/* ==========================================================================
   DESIGN SYSTEM MÍNIMO — Trino Capital · Mesa de Cartas Contempladas
   Dark premium: preto/grafite + dourado discreto (auditoria 2026-07: azul eliminado). Tokens primeiro; todo
   componente novo deve consumir tokens, nunca valores soltos.
   ========================================================================== */
:root {
  /* --- superfícies (preto/grafite, do fundo para o topo) --- */
  --bg: #0d0f11;
  --bg-panel: #141719;
  --bg-panel-2: #191c1f;
  --bg-panel-3: #1f2326;
  --border: #2a2f33;
  --border-soft: rgba(42, 47, 51, .55);   /* divisórias internas, menos peso */
  --border-hair: rgba(42, 47, 51, .35);   /* linha quase invisível */

  /* --- acento institucional (dourado discreto — nunca gritante) --- */
  --gold: #c9a86a;
  --gold-soft: #d8c090;
  --gold-dim: rgba(201, 168, 106, .16);   /* fundos/halos dourados */
  --gold-grad: linear-gradient(180deg, var(--gold-soft), var(--gold));

  /* --- semânticos --- */
  --green: #4ade80;
  --amber: #fbbf24;
  --red: #f87171;
  --danger: #f87171;
  --warn: #fbbf24;

  /* --- texto --- */
  --text: #f1f1ee;
  --text-dim: #9a9f9e;
  --text-dim-2: #8b8f8e;

  /* --- espaçamento (escala 4px) --- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;

  /* --- raios --- */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* --- sombras (profundidade sutil, sem drama) --- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);
  --shadow: 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, .45);
  --shadow-gold: 0 2px 12px rgba(201, 168, 106, .22);

  /* --- foco e transição --- */
  --ring: 0 0 0 2px rgba(201, 168, 106, .45);
  --trans: .16s ease;

  color-scheme: dark;
}

/* foco visível padronizado — teclado navega com elegância */
:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--r-sm); }

* { box-sizing: border-box; }

html { overflow-x: hidden; max-width: 100vw; }

body {
  margin: 0;
  overflow-x: hidden;
  max-width: 100vw;
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 800px at 15% -10%, #16191c 0%, var(--bg) 55%);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

.tabular, .carta-linha1 .valor, .stat .value, .kv span:last-child {
  font-variant-numeric: tabular-nums;
}

header.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 24px;
  background: #101214;
  gap: 20px;
}

.divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border) 15%, var(--border) 85%, transparent);
}

header.topbar .brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

header.topbar .brand .triangle {
  width: 0; height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 14px solid var(--gold-soft);
  filter: drop-shadow(0 0 6px rgba(201,168,106,.25));
  flex-shrink: 0;
}

header.topbar h1 {
  font-size: 16px;
  margin: 0;
  letter-spacing: .1px;
  font-weight: 700;
}

header.topbar .subtitle {
  font-size: 10.5px;
  color: var(--text-dim-2);
  letter-spacing: .02em;
  margin-top: 1px;
}

.view-toggle {
  display: flex;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}

.view-toggle button {
  border: none;
  background: transparent;
  color: #b9bcb6;
  padding: 6px 14px;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}

.view-toggle button.active {
  background: linear-gradient(180deg, var(--gold-soft), var(--gold));
  color: #1a1400;
}

.toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

/* --- DS: botões — um primário por tela, resto discreto --- */
button.btn {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 8px 14px;
  border-radius: var(--r-sm);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  transition: border-color var(--trans), background var(--trans), color var(--trans), box-shadow var(--trans), opacity var(--trans);
}

button.btn:hover { border-color: var(--gold); background: var(--bg-panel-3); }

button.btn.primary {
  background: var(--gold-grad);
  color: #1a1400;
  font-weight: 700;
  border-color: var(--gold);
  box-shadow: var(--shadow-gold);
}
button.btn.primary:hover { filter: brightness(1.05); }

/* secundário: contorno discreto, sem competir com o primário */
button.btn.secondary {
  background: transparent;
  border-color: var(--border);
  color: var(--text-dim);
}
button.btn.secondary:hover { color: var(--text); border-color: var(--text-dim-2); background: rgba(255,255,255,.02); }

button.btn.small { padding: 4px 9px; font-size: 11px; }
button.btn.ghost { background: transparent; border-color: transparent; color: var(--text-dim); }
button.btn.ghost:hover { border-color: var(--border); background: var(--bg-panel-2); color: var(--text); }
button.btn.block { width: 100%; display: block; text-align: center; }

/* desabilitado: presente e legível, claramente inerte — nunca "cinza feio" */
button.btn:disabled, button.btn[disabled] {
  cursor: not-allowed;
  opacity: .55;
  filter: grayscale(.35);
  box-shadow: none;
}
button.btn.primary:disabled {
  background: var(--bg-panel-3);
  color: #b9bcb6;
  border-color: var(--border);
  filter: none;
}
button.btn:disabled:hover { border-color: var(--border); background: var(--bg-panel-3); }

/* --- DS: inputs e selects — padrão único da aplicação --- */
input.ds-input, select.ds-select, textarea.ds-input {
  width: 100%;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 7px 10px;
  border-radius: var(--r-sm);
  font-size: 12.5px;
  font-family: inherit;
  transition: border-color var(--trans);
}
input.ds-input:focus, select.ds-select:focus, textarea.ds-input:focus {
  outline: none; border-color: var(--gold);
}
input.ds-input::placeholder, textarea.ds-input::placeholder { color: var(--text-dim-2); }

/* --- DS: badges — rótulos curtos de status/contexto --- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 2.5px 8px;
  border-radius: var(--r-pill);
  border: 1px solid var(--border);
  color: var(--text-dim);
  background: rgba(255,255,255,.03);
}
.badge.gold { color: var(--gold-soft); border-color: rgba(201,168,106,.35); background: var(--gold-dim); }
.badge.green { color: var(--green); border-color: rgba(74,222,128,.3); background: rgba(74,222,128,.08); }
.badge.warn { color: var(--amber); border-color: rgba(251,191,36,.3); background: rgba(251,191,36,.08); }
.badge.danger { color: var(--red); border-color: rgba(248,113,113,.3); background: rgba(248,113,113,.08); }

button.btn-importar-destaque {
  padding: 10px 18px;
  font-size: 13px;
  box-shadow: 0 4px 14px rgba(201,168,106,.28);
}

main.layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  gap: 16px;
  padding: 16px 22px;
  align-items: start;
  max-width: 1680px;
  width: 100%;
  margin: 0 auto;
  overflow-x: hidden;
}

@media (max-width: 980px) {
  main.layout { grid-template-columns: minmax(0, 1fr); }
}

.panel {
  /* min-width: 0 é essencial aqui: sem isso, um item de grid não encolhe
     abaixo do tamanho mínimo do seu conteúdo (min-content). Um texto longo
     e sem quebra (ex.: parcela composta com dezenas de blocos, em
     .carta-linha2 com white-space:nowrap) força a coluna inteira do grid a
     crescer, empurrando o painel de Operação para fora da tela — foi
     exatamente o bug relatado ao importar cartas reais com muitos blocos de
     parcela. min-width:0 + overflow:hidden aqui resolve na raiz, e todo o
     truncamento por ellipsis já existente nos elementos internos volta a
     funcionar como esperado. */
  min-width: 0;
  overflow: hidden;
  background: linear-gradient(180deg, var(--bg-panel) 0%, #101214 100%);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  box-shadow: var(--shadow);
}

.panel h2 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--gold);
  margin: 0 0 12px 0;
  font-weight: 700;
}

.catalogo-header {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 12px;
  flex-wrap: wrap;
  gap: 12px;
}

.catalogo-header h2 { margin: 0; flex-shrink: 0; }

#segmento-tabs-wrap {
  flex: 1;
  min-width: 280px;
}

.segmento-tabs {
  display: flex;
  gap: 8px;
  margin-right: auto;
  flex: 1;
  max-width: 520px;
}

.segmento-tabs button {
  flex: 1;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text-dim);
  padding: 10px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.segmento-tabs button:hover {
  border-color: rgba(201,168,106,.45);
  color: var(--text);
}

.segmento-tabs button.active {
  background: linear-gradient(180deg, var(--gold-soft), var(--gold));
  color: #1a1400;
  border-color: var(--gold);
  box-shadow: 0 2px 12px rgba(201,168,106,.25);
}

.filtros {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin-bottom: 6px;
  padding: 9px;
  background: rgba(255,255,255,.015);
  border: 1px solid var(--border);
  border-radius: 9px;
}

.filtros label {
  font-size: 10px;
  color: var(--text-dim-2);
  text-transform: uppercase;
  letter-spacing: .03em;
  display: block;
  margin-bottom: 3px;
}

.filtros input, .filtros select {
  width: 100%;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 12px;
  height: 30px;
}

.filtros input:focus, .filtros select:focus { outline: none; border-color: var(--gold); }

.filtros .full { grid-column: 1 / -1; }

.filtros-avancados-toggle {
  background: transparent;
  border: none;
  color: var(--text-dim-2);
  font-size: 10.5px;
  cursor: pointer;
  padding: 2px 0 8px;
  display: block;
}
.filtros-avancados-toggle:hover { color: var(--gold-soft); }

.filtros-avancados {
  display: none;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin-bottom: 10px;
  padding: 9px;
  background: rgba(255,255,255,.01);
  border: 1px dashed var(--border);
  border-radius: 9px;
}
.filtros-avancados.show { display: grid; }

.filtros-avancados label {
  font-size: 10px;
  color: var(--text-dim-2);
  text-transform: uppercase;
  letter-spacing: .03em;
  display: block;
  margin-bottom: 3px;
}
.filtros-avancados input, .filtros-avancados select {
  width: 100%;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 12px;
  height: 30px;
}
.filtros-avancados input:focus, .filtros-avancados select:focus { outline: none; border-color: var(--gold); }
.filtros-avancados .full { grid-column: 1 / -1; }

.indicador-info {
  font-size: 10.5px;
  color: var(--text-dim-2);
  margin-bottom: 6px;
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.indicador-info strong { color: var(--gold-soft); font-weight: 600; }

.contador {
  font-size: 11px;
  color: var(--text-dim-2);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.origem-breakdown {
  font-size: 12px;
  color: var(--text-dim-2);
  margin-bottom: 10px;
  padding: 6px 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.btn-sutil {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-dim-2);
  font-size: 12px;
  padding: 8px 12px;
}
.btn-sutil:hover {
  color: var(--text);
  border-color: var(--text-dim-2);
}

.modo-importacao {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 10px 0;
}
.modo-importacao label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.aviso-selecao {
  display: none;
  font-size: 12px;
  color: var(--red);
  background: rgba(248,113,113,.1);
  border: 1px solid rgba(248,113,113,.35);
  border-radius: 8px;
  padding: 8px 12px;
  margin-bottom: 9px;
}
.aviso-selecao.show { display: block; }

.combinacao-info {
  display: none;
  font-size: 11.5px;
  color: var(--gold-soft);
  background: rgba(201,168,106,.07);
  border: 1px solid rgba(201,168,106,.25);
  border-radius: 8px;
  padding: 7px 12px;
  margin-bottom: 9px;
}
.combinacao-info.show { display: block; }

.table-wrap {
  max-height: 62vh;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: rgba(0,0,0,.12);
}

.catalogo-lista { display: flex; flex-direction: column; }

.carta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  cursor: pointer;
  border-left: 3px solid transparent;
  transition: background .12s ease, border-color .12s ease, opacity .12s ease;
}

.carta-row:hover { background: rgba(201,168,106,.05); }

.carta-row.selected {
  background: rgba(201,168,106,.10);
  border-left: 3px solid var(--gold);
}

.carta-row.disabled {
  opacity: .32;
  cursor: not-allowed;
}
.carta-row.disabled:hover { background: transparent; }

.carta-info { min-width: 0; flex: 1; }

.carta-linha1 {
  display: flex;
  align-items: baseline;
  gap: 9px;
  font-size: 13px;
  white-space: nowrap;
}
.carta-linha1 .codigo { font-weight: 700; color: var(--text); font-size: 13px; }
.carta-linha1 .valor { font-weight: 700; color: var(--text); font-size: 13.5px; }
.carta-linha1 .credito-destaque { font-size: 15px; font-weight: 800; color: var(--text); }

.carta-seg {
  font-size: 9px;
  font-weight: 700;
  color: var(--gold-soft);
  background: rgba(201,168,106,.12);
  border: 1px solid rgba(201,168,106,.3);
  padding: 1px 6px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.carta-linha2 {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.carta-entrada-destaque {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-top: 5px;
  font-size: 12px;
}
.carta-entrada-destaque .entrada-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-dim-2);
}
.carta-entrada-destaque .entrada-valor {
  font-weight: 800;
  font-size: 14px;
  color: var(--gold-soft);
}

.carta-meta-interna {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 5px;
  font-size: 10px;
  color: var(--text-dim-2);
}
.carta-adm { font-weight: 700; color: var(--text-dim); text-transform: uppercase; letter-spacing: .03em; }
.carta-origem { font-style: italic; }

.badge-tir-label {
  font-size: 9px;
  font-weight: 700;
  color: var(--text-dim-2);
  letter-spacing: .06em;
}

.pill-indicador {
  font-size: 12px;
  min-width: 62px;
  text-align: center;
}

.catalogo-mais { padding: 10px 14px; text-align: center; }

.banner-classificacao { margin: 8px 0 4px; }

.import-resumo-base {
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0,0,0,.15);
}

.indicador-info { display: none; }

.carta-lado-direito {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  min-width: 88px;
  padding-left: 8px;
}

.pill-tir-principal {
  font-size: 13px;
  font-weight: 800;
  padding: 6px 12px;
  letter-spacing: .01em;
}

.carta-linha3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 5px;
  font-size: 10px;
  color: var(--text-dim-2);
}

.badge-adm-discreto {
  font-size: 9px;
  font-weight: 600;
  color: var(--text-dim-2);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.carta-origem-discreta {
  font-size: 9px;
  font-style: italic;
  color: var(--text-dim-2);
  opacity: .85;
}

.entrada-rs {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-dim);
  margin-left: 4px;
}

.kv-com-hint {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 2px 12px;
  align-items: baseline;
  margin-bottom: 10px;
}
.kv-com-hint .k { grid-column: 1; font-size: 12px; }
.kv-com-hint .kv-micro {
  grid-column: 1;
  font-size: 10px;
  color: var(--text-dim-2);
  line-height: 1.3;
}
.kv-com-hint > span:last-child { grid-column: 2; grid-row: 1 / span 2; font-weight: 700; }

.import-loading-panel {
  display: none;
  margin: 14px 0;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(0,0,0,.2);
  text-align: center;
}
.import-loading-spinner {
  width: 28px;
  height: 28px;
  margin: 0 auto 10px;
  border: 3px solid rgba(201,168,106,.2);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: import-spin .8s linear infinite;
}
.import-loading-text { font-size: 13px; color: var(--text-dim); }
@keyframes import-spin { to { transform: rotate(360deg); } }

.badge-adm {
  font-size: 9.5px;
  font-weight: 700;
  color: var(--text-dim);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--border);
  padding: 2px 8px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
}

.pill {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}
.pill-otimo { background: rgba(74,222,128,.14); color: var(--green); }
.pill-bom { background: rgba(251,191,36,.14); color: var(--amber); }
.pill-atencao { background: rgba(248,113,113,.14); color: var(--red); }
.pill-neutro { background: rgba(170, 173, 168,.14); color: var(--text-dim); }

.link-discreto {
  background: transparent;
  border: none;
  color: var(--text-dim-2);
  font-size: 10.5px;
  cursor: pointer;
  padding: 8px 2px 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.link-discreto:hover { color: var(--gold-soft); }

/* -------------------------------- Operação / chips -------------------------------- */

.operacao-topo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.operacao-topo h2 { margin: 0; }

.chips-selecao {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.chip {
  display: flex;
  align-items: center;
  gap: 7px;
  background: var(--bg-panel-2);
  border: 1px solid var(--gold);
  color: var(--text);
  border-radius: 999px;
  padding: 4px 6px 4px 12px;
  font-size: 11.5px;
  font-weight: 600;
}
.chip button {
  background: rgba(255,255,255,.06);
  border: none;
  color: var(--text-dim);
  width: 18px; height: 18px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.chip button:hover { background: rgba(248,113,113,.25); color: var(--red); }

.admin-row {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 3px;
}
.admin-row .icone { font-size: 16px; line-height: 1; }
.admin-row .nome { font-size: 14px; font-weight: 800; letter-spacing: -.01em; }

.tipo-row {
  margin-bottom: 10px;
}
.tipo-row .label { font-size: 9.5px; color: var(--text-dim-2); text-transform: uppercase; letter-spacing: .05em; }
.tipo-row .valor { font-size: 12.5px; font-weight: 700; color: var(--text); text-transform: uppercase; margin-top: 1px; }

.sparkline {
  display: flex;
  align-items: flex-end;
  gap: 1px;
  height: 26px;
  margin: 6px 0 3px;
  overflow: hidden;
}
.sparkline .barra {
  flex: 1 1 auto;
  min-width: 1px;
  background: linear-gradient(180deg, var(--gold-soft), var(--gold));
  border-radius: 1px 1px 0 0;
  opacity: .85;
}

.grid-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 7px;
  margin-top: 8px;
}

.detail-empty {
  color: var(--text-dim);
  font-size: 13px;
  padding: 30px 16px;
  text-align: center;
  line-height: 1.6;
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-md);
  background: rgba(255,255,255,.015);
  margin: var(--sp-2) 0 var(--sp-3);
}
.detail-empty .empty-icone { display: block; font-size: 22px; margin-bottom: 6px; opacity: .7; }

.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-bottom: 10px;
}

/* --- DS: card executivo (números principais da ficha) --- */
.stat {
  background: linear-gradient(180deg, rgba(255,255,255,.025) 0%, rgba(255,255,255,0) 60%), var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: 10px 12px;
  box-shadow: var(--shadow-sm);
}

.stat .label { font-size: 9.5px; color: var(--text-dim-2); text-transform: uppercase; letter-spacing: .07em; font-weight: 600; }
.stat .value { font-size: 15.5px; font-weight: 800; margin-top: 4px; letter-spacing: -.01em; }
.stat .value.big { font-size: 20px; }
.stat .value.green { color: var(--green); }
.stat .value.gold { color: var(--gold-soft); }
.stat .caption { font-size: 9.5px; color: var(--text-dim-2); margin-top: 3px; }

.section-title {
  font-size: 9.5px;
  text-transform: uppercase;
  color: var(--gold-soft);
  letter-spacing: .1em;
  font-weight: 700;
  margin: 14px 0 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-hair);
}

.kv { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12px; padding: 4.5px 0; border-bottom: 1px dashed var(--border-hair); }
.kv .k { color: var(--text-dim); }
.kv .gold { color: var(--gold-soft); font-weight: 700; }
.kv input.comissao-inline {
  width: 64px;
  background: var(--bg-panel-3);
  border: 1px solid var(--gold);
  color: var(--text);
  padding: 3px 6px;
  border-radius: 6px;
  font-size: 12px;
  text-align: right;
}

.formula-hint {
  font-size: 10px;
  color: var(--text-dim-2);
  margin: -2px 0 6px;
  font-style: italic;
}

textarea, input[type=text], input[type=number], select {
  font-family: inherit;
}

.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(3,6,18,.75);
  backdrop-filter: blur(2px);
  display: flex; align-items: center; justify-content: center;
  z-index: 50;
  padding: 20px;
}

.modal {
  background: linear-gradient(180deg, var(--bg-panel) 0%, #101214 100%);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 22px;
  width: 620px;
  max-width: 94vw;
  max-height: 90vh;
  overflow: auto;
  box-shadow: var(--shadow);
}

.modal.modal-largo { width: 920px; }

.modal h3 { margin-top: 0; color: var(--gold-soft); font-size: 15px; }
.modal h4 { color: var(--text); font-size: 13px; margin: 4px 0 8px; }

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.form-grid label { font-size: 11px; color: var(--text-dim); display: block; margin-bottom: 3px; }
.form-grid input, .form-grid select, .form-grid textarea {
  width: 100%;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 6px 9px;
  border-radius: 7px;
  font-size: 12px;
  height: 32px;
}
.form-grid textarea { height: auto; }
.form-grid .full { grid-column: 1 / -1; }

.modal-actions {
  display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px;
}

.tabs-import { display: flex; gap: 6px; margin-bottom: 14px; }
.tabs-import button {
  background: var(--bg-panel-2); border: 1px solid var(--border); color: var(--text-dim);
  padding: 6px 13px; border-radius: 7px; font-size: 11.5px; font-weight: 600; cursor: pointer;
}
.tabs-import button.active { background: linear-gradient(180deg, var(--gold-soft), var(--gold)); color: #1a1400; border-color: var(--gold); }

.dropzone {
  border: 2px dashed var(--border);
  border-radius: 10px;
  padding: 22px;
  text-align: center;
  background: rgba(255,255,255,.015);
}
.dropzone input[type=file] { margin-top: 10px; }

.hint { font-size: 11px; color: var(--text-dim); margin-top: 6px; line-height: 1.5; }
.aviso-forte { font-size: 11.5px; color: var(--amber); background: rgba(251,191,36,.08); border: 1px solid rgba(251,191,36,.3); border-radius: 7px; padding: 8px 10px; margin-top: 8px; line-height: 1.5; }
.erro-lista { font-size: 11.5px; color: var(--warn); margin-top: 8px; max-height: 140px; overflow: auto; }

/* --------------------------- Prévia / conferência de importação --------------------------- */

.import-msg-info {
  color: var(--gold-soft);
  background: rgba(201,168,106,.08);
  border: 1px solid rgba(201,168,106,.3);
  border-radius: 8px;
  padding: 8px 12px;
}

.previa-resumo {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}
.previa-resumo .chip-resumo {
  font-size: 11px;
  font-weight: 700;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text-dim);
}
.previa-resumo .chip-resumo.ok { color: var(--green); border-color: rgba(74,222,128,.4); }
.previa-resumo .chip-resumo.pendente { color: var(--amber); border-color: rgba(251,191,36,.4); }

.previa-lista { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow: auto; margin-bottom: 10px; }

.previa-carta {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 10px 12px;
}
.previa-carta.tem-pendencia { border-color: rgba(251,191,36,.45); }

.previa-carta-topo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 7px;
}
.previa-carta-topo .fonte { font-size: 10px; color: var(--text-dim-2); }
.previa-carta-remover {
  background: rgba(248,113,113,.12);
  border: 1px solid rgba(248,113,113,.35);
  color: var(--red);
  width: 22px; height: 22px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
}

.previa-campos {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.previa-campos .campo { display: flex; flex-direction: column; }
.previa-campos label { font-size: 9px; color: var(--text-dim-2); text-transform: uppercase; margin-bottom: 2px; }
.previa-campos input {
  background: var(--bg-panel-3);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 5px 7px;
  border-radius: 6px;
  font-size: 11.5px;
  height: 28px;
}
.previa-campos input.pendente { border-color: var(--amber); }
.previa-campos .full { grid-column: 1 / -1; }

.pendencias-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.tag-pendencia {
  font-size: 9.5px;
  color: var(--amber);
  background: rgba(251,191,36,.1);
  border: 1px solid rgba(251,191,36,.3);
  padding: 1px 7px;
  border-radius: 999px;
}

.whatsapp-bloco {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  margin: 10px 0;
}
.whatsapp-bloco label { font-size: 11px; color: var(--text-dim); display: block; margin: 8px 0 4px; }
.whatsapp-bloco input, .whatsapp-bloco textarea {
  width: 100%;
  background: var(--bg-panel-3);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 8px 10px;
  border-radius: 7px;
  font-size: 12px;
  font-family: inherit;
}

footer.rodape {
  text-align: center;
  color: var(--text-dim-2);
  font-size: 10.5px;
  padding: 10px 0 22px;
}

/* --------------------------- Registrar operação --------------------------- */

.confirma-venda {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 11.5px;
  color: var(--amber);
  background: rgba(251,191,36,.08);
  border: 1px solid rgba(251,191,36,.3);
  border-radius: 8px;
  padding: 9px 11px;
  margin-top: 4px;
}
.confirma-venda input { margin-top: 2px; }
.confirma-venda label { color: var(--amber); }

/* -------------------------------- Dashboard -------------------------------- */

.dashboard-root {
  max-width: 1680px;
  margin: 0 auto;
  padding: 6px 22px 30px;
}

.dashboard-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
  flex-wrap: wrap;
  gap: 10px;
}
.dashboard-header h2 { margin: 0; font-size: 15px; color: var(--gold-soft); }

.dash-tabs { display: flex; gap: 6px; }
.dash-tabs button {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text-dim);
  padding: 7px 15px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.dash-tabs button.active {
  background: linear-gradient(180deg, var(--gold-soft), var(--gold));
  color: #1a1400;
  border-color: var(--gold);
}

.dash-filtros {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 7px;
  padding: 10px;
  background: rgba(255,255,255,.015);
  border: 1px solid var(--border);
  border-radius: 9px;
  margin-bottom: 14px;
}
.dash-filtros label {
  font-size: 9.5px;
  color: var(--text-dim-2);
  text-transform: uppercase;
  display: block;
  margin-bottom: 3px;
}
.dash-filtros input, .dash-filtros select {
  width: 100%;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 5px 7px;
  border-radius: 6px;
  font-size: 11.5px;
  height: 30px;
}
@media (max-width: 1300px) { .dash-filtros { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px) { .dash-filtros { grid-template-columns: repeat(2, 1fr); } }

.dash-cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 9px;
  margin-bottom: 18px;
}
@media (max-width: 1300px) { .dash-cards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .dash-cards { grid-template-columns: repeat(2, 1fr); } }

.dash-card {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 11px 13px;
}
.dash-card .label { font-size: 9.5px; color: var(--text-dim-2); text-transform: uppercase; letter-spacing: .04em; }
.dash-card .value { font-size: 17px; font-weight: 800; margin-top: 4px; }
.dash-card .value.gold { color: var(--gold-soft); }
.dash-card .value.green { color: var(--green); }
.dash-card .value.red { color: var(--red); }

/* --------------------------------- Auditoria --------------------------------- */

.auditoria-status-geral {
  border-radius: 12px;
  padding: 18px 22px;
  margin-bottom: 16px;
  border: 1px solid var(--border);
}
.auditoria-status-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-dim-2);
}
.auditoria-status-valor {
  font-size: 28px;
  font-weight: 800;
  margin-top: 4px;
}
.auditoria-status-geral.auditoria-ok {
  background: rgba(74, 222, 128, .08);
  border-color: rgba(74, 222, 128, .35);
}
.auditoria-status-geral.auditoria-ok .auditoria-status-valor { color: var(--green); }
.auditoria-status-geral.auditoria-alerta {
  background: rgba(201, 168, 106, .1);
  border-color: rgba(201, 168, 106, .4);
}
.auditoria-status-geral.auditoria-alerta .auditoria-status-valor { color: var(--gold-soft); }
.auditoria-status-geral.auditoria-critico {
  background: rgba(248, 113, 113, .1);
  border-color: rgba(248, 113, 113, .45);
}
.auditoria-status-geral.auditoria-critico .auditoria-status-valor { color: var(--red); }

.dash-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 18px;
}
@media (max-width: 1100px) { .dash-grid-2 { grid-template-columns: 1fr; } }

.dash-painel {
  background: linear-gradient(180deg, var(--bg-panel) 0%, #101214 100%);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px;
}
.dash-painel h3 { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--gold); margin: 0 0 10px; }

.dash-barlist { display: flex; flex-direction: column; gap: 7px; }
.dash-barlist-row { display: grid; grid-template-columns: 96px 1fr 104px; align-items: center; gap: 8px; font-size: 11px; }
.dash-barlist-label { color: var(--text-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-barlist-track { background: rgba(255,255,255,.05); border-radius: 5px; height: 9px; overflow: hidden; }
.dash-barlist-fill { height: 100%; background: linear-gradient(90deg, var(--gold-soft), var(--gold)); border-radius: 5px; }
.dash-barlist-valor { text-align: right; font-weight: 700; color: var(--text); }

.dash-tabela-wrap { overflow-x: auto; }
.dash-tabela { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.dash-tabela th { text-align: left; color: var(--text-dim-2); font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em; padding: 6px 8px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.dash-tabela td { padding: 7px 8px; border-bottom: 1px solid rgba(255,255,255,.04); white-space: nowrap; }
.dash-tabela tr:hover td { background: rgba(201,168,106,.04); }

.dash-secao-titulo { font-size: 12.5px; font-weight: 700; color: var(--text); margin: 4px 0 8px; }

.dash-export {
  margin-top: 10px;
  padding-top: 14px;
  border-top: 1px dashed var(--border);
}
.dash-export .hint { margin-top: 8px; }

/* --------------------------- Menu principal (v6) --------------------------- */

.menu-principal {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.menu-item {
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-dim);
  font-size: 12px;
  font-weight: 600;
  padding: 7px 13px;
  border-radius: 8px;
  cursor: pointer;
}
.menu-item:hover { color: var(--text); background: var(--bg-panel-2); }
.menu-item.active {
  color: var(--gold-soft);
  background: var(--bg-panel-2);
  border-color: var(--border);
}

/* --------------------------- Tabela de revisão da importação (v6) --------------------------- */

.modal.modal-largo { width: 1180px; }

.previa-tabela-wrap {
  overflow-x: auto;
  max-height: 54vh;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 9px;
  margin-bottom: 10px;
}
.previa-tabela { width: 100%; border-collapse: collapse; font-size: 11px; }
.previa-tabela th {
  text-align: left;
  color: var(--text-dim-2);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 7px 8px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  position: sticky;
  top: 0;
  background: var(--bg-panel);
}
.previa-tabela td {
  padding: 6px 8px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  white-space: nowrap;
  vertical-align: middle;
}
.previa-tabela input {
  background: var(--bg-panel-3);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 4px 6px;
  border-radius: 6px;
  font-size: 11px;
  height: 26px;
  width: 100%;
  min-width: 70px;
}
.previa-tr-completo td:first-child { border-left: 2px solid rgba(74,222,128,.4); }
.previa-tr-pendente td:first-child { border-left: 2px solid rgba(251,191,36,.4); }
.previa-tr-erro { background: rgba(248,113,113,.05); }
.previa-tr-erro td:first-child { border-left: 2px solid rgba(248,113,113,.5); }

.previa-tr-detalhe td {
  white-space: normal;
  padding: 4px 8px 9px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.previa-tr-detalhe { display: table-row; }


.previa-acoes { display: flex; gap: 6px; align-items: center; }

/* ==========================================================================
   Padrão global de formulários — NENHUM input/select/textarea branco.
   Fundo grafite, borda discreta, texto claro, foco dourado (rules/ux-rules.md,
   docs/UX_GUIDELINES.md). Vale para Configurações, modais e qualquer tela
   nova sem precisar de classe extra.
   ========================================================================== */

input, select, textarea {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12.5px;
  font-family: inherit;
  accent-color: var(--gold);
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(201,168,106,.18);
}
input::placeholder, textarea::placeholder { color: var(--text-dim-2); }
select option { background: var(--bg-panel-2); color: var(--text); }
input:disabled, select:disabled, textarea:disabled, button:disabled { opacity: .45; cursor: not-allowed; }

/* sem setas nativas feias em input number */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; appearance: textfield; }

input[type="radio"], input[type="checkbox"] { width: auto; padding: 0; accent-color: var(--gold); }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
select:-webkit-autofill,
textarea:-webkit-autofill {
  -webkit-text-fill-color: var(--text);
  -webkit-box-shadow: 0 0 0 1000px var(--bg-panel-2) inset;
  box-shadow: 0 0 0 1000px var(--bg-panel-2) inset;
  caret-color: var(--text);
}

/* ---------------------- Toast (substitui alert nativo) -------------------- */
.toast-root {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: min(420px, calc(100vw - 32px));
  pointer-events: none;
}
.toast {
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.45;
  background: var(--bg-panel-3);
  border: 1px solid var(--border);
  color: var(--text);
  box-shadow: var(--shadow);
  animation: toast-in .25s ease;
  pointer-events: auto;
}
.toast-saindo { opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; }
.toast-ok { border-color: rgba(74,222,128,.45); }
.toast-warn { border-color: rgba(251,191,36,.45); }
.toast-erro { border-color: rgba(248,113,113,.5); color: #fecaca; }
@keyframes toast-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Banner contextual inline */
.banner-contextual {
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 12.5px;
  margin: 8px 0;
  background: rgba(251,191,36,.08);
  border: 1px solid rgba(251,191,36,.35);
  color: var(--text);
}
.banner-contextual.erro {
  background: rgba(248,113,113,.08);
  border-color: rgba(248,113,113,.4);
}

button.btn.danger {
  background: rgba(248,113,113,.12);
  border-color: rgba(248,113,113,.5);
  color: var(--red);
}
button.btn.danger:hover:not(:disabled) { background: rgba(248,113,113,.22); border-color: var(--red); }

/* ---------------- manutenção da base / reset (perigo controlado) ---------- */
/* Bloco recolhido e discreto: nunca chama atenção como uma ação principal. */
details.manutencao-base {
  margin-top: 26px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.06);
}
details.manutencao-base > summary {
  cursor: pointer;
  font-size: 12px;
  color: var(--text-dim);
  list-style: none;
  user-select: none;
}
details.manutencao-base > summary::-webkit-details-marker { display: none; }
details.manutencao-base > summary::before { content: "▸ "; opacity: .6; }
details.manutencao-base[open] > summary::before { content: "▾ "; }
.manutencao-acao { margin-top: 10px; }
/* Botão pequeno com contorno vermelho fino — perigo controlado, sem destaque. */
button.btn-reset-discreto {
  font-size: 12px;
  padding: 5px 10px;
  background: transparent;
  border: 1px solid rgba(248,113,113,.35);
  border-radius: 6px;
  color: rgba(248,113,113,.85);
  cursor: pointer;
}
button.btn-reset-discreto:hover { background: rgba(248,113,113,.1); border-color: rgba(248,113,113,.6); }
.reset-contagens { display: flex; flex-direction: column; gap: 2px; }
.reset-contagem { font-weight: 600; color: var(--text); }

/* -------------------- garantia por imóvel (prévia + badge) ---------------- */
select.garantia-select { font-size: 12px; padding: 2px 4px; min-width: 84px; }
select.garantia-select.garantia-sim { color: #34d399; }
select.garantia-select.garantia-revisar { color: #fbbf24; }
select.garantia-select.garantia-nao { color: var(--text-dim); }
/* Badge discreto no catálogo. */
.badge-garantia-imovel {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  line-height: 1;
  padding: 2px 6px;
  border-radius: 10px;
  color: #34d399;
  border: 1px solid rgba(52,211,153,.35);
  background: rgba(52,211,153,.08);
  white-space: nowrap;
}

/* ---------------------- link discreto (ações secundárias) ----------------- */
button.link-discreto {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 12px;
  cursor: pointer;
  padding: 4px 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-family: inherit;
}
button.link-discreto:hover { color: var(--gold-soft); }

/* ---------------------- modal Importar lote (fluxo único) ----------------- */
.import-page-header h2 { margin-bottom: 6px; }
.import-page-header p, .import-modal-subtitle { color: var(--muted, #85888a); max-width: 760px; margin: 0 0 18px; }
.import-main-card {
  max-width: 760px; min-height: 270px; margin: 22px auto 14px; padding: 38px 28px;
  border: 1.5px dashed rgba(34, 39, 43, .28); border-radius: 18px; background: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center;
}
.import-main-card h3, .import-main-card p { margin: 0; }
.import-main-card h3 { color: #22282c; }
.import-main-card p, .import-main-card small { color: var(--muted, #85888a); }
.import-last-update { max-width: 760px; margin: 0 auto 18px; text-align: center; color: var(--muted, #85888a); }
.import-history-compact, .import-technical-details { margin-top: 14px; border: 1px solid rgba(34, 39, 43, .12); border-radius: 12px; background: #fff; }
.import-history-compact > summary, .import-technical-details > summary { cursor: pointer; padding: 14px 16px; font-weight: 700; color: #22282c; }
.import-history-compact > :not(summary), .import-technical-details > :not(summary) { margin: 0 16px 16px; }
.modal-confirmar-catalogo { width: min(620px, calc(100vw - 28px)); }
.confirm-catalog-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin: 16px 0; }
.confirm-catalog-meta .kv { min-width: 0; }
.catalog-replace-option { display: flex; align-items: flex-start; gap: 10px; padding: 14px; margin: 12px 0; border: 1px solid rgba(34, 39, 43, .15); border-radius: 12px; }
.catalog-replace-option input { margin-top: 3px; }
.catalog-replace-option span { display: flex; flex-direction: column; gap: 3px; }
.catalog-replace-option small { color: var(--muted, #85888a); }
.import-progress { margin: 16px 0; padding: 16px; background: #f6f8fb; border-radius: 12px; }
.import-progress-copy { display: flex; flex-direction: column; gap: 4px; }
.import-progress-copy span { color: var(--muted, #85888a); }
.import-progress-track { height: 8px; margin: 12px 0 6px; overflow: hidden; border-radius: 999px; background: #dfe5ec; }
.import-progress-track span { display: block; height: 100%; border-radius: inherit; background: #c49a4a; transition: width .2s ease; }
.modal-catalogo-final { width: min(720px, calc(100vw - 28px)); text-align: center; }
.import-success-icon { width: 48px; height: 48px; margin: 0 auto 10px; display: grid; place-items: center; border-radius: 50%; background: #e9f7ef; color: #18794e; font-size: 26px; font-weight: 800; }
.import-final-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 18px 0; }
.import-final-grid > div { padding: 12px 7px; border-radius: 10px; background: #f6f8fb; display: flex; flex-direction: column; gap: 4px; }
.import-final-grid strong { font-size: 22px; color: #22282c; }
.import-final-grid span { font-size: 12px; color: var(--muted, #85888a); }
.modal-catalogo-final .import-technical-details { text-align: left; }
@media (max-width: 720px) {
  .confirm-catalog-meta { grid-template-columns: 1fr; }
  .import-final-grid { grid-template-columns: repeat(2, 1fr); }
  .import-main-card { min-height: 230px; padding: 28px 18px; }
}
.dropzone-principal {
  border: 1.5px dashed var(--border);
  border-radius: 12px;
  background: var(--bg-panel-2);
  padding: 34px 20px;
  text-align: center;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  margin: 8px 0 4px;
}
.dropzone-principal:hover, .dropzone-principal.dragover {
  border-color: var(--gold);
  background: var(--bg-panel-3);
}
.dropzone-icone { font-size: 26px; color: var(--gold); margin-bottom: 6px; }
.dropzone-titulo { font-weight: 700; font-size: 14px; }
.dropzone-sub { color: var(--text-dim); font-size: 11.5px; margin-top: 4px; }
.rodape-importar { margin-top: 6px; }
.painel-colar-texto { margin-top: 8px; }
.painel-colar-texto textarea { width: 100%; box-sizing: border-box; }
.detalhes-tecnicos { margin-top: 8px; }

/* ---------------------- Auditoria executiva (cards por área) -------------- */
.auditoria-veredito { font-size: 14px; font-weight: 700; margin-top: 8px; }
.auditoria-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
  margin: 14px 0 4px;
}
.auditoria-card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 14px;
  border-left-width: 3px;
}
.auditoria-card.auditoria-ok { border-left-color: var(--green); }
.auditoria-card.auditoria-alerta { border-left-color: var(--amber); }
.auditoria-card.auditoria-critico { border-left-color: var(--red); background: rgba(248,113,113,.06); }
.auditoria-card-titulo { font-size: 12px; color: var(--text-dim); font-weight: 600; }
.auditoria-card-status { font-size: 16px; font-weight: 800; margin: 4px 0 2px; }
.auditoria-card.auditoria-ok .auditoria-card-status { color: var(--green); }
.auditoria-card.auditoria-alerta .auditoria-card-status { color: var(--gold-soft); }
.auditoria-card.auditoria-critico .auditoria-card-status { color: var(--red); }
.auditoria-card-contadores { font-size: 11.5px; color: var(--text-dim); margin-bottom: 4px; }

/* ---------------------- Configurações > Administração --------------------- */
.admin-acao { display: flex; gap: 10px; align-items: center; margin: 10px 0; flex-wrap: wrap; }

/* Configurações: inputs da tabela de taxas compactos */
.dash-tabela input, .dash-tabela select { padding: 5px 8px; font-size: 12px; }

/* ==========================================================================
   Rodada "simulador sólido": fluxo de parcelas compostas, prévia em massa e
   refinamento do header/catálogo (rules/ux-rules.md, docs/UX_GUIDELINES.md)
   ========================================================================== */

/* ---- fluxo real de parcelas no painel Operação (nunca média no lugar) ---- */
/* fluxo REAL de parcelas: destaque de leitura — nunca escondido atrás de média */
.fluxo-parcelas {
  margin: 2px 0 4px;
  padding: 8px 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 70%), var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
}
.fluxo-parcelas-linha { font-size: 14.5px; font-weight: 800; line-height: 1.6; letter-spacing: -.01em; }
.fluxo-parcelas-codigo { color: var(--text-dim); font-size: 11px; font-weight: 600; }
.fluxo-parcelas-blocos.composto { color: var(--gold-soft); }

/* blocos alternados na barra do fluxo (parcela muda de valor = cor muda) */
.sparkline .barra-bloco-alt { background: var(--gold); opacity: .8; }

/* ---- preenchimento em massa na prévia de importação ---- */
.previa-massa {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 12px;
  margin: 8px 0;
}

/* ---- header mais leve: menu discreto, ativa com sublinhado dourado ---- */
header.topbar { padding: 10px 24px; }
.menu-item {
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 8px 11px 9px;
  letter-spacing: .02em;
}
.menu-item:hover { background: transparent; color: var(--text); }
.menu-item.active {
  background: transparent;
  border-color: transparent;
  border-bottom-color: var(--gold);
  color: var(--gold-soft);
}

/* ---- catálogo aproveitando a altura da tela, rolagem interna fluida ---- */
main.layout { align-items: stretch; }
.panel-catalogo { display: flex; flex-direction: column; min-height: 0; }
.panel-catalogo .table-wrap {
  flex: 1 1 auto;
  max-height: none;
  min-height: 300px;
  height: calc(100vh - 330px);
  overscroll-behavior: contain;
}
@media (max-width: 1100px) {
  .panel-catalogo .table-wrap { height: auto; max-height: 62vh; }
}

/* ==========================================================================
   Redesign institucional — mesa financeira premium
   Direção: menos ruído, hierarquia forte, superfícies calmas, dourado só
   onde importa (valor-chave e ação principal). docs/UX_GUIDELINES.md.
   ========================================================================== */

/* ---- cabeçalho: navegação tipográfica, sem cara de botão ---- */
header.topbar {
  padding: 8px 28px;
  background: linear-gradient(180deg, #101214 0%, #0b0d0f 100%);
  border-bottom: 1px solid rgba(42, 47, 51, .55);
}
header.topbar .brand h1 { font-size: 15px; letter-spacing: .01em; }
header.topbar .brand .subtitle { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.menu-principal { gap: 2px; }
.menu-item {
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--text-dim-2);
  padding: 10px 12px 11px;
}
.menu-item:hover { color: var(--text-dim); }
.menu-item.active { color: var(--gold-soft); border-bottom-color: var(--gold); }

/* ---- catálogo: linhas escaneáveis, hierarquia clara ---- */
.carta-row {
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid transparent;
  transition: background .12s, border-color .12s;
}
.carta-row:hover { background: var(--bg-panel-2); border-color: rgba(42, 47, 51, .7); }
.carta-row.selected { border-color: var(--gold); background: rgba(201,168,106,.07); }
.carta-linha1 .codigo { color: var(--text-dim); font-size: 11px; letter-spacing: .04em; }
.carta-linha1 .credito-destaque { font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; }
.badge-adm {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-dim);
  font-size: 10px;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-radius: 6px;
  padding: 3px 8px;
}
.pill { font-variant-numeric: tabular-nums; font-weight: 700; }

/* ---- painel Operação: executivo, seções recolhíveis ---- */
.stat .label { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim-2); }
.stat .value { font-variant-numeric: tabular-nums; }
.essenciais-custo {
  border-top: 1px solid var(--border-soft);
  margin-top: var(--sp-3);
  padding-top: var(--sp-2);
}

/* --- DS: seção recolhível — detalhe subordinado, nunca competindo --- */
.secao-recolhivel {
  border-top: 1px solid var(--border-hair);
  margin-top: var(--sp-2);
}
button.secao-toggle {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  background: none;
  border: none;
  border-radius: var(--r-sm);
  color: var(--text-dim-2);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 9px 6px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: color var(--trans), background var(--trans);
}
button.secao-toggle:hover { color: var(--gold-soft); background: rgba(255,255,255,.025); }
button.secao-toggle .secao-seta { transition: transform .15s; font-size: 10px; color: var(--gold); }
button.secao-toggle.aberta .secao-seta { transform: rotate(90deg); }
button.secao-toggle.aberta { color: var(--text-dim); }
.secao-corpo { padding: 2px 6px 10px; }

/* --- DS: barra de ação principal da ficha executiva --- */
.painel-acoes {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin-top: var(--sp-4);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--border-soft);
}
.painel-acoes .btn { padding: 11px 16px; font-size: 13px; border-radius: var(--r-md); }
.painel-acoes .btn.primary { letter-spacing: .01em; }
.obs-comercial { border-top: 1px solid rgba(42, 47, 51, .5); margin-top: 10px; padding-top: 6px; }

/* ---- hierarquia de botões: um primário, resto discreto ---- */
button.btn { font-weight: 600; letter-spacing: .01em; }
button.btn.primary {
  box-shadow: 0 2px 10px rgba(201,168,106,.25);
  font-weight: 700;
}
button.btn.primary:hover { filter: brightness(1.06); }
button.btn.small { padding: 5px 10px; font-size: 11.5px; }

/* ---- chips de seleção mais elegantes ---- */
.chips-selecao .chip {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  font-variant-numeric: tabular-nums;
}

/* ---- números tabulares em todo lugar com valor ---- */
.kv span:last-child, .dash-card .value, .fluxo-parcelas-blocos { font-variant-numeric: tabular-nums; }

/* ---- versionamento de cartas (lotes recorrentes) ---- */
.alerta-revalidar {
  background: rgba(251,191,36,.08);
  border: 1px solid rgba(251,191,36,.35);
  border-radius: 8px;
  color: var(--amber);
  font-size: 11.5px;
  padding: 7px 10px;
  margin: 6px 0;
}
.badge-revalidar { font-size: 12px; cursor: help; }
.historico-entrada {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  margin: 6px 0;
  background: var(--bg-panel-2);
}
.historico-cab { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; }
.historico-data { color: var(--text-dim); }
.historico-status { font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 10px; }
.historico-status.historico-aplicada, .historico-status.historico-aplicada_apos_revisao { color: var(--green); }
.historico-status.historico-pendente { color: var(--amber); }
.historico-status.historico-descartada { color: var(--text-dim-2); }
.historico-alteracoes { font-size: 11.5px; margin: 4px 0 2px; font-variant-numeric: tabular-nums; }
.historico-lote { font-size: 10.5px; color: var(--text-dim-2); }
.atualizacao-pendente-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--amber);
  border-radius: 10px;
  background: var(--bg-panel);
  padding: 10px 14px;
  margin: 8px 0;
}
.atualizacao-pendente-acoes { display: flex; gap: 8px; flex-shrink: 0; }
.import-msg-warn { color: var(--amber); }

/* ==========================================================================
   FASE 1B — Catálogo + Header institucionais (sprint autônoma)
   Camada de refino sobre o design system da Fase 1A. Direção: mesa
   financeira premium — hierarquia, respiro, dourado só onde decide.
   ========================================================================== */

/* ---- header: barra institucional ---- */
header.topbar {
  padding: 10px 32px;
  background: linear-gradient(180deg, #0e1012 0%, #0b0d0f 100%);
  border-bottom: 1px solid var(--border-soft);
  min-height: 54px;
}
header.topbar .brand { gap: 12px; }
header.topbar .brand .triangle {
  border-left-width: 7px; border-right-width: 7px; border-bottom-width: 12px;
}
header.topbar h1 { font-size: 14.5px; font-weight: 700; letter-spacing: .02em; }
header.topbar .subtitle {
  font-size: 9px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); opacity: .75;
}

/* navegação: tipográfica, ativa marcada por sublinhado dourado fino */
.menu-principal { gap: 0; }
.menu-item {
  position: relative;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .11em;
  padding: 12px 14px 13px;
  border: none;
  background: none;
  border-radius: 0;
  transition: color var(--trans);
}
.menu-item::after {
  content: "";
  position: absolute;
  left: 14px; right: 14px; bottom: 6px;
  height: 2px;
  border-radius: 2px;
  background: var(--gold);
  opacity: 0;
  transform: scaleX(.4);
  transition: opacity var(--trans), transform var(--trans);
}
.menu-item:hover { color: var(--text); }
.menu-item.active { color: var(--gold-soft); border-bottom-color: transparent; }
.menu-item.active::after { opacity: 1; transform: scaleX(1); }

/* alternância interna/comercial: controle segmentado sóbrio */
.view-toggle {
  background: var(--bg-panel);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-pill);
  padding: 3px;
  gap: 2px;
}
.view-toggle button {
  border: none;
  background: transparent;
  color: #b9bcb6;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 6px 14px;
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: color var(--trans), background var(--trans);
}
.view-toggle button:hover { color: var(--text-dim); }
.view-toggle button.active {
  background: var(--gold-grad);
  color: #1a1400;
  font-weight: 700;
  box-shadow: var(--shadow-sm);
}

/* ---- abas de segmento: seletor discreto, não botões gordos ---- */
.segmento-tabs { gap: 6px; max-width: 460px; }
.segmento-tabs button {
  background: transparent;
  border: 1px solid var(--border-soft);
  color: var(--text-dim-2);
  padding: 8px 14px;
  border-radius: var(--r-pill);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .03em;
  transition: color var(--trans), border-color var(--trans), background var(--trans);
}
.segmento-tabs button:hover { color: var(--text-dim); border-color: var(--border); background: rgba(255,255,255,.02); }
.segmento-tabs button.active {
  background: var(--gold-dim);
  border-color: rgba(201,168,106,.45);
  color: var(--gold-soft);
}

/* ---- catálogo: vitrine escaneável ---- */
.catalogo-lista { display: flex; flex-direction: column; gap: 7px; padding: 2px; }
.carta-row {
  padding: 12px 16px;
  border-radius: var(--r-md);
  border: 1px solid var(--border-hair);
  background: linear-gradient(180deg, rgba(255,255,255,.015) 0%, rgba(255,255,255,0) 55%), var(--bg-panel);
  transition: background var(--trans), border-color var(--trans), transform .1s ease;
  cursor: pointer;
}
.carta-row:hover {
  background: var(--bg-panel-2);
  border-color: var(--border);
}
.carta-row.selected {
  border-color: rgba(201,168,106,.55);
  background: linear-gradient(180deg, rgba(201,168,106,.06) 0%, rgba(201,168,106,.02) 100%), var(--bg-panel);
  box-shadow: 0 0 0 1px rgba(201,168,106,.2), var(--shadow-sm);
}
.carta-row.disabled { opacity: .38; filter: saturate(.5); }

.carta-linha1 { display: flex; align-items: baseline; gap: 10px; }
.carta-linha1 .codigo { font-size: 10.5px; letter-spacing: .06em; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.carta-linha1 .credito-destaque { font-size: 16.5px; font-weight: 800; letter-spacing: -.015em; }
.carta-seg {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-dim-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-pill);
  padding: 2px 8px;
}

.carta-entrada-destaque { display: flex; align-items: baseline; gap: 7px; margin-top: 4px; }
.carta-entrada-destaque .entrada-label {
  font-size: 8.5px; font-weight: 700; letter-spacing: .12em; color: var(--gold); opacity: .85;
}
.carta-entrada-destaque .entrada-valor { font-size: 13px; font-weight: 800; color: var(--gold-soft); }
.carta-entrada-destaque .entrada-rs { font-size: 12px; font-weight: 600; color: var(--text-dim); font-variant-numeric: tabular-nums; }

.carta-linha2 { font-size: 11.5px; color: var(--text-dim); margin-top: 5px; font-variant-numeric: tabular-nums; }
.carta-linha3 { margin-top: 6px; gap: 10px; }
.carta-origem-discreta { font-size: 9.5px; color: var(--text-dim-2); letter-spacing: .02em; }

.carta-lado-direito { min-width: 96px; gap: 4px; }
.pill-tir-principal { padding: 7px 13px; border-radius: var(--r-md); box-shadow: var(--shadow-sm); }

.contador { letter-spacing: .08em; font-size: 10.5px; }

@media (max-width: 980px) {
  header.topbar { padding: 10px 16px; }
  .menu-item { padding: 10px 10px 11px; }
}

/* ==========================================================================
   FASE 1C — Registrar operação: fluxo em etapas + sucesso elegante
   ========================================================================== */
.modal.modal-wizard { width: 640px; padding: 26px 28px 22px; }

.wizard-titulo { margin: 0 0 14px; font-size: 16px; letter-spacing: .01em; }

.wizard-passos { display: flex; gap: 4px; margin-bottom: 18px; }
.wizard-passo {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: var(--r-sm);
  border-bottom: 2px solid var(--border-hair);
  opacity: .55;
  transition: opacity var(--trans);
}
.wizard-passo.ativo { opacity: 1; border-bottom-color: var(--gold); background: rgba(255,255,255,.02); }
.wizard-passo.feito { opacity: .8; border-bottom-color: rgba(201,168,106,.35); }
.wizard-passo-num {
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--border);
  font-size: 10.5px; font-weight: 700;
  color: var(--text-dim);
  flex-shrink: 0;
}
.wizard-passo.ativo .wizard-passo-num { border-color: var(--gold); color: var(--gold-soft); background: var(--gold-dim); }
.wizard-passo.feito .wizard-passo-num { color: var(--gold); border-color: rgba(201,168,106,.4); }
.wizard-passo-label { font-size: 10.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-dim); }

.wizard-corpo { min-height: 210px; }
.wizard-secao-label { font-size: 11px; color: var(--text-dim); letter-spacing: .03em; margin-bottom: 8px; }
.wizard-chips { margin-bottom: 12px; }
.wizard-fluxo { font-weight: 700; color: var(--gold-soft); font-variant-numeric: tabular-nums; font-size: 12.5px; }
.wizard-form label { text-transform: uppercase; font-size: 9.5px; letter-spacing: .06em; color: var(--text-dim-2); }
.wizard-conf-grid { margin-top: 2px; }

.wizard-impacto {
  margin-top: 14px;
  border: 1px solid rgba(201,168,106,.3);
  background: linear-gradient(180deg, rgba(201,168,106,.07) 0%, rgba(201,168,106,.02) 100%);
  border-radius: var(--r-md);
  padding: 14px 16px;
}
.wizard-impacto-titulo {
  font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold-soft); margin-bottom: 8px;
}
.wizard-impacto-linha {
  display: flex; justify-content: space-between; gap: 10px;
  font-size: 12.5px; padding: 3px 0; color: var(--text-dim);
}
.wizard-impacto-linha strong { color: var(--text); font-variant-numeric: tabular-nums; }
.wizard-impacto-linha strong.gold { color: var(--gold-soft); }
.wizard-impacto .confirma-venda {
  display: flex; align-items: flex-start; gap: 10px;
  margin-top: 12px; padding-top: 12px;
  border-top: 1px solid rgba(201,168,106,.2);
  font-size: 12px; color: var(--text); cursor: pointer; line-height: 1.5;
}
.wizard-impacto .confirma-venda input { margin-top: 2px; accent-color: var(--gold); }

.wizard-acoes { margin-top: 18px; justify-content: flex-end; }
.wizard-acoes .btn.ghost { margin-right: auto; }

/* sucesso: afirmativo e sóbrio */
.wizard-sucesso { text-align: center; padding: 12px 8px 4px; }
.wizard-sucesso-icone {
  width: 52px; height: 52px; margin: 0 auto 12px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-size: 24px; font-weight: 700;
  color: #1a1400;
  background: var(--gold-grad);
  box-shadow: var(--shadow-gold);
}
.wizard-sucesso h3 { margin: 0 0 14px; font-size: 15.5px; }
.wizard-sucesso-resumo {
  text-align: left;
  max-width: 380px; margin: 0 auto 6px;
  background: var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: 10px 16px;
}
.wizard-sucesso-acoes { justify-content: center; margin-top: 16px; }

/* ==========================================================================
   FASE 1D — Dashboard executivo (gráficos SVG, funil, rankings)
   ========================================================================== */
.dash-cards { gap: 8px; }
.dash-card {
  background: linear-gradient(180deg, rgba(255,255,255,.025) 0%, rgba(255,255,255,0) 60%), var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: 12px 14px;
  box-shadow: var(--shadow-sm);
}
.dash-card .label { font-size: 9px; letter-spacing: .09em; font-weight: 600; }
.dash-card .value { font-size: 17px; font-weight: 800; margin-top: 4px; letter-spacing: -.015em; font-variant-numeric: tabular-nums; }
.dash-card .value.gold { color: var(--gold-soft); }
.dash-card .value.green { color: var(--green); }

.dash-painel {
  background: linear-gradient(180deg, var(--bg-panel) 0%, #101214 100%);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: 16px 18px;
  box-shadow: var(--shadow-sm);
}
.dash-painel h3 {
  margin: 0 0 12px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold-soft);
}
.dash-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.dash-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-top: 10px; }
@media (max-width: 1100px) { .dash-grid-3 { grid-template-columns: 1fr; } .dash-grid-2 { grid-template-columns: 1fr; } }

/* filtros: discretos no topo, sem gritar */
.dash-filtros {
  background: rgba(255,255,255,.015);
  border: 1px solid var(--border-hair);
  border-radius: var(--r-md);
  padding: 10px 12px;
}
.dash-filtros label { font-size: 9px; letter-spacing: .08em; }
.dash-filtros input, .dash-filtros select {
  background: var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
}

/* gráfico de colunas SVG */
.grafico-wrap { width: 100%; }
.grafico-colunas { width: 100%; height: auto; display: block; }
.grafico-grid { stroke: rgba(42, 47, 51, .35); stroke-width: 1; stroke-dasharray: 2 4; }
.grafico-base { stroke: var(--border); stroke-width: 1; }
.grafico-colunas rect { fill: var(--gold); opacity: .82; transition: opacity .12s; }
.grafico-colunas rect:hover { opacity: 1; }
.grafico-valor { fill: var(--text-dim); font-size: 9.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.grafico-rotulo { fill: var(--text-dim-2); font-size: 9px; letter-spacing: .04em; }

/* funil de status */
.funil { display: flex; flex-direction: column; gap: 7px; }
.funil-linha { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 10px; }
.funil-label { font-size: 11px; color: var(--text-dim); }
.funil-barra-area { min-width: 0; }
.funil-barra {
  background: linear-gradient(90deg, rgba(201,168,106,.35), rgba(201,168,106,.18));
  border: 1px solid rgba(201,168,106,.25);
  border-radius: var(--r-sm);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
  padding: 4px 9px;
  min-width: 30px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  transition: width .25s ease;
}
.funil-barra.funil-vendida {
  background: linear-gradient(90deg, rgba(74,222,128,.3), rgba(74,222,128,.12));
  border-color: rgba(74,222,128,.3);
}
.funil-barra.funil-perdida {
  background: rgba(255,255,255,.04);
  border-color: var(--border-soft);
  color: var(--text-dim-2);
}

/* rankings */
.ranking { display: flex; flex-direction: column; gap: 9px; }
.ranking-linha { display: flex; align-items: center; gap: 10px; }
.ranking-pos {
  width: 20px; height: 20px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-size: 10px; font-weight: 800;
  color: var(--gold-soft);
  border: 1px solid rgba(201,168,106,.35);
  background: var(--gold-dim);
}
.ranking-linha:first-child .ranking-pos { background: var(--gold-grad); color: #1a1400; border-color: var(--gold); }
.ranking-meio { flex: 1; min-width: 0; }
.ranking-nome { font-size: 11.5px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ranking-track { height: 3px; background: rgba(255,255,255,.05); border-radius: 2px; margin-top: 4px; overflow: hidden; }
.ranking-fill { height: 100%; background: var(--gold-grad); border-radius: 2px; }
.ranking-valor { font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text-dim); flex-shrink: 0; }

/* header do dashboard */
.dashboard-header h2 { font-size: 16px; letter-spacing: .01em; }
.dash-tabs button {
  background: transparent; border: 1px solid var(--border-soft); color: var(--text-dim-2);
  border-radius: var(--r-pill); padding: 6px 14px; font-size: 11.5px; font-weight: 600; cursor: pointer;
  transition: color var(--trans), border-color var(--trans), background var(--trans);
}
.dash-tabs button.active { background: var(--gold-dim); border-color: rgba(201,168,106,.45); color: var(--gold-soft); }

/* ==========================================================================
   RODADA UX — Registrar operação enxuto
   ========================================================================== */
.wizard-form-principal { grid-template-columns: 1fr 1fr; }
.wizard-contexto { margin: 8px 2px 2px; font-size: 11px; color: var(--text-dim-2); }
.wizard-opcionais { margin-top: 10px; }
.wizard-opcionais .secao-toggle { padding-left: 2px; }
.wizard-comissao-pct { font-size: 11px; color: var(--text-dim); font-weight: 600; }

/* ==========================================================================
   RODADA UX — Operações como funil em colunas (CRM premium)
   ========================================================================== */
.kanban {
  display: grid;
  grid-template-columns: repeat(4, minmax(230px, 1fr));
  gap: 12px;
  align-items: start;
  margin-top: 6px;
  overflow-x: auto;
  padding-bottom: 8px;
}
@media (max-width: 1100px) { .kanban { grid-template-columns: repeat(2, minmax(230px, 1fr)); } }
@media (max-width: 640px) { .kanban { grid-template-columns: 1fr; } }

.kanban-col {
  background: rgba(255,255,255,.015);
  border: 1px solid var(--border-hair);
  border-radius: var(--r-lg);
  padding: 10px;
  min-height: 120px;
}
.kanban-col-cab {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  padding: 2px 4px 10px;
  border-bottom: 1px solid var(--border-hair);
  margin-bottom: 10px;
}
.kanban-col-titulo {
  display: flex; align-items: center; gap: 8px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: var(--text-dim);
}
.kanban-col-qtd {
  font-size: 10px; font-weight: 800;
  color: var(--gold-soft);
  background: var(--gold-dim);
  border: 1px solid rgba(201,168,106,.3);
  border-radius: var(--r-pill);
  padding: 1px 8px;
  font-variant-numeric: tabular-nums;
}
.kanban-col-soma { font-size: 11px; font-weight: 700; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.kanban-col-vendida .kanban-col-titulo { color: var(--green); }
.kanban-col-vendida .kanban-col-qtd { color: var(--green); background: rgba(74,222,128,.08); border-color: rgba(74,222,128,.3); }
.kanban-col-perdida { opacity: .75; }

.kanban-col-corpo { display: flex; flex-direction: column; gap: 8px; }

.kanban-card {
  background: linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 60%), var(--bg-panel);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: 11px 13px;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--trans), background var(--trans);
}
.kanban-card:hover { border-color: var(--border); background: var(--bg-panel-2); }
.kanban-col-vendida .kanban-card { border-left: 2px solid rgba(74,222,128,.5); }
.kanban-col-perdida .kanban-card { border-left: 2px solid var(--border); }

.kanban-card-l1 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.kanban-card-id { font-size: 10px; letter-spacing: .05em; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.kanban-card-data { font-size: 10px; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.kanban-card-credito { font-size: 15px; font-weight: 800; letter-spacing: -.01em; margin-top: 3px; font-variant-numeric: tabular-nums; }
.kanban-card-l3 { display: flex; align-items: center; gap: 7px; margin-top: 6px; flex-wrap: wrap; }
.kanban-card-cartas { font-size: 9.5px; color: var(--text-dim-2); }
.kanban-card-l4 { display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.kanban-card-l4:empty { display: none; }
.kanban-card-receita { font-size: 10.5px; font-weight: 700; color: var(--green); font-variant-numeric: tabular-nums; }
.kanban-card-motivo {
  font-size: 10px; color: var(--text-dim-2); font-style: italic;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.kanban-card-statusfino { font-size: 9.5px; color: var(--gold); letter-spacing: .04em; }
.kanban-card-parceiro { font-size: 9.5px; color: var(--text-dim-2); }
.kanban-vazio { font-size: 11px; color: var(--text-dim-2); text-align: center; padding: 18px 6px; }

/* ==========================================================================
   RODADA UX — Dashboard único, filtros em uma linha
   ========================================================================== */
.dash-filtros-linha {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
  padding: 10px 14px;
}
.dash-filtro-campo { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.dash-filtro-campo label {
  font-size: 8.5px; letter-spacing: .09em; text-transform: uppercase;
  color: var(--text-dim-2); font-weight: 600;
}
.dash-filtro-campo input, .dash-filtro-campo select {
  height: 30px;
  font-size: 11.5px;
  padding: 4px 8px;
  background: var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
  color: var(--text);
  min-width: 116px;
  max-width: 170px;
}
.dash-filtro-campo input:focus, .dash-filtro-campo select:focus { outline: none; border-color: var(--gold); }
.dash-export { margin-top: 14px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* ==========================================================================
   RODADA UX — refinamento final (consistência de páginas e contenção)
   ========================================================================== */
/* cabeçalhos de página: mesmo peso em todas as telas */
.dashboard-header { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; }
.dashboard-header h2 { font-size: 16px; font-weight: 700; letter-spacing: .01em; margin: 0; }
.dashboard-header .hint { margin: 0; }

/* kanban: colunas contidas — listas longas rolam dentro da fase */
.kanban-col-corpo { max-height: 64vh; overflow-y: auto; padding-right: 2px; }
.kanban-col-corpo::-webkit-scrollbar { width: 6px; }
.kanban-col-corpo::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }

/* respiro geral das páginas internas */
#dashboard-root, #operacoes-root, #importacoes-root { padding: 2px 2px 10px; }

/* datas do filtro não estouram a linha */
.dash-filtro-campo input[type="date"] { min-width: 128px; max-width: 142px; }

/* ==========================================================================
   RODADA CIRÚRGICA — Fix A: inputs/selects do wizard íntegros
   Causa raiz: height fixa (32px) + padding maior no wizard cortava o texto
   do select ("Proposta enviada"). Altura agora é mínima e elástica, com
   line-height explícito — nenhum texto cortado em nenhum select do app.
   ========================================================================== */
.form-grid input, .form-grid select, .form-grid textarea {
  height: auto;
  min-height: 36px;
  line-height: 1.35;
  padding: 8px 11px;
  font-size: 12.5px;
}
.form-grid select { padding-right: 28px; text-overflow: ellipsis; }
.wizard-form-principal select, .wizard-form-principal input { min-height: 40px; font-size: 13px; }
.wizard-form label { margin-bottom: 4px; }

/* ==========================================================================
   RODADA CIRÚRGICA — funil interativo + drawer CRM
   ========================================================================== */
/* card: menos metadados, mais hierarquia */
.kanban-card { cursor: grab; }
.kanban-card:active { cursor: grabbing; }
.kanban-card-codigo { font-size: 12.5px; font-weight: 800; letter-spacing: .01em; color: var(--gold-soft); font-variant-numeric: tabular-nums; }
.kanban-card.dragging { opacity: .45; transform: rotate(1.2deg) scale(.98); box-shadow: var(--shadow-lg); }
.kanban-col.drag-over {
  border-color: rgba(201,168,106,.5);
  background: var(--gold-dim);
  box-shadow: inset 0 0 0 1px rgba(201,168,106,.25);
}
.kanban-col { transition: background var(--trans), border-color var(--trans), box-shadow var(--trans); }

/* drawer lateral premium */
.drawer-overlay {
  position: fixed; inset: 0;
  background: rgba(4, 7, 20, .55);
  backdrop-filter: blur(2px);
  z-index: 60;
}
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 420px; max-width: 94vw;
  background: linear-gradient(180deg, var(--bg-panel) 0%, #0c1428 100%);
  border-left: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  padding: 22px 22px 30px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform .18s ease;
}
.drawer.aberto { transform: translateX(0); }

.drawer-cab {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: 14px;
}
.drawer-codigo { font-size: 13px; font-weight: 800; color: var(--gold-soft); letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.drawer-credito { font-size: 20px; font-weight: 800; letter-spacing: -.02em; margin-top: 3px; font-variant-numeric: tabular-nums; }
.drawer-cab-dir { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.drawer-fechar { font-size: 13px; padding: 4px 9px; }

.drawer-secao { padding: 12px 0; border-bottom: 1px solid var(--border-hair); }
.drawer-secao:last-child { border-bottom: none; }
.drawer-secao-titulo {
  font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold-soft); margin-bottom: 8px;
}
.drawer-acoes-linha { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.drawer-form { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.drawer-form label { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim-2); margin-top: 8px; }

.drawer-nota {
  background: rgba(255,255,255,.02);
  border: 1px solid var(--border-hair);
  border-radius: var(--r-sm);
  padding: 8px 10px;
  margin-bottom: 8px;
}
.drawer-nota-data { font-size: 9.5px; color: var(--text-dim-2); margin-bottom: 3px; font-variant-numeric: tabular-nums; }
.drawer-nota-texto { font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.drawer-secao textarea.ds-input { margin-top: 8px; }

.drawer-tarefa {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 4px;
  font-size: 12px;
  border-bottom: 1px dashed var(--border-hair);
  cursor: pointer;
}
.drawer-tarefa input { accent-color: var(--gold); }
.drawer-tarefa-texto { flex: 1; }
.drawer-tarefa.feita .drawer-tarefa-texto { text-decoration: line-through; color: var(--text-dim-2); }
.drawer-tarefa-quando { font-size: 10px; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.drawer-tarefa-form { display: grid; grid-template-columns: 1fr 130px; gap: 8px; margin-top: 8px; }

.drawer-hist { display: flex; gap: 10px; font-size: 11px; color: var(--text-dim); padding: 4px 0; }
.drawer-hist-data { color: var(--text-dim-2); flex-shrink: 0; font-variant-numeric: tabular-nums; }

/* ==========================================================================
   RODADA CIRÚRGICA — toolbar de filtros do dashboard com presença
   ========================================================================== */
.dash-filtros-linha {
  background: linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,.008) 100%), var(--bg-panel);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--gold);
  border-radius: var(--r-md);
  padding: 14px 18px;
  gap: 14px;
  box-shadow: var(--shadow-sm);
  margin-bottom: 14px;
}
.dash-filtro-campo label { font-size: 9px; color: var(--text-dim); }
.dash-filtro-campo input, .dash-filtro-campo select {
  height: 36px;
  font-size: 12.5px;
  padding: 6px 10px;
  min-width: 132px;
  max-width: 190px;
  border-color: var(--border);
}
.dash-filtro-campo input[type="date"] { min-width: 140px; max-width: 152px; }

/* visão comercial: painel curto, sem vazio vertical */
/* (as remoções de conteúdo já reduzem a altura; aqui só compactação fina) */
.painel-comercial-compacto .fluxo-parcelas { margin-bottom: 4px; }
.painel-comercial-compacto .painel-acoes { margin-top: 10px; }

/* ==========================================================================
   RODADA ENTERPRISE — toolbar dashboard, drawer largo, cards funil
   ========================================================================== */
.dash-filtros-enterprise {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
  margin-bottom: 18px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, .22);
}
@media (max-width: 1100px) {
  .dash-filtros-enterprise { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dash-filtros-enterprise { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.dash-empty-filtro { text-align: center; padding: 36px 20px; }
.dash-empty-filtro strong { display: block; font-size: 15px; margin-top: 6px; }

.drawer-enterprise {
  width: 580px;
  max-width: 96vw;
  padding: 24px 26px 32px;
}
.drawer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 22px;
}
@media (max-width: 720px) {
  .drawer-grid { grid-template-columns: 1fr; }
}
.drawer-col { min-width: 0; }
.drawer-id-tecnico { font-size: 10px; margin-top: 4px; opacity: .65; }
.drawer-codigo { font-size: 15px; }
.drawer-nota-input { margin-top: 10px; resize: vertical; min-height: 56px; }
.drawer-tarefa-corpo { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.drawer-tarefa-obs { font-size: 10.5px; }
.drawer-tarefa-form-enterprise {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto;
}
.drawer-tarefa-form-enterprise input:first-child { grid-column: 1 / -1; }
.drawer-tarefa-form-enterprise input:last-child { grid-column: 1 / -1; }
.drawer-timeline-item { border-left: 2px solid var(--gold-dim); padding-left: 10px; margin-left: 2px; }

.kanban-card-l1 { align-items: center; }
.kanban-card-l1 .badge { font-size: 9px; padding: 2px 6px; }
.kanban-card-l3 .kanban-card-data { margin-left: auto; font-size: 10px; color: var(--text-dim-2); }
.kanban-card-status { flex-shrink: 0; }

/* ==========================================================================
   RODADA AUTÔNOMA — busca por crédito alvo
   ========================================================================== */
.busca-alvo-resultados { max-height: 46vh; overflow-y: auto; padding-right: 4px; }
.busca-sugestao {
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: 12px 14px;
  margin-bottom: 10px;
  background: rgba(255,255,255,.015);
}
.busca-sugestao-topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.busca-sugestao-codigos { font-weight: 800; color: var(--gold-soft); font-variant-numeric: tabular-nums; }
.warn-text { color: var(--amber); }

/* ==========================================================================
   RODADA AUTÔNOMA — dashboard compacto (acima da dobra) + clicável
   ========================================================================== */
.dash-toolbar { padding: 12px 18px; gap: 14px; }
.dash-toolbar .dash-filtro-campo select, .dash-toolbar-periodo-campos { height: 36px; }
.dash-cards { gap: 7px; }
@media (min-width: 1400px) { .dash-cards { grid-template-columns: repeat(8, 1fr); } }
.dash-card { padding: 9px 12px; }
.dash-card .value { font-size: 15.5px; margin-top: 3px; }
.dash-painel { padding: 12px 15px; }
.dash-painel h3 { margin-bottom: 8px; }
.dash-grid-2, .dash-grid-3 { gap: 8px; margin-top: 8px; }
.grafico-colunas { max-height: 150px; }
.funil { gap: 5px; }
.funil-linha { grid-template-columns: 132px 1fr; }
.ranking { gap: 7px; }
.dash-export { margin-top: 10px; }

/* interatividade: funil e rankings clicáveis */
.funil-linha.clicavel, .ranking-linha.clicavel { cursor: pointer; border-radius: var(--r-sm); transition: background var(--trans); padding: 2px 4px; margin: -2px -4px; }
.funil-linha.clicavel:hover, .ranking-linha.clicavel:hover { background: rgba(255,255,255,.03); }
.ranking-linha.clicavel:hover .ranking-nome { color: var(--gold-soft); }

/* catálogo: rodapé do render incremental */
.catalogo-rodape { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 0 6px; }
.catalogo-rodape .hint { margin: 0; }

/* ==========================================================================
   RODADA PREMIUM — P1: taxa inequívoca, CTAs de ferramenta, sparkline
   ========================================================================== */
.pill-taxa-legenda {
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--text-dim-2);
  margin-top: 2px;
  text-align: center;
  display: block;
}

/* CTAs de ferramenta: presentes sem competir com a ação principal do painel */
button.btn.cta-ferramenta {
  background: var(--gold-dim);
  border: 1px solid rgba(201,168,106,.45);
  color: var(--gold-soft);
  font-weight: 700;
  font-size: 12px;
  padding: 8px 16px;
  border-radius: var(--r-pill);
  letter-spacing: .02em;
}
button.btn.cta-ferramenta:hover { background: rgba(201,168,106,.24); border-color: var(--gold); color: var(--gold-soft); }
button.btn.cta-ferramenta-sec { background: transparent; color: var(--text-dim); border-color: var(--border); }
button.btn.cta-ferramenta-sec:hover { color: var(--gold-soft); border-color: rgba(201,168,106,.45); background: var(--gold-dim); }

/* ==========================================================================
   RODADA PREMIUM — P2: busca por crédito alvo com hierarquia real
   ========================================================================== */
.busca-secao-cab {
  margin: 16px 0 10px;
  padding: 10px 14px;
  border-left: 3px solid var(--gold);
  background: linear-gradient(90deg, var(--gold-dim), transparent 70%);
  border-radius: var(--r-sm);
}
.busca-secao-cab:first-child { margin-top: 4px; }
.busca-secao-titulo { font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-soft); }
.busca-secao-sub { font-size: 11px; color: var(--text-dim); margin-top: 2px; }

.busca-sugestao { padding: 14px 16px; }
.busca-sugestao.recomendada {
  border-color: rgba(201,168,106,.55);
  box-shadow: 0 0 0 1px rgba(201,168,106,.2), var(--shadow-sm);
  background: linear-gradient(180deg, rgba(201,168,106,.05) 0%, rgba(255,255,255,.01) 100%);
}
.busca-sugestao-topo { gap: 8px; }
.busca-sugestao-codigos { font-size: 14px; }
.busca-sugestao-adm { margin-left: auto; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim-2); }

.busca-numeros { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin: 12px 0 10px; }
.busca-numero { display: flex; flex-direction: column; gap: 2px; }
.busca-numero-label { font-size: 8.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--text-dim-2); }
.busca-numero-valor { font-size: 15px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.busca-numero-valor.gold { color: var(--gold-soft); }
.busca-numero-valor.green { color: var(--green); }
.busca-numero-valor small { font-size: 10.5px; font-weight: 700; color: var(--text-dim); }

.busca-sugestao-rodape { display: flex; align-items: center; gap: 14px; border-top: 1px solid var(--border-hair); padding-top: 10px; }
.busca-meta { font-size: 11px; color: var(--text-dim); font-variant-numeric: tabular-nums; cursor: default; }
.busca-sugestao-rodape .btn { margin-left: auto; }

/* ==========================================================================
   RODADA PREMIUM — P4: dashboard legível e interativo
   ========================================================================== */
/* rótulos e valores dos gráficos SVG maiores (escalam com o viewBox) */
.grafico-valor { font-size: 12px; font-weight: 800; fill: var(--text); }
.grafico-rotulo { font-size: 11px; fill: var(--text-dim); }
.grafico-colunas { max-height: 168px; }

/* funil: estado ativo do filtro */
.funil-linha.funil-ativo { background: var(--gold-dim); box-shadow: inset 2px 0 0 var(--gold); }
.funil-linha.funil-ativo .funil-label { color: var(--gold-soft); font-weight: 700; }

/* cabeçalho de painel com ação discreta */
.dash-painel-cab { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.dash-painel-cab h3 { margin: 0; }

/* chips de filtros ativos */
.filtros-ativos { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 12px; }
.filtro-chip {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--gold-dim);
  border: 1px solid rgba(201,168,106,.4);
  color: var(--gold-soft);
  font-size: 11px; font-weight: 600;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: background var(--trans), border-color var(--trans);
  font-family: inherit;
}
.filtro-chip:hover { background: rgba(201,168,106,.25); border-color: var(--gold); }
.filtro-chip-x { font-size: 9px; opacity: .8; }

/* configurações: área administrativa apartada */
.config-tabs { display: flex; align-items: center; gap: 8px; width: 100%; }
button.config-tab-admin {
  margin-left: auto;
  background: transparent;
  border: 1px dashed var(--border);
  color: var(--text-dim-2);
  border-radius: var(--r-pill);
  padding: 6px 14px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: color var(--trans), border-color var(--trans), background var(--trans);
  font-family: inherit;
}
button.config-tab-admin:hover { color: var(--text-dim); border-color: var(--text-dim-2); }
button.config-tab-admin.active { color: var(--amber); border-color: rgba(251,191,36,.4); background: rgba(251,191,36,.06); border-style: solid; }

/* ==========================================================================
   ENTRADA INSTITUCIONAL — logo reveal curto e sóbrio
   ========================================================================== */
#entrada-trino {
  position: fixed; inset: 0; z-index: 999;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(900px 600px at 50% 42%, #16191c 0%, #0d0f11 70%);
  opacity: 1;
  transition: opacity .45s ease;
}
#entrada-trino.saindo { opacity: 0; pointer-events: none; }
#entrada-trino { transition: opacity .6s ease; }
.entrada-conteudo { text-align: center; }
/* timeline ~4s: triângulo (0–0,8s) → marca (0,8–1,8s) → assinatura (1,8–3s)
   → linha + brilho sutil → saída suave (3,9s, via JS) */
.entrada-triangulo {
  width: 0; height: 0; margin: 0 auto 20px;
  border-left: 24px solid transparent;
  border-right: 24px solid transparent;
  border-bottom: 42px solid var(--gold-soft);
  filter: drop-shadow(0 0 18px rgba(201,168,106,.45));
  animation: entradaTri .85s cubic-bezier(.2,.8,.25,1) both,
             entradaBrilho 2s ease 1.6s both;
}
.entrada-marca {
  font-size: 22px; font-weight: 800; letter-spacing: .3em; color: var(--text);
  animation: entradaFade .9s ease .85s both;
}
.entrada-sub {
  font-size: 10px; letter-spacing: .36em; text-transform: uppercase;
  color: var(--gold); margin-top: 9px;
  animation: entradaFade .9s ease 1.85s both;
}
.entrada-linha {
  height: 1px; width: 0; margin: 22px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  animation: entradaLinha 1.1s ease 1.95s forwards;
}
@keyframes entradaTri { from { opacity: 0; transform: translateY(16px) scale(.82); } to { opacity: 1; transform: none; } }
@keyframes entradaFade { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }
@keyframes entradaLinha { to { width: 240px; } }
@keyframes entradaBrilho {
  0% { filter: drop-shadow(0 0 18px rgba(201,168,106,.45)); }
  50% { filter: drop-shadow(0 0 30px rgba(216,192,144,.7)); }
  100% { filter: drop-shadow(0 0 18px rgba(201,168,106,.45)); }
}
@media (prefers-reduced-motion: reduce) {
  .entrada-triangulo, .entrada-marca, .entrada-sub, .entrada-linha { animation: none; }
  .entrada-linha { width: 220px; }
  #entrada-trino { transition: none; }
}

/* veículos: limite de anos sempre visível */
.carta-anos-uso { font-size: 8.5px; }

/* ==========================================================================
   APRESENTAÇÃO — mesa única: incompatíveis, resumo da operação, seleção
   ========================================================================== */
.mesa-grid-row.incompativel { opacity: .38; filter: saturate(.6); }
.mesa-grid-row.incompativel input[type="checkbox"] { cursor: not-allowed; }
.mesa-grid-row.selected {
  background: rgba(201,168,106,.07);
  box-shadow: inset 2px 0 0 var(--gold);
}
.resumo-operacao-mesa {
  font-size: 11.5px; font-weight: 700; color: var(--gold-soft);
  background: var(--gold-dim);
  border: 1px solid rgba(201,168,106,.35);
  border-radius: var(--r-pill);
  padding: 4px 12px;
  font-variant-numeric: tabular-nums;
}

/* filtros avançados do dashboard: recolhidos e discretos */
.dash-filtros-avancados { align-self: flex-end; }
.dash-filtros-avancados summary {
  cursor: pointer; font-size: 10.5px; color: var(--text-dim-2);
  letter-spacing: .05em; text-transform: uppercase; padding: 6px 4px;
  list-style: none;
}
.dash-filtros-avancados summary:hover { color: var(--gold-soft); }
.dash-filtros-avancados[open] { background: rgba(255,255,255,.02); border-radius: var(--r-sm); padding: 4px 8px; }
.kpi-drill { cursor: pointer; transition: border-color var(--trans), transform .1s ease; }
.kpi-drill:hover { border-color: rgba(201,168,106,.45); transform: translateY(-1px); }

/* demandas: cabeçalho executivo e tabela */
.demanda-cab { display: flex; align-items: center; gap: 10px; }
.demanda-contagem { font-weight: 700; color: var(--gold-soft); }
.demanda-justificativa { font-size: 11px; color: var(--text-dim); max-width: 260px; }
.dash-tabela td.num { text-align: right; font-variant-numeric: tabular-nums; }

/* ==========================================================================
   RODADA FINAL — layout, alinhamentos, menu estável
   ========================================================================== */
/* menu NUNCA se move: a gosaneira era a scrollbar aparecendo/sumindo entre
   telas — reserva o espaço da barra de rolagem de forma estável. */
html { scrollbar-gutter: stable; }
header.topbar { width: 100%; }

/* catálogo em largura total quando não há operação em montagem */
main.layout { transition: grid-template-columns .18s ease; }
main.layout.layout-cheio { grid-template-columns: minmax(0, 1fr) 0; }
main.layout.layout-cheio > section.panel:last-child { display: none; }

/* grade: alinhamentos previsíveis, sem sticky horizontal, sem sobreposição */
.mesa-grid-cell.mesa-align-right, .mesa-grid-head-cell.mesa-align-right { justify-content: flex-end; text-align: right; }
.mesa-grid-cell.mesa-align-center, .mesa-grid-head-cell.mesa-align-center { justify-content: center; text-align: center; }
.mesa-grid-cell.mesa-nowrap { white-space: nowrap; }
.mesa-grid-cell { overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.mesa-grid-pin { position: static !important; left: auto !important; }
.mesa-grid-scroll { overflow-x: hidden; }
.mesa-grid-filter { display: none !important; }
.contador-catalogo { font-weight: 600; color: var(--text-dim); text-transform: none; letter-spacing: 0; }
.filtro-personalizado { display: flex; flex-direction: column; gap: 5px; }
.filtro-chip-limpar { border-style: dashed; color: var(--text-dim); background: transparent; }

/* ==========================================================================
   REDESIGN UX INSTITUCIONAL — camada final (Design Lead, 2026-07-14)
   Conceito: "dourado é decisão, grafite é ambiente, tipografia é hierarquia".
   Corrige: fontes 9–10px, caps excessivo, borda sobre borda, planilha
   apertada, dourado pulverizado, painel-relatório.
   ========================================================================== */

/* ---------- tipografia base: legível para horas de uso ---------- */
body { font-size: 13.5px; }
.hint { font-size: 12px; }
label { font-size: 12px; }

/* ---------- 1. HEADER GLOBAL: sólido, 3 zonas, sticky ---------- */
header.topbar {
  position: sticky; top: 0; z-index: 50;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  min-height: 60px;
  padding: 0 24px;
  background: linear-gradient(180deg, #111315 0%, #0e1113 100%);
  border-bottom: 1px solid var(--border-soft);
}
header.topbar .brand h1 { font-size: 15.5px; letter-spacing: .01em; }
header.topbar .subtitle { font-size: 10.5px; letter-spacing: .08em; color: var(--text-dim-2); }
.menu-principal { justify-content: center; gap: 4px; }
.menu-item {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .01em;
  text-transform: none;
  padding: 8px 14px;
  border-radius: var(--r-sm);
  color: var(--text-dim);
}
.menu-item::after { display: none; }
.menu-item:hover { color: var(--text); background: rgba(255,255,255,.04); }
.menu-item.active {
  color: var(--gold-soft);
  background: var(--gold-dim);
}
/* ações da direita: um primário, um secundário */
button.btn.cta-ferramenta {
  background: var(--gold-grad);
  border: none;
  color: #181300;
  font-size: 12.5px;
  font-weight: 700;
  padding: 9px 18px;
  border-radius: var(--r-sm);
  letter-spacing: 0;
}
button.btn.cta-ferramenta:hover { filter: brightness(1.06); background: var(--gold-grad); color: #181300; }
button.btn.cta-ferramenta-sec {
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  font-weight: 600;
}
button.btn.cta-ferramenta-sec:hover { border-color: var(--text-dim-2); background: var(--bg-panel-3); color: var(--text); }

/* ---------- 2. BARRA DE CONTEXTO ---------- */
.barra-contexto {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 4px 12px 2px;
  margin-bottom: 4px;
  border: none;
  background: transparent;
}
.contexto-titulo { font-size: 20px; font-weight: 700; letter-spacing: -.01em; color: var(--text); }
.contexto-sub { font-size: 12.5px; color: var(--text-dim); margin-top: 3px; }
.contexto-sub-op { color: var(--gold-soft); font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------- FILTROS: uma linha respirada, sem caixa por filtro ---------- */
#filtros .filtros {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px;
  background: transparent; border: none; padding: 0 0 4px;
}
#filtros .filtros > div { background: transparent; border: none; padding: 0; }
#filtros .filtros .full { flex: 2 1 260px; }
#filtros .filtros > div:not(.full) { flex: 0 1 auto; }
#filtros label {
  font-size: 11.5px; color: var(--text-dim); text-transform: none;
  letter-spacing: 0; margin-bottom: 5px; font-weight: 500;
}
#filtros input[type="text"], #filtros select, #filtros input[type="number"] {
  height: 38px; font-size: 13px; padding: 8px 12px;
  background: var(--bg-panel-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
  min-width: 150px;
}
#filtros .full input { width: 100%; }
.filtros-avancados-toggle {
  background: transparent; border: 1px solid var(--border-soft);
  color: var(--text-dim); font-size: 12.5px; padding: 8px 14px;
  border-radius: var(--r-sm); cursor: pointer; font-family: inherit;
}
.filtros-avancados-toggle:hover { color: var(--gold-soft); border-color: rgba(201,168,106,.4); }
.filtros-avancados {
  background: rgba(255,255,255,.015);
  border: 1px solid var(--border-hair);
  border-radius: var(--r-md);
  padding: 14px 16px;
  display: none;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px 16px;
}
.filtros-avancados.show { display: grid; }
.filtros-avancados label { font-size: 11.5px; text-transform: none; letter-spacing: 0; }

/* ---------- 3. TABELA: mesa financeira, não planilha ---------- */
.mesa-grid { border: 1px solid var(--border-hair); border-radius: var(--r-md); overflow: hidden; }
.mesa-grid-header {
  min-height: 44px;
  background: #15181b;
  border-bottom: 1px solid var(--border-soft);
}
.mesa-grid-head-cell {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dim);
  text-transform: none;
  letter-spacing: .01em;
  border-right: none !important;   /* menos linhas verticais */
  padding: 0 12px;
}
.mesa-grid-sort { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: inherit; }
.mesa-grid-cell {
  font-size: 13.5px;
  padding: 0 12px;
  border-right: none !important;
  border-bottom: 1px solid var(--border-hair);
  color: var(--text);
  display: flex; align-items: center;
}
/* hierarquia dentro da linha: valores fortes, secundários leves */
.mesa-grid-cell.mesa-align-right { font-weight: 600; }
.mesa-grid-row:nth-child(even) .mesa-grid-cell { background: rgba(255,255,255,.008); }
.mesa-grid-row:hover .mesa-grid-cell { background: rgba(255,255,255,.03); }
.mesa-grid-row { transition: background .1s ease; }

/* SELEÇÃO: barra dourada + grafite claro, sem cinza opaco */
.mesa-grid-row.selected .mesa-grid-cell {
  background: rgba(201,168,106,.08);
  border-bottom-color: rgba(201,168,106,.25);
}
.mesa-grid-row.selected .mesa-grid-cell:first-child { box-shadow: inset 3px 0 0 var(--gold); }
.mesa-grid-row input[type="checkbox"] { accent-color: var(--gold); width: 15px; height: 15px; }
.mesa-grid-row.incompativel { opacity: .55; filter: none; }
.mesa-grid-row.incompativel .mesa-grid-cell { color: var(--text-dim); }

/* ---------- layout 64/36 e transição ---------- */
main.layout { grid-template-columns: minmax(0, 1.78fr) minmax(0, 1fr); gap: 20px; padding: 12px 24px 24px; max-width: none; }
main.layout.layout-cheio { grid-template-columns: minmax(0, 1fr) 0; gap: 0; }

/* painel sticky */
main.layout > section.panel:last-child { position: sticky; top: 72px; max-height: calc(100vh - 88px); overflow-y: auto; }

/* ---------- 4. PAINEL COCKPIT ---------- */
.cockpit-cab {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  padding-bottom: 12px; margin-bottom: 12px;
  border-bottom: 1px solid var(--border-soft);
}
.cockpit-adm { font-size: 17px; font-weight: 700; letter-spacing: 0; }
.cockpit-meta { font-size: 12.5px; color: var(--text-dim); margin-top: 3px; font-variant-numeric: tabular-nums; }

/* métricas 2×2: números grandes, sem texto pequeno competindo */
.grid-2 { gap: 10px; }
.stat { padding: 14px 16px; border: 1px solid var(--border-hair); background: var(--bg-panel-2); box-shadow: none; }
.stat .label { font-size: 11.5px; text-transform: none; letter-spacing: 0; color: var(--text-dim); font-weight: 500; }
.stat .value { font-size: 22px; font-weight: 700; margin-top: 5px; letter-spacing: -.02em; }
.stat .caption { font-size: 11px; margin-top: 3px; }

/* fluxo: texto forte + timeline limpa */
.fluxo-parcelas { background: transparent; border: none; padding: 4px 0 0; }
.fluxo-parcelas-linha { font-size: 15px; font-weight: 700; }
.fluxo-timeline {
  display: flex; gap: 3px; margin: 8px 0 4px; height: 26px;
}
.fluxo-timeline-seg {
  display: flex; align-items: center; justify-content: center;
  background: rgba(201,168,106,.16);
  border: 1px solid rgba(201,168,106,.3);
  border-radius: 5px;
  font-size: 11px; font-weight: 600; color: var(--gold-soft);
  overflow: hidden; white-space: nowrap;
  min-width: 30px;
  font-variant-numeric: tabular-nums;
}
.fluxo-timeline-seg.alt { background: rgba(201,168,106,.08); }
.sparkline {
  display: flex !important;
  align-items: flex-end;
  gap: 1px;
  height: 34px;
  margin: 8px 0 4px;
  overflow: hidden;
}

.sparkline .barra {
  flex: 1 1 auto;
  min-width: 2px;
  background: linear-gradient(180deg, var(--gold-soft), var(--gold));
  border-radius: 1px 1px 0 0;
  opacity: .9;
}

.sparkline .barra-bloco-alt {
  background: rgba(201,168,106,.75);
}

/* kv maiores e accordions legíveis */
.kv { font-size: 13px; padding: 6px 0; }
.kv-com-hint .kv-micro { font-size: 11px; }
button.secao-toggle {
  font-size: 12px;
  text-transform: none;
  letter-spacing: .01em;
  font-weight: 600;
  color: var(--text-dim);
  padding: 11px 8px;
}
button.secao-toggle .secao-seta { font-size: 11px; }
.section-title { font-size: 12px; text-transform: none; letter-spacing: .01em; font-weight: 600; }

/* ações do cockpit */
.painel-acoes .btn.primary { background: var(--gold); color: #181300; box-shadow: none; font-size: 14px; padding: 13px 18px; }
.painel-acoes .btn.primary:hover { background: var(--gold-soft); filter: none; }
.painel-acoes .btn { font-size: 13px; }

/* ---------- respiro geral: menos borda, mais espaço ---------- */
section.panel { border: none; background: transparent; box-shadow: none; padding: 0; }
main.layout > section.panel:last-child {
  background: linear-gradient(180deg, var(--bg-panel) 0%, #101214 100%);
  border: 1px solid var(--border-hair);
  border-radius: var(--r-lg);
  padding: 18px 20px;
}
.detail-empty { font-size: 13.5px; padding: 40px 20px; }
.operacao-topo h2 { display: none; } /* o contexto e o cockpit já titulam */
.contador, .trino-eyebrow { display: none; } /* contexto assume esse papel */

/* ==========================================================================
   MESA DE TRABALHO FIXA — duas colunas permanentes, zero layout shift
   (selecionar carta muda CONTEÚDO, nunca geometria)
   ========================================================================== */
:root { --header-height: 60px; --workspace-offset: 16px; }

main.layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(360px, 27vw, 420px);
  gap: 16px;
  align-items: stretch;
  height: calc(100vh - var(--header-height) - var(--workspace-offset));
  padding: 12px 24px 16px;
  overflow: hidden;               /* a página não rola na mesa */
  transition: none;                /* nada de animar a geometria */
}
@media (max-width: 1500px) { main.layout { grid-template-columns: minmax(0, 1fr) 380px; } }
@media (max-width: 1400px) { main.layout { grid-template-columns: minmax(0, 1fr) 356px; } }
main.layout.layout-cheio { grid-template-columns: minmax(0, 1fr) clamp(360px, 27vw, 420px); } /* aposentado: nunca difere */

/* coluna esquerda: filtros fixos, tabela com A ÚNICA rolagem do catálogo */
main.layout > section.panel-catalogo {
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.table-wrap { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.mesa-grid-host { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mesa-grid { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mesa-grid-scroll { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
.mesa-grid-header { position: sticky; top: 0; z-index: 3; }

/* painel direito: permanente, com rolagem própria */
main.layout > section.panel:last-child {
  position: static;               /* sticky desnecessário: altura própria */
  max-height: none;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
}

/* transição APENAS de opacidade no conteúdo do painel */
#detalhe { animation: painelFade .16s ease; }
@keyframes painelFade { from { opacity: .55; } to { opacity: 1; } }

/* ---------- estado vazio premium ---------- */
.painel-vazio { padding: 28px 8px 12px; text-align: left; }
.painel-vazio-titulo { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.painel-vazio-texto { font-size: 13px; color: var(--text-dim); line-height: 1.6; margin-top: 10px; max-width: 34ch; }
.painel-vazio-passos { display: flex; flex-direction: column; gap: 14px; margin: 26px 0; }
.painel-vazio-passo { display: flex; align-items: center; gap: 12px; }
.passo-num {
  width: 26px; height: 26px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(201,168,106,.45);
  color: var(--gold-soft);
  font-size: 12px; font-weight: 700;
  background: var(--gold-dim);
}
.passo-texto { font-size: 13px; color: var(--text); }
.painel-vazio-contagem { font-size: 12px; color: var(--text-dim-2); font-variant-numeric: tabular-nums; padding: 10px 0 4px; border-top: 1px solid var(--border-hair); }
.painel-vazio-acoes { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }

/* barra de contexto: mesma altura nos dois estados (sem pulo) */
.barra-contexto { min-height: 58px; }
/* =========================
   PENTE FINO FINAL — APRESENTAÇÃO
   ========================= */

/* ----- DEMANDAS: versão compacta e limpa ----- */
.demanda-card-compacta {
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(25, 28, 31,.92), rgba(14, 16, 18,.96));
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
}

.demanda-card-topo {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.demanda-card-head {
  min-width: 0;
}

.demanda-card-titulo {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--text);
  margin-bottom: 8px;
}

.demanda-card-badges {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}

.demanda-card-resumo {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-dim);
}

.demanda-card-meta {
  margin-top: 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--gold-soft);
}

.demanda-opcoes {
  margin-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  padding-top: 12px;
}

.demanda-opcoes-summary {
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 700;
  color: var(--gold-soft);
  margin-bottom: 10px;
}

.demanda-opcoes-summary::-webkit-details-marker {
  display: none;
}

.demanda-tabela-compacta th {
  font-size: 10px;
  letter-spacing: .06em;
  color: var(--text-dim-2);
  padding: 10px 12px;
}

.demanda-tabela-compacta td {
  padding: 11px 12px;
  font-size: 12.5px;
}

.demanda-composicoes-compactas {
  margin-top: 10px;
}

/* remove excesso visual antigo */
.demanda-justificativa {
  max-width: none !important;
  white-space: normal;
}

.dash-grid-2 {
  display: none !important;
}

/* ----- CATÁLOGO: alinhamento fino ----- */
.mesa-grid-head-cell,
.mesa-grid-cell {
  display: flex;
  align-items: center;
  min-height: 100%;
  box-sizing: border-box;
}

.mesa-grid-head-cell {
  padding-top: 0;
  padding-bottom: 0;
}

.mesa-grid-sort {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 44px;
  text-align: left;
  line-height: 1.1;
}

.mesa-grid-cell {
  line-height: 1.2;
}

.mesa-grid-cell.mesa-align-right,
.mesa-grid-head-cell.mesa-align-right .mesa-grid-sort {
  justify-content: flex-end;
  text-align: right;
}

.mesa-grid-cell.mesa-align-center,
.mesa-grid-head-cell.mesa-align-center .mesa-grid-sort {
  justify-content: center;
  text-align: center;
}

.contexto-titulo {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.1;
}

.contexto-sub {
  font-size: 13px;
  color: var(--text-dim);
  margin-top: 4px;
}

/* topo do catálogo mais limpo */
.panel-catalogo > .card:first-child,
.panel-catalogo > .card {
  border-radius: 18px;
}

@media (max-width: 1400px) {
  .demanda-card-topo {
    flex-direction: column;
  }
}
/* Restaura os gráficos executivos do Dashboard */
#dashboard-root > .dash-grid-2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

@media (max-width: 1100px) {
  #dashboard-root > .dash-grid-2 {
    grid-template-columns: 1fr !important;
  }
}

/* =========================
   FIX RÁPIDO — CATÁLOGO ESTÁVEL
   ========================= */

/* força a mesma malha do header e das linhas */
.mesa-grid-header,
.mesa-grid-row {
  grid-template-columns:
    34px   /* checkbox */
    86px   /* carta */
    150px  /* administradora */
    108px  /* segmento */
    108px  /* crédito */
    118px  /* entrada */
    84px   /* entrada % */
    82px   /* tir */
    70px   /* prazo */
    minmax(220px, 1fr) /* parcelas */
  !important;
}

.mesa-grid-head-cell,
.mesa-grid-cell {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.mesa-grid-head-cell .mesa-grid-sort {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 44px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1;
}

.mesa-grid-head-cell.mesa-align-center .mesa-grid-sort,
.mesa-grid-cell.mesa-align-center {
  justify-content: center;
  text-align: center;
}

.mesa-grid-head-cell.mesa-align-right .mesa-grid-sort,
.mesa-grid-cell.mesa-align-right {
  justify-content: flex-end;
  text-align: right;
}
/* Receita Trino por mês em verde */
#dashboard-root > .dash-grid-2 > .dash-painel:nth-child(2) .grafico-coluna {
  fill: var(--green) !important;
}

#dashboard-root > .dash-grid-2 > .dash-painel:nth-child(2) .grafico-coluna:hover {
  opacity: 1;
}
/* Remove os blocos retangulares redundantes das parcelas */
.fluxo-timeline {
  display: none !important;
}

/* Ajusta o espaçamento do gráfico mensal */
.sparkline {
  margin-top: 10px !important;
}
/* ==========================================================================
   PRESENTATION POLISH — ajustes finais congelados
   ========================================================================== */
/* Bloco 1: títulos do cabeçalho em BRANCO, sem estados dourados de ordenação */
.mesa-grid-head-cell, .mesa-grid-sort { color: var(--text) !important; }
.mesa-grid-sort:hover { color: var(--gold-soft) !important; }


/* Bloco 2: fluxo mês a mês visível; blocos retangulares redundantes ocultos */
.sparkline { display: flex !important; gap: 1px; align-items: flex-end; height: 30px; margin: 8px 0 4px; }
.sparkline .barra { flex: 1; min-width: 2px; background: rgba(201,168,106,.55); border-radius: 1px; }
.sparkline .barra-bloco-alt { background: rgba(201,168,106,.85); }
.fluxo-timeline { display: none !important; }

/* Bloco 4: receita em verde (crédito permanece dourado) */
.grafico-receita rect { fill: var(--green) !important; opacity: .8; }
.grafico-receita rect:hover { opacity: 1; }

/* fluxo da mesa: orientação discreta, some quando há trabalho em curso */
.fluxo-mesa { font-size: 11px; color: var(--text-dim-2); letter-spacing: .01em; }

/* menu de ações secundárias (⋯) */
.menu-acoes { position: relative; display: inline-block; }
.menu-acoes-btn { font-size: 16px; line-height: 1; padding: 4px 10px; }
.menu-acoes-lista {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 40;
  min-width: 150px;
  background: var(--bg-panel-2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
  padding: 4px;
  display: flex; flex-direction: column;
}
.menu-acoes-item {
  background: none; border: none; text-align: left; cursor: pointer;
  font-family: inherit; font-size: 12.5px; color: var(--text);
  padding: 8px 12px; border-radius: var(--r-sm);
}
.menu-acoes-item:hover { background: rgba(255,255,255,.05); }
.menu-acoes-item.destrutivo { color: var(--red); }
.import-executivo { padding: 12px 0 14px; }
.import-executivo-titulo { font-size: 17px; font-weight: 700; margin-bottom: 10px; }

/* HOTFIX catálogo final: geometria responsiva e uma única malha. O mesmo
   --mesa-columns é consumido pelo cabeçalho e por todas as linhas. */
main.layout {
  grid-template-columns: minmax(0, 1fr) clamp(280px, 23vw, 330px);
}
main.layout.tem-selecao {
  grid-template-columns: minmax(0, 61fr) minmax(380px, 39fr);
}
.panel-catalogo .mesa-grid-table {
  width: 100%;
  min-width: 0;
}
.panel-catalogo .mesa-grid-header,
.panel-catalogo .mesa-grid-row {
  grid-template-columns: var(--mesa-columns) !important;
  width: 100%;
}
.panel-catalogo .mesa-grid-head-cell,
.panel-catalogo .mesa-grid-cell {
  padding-left: 6px;
  padding-right: 6px;
}
.panel-catalogo .mesa-grid-scroll { overflow-x: hidden; }
.reconciliacao-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.reconciliacao-modal .dash-tabela-wrap { max-height: 58vh; overflow: auto; }
.comissoes-resumo { margin: 12px 0 4px; padding: 12px 14px; border: 1px solid var(--border-hair); border-radius: var(--r-md); background: rgba(255,255,255,.018); }
.comissoes-resumo-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.badge.incorporada { color: var(--green); border: 1px solid rgba(74,222,128,.35); background: rgba(74,222,128,.08); }
.comissao-origem-select { width: min(190px, 56%); }
.config-comissoes-parceiro { margin-bottom: 14px; }
.dash-cards-comissoes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .dash-cards-comissoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1000px) {
  main.layout,
  main.layout.tem-selecao { grid-template-columns: minmax(0, 1fr); height: auto; overflow: visible; }
}

/* funil executivo: cliente como título, próxima ação, aging */
.kanban-card-cliente { font-size: 13px; font-weight: 700; color: var(--text); }
.kanban-card-meta { font-size: 10.5px; color: var(--text-dim-2); }
.kanban-card-aging { font-size: 10px; color: var(--text-dim-2); font-variant-numeric: tabular-nums; }
.kanban-card-aging.atrasado { color: var(--amber); font-weight: 700; }
.kanban-card-proxima {
  font-size: 11px; color: var(--gold-soft); margin-top: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.drawer-proxima-acao { background: var(--gold-dim); border: 1px solid rgba(201,168,106,.3); border-radius: var(--r-md); padding: 12px 14px; margin-bottom: 6px; }
.drawer-proxima-texto { font-size: 13px; margin: 4px 0 2px; }
.dash-barlist-row.clicavel { cursor: pointer; border-radius: var(--r-sm); }
.dash-barlist-row.clicavel:hover { background: rgba(255,255,255,.03); }
.adm-a-validar {
  font-size: 8.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--amber); border: 1px dashed rgba(251,191,36,.45); border-radius: var(--r-pill);
  padding: 1px 6px; vertical-align: middle;
}


/* ==========================================================
   HOTFIX — ENTRADA INSTITUCIONAL E REVEAL PROGRESSIVO
   ========================================================== */
body.trino-loading {
  overflow: hidden;
}

body.trino-loading .topbar,
body.trino-loading .divider,
body.trino-loading main.layout,
body.trino-loading .dashboard-root,
body.trino-loading .rodape {
  opacity: 0;
  transform: translateY(10px);
}

body.trino-app-ready {
  overflow: auto;
}

body.trino-app-ready .topbar,
body.trino-app-ready .divider,
body.trino-app-ready main.layout,
body.trino-app-ready .dashboard-root,
body.trino-app-ready .rodape {
  opacity: 1;
  transform: none;
}

body.trino-app-ready .topbar {
  transition: opacity .42s ease .02s, transform .42s ease .02s;
}
body.trino-app-ready .divider {
  transition: opacity .42s ease .08s, transform .42s ease .08s;
}
body.trino-app-ready main.layout,
body.trino-app-ready .dashboard-root {
  transition: opacity .52s ease .14s, transform .52s ease .14s;
}
body.trino-app-ready .rodape {
  transition: opacity .45s ease .22s, transform .45s ease .22s;
}

#entrada-trino {
  display: flex !important;
  visibility: visible !important;
  position: fixed;
  inset: 0;
  z-index: 99999;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 45%, rgba(44, 38, 26, .55) 0%, rgba(12, 14, 16,.94) 42%, #070809 100%);
  opacity: 1;
  pointer-events: auto;
  transition: opacity .85s cubic-bezier(.22,.8,.24,1), visibility .85s ease;
}

#entrada-trino.saindo {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.entrada-conteudo {
  text-align: center;
  transform: translateY(-2vh);
}

.entrada-triangulo {
  width: 0;
  height: 0;
  margin: 0 auto 22px;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  border-bottom: 44px solid var(--gold-soft);
  filter: drop-shadow(0 0 18px rgba(201,168,106,.38));
  animation: trinoLogoEntrada .8s cubic-bezier(.2,.8,.2,1) both,
             trinoLogoPulso 2.2s ease 1.5s both;
}

.entrada-marca {
  color: var(--text);
  font-size: 23px;
  font-weight: 800;
  letter-spacing: .28em;
  padding-left: .28em;
  animation: trinoTextoEntrada .9s ease .85s both;
}

.entrada-sub {
  margin-top: 11px;
  color: var(--gold-soft);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  animation: trinoTextoEntrada .9s ease 1.85s both;
}

.entrada-linha {
  width: 0;
  height: 1px;
  margin: 24px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold-soft), transparent);
  animation: trinoLinhaEntrada 1.1s ease 1.95s forwards;
}

@keyframes trinoLogoEntrada {
  from { opacity: 0; transform: translateY(14px) scale(.82); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes trinoTextoEntrada {
  from { opacity: 0; transform: translateY(8px); filter: blur(3px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes trinoLinhaEntrada {
  to { width: 245px; }
}
@keyframes trinoLogoPulso {
  0%,100% { filter: drop-shadow(0 0 16px rgba(201,168,106,.34)); }
  50% { filter: drop-shadow(0 0 30px rgba(216,192,144,.68)); }
}

@media (prefers-reduced-motion: reduce) {
  .entrada-triangulo,
  .entrada-marca,
  .entrada-sub,
  .entrada-linha { animation: none !important; }
  .entrada-linha { width: 220px; }
  #entrada-trino,
  body.trino-app-ready .topbar,
  body.trino-app-ready .divider,
  body.trino-app-ready main.layout,
  body.trino-app-ready .dashboard-root,
  body.trino-app-ready .rodape { transition: none !important; }
}