/* =====================================================================
   Evento Ágil — Design System (tokens + componentes)
   Fonte: Brand Book Oficial Evento Ágil (seções 03 a 08).
   Este arquivo é a base reutilizável para o sistema real: as telas PHP
   devem usar estas classes e tokens, sem cores ou medidas avulsas.
   Layout: menu lateral compacto + cabeçalho contextual + área em grade.
   ===================================================================== */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/inter-latin-700-normal.woff2") format("woff2"); }

:root {
  color-scheme: light;

  /* Marca (brandbook 03) */
  --ea-azul: #1677F8;          /* color.brand.primary — ações primárias, links */
  --ea-azul-profundo: #125CC8; /* hover, foco, ênfase */
  --ea-verde: #00C7A1;         /* color.brand.secondary — progresso */
  --ea-verde-profundo: #009B83;
  --ea-marinho: #10263B;       /* títulos */
  --ea-texto: #172B3A;         /* color.text.primary */
  --ea-texto-sec: #647789;     /* color.text.muted */
  --ea-pagina: #F4F8FB;        /* color.page */
  --ea-superficie: #FFFFFF;    /* color.surface */
  --ea-borda: #DCE6EE;         /* color.border */
  --ea-borda-forte: #C5D3E0;
  --ea-azul-suave: #EAF2FE;
  --ea-hover: #F0F5FA;

  /* Cores funcionais (brandbook 03) */
  --ea-sucesso: #16835D;
  --ea-sucesso-bg: #E4F3EC;
  --ea-atencao: #A96500;
  --ea-atencao-bg: #FBF1E1;
  --ea-erro: #C83F49;
  --ea-erro-bg: #FBE9EA;
  --ea-info: #1677F8;
  --ea-info-bg: #EAF2FE;

  /* Categorias de status (padronizam relatórios, independem do nome) */
  --st-backlog: #9DB0C7;   --st-backlog-tx: #4A5D73;   --st-backlog-bg: #EEF2F6;
  --st-todo: #5D7FA8;      --st-todo-tx: #3A5878;      --st-todo-bg: #E7EEF6;
  --st-doing: #1677F8;     --st-doing-tx: #125CC8;     --st-doing-bg: #E7F0FE;
  --st-valid: #A453C9;     --st-valid-tx: #85379F;     --st-valid-bg: #F5EAFA;
  --st-done: #16835D;      --st-done-tx: #16835D;      --st-done-bg: #E4F3EC;
  --st-paused: #C98A1B;    --st-paused-tx: #8A5A00;    --st-paused-bg: #FBF1E1;

  /* Squads (série categórica validada para daltonismo) */
  --sq-1: #1677F8; --sq-2: #00A88A; --sq-3: #7B61D9;

  /* Tipografia (brandbook 04) */
  --ea-fonte: "Inter", Arial, system-ui, sans-serif;
  --fs-h1: 28px; --fs-h2: 22px; --fs-h3: 16px; --fs-corpo: 14px; --fs-meta: 12.5px; --fs-num: 26px;

  /* Medidas (brandbook 06/08) */
  --raio-card: 12px; --raio-controle: 8px;
  --e1: 4px; --e2: 8px; --e3: 12px; --e4: 16px; --e5: 24px; --e6: 32px;
  --menu-largura: 248px; --menu-compacto: 68px; --topo-altura: 60px;
  --sombra-card: 0 1px 2px rgba(16, 38, 59, .05);
  --sombra-flutuante: 0 12px 32px rgba(16, 38, 59, .16);
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; background: var(--ea-pagina); color: var(--ea-texto);
  font-family: var(--ea-fonte); font-size: var(--fs-corpo); line-height: 1.45;
  font-feature-settings: "cv11", "ss01"; -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { color: var(--ea-marinho); margin: 0; text-wrap: balance; }
h1 { font-size: var(--fs-h1); font-weight: 700; letter-spacing: -.01em; }
h2 { font-size: var(--fs-h2); font-weight: 700; }
h3 { font-size: var(--fs-h3); font-weight: 600; }
a { color: var(--ea-azul); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--ea-azul); outline-offset: 2px; border-radius: 4px; }
#tela:focus { outline: none; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--ea-texto-sec); }
.meta { font-size: var(--fs-meta); color: var(--ea-texto-sec); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[data-lucide], .lucide { width: 18px; height: 18px; stroke-width: 1.8; flex: none; }

/* ---------- Faixa de prévia ---------- */
.faixa-previa {
  display: flex; align-items: center; gap: var(--e2); flex-wrap: wrap;
  background: var(--ea-atencao-bg); color: #6E4300; border-bottom: 1px solid #EED9B6;
  padding: 6px var(--e4); font-size: var(--fs-meta);
}
.faixa-previa strong { font-weight: 600; }

/* ---------- Shell ---------- */
.app { display: grid; grid-template-columns: var(--menu-largura) minmax(0, 1fr); min-height: 100%; }
.app.compacto { grid-template-columns: var(--menu-compacto) minmax(0, 1fr); }

.menu {
  background: var(--ea-superficie); border-right: 1px solid var(--ea-borda);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.menu-marca { display: flex; align-items: center; height: var(--topo-altura); padding: 0 var(--e4); border-bottom: 1px solid var(--ea-borda); }
.menu-marca img { height: 30px; width: auto; }
.menu-marca .simbolo { display: none; height: 30px; }
.app.compacto .menu-marca { justify-content: center; padding: 0; }
.app.compacto .menu-marca .logo { display: none; }
.app.compacto .menu-marca .simbolo { display: block; }

.menu-grupo { padding: var(--e3) var(--e2) 0; }
.menu-grupo-titulo { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ea-texto-sec); padding: 0 var(--e3) var(--e2); }
.app.compacto .menu-grupo-titulo { visibility: hidden; height: 4px; padding: 0; }
.menu-item {
  display: flex; align-items: center; gap: var(--e3); width: 100%; min-height: 40px; padding: 0 var(--e3);
  border: 0; background: none; border-radius: var(--raio-controle); color: var(--ea-texto);
  text-decoration: none; cursor: pointer; font-weight: 500; text-align: left;
}
.menu-item:hover { background: var(--ea-hover); }
.menu-item.ativo { background: var(--ea-azul-suave); color: var(--ea-azul-profundo); }
.menu-item.ativo [data-lucide], .menu-item.ativo .lucide { color: var(--ea-azul); }
.menu-item[aria-disabled="true"] { color: #8A9AAB; cursor: not-allowed; }
.menu-item[aria-disabled="true"]:hover { background: none; }
.menu-item .fase { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--ea-texto-sec); border: 1px solid var(--ea-borda); border-radius: 999px; padding: 1px 7px; }
.app.compacto .menu-item { justify-content: center; padding: 0; }
.app.compacto .menu-item .rotulo, .app.compacto .menu-item .fase { display: none; }
.menu-rodape { margin-top: auto; padding: var(--e3) var(--e2); border-top: 1px solid var(--ea-borda); }

.principal { min-width: 0; display: flex; flex-direction: column; }
.topo {
  height: var(--topo-altura); background: var(--ea-superficie); border-bottom: 1px solid var(--ea-borda);
  display: flex; align-items: center; gap: var(--e3); padding: 0 var(--e5); position: sticky; top: 0; z-index: 20;
}
.contexto { display: flex; align-items: center; gap: var(--e2); min-width: 0; flex-wrap: nowrap; overflow: hidden; }
.contexto-item { display: flex; flex-direction: column; min-width: 0; }
.contexto-item .meta { font-size: 11px; line-height: 1.2; }
.contexto-item strong { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13.5px; }
.contexto-sep { color: var(--ea-borda-forte); }
.topo-acoes { margin-left: auto; display: flex; align-items: center; gap: var(--e2); }
.busca-global { position: relative; }
.busca-global input { width: 240px; height: 36px; padding: 0 var(--e3) 0 34px; border: 1px solid var(--ea-borda); border-radius: var(--raio-controle); background: var(--ea-pagina); }
.busca-global [data-lucide], .busca-global .lucide { position: absolute; left: 10px; top: 9px; color: var(--ea-texto-sec); width: 16px; height: 16px; }
.avatar-usuario { display: flex; align-items: center; gap: var(--e2); padding-left: var(--e2); border-left: 1px solid var(--ea-borda); }

.conteudo { padding: var(--e5); display: flex; flex-direction: column; gap: var(--e5); min-width: 0; }
.cabecalho-tela { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e4); flex-wrap: wrap; }
.trilha { display: flex; gap: 6px; align-items: center; font-size: var(--fs-meta); color: var(--ea-texto-sec); margin-bottom: 6px; }
.trilha [data-lucide], .trilha .lucide { width: 14px; height: 14px; }
.cabecalho-tela p { margin: 4px 0 0; color: var(--ea-texto-sec); max-width: 70ch; }

/* ---------- Botões (brandbook 05) ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e2); height: 40px; padding: 0 var(--e4);
  border-radius: var(--raio-controle); border: 1px solid transparent; font-weight: 600; cursor: pointer; white-space: nowrap;
  transition: background .12s, border-color .12s;
}
.btn-primario { background: var(--ea-azul); color: #fff; }
.btn-primario:hover { background: var(--ea-azul-profundo); }
.btn-secundario { background: var(--ea-superficie); border-color: var(--ea-borda); color: var(--ea-marinho); }
.btn-secundario:hover { background: var(--ea-hover); border-color: var(--ea-borda-forte); }
.btn-sucesso { background: var(--ea-sucesso); color: #fff; }
.btn-perigo { background: var(--ea-erro); color: #fff; }
.btn-fantasma { background: none; color: var(--ea-texto); }
.btn-fantasma:hover { background: var(--ea-hover); }
.btn-pequeno { height: 32px; padding: 0 var(--e3); font-size: 13px; }
.btn-icone { width: 36px; height: 36px; padding: 0; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }

/* ---------- Campos ---------- */
.campo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.campo label { font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); }
.controle {
  height: 36px; padding: 0 var(--e3); border: 1px solid var(--ea-borda); border-radius: var(--raio-controle);
  background: var(--ea-superficie); min-width: 0;
}
select.controle { padding-right: 28px; }
textarea.controle { height: auto; padding: var(--e2) var(--e3); resize: vertical; }
.controle:hover { border-color: var(--ea-borda-forte); }
.controle:focus { outline: none; border-color: var(--ea-azul); box-shadow: 0 0 0 3px rgba(22, 119, 248, .15); }
.barra-filtros { display: flex; flex-wrap: wrap; gap: var(--e3); align-items: flex-end; }
.barra-filtros .campo { min-width: 150px; }
.busca-local { position: relative; }
.busca-local input { padding-left: 32px; width: 220px; }
.busca-local [data-lucide], .busca-local .lucide { position: absolute; left: 10px; bottom: 9px; width: 16px; height: 16px; color: var(--ea-texto-sec); }
.check { display: inline-flex; align-items: center; gap: 6px; height: 36px; font-weight: 500; cursor: pointer; }
.check input { width: 16px; height: 16px; accent-color: var(--ea-azul); }

/* Alternador segmentado */
.segmentado { display: inline-flex; background: var(--ea-pagina); border: 1px solid var(--ea-borda); border-radius: var(--raio-controle); padding: 3px; gap: 2px; }
.segmentado button { border: 0; background: none; height: 28px; padding: 0 var(--e3); border-radius: 6px; font-weight: 500; font-size: 13px; color: var(--ea-texto-sec); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.segmentado button[aria-pressed="true"] { background: var(--ea-superficie); color: var(--ea-marinho); box-shadow: 0 1px 2px rgba(16, 38, 59, .12); font-weight: 600; }
.segmentado [data-lucide], .segmentado .lucide { width: 15px; height: 15px; }

/* ---------- Cards / painéis ---------- */
.painel { background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: var(--raio-card); box-shadow: var(--sombra-card); min-width: 0; }
.painel-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e3); padding: var(--e4) var(--e4) 0; flex-wrap: wrap; }
.painel-topo .meta { margin-top: 2px; }
.painel-corpo { padding: var(--e4); }
.painel-rodape { border-top: 1px solid var(--ea-borda); padding: var(--e3) var(--e4); display: flex; justify-content: space-between; align-items: center; gap: var(--e3); flex-wrap: wrap; }

.grade { display: grid; gap: var(--e4); }
.grade-kpi { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grade-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grade-21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }

/* KPI */
.kpi { padding: var(--e4); display: flex; flex-direction: column; gap: 6px; }
.kpi-rotulo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ea-texto-sec); font-weight: 500; }
.kpi-rotulo [data-lucide], .kpi-rotulo .lucide { width: 16px; height: 16px; }
.kpi-valor { font-size: var(--fs-num); font-weight: 700; color: var(--ea-marinho); line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi-valor small { font-size: 14px; font-weight: 500; color: var(--ea-texto-sec); margin-left: 2px; }
.kpi-detalhe { font-size: var(--fs-meta); color: var(--ea-texto-sec); display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; }

/* Pílulas / badges */
.pilula { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.pilula::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pilula.sem-ponto::before { display: none; }
.st-backlog { background: var(--st-backlog-bg); color: var(--st-backlog-tx); }
.st-todo { background: var(--st-todo-bg); color: var(--st-todo-tx); }
.st-doing { background: var(--st-doing-bg); color: var(--st-doing-tx); }
.st-valid { background: var(--st-valid-bg); color: var(--st-valid-tx); }
.st-done { background: var(--st-done-bg); color: var(--st-done-tx); }
.st-paused { background: var(--st-paused-bg); color: var(--st-paused-tx); }
.tag-sucesso { background: var(--ea-sucesso-bg); color: var(--ea-sucesso); }
.tag-atencao { background: var(--ea-atencao-bg); color: var(--ea-atencao); }
.tag-erro { background: var(--ea-erro-bg); color: var(--ea-erro); }
.tag-info { background: var(--ea-info-bg); color: var(--ea-azul-profundo); }
.tag-neutra { background: var(--ea-pagina); color: var(--ea-texto-sec); border: 1px solid var(--ea-borda); }
.sinal { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; }
.sinal [data-lucide], .sinal .lucide { width: 14px; height: 14px; }
.sinal.erro { color: var(--ea-erro); } .sinal.atencao { color: var(--ea-atencao); } .sinal.sucesso { color: var(--ea-sucesso); }

/* Prioridade: ícone + texto, nunca só cor */
.prioridade { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 500; color: var(--ea-texto-sec); }
.prioridade i.barras { display: inline-flex; gap: 1.5px; align-items: flex-end; height: 11px; }
.prioridade i.barras b { width: 3px; background: var(--ea-borda-forte); border-radius: 1px; }
.prioridade i.barras b:nth-child(1) { height: 5px; } .prioridade i.barras b:nth-child(2) { height: 8px; } .prioridade i.barras b:nth-child(3) { height: 11px; }
.prioridade.p-media i.barras b:nth-child(-n+2) { background: var(--ea-texto-sec); }
.prioridade.p-alta i.barras b { background: var(--ea-atencao); }
.prioridade.p-critica { color: var(--ea-erro); font-weight: 600; }
.prioridade.p-critica i.barras b { background: var(--ea-erro); }
.prioridade.p-baixa i.barras b:nth-child(1) { background: var(--ea-texto-sec); }

/* Tipo de item */
.tipo { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 5px; flex: none; }
.tipo [data-lucide], .tipo .lucide { width: 13px; height: 13px; stroke-width: 2.2; color: #fff; }
.tipo-historia { background: var(--ea-verde-profundo); }
.tipo-tarefa { background: var(--ea-azul); }
.tipo-bug { background: var(--ea-erro); }

/* Avatar */
.avatar { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; color: var(--ea-marinho); background: var(--ea-azul-suave); border: 1px solid var(--ea-borda); flex: none; }
.avatar.avatar-vazio { background: var(--ea-pagina); color: var(--ea-texto-sec); border-style: dashed; }
.avatar.g { width: 32px; height: 32px; font-size: 12px; }
.pessoa { display: inline-flex; align-items: center; gap: var(--e2); min-width: 0; }
.pessoa span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Medidor de ocupação */
.medidor { position: relative; height: 8px; background: var(--ea-pagina); border: 1px solid var(--ea-borda); border-radius: 999px; overflow: hidden; }
.medidor > span { position: absolute; inset: 0 auto 0 0; background: var(--ea-azul); border-radius: 999px; }
.medidor.m-ok > span { background: var(--ea-azul); }
.medidor.m-progresso > span { background: var(--ea-verde-profundo); }
.medidor.m-alerta > span { background: var(--ea-atencao); }
.medidor.m-excesso > span { background: var(--ea-erro); }
.medidor .marca-100 { position: absolute; top: -1px; bottom: -1px; width: 2px; background: var(--ea-marinho); }
.medidor.g { height: 12px; }

/* Ponto de squad */
.ponto-squad { width: 8px; height: 8px; border-radius: 2px; display: inline-block; flex: none; }

/* ---------- Tabelas ---------- */
.tabela-rolagem { overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.tabela th { text-align: left; font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); background: #F8FAFC; padding: 10px var(--e3); border-bottom: 1px solid var(--ea-borda); white-space: nowrap; }
.tabela td { padding: 10px var(--e3); border-bottom: 1px solid var(--ea-borda); vertical-align: middle; }
.tabela tbody tr:hover { background: #FAFCFE; }
.tabela tr.clicavel { cursor: pointer; }
.tabela .dir { text-align: right; }
.tabela tfoot td { font-weight: 600; background: #F8FAFC; }

/* ---------- Listas de exceção ---------- */
.lista-excecao { list-style: none; margin: 0; padding: 0; }
.lista-excecao li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--e3); padding: var(--e3) 0; border-bottom: 1px solid var(--ea-borda); align-items: start; }
.lista-excecao li:last-child { border-bottom: 0; }
.lista-excecao .titulo { font-weight: 500; }
.icone-excecao { width: 28px; height: 28px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.icone-excecao.erro { background: var(--ea-erro-bg); color: var(--ea-erro); }
.icone-excecao.atencao { background: var(--ea-atencao-bg); color: var(--ea-atencao); }
.icone-excecao [data-lucide], .icone-excecao .lucide { width: 16px; height: 16px; }

/* ---------- Alertas ---------- */
.alerta { display: flex; gap: var(--e3); align-items: flex-start; padding: var(--e3) var(--e4); border-radius: var(--raio-controle); border: 1px solid; font-size: 13.5px; }
.alerta [data-lucide], .alerta .lucide { margin-top: 1px; }
.alerta-erro { background: var(--ea-erro-bg); border-color: #F1C6CA; color: #8E2830; }
.alerta-atencao { background: var(--ea-atencao-bg); border-color: #EED9B6; color: #6E4300; }
.alerta-info { background: var(--ea-info-bg); border-color: #C9DDFC; color: #0F4A9C; }
.alerta-sucesso { background: var(--ea-sucesso-bg); border-color: #BFE3D1; color: #0F5E42; }

/* ---------- Estado vazio ---------- */
.vazio { text-align: center; padding: var(--e6) var(--e4); color: var(--ea-texto-sec); display: flex; flex-direction: column; align-items: center; gap: var(--e2); }
.vazio [data-lucide], .vazio .lucide { width: 28px; height: 28px; color: var(--ea-borda-forte); }
.vazio strong { color: var(--ea-marinho); font-weight: 600; }

/* ---------- Gráficos ---------- */
.grafico { position: relative; height: 280px; }
.grafico.baixo { height: 220px; }
.legenda { display: flex; flex-wrap: wrap; gap: var(--e4); font-size: 12.5px; color: var(--ea-texto-sec); }
.legenda span { display: inline-flex; align-items: center; gap: 6px; }
.legenda i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.legenda i.linha { height: 2px; width: 16px; border-radius: 0; }
.legenda i.tracejada { height: 0; width: 16px; border-top: 2px dashed; background: none !important; }

/* ---------- Kanban ---------- */
.kanban-indicadores { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; }
.kanban-indicadores > div { padding: var(--e3) var(--e4); border-right: 1px solid var(--ea-borda); }
.kanban-indicadores > div:last-child { border-right: 0; }
.kanban-indicadores strong { display: block; font-size: 20px; font-weight: 700; color: var(--ea-marinho); font-variant-numeric: tabular-nums; }
.quadro-rolagem { overflow-x: auto; padding-bottom: var(--e2); }
.quadro { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(264px, 1fr); gap: var(--e3); min-height: 420px; }
.coluna { background: #EEF3F8; border-radius: var(--raio-card); display: flex; flex-direction: column; min-width: 0; border: 1px solid transparent; }
.coluna.wip-excedido { border-color: #F1C6CA; background: #FBF1F2; }
.coluna.alvo { border-color: var(--ea-azul); background: var(--ea-azul-suave); }
.coluna-topo { padding: var(--e3) var(--e3) var(--e2); display: flex; align-items: center; gap: var(--e2); }
.coluna-topo h3 { font-size: 13.5px; font-weight: 600; }
.coluna-topo .contador { font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); background: var(--ea-superficie); border-radius: 999px; padding: 0 8px; line-height: 20px; }
.coluna-topo .wip { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--ea-texto-sec); }
.coluna-topo .wip.excedido { color: var(--ea-erro); }
.coluna-barra { height: 3px; margin: 0 var(--e3) var(--e2); border-radius: 2px; }
.coluna-cartoes { padding: 0 var(--e2) var(--e2); display: flex; flex-direction: column; gap: var(--e2); flex: 1; min-height: 80px; }
.coluna-horas { padding: 0 var(--e3) var(--e2); font-size: 11.5px; color: var(--ea-texto-sec); }
.cartao {
  background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: 10px; padding: 10px var(--e3);
  display: flex; flex-direction: column; gap: var(--e2); cursor: grab; box-shadow: var(--sombra-card); position: relative;
}
.cartao:hover { border-color: var(--ea-borda-forte); }
.cartao.arrastando { opacity: .5; }
.cartao.bloqueado { border-left: 3px solid var(--ea-erro); }
.cartao-linha { display: flex; align-items: center; gap: var(--e2); min-width: 0; }
.cartao-codigo { font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); font-variant-numeric: tabular-nums; }
.cartao-titulo { font-weight: 500; line-height: 1.35; color: var(--ea-texto); }
.cartao-historia { font-size: 12px; color: var(--ea-texto-sec); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cartao-rodape { display: flex; align-items: center; gap: var(--e2); justify-content: space-between; }
.cartao-horas { font-size: 12px; color: var(--ea-texto-sec); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 4px; }
.cartao-horas [data-lucide], .cartao-horas .lucide { width: 13px; height: 13px; }
.cartao-mover { position: absolute; top: 6px; right: 6px; width: 28px; height: 28px; border: 0; border-radius: 6px; background: none; color: var(--ea-texto-sec); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.cartao-mover:hover, .cartao-mover:focus-visible { background: var(--ea-hover); color: var(--ea-marinho); }
.cartao-mover [data-lucide], .cartao-mover .lucide { width: 16px; height: 16px; }
.cartao-sinais { display: flex; flex-wrap: wrap; gap: 6px; }
.btn-novo-cartao { margin: 0 var(--e2) var(--e2); border: 1px dashed var(--ea-borda-forte); background: none; border-radius: 8px; height: 34px; color: var(--ea-texto-sec); font-weight: 500; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.btn-novo-cartao:hover { background: var(--ea-superficie); color: var(--ea-azul-profundo); border-color: var(--ea-azul); }

/* Menu flutuante */
.menu-flutuante { position: fixed; z-index: 60; background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: 10px; box-shadow: var(--sombra-flutuante); padding: 6px; min-width: 200px; }
.menu-flutuante .meta { padding: 4px 8px 6px; display: block; }
.menu-flutuante button { display: flex; width: 100%; align-items: center; gap: var(--e2); border: 0; background: none; padding: 8px; border-radius: 6px; cursor: pointer; text-align: left; }
.menu-flutuante button:hover, .menu-flutuante button:focus-visible { background: var(--ea-hover); }
.menu-flutuante button[disabled] { color: var(--ea-texto-sec); cursor: default; background: none; }

/* ---------- Backlog / planejamento ---------- */
.planejamento { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--e4); align-items: start; }
.grupo-iniciativa { border-bottom: 1px solid var(--ea-borda); }
.grupo-iniciativa:last-child { border-bottom: 0; }
.grupo-topo { display: flex; align-items: center; gap: var(--e2); padding: var(--e3) var(--e4); background: #F8FAFC; border-bottom: 1px solid var(--ea-borda); cursor: pointer; width: 100%; border-left: 0; border-right: 0; border-top: 0; text-align: left; }
.grupo-topo .chev { transition: transform .15s; }
.grupo-topo[aria-expanded="false"] .chev { transform: rotate(-90deg); }
.grupo-topo strong { font-weight: 600; }
.item-backlog { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto auto auto; gap: var(--e3); align-items: center; padding: 10px var(--e4); border-bottom: 1px solid var(--ea-borda); background: var(--ea-superficie); }
.item-backlog:last-child { border-bottom: 0; }
.item-backlog[draggable="true"] { cursor: grab; }
.item-backlog:hover { background: #FAFCFE; }
.item-backlog .titulo { min-width: 0; }
.item-backlog .titulo span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-backlog .est { font-size: 12.5px; font-variant-numeric: tabular-nums; color: var(--ea-texto-sec); text-align: right; min-width: 64px; }
.zona-sprint { min-height: 120px; }
.zona-sprint.alvo { outline: 2px dashed var(--ea-azul); outline-offset: -6px; background: var(--ea-azul-suave); }
.resumo-capacidade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e3); }
.resumo-capacidade > div { border: 1px solid var(--ea-borda); border-radius: 10px; padding: var(--e3); }
.resumo-capacidade strong { display: block; font-size: 20px; font-weight: 700; color: var(--ea-marinho); font-variant-numeric: tabular-nums; }
.carga-pessoa { display: grid; grid-template-columns: minmax(0, 140px) minmax(0, 1fr) 96px; gap: var(--e3); align-items: center; padding: 6px 0; }
.carga-pessoa .valores { font-size: 12.5px; text-align: right; font-variant-numeric: tabular-nums; }
.lateral-fixa { position: sticky; top: calc(var(--topo-altura) + var(--e4)); display: flex; flex-direction: column; gap: var(--e4); }

/* ---------- Capacity ---------- */
.matriz th.squad { text-align: center; }
.matriz td.celula { text-align: center; white-space: nowrap; }
.celula-valor { display: inline-flex; flex-direction: column; align-items: center; line-height: 1.25; }
.celula-valor b { font-weight: 600; font-variant-numeric: tabular-nums; }
.celula-valor span { font-size: 11.5px; color: var(--ea-texto-sec); font-variant-numeric: tabular-nums; }
.celula-vazia { color: #A7B5C3; }
.ocupacao { display: grid; grid-template-columns: minmax(70px, 1fr) 44px; gap: var(--e2); align-items: center; min-width: 130px; }
.ocupacao b { font-size: 12.5px; text-align: right; font-variant-numeric: tabular-nums; }
.cartoes-squad { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e4); }
.squad-cab { display: flex; align-items: center; gap: var(--e2); }
.numeros-squad { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e2); margin: var(--e4) 0; }
.numeros-squad strong { display: block; font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ea-marinho); }
.membro-squad { display: grid; grid-template-columns: minmax(0, 1fr) 120px 58px; gap: var(--e3); align-items: center; padding: 6px 0; font-size: 13px; }
.membro-squad .num { text-align: right; font-size: 12.5px; }

/* ---------- Gaveta e modal ---------- */
.veu { position: fixed; inset: 0; background: rgba(16, 38, 59, .32); z-index: 50; }
.gaveta {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(520px, 100%); background: var(--ea-superficie); z-index: 55;
  box-shadow: var(--sombra-flutuante); display: flex; flex-direction: column;
}
.gaveta-topo { display: flex; align-items: flex-start; gap: var(--e3); padding: var(--e4) var(--e5); border-bottom: 1px solid var(--ea-borda); }
.gaveta-corpo { padding: var(--e5); overflow-y: auto; display: flex; flex-direction: column; gap: var(--e5); }
.gaveta-corpo h4 { font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--ea-texto-sec); font-weight: 600; margin-bottom: var(--e2); }
.campos-detalhe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e3) var(--e4); margin: 0; }
.campos-detalhe dt { font-size: 12px; color: var(--ea-texto-sec); }
.campos-detalhe dd { margin: 2px 0 0; font-weight: 500; }
.linha-tempo { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--ea-borda); }
.linha-tempo li { position: relative; padding: 0 0 var(--e3) var(--e4); font-size: 13px; }
.linha-tempo li::before { content: ""; position: absolute; left: -6px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--ea-superficie); border: 2px solid var(--ea-azul); }
.linha-tempo li.novo::before { background: var(--ea-azul); }
.calculo { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.calculo td { padding: 7px 0; border-bottom: 1px dashed var(--ea-borda); }
.calculo td:last-child { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }
.calculo tr.total td { border-bottom: 0; border-top: 2px solid var(--ea-marinho); font-weight: 700; color: var(--ea-marinho); }
.modal { position: fixed; z-index: 56; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(560px, calc(100% - 32px)); max-height: calc(100% - 48px); overflow-y: auto; background: var(--ea-superficie); border-radius: var(--raio-card); box-shadow: var(--sombra-flutuante); }
.modal form { display: flex; flex-direction: column; gap: var(--e4); padding: var(--e5); }
.modal .linha-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e3); }
.modal-acoes { display: flex; justify-content: flex-end; gap: var(--e2); }
.erro-campo { color: var(--ea-erro); font-size: 12px; }

/* Toast */
.toasts { position: fixed; right: var(--e5); bottom: var(--e5); z-index: 70; display: flex; flex-direction: column; gap: var(--e2); }
.toast { background: var(--ea-marinho); color: #fff; padding: var(--e3) var(--e4); border-radius: 10px; box-shadow: var(--sombra-flutuante); display: flex; gap: var(--e2); align-items: flex-start; max-width: 380px; font-size: 13.5px; }
.toast .lucide { color: var(--ea-verde); }
.toast.aviso .lucide { color: #FFC56B; }

/* Utilitários */
.linha { display: flex; align-items: center; gap: var(--e2); flex-wrap: wrap; }
.entre { justify-content: space-between; }
.pilha { display: flex; flex-direction: column; gap: var(--e3); }
.oculto-mobile { }
.so-mobile { display: none !important; }

/* ---------- Responsivo ---------- */
@media (max-width: 1200px) {
  .grade-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kanban-indicadores { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kanban-indicadores > div:nth-child(3) { border-right: 0; }
  .kanban-indicadores > div:nth-child(-n+3) { border-bottom: 1px solid var(--ea-borda); }
  .cartoes-squad { grid-template-columns: minmax(0, 1fr); }
  .busca-global input { width: 180px; }
}
@media (max-width: 1024px) {
  .grade-21, .grade-2, .planejamento { grid-template-columns: minmax(0, 1fr); }
  .lateral-fixa { position: static; }
  .contexto .contexto-item.sec, .contexto .contexto-sep.sec { display: none; }
}
@media (max-width: 860px) {
  .app, .app.compacto { grid-template-columns: minmax(0, 1fr); }
  .menu { position: fixed; left: 0; top: 0; bottom: 0; width: var(--menu-largura); z-index: 58; transform: translateX(-100%); transition: transform .2s; }
  .app.menu-aberto .menu { transform: none; box-shadow: var(--sombra-flutuante); }
  .app.compacto .menu-item { justify-content: flex-start; padding: 0 var(--e3); }
  .app.compacto .menu-item .rotulo, .app.compacto .menu-item .fase { display: inline; }
  .app.compacto .menu-marca .logo { display: block; } .app.compacto .menu-marca .simbolo { display: none; }
  .so-mobile { display: inline-flex !important; }
  .oculto-mobile { display: none !important; }
  .topo { padding: 0 var(--e4); }
  .conteudo { padding: var(--e4); gap: var(--e4); }
  .busca-global { display: none; }
}
@media (max-width: 560px) {
  h1 { font-size: 22px; }
  .grade-kpi { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e2); }
  .kpi { padding: var(--e3); }
  .kpi-valor { font-size: 22px; }
  .kanban-indicadores { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kanban-indicadores > div { border-right: 0 !important; border-bottom: 1px solid var(--ea-borda); }
  .resumo-capacidade { grid-template-columns: minmax(0, 1fr); }
  .item-backlog { grid-template-columns: auto minmax(0, 1fr) auto; }
  .item-backlog .so-desktop { display: none; }
  .carga-pessoa { grid-template-columns: minmax(0, 1fr) 90px; }
  .carga-pessoa .medidor { grid-column: 1 / -1; grid-row: 2; }
  .barra-filtros .campo, .busca-local input { min-width: 0; width: 100%; }
  .barra-filtros > * { flex: 1 1 140px; }
  .campos-detalhe, .modal .linha-campos { grid-template-columns: minmax(0, 1fr); }
  .contexto-item.ter { display: none; }
  .avatar-usuario .nome { display: none; }
  .numeros-squad { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .membro-squad { grid-template-columns: minmax(0, 1fr) 70px 50px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* =====================================================================
   Sistema completo — complementos do design system
   ===================================================================== */
.st-cancel { background: #EEF1F4; color: #6B7A89; }
.menu-item .contador-menu { margin-left: auto; font-size: 11px; font-weight: 700; background: var(--ea-erro); color: #fff; border-radius: 999px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; }
.app.compacto .menu-item .contador-menu { display: none; }
.menu-sep { height: 1px; background: var(--ea-borda); margin: var(--e2) var(--e3) 0; }
.btn-notif { position: relative; }
.btn-notif .badge { position: absolute; top: 3px; right: 3px; min-width: 16px; height: 16px; border-radius: 999px; background: var(--ea-erro); color: #fff; font-size: 10px; font-weight: 700; display: none; align-items: center; justify-content: center; padding: 0 4px; }
.btn-notif .badge.on { display: inline-flex; }
.menu-usuario { position: relative; }
.menu-usuario > button { border: 0; background: none; cursor: pointer; display: flex; align-items: center; gap: var(--e2); padding: 4px 6px; border-radius: var(--raio-controle); text-align: left; }
.menu-usuario > button:hover { background: var(--ea-hover); }
.faixa-suporte { background: #3A2A00; color: #FFE7B3; padding: 8px var(--e4); display: flex; gap: var(--e3); align-items: center; flex-wrap: wrap; font-size: 13px; }
.faixa-suporte form { margin-left: auto; }
.faixa-suporte .btn { height: 30px; }
.faixa-demo { background: var(--ea-atencao-bg); color: #6E4300; border-bottom: 1px solid #EED9B6; padding: 6px var(--e4); font-size: var(--fs-meta); display: flex; gap: 8px; align-items: center; }

/* Mensagens da página */
.mensagens { display: flex; flex-direction: column; gap: var(--e2); }
.mensagens .alerta { align-items: center; }
.mensagens .alerta .fechar { margin-left: auto; border: 0; background: none; cursor: pointer; color: inherit; opacity: .7; }

/* Cabeçalho de tela */
.cabecalho-tela .acoes { display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; }
.cabecalho-tela h1 .codigo { color: var(--ea-texto-sec); font-weight: 600; margin-right: 6px; }
.sub-linha { display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; margin-top: 8px; }

/* Formulários em grade */
.form-grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--e4) var(--e4); }
.form-grade > * { grid-column: span 12; }
.form-grade .col-2 { grid-column: span 2; } .form-grade .col-3 { grid-column: span 3; } .form-grade .col-4 { grid-column: span 4; }
.form-grade .col-5 { grid-column: span 5; } .form-grade .col-6 { grid-column: span 6; } .form-grade .col-8 { grid-column: span 8; }
.form-grade .col-9 { grid-column: span 9; } .form-grade .col-12 { grid-column: span 12; }
.dica { font-size: 12px; color: var(--ea-texto-sec); }
.campo label .obrig { color: var(--ea-erro); margin-left: 2px; }
.controle.invalido, .invalido .controle, .invalido.controle { border-color: var(--ea-erro); }
.erro-campo { display: block; }
textarea.controle { min-height: 80px; line-height: 1.5; }
.controle[type="color"] { padding: 2px 4px; width: 64px; }
.dias-semana { display: flex; gap: 6px; flex-wrap: wrap; }
.dias-semana label { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--ea-borda); border-radius: 8px; padding: 6px 10px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--ea-texto); }
.dias-semana input { accent-color: var(--ea-azul); }
.multi-check { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px 16px; max-height: 240px; overflow-y: auto; padding: var(--e2); border: 1px solid var(--ea-borda); border-radius: var(--raio-controle); }
.multi-check label { display: flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; }
.form-acoes { display: flex; gap: var(--e2); justify-content: flex-end; flex-wrap: wrap; padding-top: var(--e2); }
.btn-grande { height: 46px; padding: 0 var(--e5); font-size: 15px; }
.btn-link { background: none; border: 0; padding: 0; color: var(--ea-azul); font-weight: 600; cursor: pointer; height: auto; }
.btn-perigo-suave { background: var(--ea-superficie); color: var(--ea-erro); border-color: #F1C6CA; }
.btn-perigo-suave:hover { background: var(--ea-erro-bg); }
.btn.carregando { position: relative; color: transparent !important; pointer-events: none; }
.btn.carregando::after { content: ""; position: absolute; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.5); border-top-color: #fff; border-radius: 50%; animation: gira .7s linear infinite; }
.btn-secundario.carregando::after { border-color: rgba(22,119,248,.3); border-top-color: var(--ea-azul); }
@keyframes gira { to { transform: rotate(360deg); } }
.linha-form { display: flex; gap: var(--e2); align-items: flex-end; flex-wrap: wrap; }
.linha-form .campo { flex: 1 1 160px; }

/* Abas */
.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--ea-borda); overflow-x: auto; }
.abas a, .abas button { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; color: var(--ea-texto-sec); text-decoration: none; font-weight: 500; border: 0; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; cursor: pointer; }
.abas a:hover, .abas button:hover { color: var(--ea-marinho); }
.abas a.ativa, .abas button.ativa { color: var(--ea-azul-profundo); border-bottom-color: var(--ea-azul); font-weight: 600; }
.abas .contagem { font-size: 11.5px; background: var(--ea-pagina); border: 1px solid var(--ea-borda); border-radius: 999px; padding: 0 7px; }
[data-aba-painel][hidden] { display: none !important; }

/* Tabelas */
.tabela th a { color: inherit; text-decoration: none; display: inline-flex; gap: 4px; align-items: center; }
.tabela th a:hover { color: var(--ea-marinho); }
.tabela td a.forte, .tabela td .forte { font-weight: 600; color: var(--ea-marinho); text-decoration: none; }
.tabela td a.forte:hover { color: var(--ea-azul); }
.tabela tr.linha-alerta td:first-child { box-shadow: inset 3px 0 0 var(--ea-erro); }
.tabela .acoes-linha { white-space: nowrap; text-align: right; }
.tabela td.nowrap { white-space: nowrap; }
.tabela.compacta td, .tabela.compacta th { padding: 7px 10px; }
.tabela tfoot td { border-bottom: 0; }
.paginacao { display: flex; gap: 6px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: var(--e3) var(--e4); border-top: 1px solid var(--ea-borda); }
.paginacao .paginas { display: flex; gap: 4px; flex-wrap: wrap; }
.paginacao a, .paginacao span.atual { min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--ea-borda); color: var(--ea-texto); text-decoration: none; font-size: 13px; padding: 0 8px; }
.paginacao span.atual { background: var(--ea-azul); border-color: var(--ea-azul); color: #fff; font-weight: 600; }
.paginacao a:hover { background: var(--ea-hover); }

/* Listas e blocos */
.lista-simples { list-style: none; margin: 0; padding: 0; }
.lista-simples li { padding: 10px 0; border-bottom: 1px solid var(--ea-borda); display: flex; gap: var(--e3); align-items: flex-start; }
.lista-simples li:last-child { border-bottom: 0; }
.lista-simples .cresce { flex: 1; min-width: 0; }
.bloco-texto { white-space: pre-wrap; line-height: 1.6; color: var(--ea-texto); }
.bloco-texto.vazio-txt { color: var(--ea-texto-sec); font-style: italic; }
.mini-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: var(--e3); }
.mini-stats > div { border: 1px solid var(--ea-borda); border-radius: 10px; padding: 10px var(--e3); background: var(--ea-superficie); }
.mini-stats strong { display: block; font-size: 18px; font-weight: 700; color: var(--ea-marinho); font-variant-numeric: tabular-nums; }
.mini-stats .meta { display: block; }
.grade-lateral { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--e4); align-items: start; }
.grade-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--ea-borda); background: var(--ea-superficie); font-size: 12.5px; font-weight: 500; color: var(--ea-texto); text-decoration: none; }
.chip:hover { border-color: var(--ea-borda-forte); }
.chip.ativo { background: var(--ea-azul-suave); border-color: #C9DDFC; color: var(--ea-azul-profundo); }
.comentario { padding: var(--e3) 0; border-bottom: 1px solid var(--ea-borda); }
.comentario:last-child { border-bottom: 0; }
.comentario .cab { display: flex; gap: var(--e2); align-items: center; margin-bottom: 4px; }
.comentario .corpo { white-space: pre-wrap; line-height: 1.55; }
.anexo { display: flex; gap: var(--e2); align-items: center; padding: 8px 0; border-bottom: 1px solid var(--ea-borda); }
.anexo:last-child { border-bottom: 0; }
.anexo a { font-weight: 500; text-decoration: none; }
.calendario-mes { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--ea-borda); border-radius: var(--raio-card); overflow: hidden; background: var(--ea-superficie); }
.calendario-mes .cab-dia { padding: 8px; font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); background: #F8FAFC; border-bottom: 1px solid var(--ea-borda); text-align: center; }
.calendario-mes .dia { min-height: 104px; border-right: 1px solid var(--ea-borda); border-bottom: 1px solid var(--ea-borda); padding: 6px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.calendario-mes .dia:nth-child(7n) { border-right: 0; }
.calendario-mes .dia.fora { background: #FAFBFC; color: #A7B5C3; }
.calendario-mes .dia.fds { background: #F7F9FB; }
.calendario-mes .dia.hoje .num-dia { background: var(--ea-azul); color: #fff; }
.calendario-mes .num-dia { font-size: 12px; font-weight: 600; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.calendario-mes .evento { font-size: 11.5px; border-radius: 5px; padding: 2px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--ea-azul-suave); color: var(--ea-azul-profundo); }
.calendario-mes .evento.feriado { background: var(--ea-erro-bg); color: var(--ea-erro); font-weight: 600; }
.calendario-mes .evento.parcial { background: var(--ea-atencao-bg); color: var(--ea-atencao); }
.calendario-mes .evento.squad { background: #F1ECFB; color: #5B45B5; }
.calendario-mes .evento.empresa { background: var(--ea-sucesso-bg); color: var(--ea-sucesso); }
.matriz-perm { overflow-x: auto; }
.matriz-perm table { border-collapse: collapse; width: 100%; font-size: 13px; }
.matriz-perm th, .matriz-perm td { border-bottom: 1px solid var(--ea-borda); padding: 8px 10px; }
.matriz-perm th.papel { writing-mode: initial; text-align: center; min-width: 110px; font-size: 12px; }
.matriz-perm td.c { text-align: center; }
.matriz-perm tr.modulo td { background: #F8FAFC; font-weight: 600; color: var(--ea-marinho); }
.matriz-perm input { width: 16px; height: 16px; accent-color: var(--ea-azul); }

/* Detalhes / acordeão */
details.painel > summary { list-style: none; cursor: pointer; padding: var(--e4); display: flex; align-items: center; gap: var(--e2); font-weight: 600; color: var(--ea-marinho); }
details.painel > summary::-webkit-details-marker { display: none; }
details.painel > summary .chev { margin-left: auto; transition: transform .15s; }
details.painel[open] > summary .chev { transform: rotate(180deg); }
details.painel > .painel-corpo { padding-top: 0; }

/* Kanban (versão do sistema) */
.kb-topo { display: flex; gap: var(--e3); align-items: center; flex-wrap: wrap; }
.kb-capacidade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e3); padding: var(--e3) var(--e4); }
.kb-capacidade .rot { font-size: 12px; color: var(--ea-texto-sec); }
.kb-capacidade strong { display: block; font-size: 18px; color: var(--ea-marinho); font-variant-numeric: tabular-nums; }
.coluna-cartoes.alvo-drop { outline: 2px dashed var(--ea-azul); outline-offset: -4px; border-radius: 8px; }
.cartao .tag-tipo-historia { font-size: 11px; font-weight: 600; color: var(--ea-verde-profundo); }
.cartao.historia { border-style: dashed; }
.cartao-meta { display: flex; gap: 10px; color: var(--ea-texto-sec); font-size: 12px; align-items: center; }
.cartao-meta [data-lucide], .cartao-meta .lucide { width: 13px; height: 13px; }
.grupo-raia { margin-bottom: var(--e3); }
.grupo-raia > h4 { font-size: 13px; color: var(--ea-texto-sec); margin: 0 0 6px; }
.status-carregando { font-size: 12px; color: var(--ea-texto-sec); display: inline-flex; gap: 6px; align-items: center; }

/* Planejamento */
.plan-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: var(--e3); align-items: center; padding: 10px var(--e4); border-bottom: 1px solid var(--ea-borda); }
.plan-item:last-child { border-bottom: 0; }
.plan-item .titulo > span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-item .est { font-size: 12.5px; color: var(--ea-texto-sec); text-align: right; font-variant-numeric: tabular-nums; min-width: 70px; }

/* Gaveta do cartão */
.gaveta .gaveta-corpo .bloco-texto { font-size: 13.5px; }

/* Busca */
.resultado-busca { display: flex; gap: var(--e2); align-items: center; padding: 10px 0; border-bottom: 1px solid var(--ea-borda); text-decoration: none; color: var(--ea-texto); }
.resultado-busca:hover .titulo { color: var(--ea-azul); }

/* Login e telas públicas simples */
.auth { min-height: 100vh; display: grid; place-items: center; padding: var(--e5) var(--e4); background: radial-gradient(1200px 500px at 15% -10%, #E3EEFE 0%, transparent 60%), radial-gradient(900px 500px at 110% 110%, #DDF7F1 0%, transparent 55%), var(--ea-pagina); }
.auth-card { width: min(420px, 100%); background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: 16px; box-shadow: 0 10px 40px rgba(16,38,59,.08); padding: var(--e6) var(--e5); display: flex; flex-direction: column; gap: var(--e4); }
.auth-card .logo { height: 40px; width: auto; align-self: flex-start; }
.auth-card h1 { font-size: 22px; }
.auth-card form { display: flex; flex-direction: column; gap: var(--e4); }
.auth-card .controle { height: 42px; }
.auth-rodape { text-align: center; font-size: 12.5px; color: var(--ea-texto-sec); }
.auth-rodape a { color: var(--ea-texto-sec); }

/* Site institucional */
.site { background: #fff; }
.site-topo { position: sticky; top: 0; z-index: 30; background: rgba(255,255,255,.94); backdrop-filter: blur(6px); border-bottom: 1px solid var(--ea-borda); }
.site-topo .dentro { display: flex; align-items: center; gap: var(--e5); height: 68px; }
.site-topo .logo { height: 34px; width: auto; }
.site-topo nav { display: flex; gap: var(--e4); margin-left: auto; align-items: center; }
.site-topo nav a { color: var(--ea-texto); text-decoration: none; font-weight: 500; font-size: 14px; }
.site-topo nav a:hover { color: var(--ea-azul); }
.site-topo .btn { height: 38px; }
.dentro { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.hero { padding: 72px 0 56px; background: radial-gradient(900px 420px at 0% 0%, #EAF2FE 0%, transparent 60%), radial-gradient(700px 400px at 100% 30%, #E3F8F3 0%, transparent 55%); }
.hero .dentro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 48px; align-items: center; }
.hero h1 { font-size: clamp(30px, 4vw, 46px); line-height: 1.12; letter-spacing: -.02em; }
.hero p.sub { font-size: 18px; color: var(--ea-texto-sec); line-height: 1.55; margin: 18px 0 28px; max-width: 54ch; }
.hero .botoes { display: flex; gap: var(--e3); flex-wrap: wrap; }
.selo { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 600; color: var(--ea-azul-profundo); background: var(--ea-azul-suave); border-radius: 999px; padding: 6px 12px; margin-bottom: 18px; }
.mock { background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: 16px; box-shadow: 0 24px 60px rgba(16,38,59,.12); overflow: hidden; }
.mock-barra { display: flex; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--ea-borda); background: #F8FAFC; }
.mock-barra i { width: 10px; height: 10px; border-radius: 50%; background: #D7E1EA; display: block; }
.mock-corpo { padding: 16px; display: grid; gap: 12px; }
.mock-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mock-kpis div { border: 1px solid var(--ea-borda); border-radius: 10px; padding: 10px; }
.mock-kpis span { display: block; font-size: 11.5px; color: var(--ea-texto-sec); }
.mock-kpis strong { font-size: 20px; color: var(--ea-marinho); }
.mock-colunas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mock-colunas .col { background: #EEF3F8; border-radius: 10px; padding: 8px; display: grid; gap: 6px; align-content: start; }
.mock-colunas .col b { font-size: 11.5px; color: var(--ea-texto-sec); }
.mock-colunas .c { background: #fff; border: 1px solid var(--ea-borda); border-radius: 8px; padding: 8px; font-size: 12px; }
.mock-colunas .c em { display: block; height: 4px; border-radius: 2px; margin-top: 6px; background: var(--ea-azul); font-style: normal; }
.secao { padding: 72px 0; }
.secao.cinza { background: var(--ea-pagina); }
.secao h2 { font-size: clamp(24px, 3vw, 32px); letter-spacing: -.01em; }
.secao .intro { color: var(--ea-texto-sec); font-size: 16.5px; max-width: 64ch; margin: 10px 0 36px; line-height: 1.55; }
.recursos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e4); }
.recurso { background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: var(--raio-card); padding: var(--e5); }
.recurso .ic { width: 40px; height: 40px; border-radius: 10px; background: var(--ea-azul-suave); color: var(--ea-azul); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.recurso h3 { font-size: 16px; margin-bottom: 6px; }
.recurso p { margin: 0; color: var(--ea-texto-sec); font-size: 14px; line-height: 1.55; }
.passos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--e4); counter-reset: passo; }
.passo { position: relative; padding: var(--e5) var(--e4); border-radius: var(--raio-card); background: var(--ea-superficie); border: 1px solid var(--ea-borda); }
.passo::before { counter-increment: passo; content: counter(passo); width: 32px; height: 32px; border-radius: 50%; background: var(--ea-azul); color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.passo h3 { font-size: 15px; margin-bottom: 6px; }
.passo p { margin: 0; color: var(--ea-texto-sec); font-size: 13.5px; line-height: 1.5; }
.publicos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e3); }
.publico { display: flex; gap: 12px; align-items: flex-start; padding: var(--e4); border: 1px solid var(--ea-borda); border-radius: var(--raio-card); background: var(--ea-superficie); }
.publico .ic { color: var(--ea-verde-profundo); }
.publico strong { display: block; color: var(--ea-marinho); }
.publico span { color: var(--ea-texto-sec); font-size: 13.5px; }
.vitrine { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e4); }
.vitrine .painel { padding: var(--e4); }
.vitrine .grafico { height: 230px; }
.contato-grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: start; }
.contato-info { display: grid; gap: var(--e4); }
.contato-info .linha { color: var(--ea-texto); }
.form-contato { background: var(--ea-superficie); border: 1px solid var(--ea-borda); border-radius: 16px; padding: var(--e5); box-shadow: 0 10px 40px rgba(16,38,59,.06); }
.armadilha { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.rodape { background: var(--ea-marinho); color: #C9D5E1; padding: 48px 0 32px; font-size: 14px; }
.rodape .dentro { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 32px; }
.rodape a { color: #E6EEF6; text-decoration: none; }
.rodape a:hover { text-decoration: underline; }
.rodape h4 { color: #fff; font-size: 14px; margin-bottom: 10px; }
.rodape ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.rodape .copy { grid-column: 1 / -1; border-top: 1px solid rgba(255,255,255,.12); padding-top: 18px; font-size: 12.5px; color: #9FB0C1; }
.texto-legal { max-width: 78ch; line-height: 1.7; }
.texto-legal h2 { font-size: 20px; margin: 28px 0 8px; }
.cookie-aviso { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 80; max-width: 640px; margin: 0 auto; background: var(--ea-marinho); color: #fff; border-radius: 12px; padding: 14px 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; box-shadow: var(--sombra-flutuante); font-size: 13.5px; }
.cookie-aviso a { color: #fff; }
.cookie-aviso[hidden] { display: none; }

/* Erros */
.pagina-erro { text-align: center; padding: 64px 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.pagina-erro .codigo-erro { font-size: 56px; font-weight: 700; color: var(--ea-borda-forte); line-height: 1; }

/* Impressão de relatórios */
@media print {
  .menu, .topo, .barra-filtros, .acoes, .faixa-demo, .faixa-suporte, .paginacao, .no-print, .nao-imprimir, .toasts { display: none !important; }
  .app { display: block; }
  .conteudo { padding: 0; }
  .painel { box-shadow: none; border: 0; }
  body { background: #fff; }
}

/* Responsivo (complementos) */
@media (max-width: 1200px) {
  .recursos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .passos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grade-lateral { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1024px) {
  .hero .dentro, .contato-grade, .vitrine { grid-template-columns: minmax(0, 1fr); }
  .grade-3 { grid-template-columns: minmax(0, 1fr); }
  .kb-capacidade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .publicos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .site-topo nav a.so-desk { display: none; }
  .rodape .dentro { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .form-grade .col-2, .form-grade .col-3, .form-grade .col-4, .form-grade .col-5, .form-grade .col-6, .form-grade .col-8, .form-grade .col-9 { grid-column: span 12; }
  .recursos, .passos, .publicos { grid-template-columns: minmax(0, 1fr); }
  .calendario-mes .dia { min-height: 64px; }
  .calendario-mes .evento { font-size: 0; height: 6px; padding: 0; }
  .plan-item { grid-template-columns: auto minmax(0, 1fr) auto; }
  .plan-item > :last-child { grid-column: 2 / -1; justify-self: start; }
  .plan-item .est { min-width: 0; }
  .plan-item .so-desktop { display: none; }
  .hero { padding: 40px 0; }
  .secao { padding: 48px 0; }
  .site-topo .dentro { gap: var(--e3); }
  .site-topo nav { gap: var(--e2); }
}
a.btn { text-decoration: none; }
.lista-excecao a { text-decoration: none; color: var(--ea-marinho); font-weight: 500; }
.lista-excecao a:hover { color: var(--ea-azul); text-decoration: underline; }
.campo > .rotulo { font-size: 12px; font-weight: 600; color: var(--ea-texto-sec); }
.linha-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e3); }
@media (max-width: 720px) { .linha-campos { grid-template-columns: minmax(0, 1fr); } }
.titulo-secao { font-size: 15px; font-weight: 700; color: var(--ea-marinho); margin: var(--e2) 0 0; }
.bloco-codigo { background: #F6F8FB; border: 1px solid var(--ea-borda); border-radius: 8px; padding: var(--e3); font-size: 12px; overflow: auto; max-height: 360px; margin: 0; white-space: pre-wrap; word-break: break-word; }
.matriz-perm-grupo { border: 1px solid var(--ea-borda); border-radius: 10px; padding: var(--e2) var(--e3); margin: 0; min-width: 0; }
.matriz-perm-grupo legend { font-size: 12px; font-weight: 700; color: var(--ea-marinho); text-transform: uppercase; letter-spacing: .04em; padding: 0 6px; }
details.painel > summary { list-style: none; }
details.painel > summary::-webkit-details-marker { display: none; }
details.painel > summary::after { content: "Abrir ▾"; font-size: 12px; color: var(--ea-texto-sec); margin-left: auto; }
details.painel[open] > summary::after { content: "Fechar ▴"; }
.relatorios-grade .lista-simples li { padding: 8px 0; }
[hidden] { display: none !important; }
.tipo-iniciativa { background: var(--ea-marinho); }
h1 .tipo { width: 28px; height: 28px; border-radius: 7px; vertical-align: 3px; }
h1 .tipo [data-lucide], h1 .tipo .lucide { width: 17px; height: 17px; }
aside .campos-detalhe { grid-template-columns: minmax(0, 120px) minmax(0, 1fr); }
a.forte { font-weight: 600; color: var(--ea-marinho); text-decoration: none; }
a.forte:hover { color: var(--ea-azul); }