/* ═════════════════════════════════════════════════════════════════
   POSTULAX FINANCE — DESIGN SYSTEM 2.0 (camada canônica)
   -----------------------------------------------------------------
   Fonte: D-FIN-2.0 (Auditoria e Sistema + Showroom corrigido, base B)
          e D-FIN-2.1/2.2 (superfícies secundárias).
   Carregada DEPOIS do <style> do dashboard: vence pela ordem da
   cascata, sem renomear classe e sem mexer em lógica. O que o
   produto calcula continua vindo do produto — isto é só aparência.

   Regras que este arquivo impõe:
     • duas famílias: Manrope para tudo; JetBrains Mono SÓ em eyebrow,
       cabeçalho de coluna, ticker/código, hash/id e versão;
     • quatro superfícies visuais (PANEL, CARD, RECESSED, OVERLAY)
       por degrau de luminância, não por borda;
     • cyan só em navegação ativa, link, ação primária única, série
       da carteira e anel de foco;
     • prata/dourado só em badge, coruja e superfície de upgrade;
     • número sempre tabular; sinal nunca só por cor.
   ═════════════════════════════════════════════════════════════════ */

:root {
  /* ── superfícies (base B aprovada) ── */
  --fin-page:      #0B1420;
  --fin-recessed:  #111D2B;
  --fin-panel:     #14202F;
  --fin-card:      #1A2838;
  --fin-overlay:   #1E2E42;
  --fin-bar:       #0E1A28;   /* topbar e bottom nav */
  --fin-nav-on:    #16293A;   /* item ativo da navegação */
  --fin-seg-on:    #183044;   /* pastilha ativa do segmented, monograma */

  /* ── tinta ── */
  --fin-ink-1: #EAF1F8;  /* valor, título */
  --fin-ink-2: #A9BACB;  /* descrição */
  --fin-ink-3: #8FA3B8;  /* rótulo, meta — piso do texto informativo */
  --fin-ink-4: #6F8298;  /* desabilitado, chrome */

  /* ── acento e dado ── */
  --fin-accent:       #2FC6E8;
  --fin-accent-hover: #6FDCF2;
  --fin-accent-ink:   #04222C;
  --fin-accent-soft:  rgba(47,198,232,.10);
  --fin-accent-text:  #9BE4F6;
  --fin-pos:  #3FCF8E;
  --fin-neg:  #F2777A;
  --fin-warn: #D9A05B;   /* cobertura incompleta */
  --fin-info: #8B8FE8;

  /* ── planos: prata e dourado CONTIDOS (badge, coruja, estado e
     superfície de upgrade — nunca em botão de ação comum) ── */
  --fin-pro:        #C7D2DD;
  --fin-pro-line:   rgba(199,210,221,.38);
  --fin-pro-soft:   rgba(199,210,221,.08);
  --fin-premium:      #E5B567;
  --fin-premium-line: rgba(229,181,103,.40);
  --fin-premium-soft: rgba(229,181,103,.08);

  /* ── linhas ── */
  --fin-line:       rgba(255,255,255,.06);
  --fin-line-2:     rgba(255,255,255,.065);
  --fin-line-3:     rgba(255,255,255,.10);
  --fin-line-btn:   rgba(255,255,255,.14);
  --fin-row-hover:  rgba(255,255,255,.022);
  --fin-nav-hover:  rgba(255,255,255,.035);

  /* ── raios ── */
  --fin-r-panel: 14px;
  --fin-r-card:  12px;
  --fin-r-rec:   10px;
  --fin-r-ovl:   16px;
  --fin-r-btn:   10px;
  --fin-r-item:  8px;

  /* ── espaçamento (escala 4·8·12·16·20·24·32·40·48·64·80) ── */
  --fin-control-gap: 8px;
  --fin-action-gap:  12px;
  --fin-inline-gap:  8px;
  --fin-card-pad:    20px;
  --fin-panel-pad:   28px;
  --fin-section-gap: 48px;
  --fin-page-gap:    64px;
  --fin-gutter:      48px;

  /* ── tipografia ── */
  --fin-sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fin-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --fin-shadow-ovl: 0 24px 64px rgba(0,0,0,.55);

  /* ── tokens legados apontados para o sistema ──
     Quem já usa var(--db-*) herda o sistema sem reescrita. */
  --db-bg:        var(--fin-page);
  --db-surface:   var(--fin-panel);
  --db-surface-2: var(--fin-card);
  --db-line:      var(--fin-line);
  --db-line-soft: rgba(255,255,255,.03);
  --db-text:      var(--fin-ink-1);
  --db-text-soft: var(--fin-ink-2);
  --db-muted:     var(--fin-ink-3);
  --db-cyan:      var(--fin-accent);
  --db-cyan-dk:   var(--fin-accent);
  --db-green:     var(--fin-pos);
  --db-red:       var(--fin-neg);
  --action-gap:    var(--fin-action-gap);
  --button-height: 40px;
  --button-radius: var(--fin-r-btn);
  --control-font:  600 13.5px var(--fin-sans);
  --section-gap:   var(--fin-section-gap);
  --postulax-cyan: var(--fin-accent);
}
@media (max-width: 1439px) { :root { --fin-gutter: 40px; } }
@media (max-width: 1279px) { :root { --fin-gutter: 32px; } }
@media (max-width: 1023px) { :root { --fin-gutter: 24px; } }
@media (max-width: 640px)  { :root { --fin-gutter: 20px; --button-height: 44px; --fin-panel-pad: 20px; --fin-section-gap: 32px; } }

/* Tema por plano: a cor do plano fica confinada a badge, coruja e
   superfície de upgrade (D-FIN-2.0 §6). Botão comum, item ativo,
   hairline e brilho de fundo deixam de variar por plano. */
body, body[data-plan="free"], body[data-plan="pro"], body[data-plan="premium"] {
  --p-accent:      var(--fin-accent);
  --p-accent-soft: var(--fin-accent-soft);
  --p-cta-from:    var(--fin-accent);
  --p-cta-to:      var(--fin-accent);
  --p-cta-tx:      var(--fin-accent-ink);
  --p-hero-from:   var(--fin-panel);
  --p-hero-to:     var(--fin-panel);
  --p-hero-glow:   transparent;
  --p-hairline:    var(--fin-line);
  --p-eyebrow:     var(--fin-ink-3);
}

/* ── base ── */
html, body {
  font-family: var(--fin-sans);
  background: var(--fin-page);
  color: var(--fin-ink-1);
  font-variant-numeric: tabular-nums;   /* todo número alinha na vírgula */
}
body::before { display: none; }          /* brilho decorativo de fundo saiu */
h1, h2, h3, h4, h5, h6,
.db-hero-title, .db-card-title, .db-topbar-greeting, .db-hero-mini-value,
.db-score-num, .db-page-head h1, .db-tool-name, .db-plan-gate-title,
.db-teaser-title, .db-patr-metric-value, .db-user-avatar, .db-user-menu-name,
.db-more-name, .pv-head h1 {
  font-family: var(--fin-sans);
}

/* Anel de foco: o mesmo em toda superfície. */
.db-shell :focus-visible,
.db-bottom-nav :focus-visible,
.db-more-sheet :focus-visible {
  outline: 2px solid var(--fin-accent);
  outline-offset: 2px;
}

/* ═══ SHELL ═══════════════════════════════════════════════════════ */
.db-shell { grid-template-columns: 264px minmax(0, 1fr); }

/* ── sidebar ── */
.db-sidebar {
  background: var(--fin-page);
  border-right: 1px solid var(--fin-line);
  padding: 20px 16px 16px;
}
.db-brand { margin-bottom: 24px; padding: 0 12px; gap: 10px; font-size: 14px; letter-spacing: .18em; }
.db-brand img { width: 26px; height: 26px; }
.db-nav { gap: 2px; }
.db-nav a {
  position: relative;
  min-height: 40px; padding: 0 12px; gap: 12px;
  border-radius: var(--fin-r-item);
  font: 500 14px/1.2 var(--fin-sans);
  color: var(--fin-ink-2);
}
.db-nav a:hover { background: var(--fin-nav-hover); color: var(--fin-ink-1); }
.db-nav a.is-active,
.db-nav a.is-active:hover {
  background: var(--fin-nav-on) !important;
  color: var(--fin-ink-1) !important;
  font-weight: 600;
}
/* o acento marca posição, não pinta área: barra de 2px */
.db-nav a.is-active::before {
  content: ''; position: absolute; left: 0; top: 10px; bottom: 10px;
  width: 2px; border-radius: 2px; background: var(--fin-accent);
}
.db-nav .db-nav-ico, .db-nav-ico { width: 18px; height: 18px; opacity: 1; color: var(--fin-ink-3); }
.db-nav-ico svg { width: 18px; height: 18px; }
.db-nav a.is-active .db-nav-ico { color: var(--fin-accent); }
.db-sidebar-section {
  margin-top: 0; padding: 24px 12px 8px;
  font: 500 10px/1 var(--fin-mono);
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--fin-ink-3); opacity: 1;
}
/* CONTA vai para o rodapé fixo da sidebar, separado por hairline. */
#db-sidebar-section-account {
  margin-top: auto; padding-top: 20px;
  border-top: 1px solid var(--fin-line);
}
.db-sidebar-footer {
  margin-top: 12px; padding: 12px 12px 0; border-top: 0;
  font: 500 10px/1 var(--fin-mono); letter-spacing: .08em; color: var(--fin-ink-3);
}
/* contador: RECESSED, mono, nunca cyan */
.db-nav-count {
  font: 500 10px/1 var(--fin-mono); color: var(--fin-ink-3);
  background: var(--fin-recessed); border: 0; padding: 4px 7px; border-radius: 6px;
}
/* O badge do plano vive no item Plano da sidebar e sai da topbar. */
body[data-plan="pro"] #db-nav-plan::after,
body[data-plan="premium"] #db-nav-plan::after {
  display: inline-block; margin-left: 10px; padding: 3px 7px; border-radius: 5px;
  font: 600 9.5px/1 var(--fin-mono); letter-spacing: .12em; vertical-align: 1px;
}
body[data-plan="pro"] #db-nav-plan::after {
  content: 'PRO'; color: #C7D2DD; border: 1px solid rgba(199,210,221,.4);
}
body[data-plan="premium"] #db-nav-plan::after {
  content: 'PREMIUM'; color: #FFCB47; border: 1px solid rgba(255,184,0,.45);
}

/* ── topbar: contexto institucional, idioma e conta — nunca o título ── */
.db-topbar {
  background: rgba(11,20,32,.92);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--fin-line);
  padding: 0 var(--fin-gutter);
  min-height: 60px;
}
.db-topbar-left { flex-direction: row; align-items: center; gap: 12px; }
.db-topbar-greeting, .db-topbar-sub { display: none; }
.fin-topbar-context {
  font: 500 11px/1 var(--fin-mono); letter-spacing: .16em;
  text-transform: uppercase; color: var(--fin-ink-3); white-space: nowrap;
}
.db-topbar-right { gap: 12px; }
/* A ação primária mora no cabeçalho da página (proxy abaixo). O botão
   original continua sendo a única fonte do rótulo e da ação. */
.db-topbar #db-topbar-cta { display: none !important; }
.db-lang {
  background: var(--fin-recessed); border: 0; border-radius: 9px; padding: 3px; gap: 2px;
}
.db-lang button {
  min-height: 30px; padding: 0 10px; border-radius: 7px;
  font: 600 12px/1 var(--fin-sans); letter-spacing: .04em; color: var(--fin-ink-3);
}
.db-lang button.is-active { background: var(--fin-seg-on); color: var(--fin-ink-1); }
.db-user-btn {
  min-height: 40px; border: 0; background: transparent; border-radius: 10px;
  padding: 4px 8px 4px 4px;
}
.db-user-btn:hover { background: var(--fin-nav-hover); }
.db-user-avatar {
  background: var(--fin-seg-on); color: var(--fin-accent-text);
  font: 600 12.5px/1 var(--fin-sans); border-radius: 8px;
}
.db-user-name { font: 600 13.5px/1.2 var(--fin-sans); color: var(--fin-ink-1); }
/* Founder QA · A3 — a insígnia do plano é a única identificação visual
   de tier no header autenticado. Ela VOLTA, com a coruja oficial do
   tier (o produto já a monta em db2ApplyPlanChrome), em tamanho
   institucional: sem preenchimento, hairline na cor do tier, mono. */
.db-user-btn .db-plan-chip,
.db-user-btn .db-plan-chip.free,
.db-user-btn .db-plan-chip.pro,
.db-user-btn .db-plan-chip.premium {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px;
  border-radius: 6px; background: transparent;
  font: 600 9.5px/1 var(--fin-mono); letter-spacing: .14em;
  border: 1px solid var(--fin-line-3); color: var(--fin-ink-3);
}
.db-user-btn .db-plan-chip img { width: 14px; height: 14px; filter: none !important; }
.db-user-btn .db-plan-chip.pro { border-color: var(--fin-pro-line); color: var(--fin-pro); }
.db-user-btn .db-plan-chip.premium { border-color: var(--fin-premium-line); color: var(--fin-premium); }
@media (max-width: 767px) { .db-user-btn .db-plan-chip { padding: 4px 6px; } .db-user-btn .db-plan-chip span, .db-user-btn .db-plan-chip { font-size: 9px; } }
.db-user-menu {
  background: var(--fin-overlay); border: 1px solid var(--fin-line-3);
  border-radius: var(--fin-r-ovl); box-shadow: var(--fin-shadow-ovl);
}
.db-user-menu-name { color: var(--fin-ink-1); }
.db-user-menu-email { color: var(--fin-ink-3); }
.db-user-menu-plan { font-family: var(--fin-mono); background: var(--fin-recessed); border: 0; color: var(--fin-ink-2); }
.db-user-menu-item { color: var(--fin-ink-2); font: 500 14px var(--fin-sans); }
.db-user-menu-exit { color: var(--fin-neg); }

/* Botões do shell que só existem em certas larguras. */
.fin-shell-btn {
  display: none; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 9px; border: 0; cursor: pointer;
  background: transparent; color: var(--fin-ink-2);
}
.fin-shell-btn:hover { background: var(--fin-nav-hover); color: var(--fin-ink-1); }
.fin-shell-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.fin-nav-backdrop { display: none; }

/* ── área de conteúdo ── */
.db-content {
  padding: 40px var(--fin-gutter) var(--fin-page-gap);
  max-width: 1320px;
  column-gap: 24px; row-gap: var(--fin-section-gap);
}
.db-utility-zone { padding: 0 var(--fin-gutter); max-width: 1320px; }

/* ── cabeçalho da página: o único lugar do título ── */
.db-page-head, .pv-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 32px; flex-wrap: wrap; padding: 0;
}
.db-page-head > :not(.fin-head-cta), .pv-head > :not(.fin-head-cta) { max-width: 760px; }
.db-page-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 32px; row-gap: 0; align-items: end; }
.db-page-head > * { grid-column: 1; }
.db-page-head > .fin-head-cta { grid-column: 2; grid-row: 1 / span 4; align-self: end; }
.db-page-head .db-card-eyebrow, .pv-eyebrow { margin: 0 0 8px; }
.db-page-head h1, .pv-head h1 {
  font: 700 30px/1.15 var(--fin-sans); letter-spacing: -.02em;
  color: var(--fin-ink-1); margin: 0 0 8px;
}
.db-page-head p, .pv-head p { font-size: 15px; line-height: 1.55; color: var(--fin-ink-2); margin: 0; }
.fin-head-cta { flex: 0 0 auto; }
@media (max-width: 640px) {
  .db-page-head h1, .pv-head h1 { font-size: 24px; }
  .fin-head-cta { display: none !important; }
}

/* ═══ SUPERFÍCIES ═════════════════════════════════════════════════
   PANEL: bloco funcional completo. CARD: objeto par e repetível.
   RECESSED: afunda (input, header de tabela, drop). OVERLAY: flutua. */
.db-card {
  background: var(--fin-panel);
  border: 0;
  border-radius: var(--fin-r-panel);
  padding: var(--fin-panel-pad);
}
.db-card:hover { border-color: transparent; }
.db-page-card {
  background: var(--fin-card);
  border: 0;
  border-radius: var(--fin-r-card);
  padding: var(--fin-card-pad);
}
.db-page-card:hover { border-color: transparent; }
/* Superfície de upgrade: única que pode carregar a cor do plano. */
.db-page-card.premium, .db-page-card.pro, .db-page-card.featured { background: var(--fin-card); }
.db-page-card.premium { box-shadow: inset 0 0 0 1px rgba(255,184,0,.22); }
.db-page-card.pro     { box-shadow: inset 0 0 0 1px rgba(199,210,221,.22); }
.db-card.db-hero {
  background: var(--fin-panel); border: 0; border-radius: var(--fin-r-panel);
}
.db-hero-wm { display: none !important; }
.db-card-eyebrow, .pv-eyebrow {
  font: 500 11px/1.2 var(--fin-mono); letter-spacing: .14em;
  text-transform: uppercase; color: var(--fin-ink-3);
}
.db-card-title { font: 700 17px/1.35 var(--fin-sans); letter-spacing: -.005em; color: var(--fin-ink-1); }
.db-card-sub   { font-size: 13.5px; line-height: 1.5; color: var(--fin-ink-2); }

/* ═══ AÇÕES — seis contratos, um por papel ════════════════════════ */
.db-primary-action, .db-next-btn, .db-topbar-btn, .fin-btn-primary, .pv-btn-primary {
  min-height: 40px; height: auto; padding: 0 20px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: var(--fin-r-btn);
  background: var(--fin-accent); color: var(--fin-accent-ink);
  font: 700 14px/1 var(--fin-sans); letter-spacing: 0; text-transform: none;
  box-shadow: none; filter: none; transform: none; cursor: pointer;
}
.db-primary-action:hover, .db-next-btn:hover, .db-topbar-btn:hover, .fin-btn-primary:hover, .pv-btn-primary:hover {
  background: var(--fin-accent-hover); box-shadow: none; filter: none; transform: none;
}
/* Superfície de upgrade é o único lugar de botão dourado. Ele existe
   para o dia em que o Premium for contratável; hoje nenhum fluxo o usa. */
.db-primary-action.gold { background: var(--fin-premium); color: #2A1B05; }

/* ═══ CONTRATO DE AÇÃO POR PLANO (D-FIN-2.3) ══════════════════════
   O acabamento do plano tinha três seletores escritos à mão e nenhum
   nome: a próxima superfície que precisasse dele copiaria o gradiente,
   e em pouco tempo haveria um prata por página. Aqui ele vira contrato
   com três níveis e DOIS ganchos reutilizáveis.

     NÍVEL 1 · PRIMARY   uma por superfície. A ação que a página existe
                         para oferecer. Ganha o acabamento do plano:
                         gradiente, borda clara, brilho interno e sombra
                         controlada. Gancho: `.fin-acao-1`.
     NÍVEL 2 · SECONDARY ação de apoio. Contorno na cor do plano, fundo
                         transparente, SEM gradiente — ela acompanha a
                         principal, não disputa com ela. Gancho:
                         `.fin-acao-2` (e `.fin-head-aux`, que é o nível
                         2 do cabeçalho por definição).
     NÍVEL 3 · TERTIARY  navegação textual institucional: `.fin-btn-ghost`
                         e `.db-ghost-action`. NÃO recebe metal em plano
                         nenhum — texto prateado vira ruído, não hierarquia.
     DESTRUTIVO          `.db-danger-action` mantém a semântica de perigo
                         em todo plano. Prata em "excluir" esconderia o
                         que o botão faz.

   Free é o caso base e está DECLARADO: accent cyan no nível 1, linha
   neutra no nível 2. Não é ausência de tratamento — é o tratamento do
   plano que ainda não tem metal.

   Regra que esta seção existe para impedir: nenhum outro botão do SaaS
   muda com o plano. Opt-in por classe, nunca por varredura. */

/* ── NÍVEL 1 · PRIMARY PRO ──────────────────────────────────────── */
body[data-plan="pro"] .fin-btn-primary.fin-head-cta,
body[data-plan="pro"] #db-topbar-cta,
body[data-plan="pro"] .db-hero-compact > .fin-head-cta,
body[data-plan="pro"] .fin-acao-1 {
  background: linear-gradient(180deg, #DCE4EE 0%, #C0C8D4 46%, #9AA7B6 100%);
  color: #0C1622;
  border: 1px solid rgba(255,255,255,.34);
  box-shadow: 0 1px 0 rgba(255,255,255,.45) inset, 0 6px 18px -8px rgba(154,167,182,.55);
  text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
body[data-plan="pro"] .fin-btn-primary.fin-head-cta:hover,
body[data-plan="pro"] #db-topbar-cta:hover,
body[data-plan="pro"] .db-hero-compact > .fin-head-cta:hover,
body[data-plan="pro"] .fin-acao-1:hover {
  background: linear-gradient(180deg, #E8EEF6 0%, #CCD4DF 46%, #A7B3C1 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.5) inset, 0 8px 22px -8px rgba(154,167,182,.6);
}
/* ── NÍVEL 1 · PRIMARY PREMIUM ──────────────────────────────────── */
body[data-plan="premium"] .fin-btn-primary.fin-head-cta,
body[data-plan="premium"] #db-topbar-cta,
body[data-plan="premium"] .db-hero-compact > .fin-head-cta,
body[data-plan="premium"] .fin-acao-1 {
  background: linear-gradient(180deg, #FFD470 0%, #E5B567 48%, #C8913C 100%);
  color: #221703;
  border: 1px solid rgba(255,255,255,.3);
  box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 6px 18px -8px rgba(229,181,103,.55);
}
body[data-plan="premium"] .fin-btn-primary.fin-head-cta:hover,
body[data-plan="premium"] #db-topbar-cta:hover,
body[data-plan="premium"] .db-hero-compact > .fin-head-cta:hover,
body[data-plan="premium"] .fin-acao-1:hover {
  background: linear-gradient(180deg, #FFDE8C 0%, #EFC178 48%, #D29C46 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.45) inset, 0 8px 22px -8px rgba(229,181,103,.6);
}

/* ── NÍVEL 2 · SECONDARY por plano ──────────────────────────────────
   Contorno e texto na cor do plano. Sem gradiente e sem sombra: o que
   separa o nível 2 do nível 1 é justamente a ausência de profundidade. */
body[data-plan="pro"] .fin-head-aux,
body[data-plan="pro"] .fin-acao-2 {
  border-color: var(--fin-pro-line); color: var(--fin-pro); background: transparent;
}
body[data-plan="pro"] .fin-head-aux:hover,
body[data-plan="pro"] .fin-acao-2:hover {
  background: var(--fin-pro-soft); border-color: rgba(199,210,221,.58); color: #E3EAF2;
}
body[data-plan="premium"] .fin-head-aux,
body[data-plan="premium"] .fin-acao-2 {
  border-color: var(--fin-premium-line); color: var(--fin-premium); background: transparent;
}
body[data-plan="premium"] .fin-head-aux:hover,
body[data-plan="premium"] .fin-acao-2:hover {
  background: var(--fin-premium-soft); border-color: rgba(229,181,103,.6); color: #F0C98A;
}
/* Free declarado: a linha neutra do SECONDARY base, dita por escrito
   para que ninguém a leia como "esqueceram do Free". */
body[data-plan="free"] .fin-head-aux,
body[data-plan="free"] .fin-acao-2 {
  border-color: var(--fin-line-btn); color: var(--fin-ink-1);
}
/* O anel de foco não é do plano: ele é de acessibilidade e precisa ser
   o mesmo em toda a superfície. */
.fin-acao-1:focus-visible, .fin-acao-2:focus-visible, .fin-head-aux:focus-visible {
  outline: 2px solid var(--fin-accent); outline-offset: 2px;
}
.db-secondary-action, .db-tool-btn, .fin-btn-secondary {
  min-height: 40px; padding: 0 18px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid var(--fin-line-btn); border-radius: var(--fin-r-btn);
  background: transparent; color: var(--fin-ink-1);
  font: 600 14px/1 var(--fin-sans); letter-spacing: 0; text-transform: none;
  transform: none; cursor: pointer;
}
.db-secondary-action:hover, .db-tool-btn:hover, .fin-btn-secondary:hover {
  background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.22);
  color: var(--fin-ink-1); transform: none;
}
.db-ghost-action, .fin-btn-ghost {
  min-height: 36px; padding: 0 10px;
  display: inline-flex; align-items: center; gap: 6px;
  border: 0; border-radius: 8px; background: transparent; color: var(--fin-accent);
  font: 600 14px/1 var(--fin-sans); letter-spacing: 0; text-transform: none;
  transform: none; cursor: pointer;
}
.db-ghost-action:hover, .fin-btn-ghost:hover { background: var(--fin-accent-soft); color: var(--fin-accent-hover); transform: none; }
.db-ghost-action.gold { color: var(--fin-premium); }
.db-ghost-action.gold:hover { color: #F0C98A; background: var(--fin-premium-soft); }
.db-danger-action, .pv-btn-danger, .fin-btn-destructive {
  background: transparent; color: var(--fin-neg);
  border: 1px solid rgba(242,119,122,.35); border-radius: var(--fin-r-btn);
  font: 600 14px/1 var(--fin-sans); letter-spacing: 0; text-transform: none; min-height: 40px;
}
@media (max-width: 640px) {
  .db-primary-action, .db-next-btn, .db-secondary-action, .db-tool-btn,
  .db-danger-action, .fin-btn-primary, .fin-btn-secondary { min-height: 44px; }
  .db-ghost-action, .fin-btn-ghost { min-height: 44px; }
}
/* Grupo de ações: flex + gap 12, nunca margin por botão. */
.db-card-action, .db-action-row, .db-account-actions, .db-billing-actions,
.db-report-actions, .db-empty-actions, .pv-actions, .pv-c-actions, .fin-actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--fin-action-gap);
}

/* Badges de status: sem cyan, mono discreto (D-FIN-2.0 §6). */
.db-status-pill {
  font: 600 10px/1 var(--fin-mono); letter-spacing: .1em;
  border-radius: 5px; padding: 4px 8px;
  border: 1px solid var(--fin-line-3); background: transparent; color: var(--fin-ink-3);
}
.db-status-pill.available { color: var(--fin-pos); border-color: rgba(63,207,142,.35); background: transparent; }
.db-status-pill.current   { color: var(--fin-ink-2); border-color: var(--fin-line-3); background: transparent; }

/* Checkbox: 20px com alvo de 44px na linha, gap 12. */
.db-check-row { gap: 12px; min-height: 44px; }
.db-check { width: 20px; height: 20px; border-radius: 5px; background: var(--fin-recessed); border-color: rgba(255,255,255,.18); }
.db-check:checked { background: var(--fin-accent); border-color: var(--fin-accent); }
.db-check::after { background: var(--fin-accent-ink); }

/* ═══ RESPONSIVO DO SHELL ═════════════════════════════════════════ */

/* 1024–1279 · sidebar textual compacta (224) por padrão; rail de 72
   por escolha do usuário, persistida neste dispositivo. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .db-shell { grid-template-columns: 224px minmax(0, 1fr); }
  .db-sidebar { padding: 18px 12px 14px; }
  #fin-rail-toggle { display: inline-flex; }
  html.fin-rail .db-shell { grid-template-columns: 72px minmax(0, 1fr); }
  html.fin-rail .db-sidebar { padding: 18px 10px 14px; align-items: center; }
  html.fin-rail .db-brand { padding: 0; justify-content: center; }
  html.fin-rail .db-brand > span,
  html.fin-rail .db-sidebar-section,
  html.fin-rail .db-sidebar-footer,
  html.fin-rail .db-nav-count,
  html.fin-rail .db-nav a > span:not(.db-nav-ico) { display: none !important; }
  html.fin-rail #db-sidebar-section-account { display: block !important; font-size: 0; padding: 0; margin-top: auto; height: 12px; }
  html.fin-rail .db-nav a { justify-content: center; padding: 0; width: 48px; }
  html.fin-rail .db-nav a.is-active::before { left: -10px; }
}

/* 641–1023 · sem sidebar persistente: a navegação abre em folha. */
@media (min-width: 641px) and (max-width: 1023px) {
  .db-shell { grid-template-columns: minmax(0, 1fr); }
  .db-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 70;
    width: 288px; height: 100%;
    background: var(--fin-overlay); border-right: 1px solid var(--fin-line-3);
    box-shadow: var(--fin-shadow-ovl);
    transform: translateX(-105%); transition: transform .24s ease;
    visibility: hidden;
  }
  html.fin-nav-open .db-sidebar { transform: none; visibility: visible; }
  /* O bloco antigo de 960px transformava a sidebar em rail de ícones. */
  .db-brand { justify-content: flex-start; padding: 0 12px; }
  .db-brand span, .db-sidebar-section { display: revert; }
  .db-nav a { justify-content: flex-start; padding: 0 12px; }
  .db-nav a span:not(.db-nav-ico) { display: inline; }
  .db-sidebar-footer { display: flex; }
  #fin-menu-toggle { display: inline-flex; }
  html.fin-nav-open .fin-nav-backdrop {
    display: block; position: fixed; inset: 0; z-index: 69; background: rgba(4,10,18,.55);
  }
}
@media (prefers-reduced-motion: reduce) { .db-sidebar { transition: none; } }

/* ≤640 · marca à esquerda, idioma e conta à direita, na mesma faixa;
   navegação principal na bottom nav de 5 destinos + Mais. */
@media (max-width: 640px) {
  .db-sidebar {
    height: 56px !important; padding: 0 var(--fin-gutter) !important;
    background: var(--fin-bar) !important; border-bottom: 1px solid var(--fin-line) !important;
  }
  .db-topbar {
    position: fixed !important; top: 0 !important; right: 0; z-index: 41 !important;
    min-height: 56px; height: 56px; padding: 0 var(--fin-gutter) 0 0 !important;
    background: transparent; border: 0; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  .fin-topbar-context { display: none; }
  .db-content { padding: 24px var(--fin-gutter) calc(96px + env(safe-area-inset-bottom)); }
}

/* ── bottom nav: 5 destinos, rótulos sempre visíveis ── */
.db-bottom-nav {
  background: var(--fin-bar);
  border-top: 1px solid var(--fin-line);
  backdrop-filter: none; -webkit-backdrop-filter: none;
  padding: 0 4px env(safe-area-inset-bottom);
  display: none; grid-template-columns: repeat(5, 1fr); gap: 0;
}
@media (max-width: 640px) { .db-bottom-nav { display: grid; } }
.db-bottom-nav button {
  min-height: 56px; min-width: 0; padding: 6px 2px;
  gap: 5px; color: var(--fin-ink-3);
  font: 500 10px/1.1 var(--fin-sans);   /* exceção documentada: 10px para "Rentabilidade" caber */
  white-space: nowrap;
}
.db-bottom-nav button svg { width: 20px; height: 20px; }
.db-bottom-nav button.is-active { color: var(--fin-accent); font-weight: 600; }

/* ── "Mais": a arquitetura real, na mesma ordem e nos mesmos grupos ── */
.db-more-sheet {
  background: var(--fin-overlay);
  border-top: 1px solid var(--fin-line-3);
  border-radius: var(--fin-r-ovl) var(--fin-r-ovl) 0 0;
  box-shadow: var(--fin-shadow-ovl);
  max-height: 82vh; overflow-y: auto;
  padding: 12px 12px calc(76px + env(safe-area-inset-bottom));
}
.db-more-sheet button {
  min-height: 48px; padding: 0 12px; gap: 12px; border-radius: var(--fin-r-item);
  color: var(--fin-ink-2); font: 500 15px var(--fin-sans);
}
.db-more-sheet button.is-active { background: var(--fin-nav-on); color: var(--fin-ink-1); font-weight: 600; }
.db-more-sheet svg { width: 18px; height: 18px; color: var(--fin-ink-3); }
.fin-more-group {
  padding: 18px 12px 6px;
  font: 500 10px/1 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3);
}
.db-more-grabber { width: 40px; height: 4px; background: rgba(255,255,255,.2); }

/* Texto só para leitor de tela. */
.fin-sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.pv-vazio { font-family: var(--fin-sans); font-style: normal; color: var(--fin-ink-3); }

/* ≤640: uma coluna só (a regra de 264px acima vale do tablet para cima). */
@media (max-width: 640px) {
  .db-shell { grid-template-columns: minmax(0, 1fr); }
}

/* Contador oculto continua oculto em qualquer largura. */
.db-nav-count[hidden] { display: none !important; }
/* O ícone do rail aponta para onde a barra vai. */
html.fin-rail #fin-rail-toggle svg { transform: scaleX(-1); }

/* ═══ CONTROLES ═══════════════════════════════════════════════════
   Segmented (exclusivo, h36): troca o conjunto de dados. Trilho
   RECESSED, pastilha ativa em navy claro. O mesmo desenho serve o
   idioma, o estado da Carteira e a moeda. */
:root { --fin-seg-active: #22415A; }
.db-lang button.is-active { background: var(--fin-seg-active); }
.pc-estados {
  display: inline-flex; align-items: center; gap: 4px; justify-self: start;
  padding: 5px; border-radius: 11px; background: var(--fin-recessed);
  /* Hairline própria: o trilho RECESSED e o PANEL da tabela ficam a um
     passo de distância no mesmo navy, e sem borda o controle parecia a
     aba de cima do card em vez de um objeto separado. */
  border: 1px solid var(--fin-line);
  width: auto; grid-column: 1 / -1;
  /* A régua anterior era `calc(24px - var(--fin-section-gap))`, aritmética
     contra um vão de 48px que ESTE contêiner não tem: o pai usa row-gap
     de 20px, então o resultado era −4px e o controle encostava (e cobria)
     o topo da tabela. O vão agora é declarado, não deduzido. */
  margin-bottom: 8px;
}
.pc-estados > .pc-estado {
  min-height: 36px; height: 36px; padding: 0 20px; border: 0; border-radius: 8px;
  background: transparent; color: var(--fin-ink-3);
  font: 500 13.5px/1 var(--fin-sans); cursor: pointer; box-shadow: none;
  white-space: nowrap;
}
.pc-estados > .pc-estado:hover { color: var(--fin-ink-1); background: transparent; }
.pc-estados > .pc-estado.is-on {
  background: var(--fin-seg-active); color: var(--fin-ink-1); font-weight: 600;
  /* Relevo mínimo: a pastilha ativa se levanta do trilho sem virar botão. */
  border: 0; box-shadow: inset 0 0 0 1px rgba(234,241,248,.08), 0 1px 2px rgba(0,0,0,.28);
}
@media (max-width: 640px) {
  .pc-estados { display: flex; width: 100%; margin-bottom: 6px; }
  .pc-estados > .pc-estado {
    flex: 1 1 0; min-height: 44px; height: 44px; padding: 0 8px;
    /* Em 360px "Encerradas (1)" não cabe inteiro: reduzir a fonte mantém
       os três rótulos legíveis sem cortar nenhum. */
    font-size: 13px;
  }
}
@media (max-width: 380px) { .pc-estados > .pc-estado { font-size: 12.5px; padding: 0 4px; } }

/* ═══ ESTADOS DE DADO ═════════════════════════════════════════════
   Faixa de 2px à esquerda, sem card e sem borda completa. */
.pc-demo {
  display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap;
  background: rgba(217,160,91,.05); border: 0; border-left: 2px solid var(--fin-warn);
  border-radius: 0 10px 10px 0; padding: 14px 18px;
}
.pc-demo .pc-demo-tag {
  font: 600 10.5px/1 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase;
  color: var(--fin-warn); background: transparent; border: 0; padding: 0;
}
.pc-demo .pc-demo-txt { font-size: 13.5px; color: var(--fin-ink-2); }

/* Sinal: a cor reforça, o + / − / — carrega o significado. */
.pc-up { color: var(--fin-pos) !important; }
.pc-down { color: var(--fin-neg) !important; }

/* ═══ KPI · faixa sem contêiner ════════════════════════════════════
   Um número protagonista (KPI-hero), os demais um degrau abaixo,
   separados por hairline vertical — não por cards. */
.fin-kpis {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 0;
  align-items: start;
}
.fin-kpi { display: flex; flex-direction: column; gap: 8px; padding: 0 24px; min-width: 0; }
.fin-kpi:first-child { padding-left: 0; }
.fin-kpi + .fin-kpi { border-left: 1px solid var(--fin-line); }
.fin-kpi-lab {
  font: 500 11px/1.25 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3);
}
.fin-kpi-val {
  font: 700 26px/1.1 var(--fin-sans); letter-spacing: -.01em; color: var(--fin-ink-1);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.fin-kpi-hero .fin-kpi-val { font-size: 34px; letter-spacing: -.02em; line-height: 1; }
.fin-kpi-sub { font-size: 13px; line-height: 1.45; color: var(--fin-ink-3); margin: 0; }
.fin-kpi-texto .fin-kpi-sub { font-size: 13.5px; color: var(--fin-ink-2); }
.fin-kpi-bar { display: block; height: 3px; width: 100%; max-width: 160px; background: var(--fin-line-3); border-radius: 2px; overflow: hidden; }
.fin-kpi-bar > span { display: block; height: 100%; background: var(--fin-ink-3); }
@media (max-width: 1279px) {
  .fin-kpis { grid-template-columns: 1fr 1fr; row-gap: 24px; }
  .fin-kpi:nth-child(odd) { padding-left: 0; border-left: 0; }
}
@media (max-width: 640px) {
  .fin-kpis { grid-template-columns: 1fr; row-gap: 0; }
  .fin-kpi { padding: 12px 0 !important; border-left: 0 !important; }
  .fin-kpi + .fin-kpi { border-top: 1px solid var(--fin-line); flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: 12px; row-gap: 4px; }
  .fin-kpi + .fin-kpi .fin-kpi-val { font-size: 17px; }
  .fin-kpi + .fin-kpi .fin-kpi-sub { flex-basis: 100%; }
  .fin-kpi-hero .fin-kpi-val { font-size: 32px; }
}

/* ═══ TABELA CANÔNICA ══════════════════════════════════════════════
   Densa por definição: linha de 48, número à direita e tabular,
   identidade à esquerda, ação no "…". Header sem fundo, com hairline. */
.fin-panel-tab { padding: 8px 24px 12px; }
.pc-tab-wrap { overflow-x: auto; }
.pc-tab { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.pc-tab thead th {
  font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--fin-ink-3); text-align: left; padding: 18px 8px 12px;
  border-bottom: 1px solid rgba(255,255,255,.09); background: transparent; white-space: nowrap;
}
.pc-tab thead th.pc-num { text-align: right; }
.pc-tab tbody td, .pc-tab tbody th {
  padding: 14px 8px; border-bottom: 1px solid var(--fin-line); font-size: 14px; color: var(--fin-ink-1);
  vertical-align: middle; text-align: left; font-weight: 400;
}
.pc-tab tbody td.pc-num { text-align: right; white-space: nowrap; }
.pc-tab tbody tr:hover > * { background: var(--fin-row-hover); }
.pc-traco, .pc-tab .pc-traco { color: var(--fin-ink-3); }

.fin-tab-cart { table-layout: auto; }
.fin-tab-cart th.fin-c-qtd   { width: 88px; }
.fin-tab-cart th.fin-c-pm    { width: 108px; }
.fin-tab-cart th.fin-c-preco { width: 108px; }
.fin-tab-cart th.fin-c-val   { width: 136px; }
.fin-tab-cart th.fin-c-res   { width: 150px; }
.fin-tab-cart th.fin-c-part  { width: 64px; }
.fin-tab-cart .fin-c-menu    { width: 44px; padding-left: 0; padding-right: 0; text-align: right; }
.fin-tab-cart td.fin-c-val   { font-size: 15px; font-weight: 600; }
.fin-tab-cart td.fin-c-part  { color: var(--fin-ink-2); }
.fin-tab-cart td.fin-c-qtd, .fin-tab-cart td.fin-c-pm, .fin-tab-cart td.fin-c-preco { color: var(--fin-ink-1); }
.fin-tab-cart tbody.fin-grp-body:last-child tr:last-child > * { border-bottom: 0; }

/* linha de classe: agrupamento dentro da própria tabela */
.fin-tab-cart tr.fin-grp > * { padding-top: 22px; padding-bottom: 12px; border-bottom: 0; vertical-align: baseline; background: transparent !important; }
.fin-grp-id { display: inline-flex; align-items: center; gap: 10px; }
.fin-grp-dot { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.fin-grp-nome { font-size: 15px; font-weight: 600; color: var(--fin-ink-1); }
.fin-grp-n { font-size: 13px; color: var(--fin-ink-3); }
.fin-grp-ref { display: block; margin-top: 6px; padding-left: 18px; font: 500 10.5px/1.3 var(--fin-mono); letter-spacing: .08em; color: var(--fin-ink-3); }
.fin-tab-cart tr.fin-grp td.fin-c-val { font-size: 15px; font-weight: 600; }
.fin-tab-cart tr.fin-grp td.fin-c-res { font-size: 13.5px; }
.fin-md-only { display: none; }

/* identidade do ativo */
.fin-ativo { display: flex; align-items: center; gap: 12px; padding-left: 18px; min-width: 0; }
.fin-mono-badge {
  width: 32px; height: 32px; border-radius: 8px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--fin-seg-on); color: var(--fin-accent-text);
  font: 600 11px/1 var(--fin-mono);
}
.fin-ativo-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fin-ativo-l1 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.fin-tk {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer; text-align: left;
  font: 600 14px/1.3 var(--fin-sans); color: var(--fin-ink-1);
}
.fin-tk.is-tk { font: 600 13.5px/1.3 var(--fin-mono); }
.fin-tk:hover { color: var(--fin-accent); text-decoration: underline; text-underline-offset: 3px; }
.fin-ativo-meta { font-size: 12.5px; line-height: 1.45; color: var(--fin-ink-3); font-weight: 400; }
.fin-meta-k { color: var(--fin-ink-3); }

/* resultado: R$ em cima, % embaixo; cobertura em uma linha */
.fin-res { display: block; font-weight: 600; }
.fin-res-sub { display: block; font-size: 12.5px; opacity: .85; margin-top: 2px; color: var(--fin-ink-3); }
.fin-cov { font-size: 13px; color: var(--fin-ink-3); white-space: normal; }

/* "…" de 44px de alvo, 32 visível */
.fin-row-menu {
  width: 36px; height: 36px; border-radius: 8px; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--fin-ink-3);
}
.fin-row-menu:hover, .fin-row-menu[aria-expanded="true"] { color: var(--fin-ink-1); background: rgba(255,255,255,.06); }

/* posição encerrada: não é erro nem desativada — é história */
.fin-tab-cart tr.is-closed > * { opacity: .72; }
.fin-tab-cart tr.is-closed .fin-res { opacity: 1; }

/* selos: mono discreto, neutro; cobertura incompleta em âmbar */
.pc-selo {
  display: inline-flex; align-items: center; padding: 3px 7px; border-radius: 4px;
  font: 600 9.5px/1 var(--fin-mono); letter-spacing: .1em; text-transform: uppercase;
  color: var(--fin-ink-3); background: transparent; border: 1px solid var(--fin-line-3);
}
.pc-selo-none, .pc-selo-alerta { color: var(--fin-warn); border-color: rgba(217,160,91,.4); }
.pc-selo-encerrada { color: var(--fin-ink-2); }

/* 1024–1279: identidade · valor · resultado · participação — as quatro
   colunas que sustentam comparação. Preço médio e atual vivem na ficha. */
@media (max-width: 1279px) {
  .fin-tab-cart .fin-c-qtd, .fin-tab-cart .fin-c-pm, .fin-tab-cart .fin-c-preco { display: none; }
}
/* 641–1023: linha de dois níveis — identidade + meta à esquerda,
   valor + resultado à direita. O cabeçalho de classe leva o total. */
@media (max-width: 1023px) {
  .fin-panel-tab { padding: 4px 16px 8px; }
  .fin-tab-cart thead { display: none; }
  .fin-tab-cart, .fin-tab-cart tbody { display: block; }
  .fin-tab-cart tr { display: grid; grid-template-columns: minmax(0, 1fr) auto 44px; column-gap: 12px; align-items: center; border-bottom: 1px solid var(--fin-line); }
  .fin-tab-cart tr > * { border-bottom: 0 !important; padding: 0 !important; }
  .fin-tab-cart tr.fin-row { padding: 14px 0; }
  .fin-tab-cart td.fin-c-part { display: none; }
  .fin-tab-cart td.fin-c-val { grid-column: 2; grid-row: 1; }
  .fin-tab-cart td.fin-c-res { grid-column: 2; grid-row: 2; font-size: 13px; }
  .fin-tab-cart .fin-c-ativo { grid-column: 1; grid-row: 1 / span 2; }
  .fin-tab-cart td.fin-c-menu { grid-column: 3; grid-row: 1 / span 2; }
  .fin-tab-cart .fin-ativo { padding-left: 0; }
  .fin-tab-cart .fin-ativo-meta:not(.fin-md-only) { display: none; }
  .fin-md-only { display: block; }
  .fin-tab-cart tr.fin-grp { display: block; padding: 18px 0 8px; }
  .fin-tab-cart tr.fin-grp > td { display: none; }
  .fin-tab-cart tr.fin-grp th { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
  .fin-grp-nome { font: 500 11px/1.3 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }
  .fin-grp-tot { font: 500 11px/1.3 var(--fin-mono); letter-spacing: .08em; color: var(--fin-ink-3); }
  .fin-grp-n, .fin-grp-dot { display: none; }
  .fin-res-sub { display: none; }
}

/* ≤640: cartões — objetos pares e repetíveis. */
.fin-cart-mob { display: flex; flex-direction: column; gap: 10px; }
.fin-grp-line {
  display: flex; justify-content: space-between; gap: 12px; margin: 14px 0 2px;
  font: 500 11px/1.3 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3);
}
.fin-grp-line:first-child { margin-top: 0; }
.pc-cards { gap: 10px; }
.pc-card { background: var(--fin-card) !important; border: 0 !important; border-radius: var(--fin-r-card) !important; box-shadow: none !important; }
.pc-card-val { font: 700 20px/1.2 var(--fin-sans); color: var(--fin-ink-1); }
/* Founder QA · A6 — no cartão, mono só no ticker; o nome longo fica em
   Manrope e sem sublinhado permanente (a sublinha é do hover). */
.pc-card-tk { font: 600 15px/1.35 var(--fin-sans); color: var(--fin-ink-1); text-decoration: none !important; }
.pc-card-tk.is-tk { font: 600 14.5px/1.35 var(--fin-mono); }
.pc-card-tk:hover { color: var(--fin-accent) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.pc-card-nm { font-size: 12.5px; color: var(--fin-ink-3); }
.pc-card-mono { background: var(--fin-seg-on) !important; color: var(--fin-accent-text) !important; border: 0 !important; font-family: var(--fin-mono); }
.pc-card-kebab { color: var(--fin-ink-3); }
.pc-card-more { color: var(--fin-accent); }

/* ═══ NOTAS DE SEÇÃO ═══════════════════════════════════════════════
   Rótulo mono à esquerda e o texto ao lado — sem contêiner. */
.fin-note { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; padding: 0 4px; }
.fin-note-lab { flex: 0 0 auto; padding-top: 2px; font: 500 10.5px/1.3 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-note-txt { flex: 1 1 360px; min-width: 0; font-size: 14px; line-height: 1.55; color: var(--fin-ink-2); }
.fin-note-txt p { margin: 0; }
.fin-note .pc-fora { margin-top: 8px; }
.fin-note .db-ghost-action { margin-left: auto; }

/* Layout fixo: a coluna de identidade leva o resto e a linha de meta
   quebra — nunca empurra os números para fora do painel. */
.fin-tab-cart { table-layout: fixed; }
.fin-tab-cart th.fin-c-ativo { width: auto; }
.fin-tab-cart th.fin-c-menu { width: 44px; }
.fin-kpi-texto { grid-column: span 2; max-width: 520px; }
.pc-selo.pc-selo-encerrada { color: var(--fin-ink-2); border-color: var(--fin-line-3); background: transparent; }
.pc-selo.pc-selo-decl { color: var(--fin-ink-2); }
/* Encerradas: o seletor já nomeia o estado; o painel não repete o título. */
.pc-enc > .db-card-title { display: none; }
.pc-enc > .db-card-sub { margin: 12px 0 0; max-width: 760px; }
/* A identidade quebra linha dentro da própria célula (o legado da tabela
   impunha nowrap e a meta do Tesouro invadia as colunas numéricas). */
.fin-tab-cart .fin-c-ativo { white-space: normal; overflow: hidden; }
.fin-ativo-txt, .fin-ativo-meta { min-width: 0; overflow-wrap: anywhere; white-space: normal; }

/* ═══ SEÇÃO · título + subtítulo, sem contêiner ═══════════════════ */
.fin-sec { display: flex; flex-direction: column; gap: 0; }
.fin-sec-tit { font: 700 21px/1.3 var(--fin-sans); color: var(--fin-ink-1); margin: 0 0 6px; }
.fin-sec-sub { font-size: 13.5px; line-height: 1.5; color: var(--fin-ink-2); margin: 0 0 20px; max-width: 720px; }
@media (max-width: 640px) { .fin-sec-tit { font-size: 18px; } }

/* ═══ INDISPONÍVEL como protagonista (D-FIN-2.0 §03/§11) ══════════ */
.fin-indisp {
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 32px; align-items: start;
}
.fin-indisp-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.fin-estado-badge {
  display: inline-flex; padding: 4px 8px; border-radius: 4px;
  font: 600 10.5px/1 var(--fin-mono); letter-spacing: .08em; text-transform: uppercase;
  color: var(--fin-ink-2); border: 1px solid var(--fin-line-btn);
}
.fin-indisp-tit { font: 700 21px/1.3 var(--fin-sans); color: var(--fin-ink-1); margin: 0 0 10px; }
.fin-indisp-txt { font-size: 15px; line-height: 1.55; color: var(--fin-ink-2); margin: 0 0 10px; max-width: 620px; }
.fin-indisp .fin-actions { margin-top: 16px; }
.fin-indisp-disp {
  background: var(--fin-recessed); border-radius: var(--fin-r-rec); padding: 18px 20px;
  display: flex; flex-direction: column; gap: 12px;
}
.fin-indisp-disp ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.fin-indisp-disp li { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.4; color: var(--fin-ink-2); }
.fin-indisp-disp li.is-sim > span:first-child { color: var(--fin-pos); }
.fin-indisp-disp li.is-nao { color: var(--fin-ink-3); }
.fin-indisp-disp li.is-nao > span:first-child { color: var(--fin-ink-3); }
@media (max-width: 1023px) { .fin-indisp { grid-template-columns: 1fr; gap: 20px; } }

/* taxa disponível: a mesma hierarquia, sem card chamativo */
.pc-ret .pc-ret-val { font: 700 44px/1 var(--fin-sans); letter-spacing: -.02em; margin: 10px 0 8px; }
.pc-ret .pc-ret-val small { font-size: 16px; font-weight: 600; color: var(--fin-ink-3); }
.pc-ret .pc-ret-met { font: 500 11px/1.3 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); }

/* ═══ OS TRÊS CONTRATOS ═══════════════════════════════════════════
   Grid de larguras iguais, baseline única, unidade declarada no rodapé. */
.fin-ct-panel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 24px 0; }
.fin-ct { display: flex; flex-direction: column; gap: 10px; padding: 0 24px; min-width: 0; }
.fin-ct + .fin-ct { border-left: 1px solid var(--fin-line); }
.fin-ct-val { font: 700 34px/1.05 var(--fin-sans); letter-spacing: -.02em; color: var(--fin-ink-1); white-space: nowrap; }
.fin-ct-val small { font-size: 15px; font-weight: 600; color: var(--fin-ink-3); }
.fin-ct-rows { display: flex; flex-direction: column; gap: 6px; }
.fin-ct-row { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--fin-ink-3); }
.fin-ct-row > span:last-child { color: var(--fin-ink-2); font-weight: 600; white-space: nowrap; }
.fin-ct-cob { font-size: 12.5px; color: var(--fin-ink-3); }
.fin-ct-nota { font-size: 13.5px; line-height: 1.5; color: var(--fin-ink-2); margin: 4px 0 0; }
.fin-ct-rodape {
  margin-top: auto; padding-top: 12px; border-top: 1px solid var(--fin-line);
  font: 500 10.5px/1.3 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3);
}
@media (max-width: 1023px) {
  .fin-ct-panel { grid-template-columns: 1fr; padding: 8px 0; }
  .fin-ct { padding: 20px 24px; }
  .fin-ct + .fin-ct { border-left: 0; border-top: 1px solid var(--fin-line); }
}
@media (max-width: 640px) { .fin-ct { padding: 18px 20px; } .fin-ct-val { font-size: 28px; } }

/* janelas mensais: faixa de KPI, não cards */
.fin-janelas .pc-janelas { display: flex; flex-wrap: wrap; gap: 0; }
.fin-janelas .pc-janela {
  display: flex; flex-direction: column; gap: 6px; padding: 0 24px; min-width: 180px;
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
}
.fin-janelas .pc-janela:first-child { padding-left: 0; }
.fin-janelas .pc-janela + .pc-janela { border-left: 1px solid var(--fin-line) !important; }
.fin-janelas .pc-janela-rot { font: 500 11px/1.3 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-janelas .pc-janela-val { font: 700 26px/1.1 var(--fin-sans); }
.fin-janelas .pc-janela-sub { font-size: 13px; color: var(--fin-ink-3); }

/* gráfico, períodos e benchmarks: controles do sistema */
.pc-periodos { display: inline-flex; gap: 4px; padding: 4px; background: var(--fin-recessed); border-radius: 10px; }
.pc-periodo {
  min-height: 36px; padding: 0 14px; border: 0 !important; border-radius: 8px; cursor: pointer;
  background: transparent !important; color: var(--fin-ink-3) !important; font: 500 13px/1 var(--fin-sans) !important;
}
.pc-periodo[aria-pressed="true"] { background: var(--fin-seg-active) !important; color: var(--fin-ink-1) !important; font-weight: 600 !important; }
@media (max-width: 640px) { .pc-periodo { min-height: 44px; } }

/* ═══ OVERLAY · DRAWER CANÔNICO (C-21.3) ═══════════════════════════
   480 à direita no desktop, 420 no tablet, bottom sheet de 82vh no
   celular. Header fixo, corpo rolável, ações fixas. É a única superfície
   com borda visível e sombra. Vale para a ficha e para os formulários. */
.pv-backdrop { background: rgba(4,10,18,.6); backdrop-filter: none; -webkit-backdrop-filter: none; }
.pv-drawer {
  width: min(480px, 100vw); background: var(--fin-overlay);
  border-left: 1px solid var(--fin-line-3); box-shadow: var(--fin-shadow-ovl);
}
@media (min-width: 641px) and (max-width: 1023px) { .pv-drawer { width: min(420px, 100vw); } }
.pv-drawer-h, .pv-dr-head { background: var(--fin-overlay); border-bottom: 1px solid var(--fin-line); padding: 20px 24px 16px; }
.pv-drawer-b, .pv-dr-body { padding: 0 24px 24px; }
.pv-drawer-f, .pv-dr-foot {
  background: var(--fin-overlay); border-top: 1px solid var(--fin-line);
  padding: 14px 24px; gap: var(--fin-action-gap); justify-content: flex-end;
}
.pv-x, .pv-dr-close {
  width: 36px; height: 36px; border-radius: 8px; border: 0; flex: none; cursor: pointer;
  background: transparent; color: var(--fin-ink-3); font-size: 20px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
}
.pv-x:hover, .pv-dr-close:hover { background: rgba(255,255,255,.06); color: var(--fin-ink-1); }
.fin-dr-h { display: flex; align-items: flex-start; gap: 14px; }
.fin-dr-h .fin-mono-badge { width: 40px; height: 40px; border-radius: 10px; font-size: 12px; }
.fin-dr-id { flex: 1; min-width: 0; }
.fin-dr-id h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0; font: 600 17px/1.3 var(--fin-sans); color: var(--fin-ink-1); }
.fin-dr-tk { font: 600 16px/1.3 var(--fin-mono); }
.fin-dr-id .pv-drawer-sub { margin: 3px 0 0; font-size: 13.5px; color: var(--fin-ink-2); }
.fin-dr-id .pv-eyebrow { margin: 6px 0 0; font: 400 12.5px/1.4 var(--fin-sans); letter-spacing: 0; text-transform: none; color: var(--fin-ink-3); }
.fin-selo-aberta { color: var(--fin-pos) !important; border-color: rgba(63,207,142,.4) !important; }
.fin-dr-topo {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  padding: 20px 0; border-bottom: 1px solid var(--fin-line);
}
.fin-dr-kpi { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.fin-dr-kpi + .fin-dr-kpi { border-left: 1px solid var(--fin-line); padding-left: 20px; }
.fin-dr-kpi-val { font: 700 24px/1.15 var(--fin-sans); color: var(--fin-ink-1); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fin-dr-kpi-val small { display: block; margin-top: 4px; font-size: 13px; font-weight: 600; opacity: .85; }
/* seções e linhas do drawer: rótulo à esquerda, valor à direita */
.pv-drawer .pa-h3 { margin: 24px 0 6px; }
.pv-drawer .pa-kv-dl { display: flex; flex-direction: column; gap: 0; }
.pv-drawer .pa-kv-dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--fin-line); }
.pv-drawer .pa-kv-dl dt { font: 400 13.5px/1.4 var(--fin-sans); letter-spacing: 0; text-transform: none; color: var(--fin-ink-3); }
.pv-drawer .pa-kv-dl dd { margin: 0; font: 600 13.5px/1.4 var(--fin-sans); color: var(--fin-ink-1); text-align: right; }
.pv-drawer .pa-kv-dl dd.pa-destaque { font-size: 13.5px; }
.pv-drawer .pa-hist-item:last-child { border-bottom: 0; }
/* ≤640: bottom sheet com pegador; alvos de 44–48px */
@media (max-width: 640px) {
  .pv-drawer {
    top: auto !important; left: 0; right: 0; width: 100% !important; max-height: 82vh;
    border-left: 0; border-top: 1px solid var(--fin-line-3); border-radius: var(--fin-r-ovl) var(--fin-r-ovl) 0 0;
  }
  .pv-grabber { display: block; width: 40px; }
  .pv-x, .pv-dr-close { width: 44px; height: 44px; }
  .pv-drawer-h, .pv-dr-head { padding: 12px 20px 14px; }
  .pv-drawer-b, .pv-dr-body { padding: 0 20px 20px; }
  .pv-drawer-f, .pv-dr-foot { padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); flex-direction: column-reverse; align-items: stretch; }
  .fin-dr-kpi-val { font-size: 20px; }
}

/* ═══ DASHBOARD · cinco perguntas (D-FIN-2.1 §01) ═════════════════ */
/* a saudação é o título da página: sem card, sem faixa própria */
.db-card.db-hero.db-hero-compact {
  background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important;
  box-shadow: none !important; overflow: visible;
}
.db-hero-compact .db-card-eyebrow { margin-bottom: 8px; }
.db-hero-compact .db-hero-title { font: 700 30px/1.15 var(--fin-sans) !important; letter-spacing: -.02em; margin: 0 0 8px; }
.db-hero-compact .db-hero-sub { font-size: 15px !important; line-height: 1.55; color: var(--fin-ink-2) !important; max-width: 720px; }
@media (max-width: 640px) { .db-hero-compact .db-hero-title { font-size: 24px !important; } }

/* 1–3 · faixa sem contêiner */
#db-card-pv-home.pv-home {
  background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important;
}
.fin-dash-kpis { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 0; align-items: start; }
.fin-dash-kpis .fin-kpi-hero .fin-kpi-val { font-size: 40px; }
.fin-dash-kpi-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.fin-dash-par { display: flex; justify-content: space-between; gap: 12px; }
.fin-dash-par > span:last-child { font-weight: 600; white-space: nowrap; color: var(--fin-ink-2); }
.fin-kpi .fin-dash-link { align-self: flex-start; padding: 0; min-height: 28px; }
/* seletor de moeda do painel: segmented */
.fin-dash-kpi-top .pv-ccy { background: var(--fin-recessed); border: 0; border-radius: 9px; padding: 3px; }
.fin-dash-kpi-top .pv-ccy-btn { min-height: 28px; border-radius: 7px; background: transparent; color: var(--fin-ink-3); border: 0; font: 600 12px/1 var(--fin-sans); }
.fin-dash-kpi-top .pv-ccy-btn[aria-pressed="true"], .fin-dash-kpi-top .pv-ccy-btn.is-on { background: var(--fin-seg-active); color: var(--fin-ink-1); }
@media (max-width: 1023px) {
  .fin-dash-kpis { grid-template-columns: 1fr 1fr; row-gap: 24px; }
  .fin-dash-kpis .fin-kpi-hero { grid-column: 1 / -1; padding-left: 0; }
  .fin-dash-kpis .fin-kpi:nth-child(2) { border-left: 0; padding-left: 0; }
}
@media (max-width: 640px) {
  .fin-dash-kpis { grid-template-columns: 1fr; row-gap: 0; }
  .fin-dash-kpis .fin-kpi-hero .fin-kpi-val { font-size: 32px; }
  .fin-dash-kpis .fin-kpi:nth-child(n+2) { border-top: 1px solid var(--fin-line); padding: 14px 0 !important; }
  .fin-dash-kpis .fin-kpi-hero { padding-bottom: 14px !important; }
}

/* blocos: PANEL, cabeçalho com rótulo e estado */
.fin-dash-blk { display: flex; flex-direction: column; gap: 10px; }
/* O `display: flex` acima é regra de autor e VENCE o [hidden] do navegador:
   "Onde o patrimônio está" nascia como painel vazio de 56px para o visitante
   e para a conta sem patrimônio. Oculto continua oculto. */
.fin-dash-blk[hidden] { display: none; }
.fin-dash-blk-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.fin-dash-blk .db-card-title { margin: 0; }
.fin-dash-blk-val { font: 700 26px/1.15 var(--fin-sans); color: var(--fin-ink-1); }
.fin-dash-linhas { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--fin-ink-3); }
.fin-dash-link { padding: 0 !important; min-height: 32px; align-self: flex-start; }
.fin-dash-evento { margin: 6px 0 0; padding-top: 12px; border-top: 1px solid var(--fin-line); font-size: 13.5px; color: var(--fin-ink-2); display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
#db-card-plano .pv-meta-barra { height: 6px; background: var(--fin-line-3); border-radius: 3px; }
#db-card-plano .pv-meta-barra span { background: var(--fin-accent); border-radius: 3px; }
/* sem pendência, "onde" ocupa a linha inteira */
.db-content:has(#db-card-actions[style*="display: none"]) #fin-dash-onde,
.db-content:has(#db-card-actions[style*="display:none"]) #fin-dash-onde { grid-column: span 12; }
@media (max-width: 960px) { .fin-dash-blk.col-6 { grid-column: span 12; } }

/* onde o patrimônio está: barra de 10px + linhas */
.fin-dash-stack { display: flex; height: 10px; border-radius: 3px; overflow: hidden; gap: 2px; background: transparent; margin: 4px 0 6px; }
.fin-dash-stack > span { display: block; height: 100%; }
.fin-dash-cls { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.fin-dash-cls li {
  display: grid; grid-template-columns: 12px minmax(0, 1fr) auto 64px; gap: 10px; align-items: center;
  padding: 10px 0; border-bottom: 1px solid var(--fin-line); font-size: 14px; color: var(--fin-ink-1);
}
.fin-dash-cls li:last-child { border-bottom: 0; }
.fin-dash-cls-v { font-weight: 600; text-align: right; white-space: nowrap; }
.fin-dash-cls-p { color: var(--fin-ink-2); text-align: right; }
@media (max-width: 640px) { .fin-dash-cls li { grid-template-columns: 12px minmax(0, 1fr) auto; } .fin-dash-cls-v { grid-column: 3; } .fin-dash-cls-p { grid-column: 3; font-size: 12.5px; } }

/* precisa da sua atenção: linhas de dois níveis com a rota ao lado */
#db-card-actions .db-action-row, #db-actions-wrap > div {
  padding: 12px 0; border-bottom: 1px solid var(--fin-line); gap: 12px;
}
#db-actions-wrap > div:last-child { border-bottom: 0; }

/* últimos lançamentos */
.fin-dash-lanc { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.fin-dash-lanc li {
  display: grid; grid-template-columns: 132px minmax(0, 1fr) auto auto; gap: 16px; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--fin-line);
}
.fin-dash-lanc li:last-child { border-bottom: 0; }
.fin-dash-lanc-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fin-dash-lanc-id strong { font: 600 14px/1.3 var(--fin-sans); color: var(--fin-ink-1); overflow-wrap: anywhere; }
.fin-dash-lanc-id span { font-size: 12.5px; color: var(--fin-ink-3); }
.fin-dash-lanc-d { font-size: 13px; color: var(--fin-ink-3); white-space: nowrap; }
.fin-dash-lanc-v { font-weight: 600; text-align: right; white-space: nowrap; }
@media (max-width: 640px) {
  .fin-dash-lanc li { grid-template-columns: minmax(0, 1fr) auto; row-gap: 4px; }
  .fin-dash-lanc li .fin-op { grid-column: 1 / -1; justify-self: start; }
  .fin-dash-lanc-d { grid-column: 1; grid-row: 3; }
  .fin-dash-lanc-v { grid-column: 2; grid-row: 2; }
}

/* ═══ TOKEN DE OPERAÇÃO (C-21.5) ══════════════════════════════════
   Mono 10.5 uppercase, borda 1px, r4, largura fixa na coluna. O texto
   é o canal primário; a cor só reforça. */
.fin-op {
  display: inline-flex; align-items: center; justify-content: center; min-width: 104px;
  padding: 4px 8px; border-radius: 4px; border: 1px solid var(--fin-line-btn);
  font: 600 10.5px/1 var(--fin-mono); letter-spacing: .08em; text-transform: uppercase;
  color: var(--fin-ink-2); white-space: nowrap;
}
/* as seis cores do frame de Lançamentos (D-FIN-2.1 §05) */
.fin-op-buy      { color: var(--fin-pos); border-color: rgba(63,207,142,.35); }
.fin-op-sell     { color: var(--fin-neg); border-color: rgba(242,119,122,.35); }
.fin-op-income   { color: var(--fin-accent-text); border-color: rgba(47,198,232,.35); }
.fin-op-fee      { color: var(--fin-ink-2); border-color: rgba(255,255,255,.16); }
.fin-op-tax      { color: var(--fin-warn); border-color: rgba(217,160,91,.4); }
.fin-op-transfer { color: var(--fin-info); border-color: rgba(139,143,232,.4); }
/* a saudação recebe a ação primária ao lado, como todo cabeçalho de página */
.db-hero-compact { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; column-gap: 32px; align-items: end; }
.db-hero-compact > * { grid-column: 1; }
.db-hero-compact > .fin-head-cta { grid-column: 2; grid-row: 1 / span 4; align-self: end; }

/* ═══ ANÁLISE (D-FIN-2.1 §02) ═════════════════════════════════════
   Seis perguntas como SECTION, separadas por ar; a resposta logo
   abaixo, no menor gráfico que a comunica. O único PANEL da página é
   a tabela de renda fixa. */
.db-page-head > .fin-head-aux { grid-column: 2; grid-row: 1 / span 4; align-self: end; }
@media (max-width: 640px) {
  .db-page-head > .fin-head-aux { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 16px; }
}
.fin-ana { display: flex; flex-direction: column; gap: var(--fin-section-gap); min-width: 0; }
.fin-q { scroll-margin-top: 96px; min-width: 0; }
.fin-q h2[tabindex="-1"]:focus { outline: none; }
@media (max-width: 640px) { .fin-q { scroll-margin-top: 128px; } }

/* chips · acumulável · h32 (44 no toque). O selecionado carrega o ✕. */
.fin-chips { display: flex; flex-wrap: wrap; gap: var(--fin-control-gap); min-width: 0; }

/* ── Abas da Análise (role=tablist) ───────────────────────────────
   Barra de navegação entre as seis perguntas, com UM painel visível
   por vez. A régua embaixo separa a navegação do relatório: sem ela,
   a aba ativa e o título do painel disputam a mesma hierarquia. */
.fin-ana-nav {
  gap: var(--fin-control-gap); padding-bottom: 16px;
  border-bottom: 1px solid var(--fin-line); margin-bottom: 8px;
}
.fin-ana-nav > .fin-chip[aria-selected="true"] {
  border-color: rgba(47,198,232,.45); background: var(--fin-accent-soft);
  color: var(--fin-accent-text); font-weight: 600;
}
/* O painel é alvo de foco programático; o anel do contêiner inteiro
   seria ruído, e o título logo abaixo já diz onde a leitura começou. */
.fin-sec[role="tabpanel"]:focus { outline: none; }
.fin-sec[role="tabpanel"]:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 4px; }
@media (max-width: 767px) {
  /* Trilho rolável: seis abas não cabem em 360px, e quebrar em duas
     linhas faz a barra crescer mais que o painel que ela governa. */
  .fin-ana-nav {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    -webkit-overflow-scrolling: touch; padding-bottom: 12px;
  }
  .fin-ana-nav::-webkit-scrollbar { display: none; }
  .fin-ana-nav > .fin-chip { flex: 0 0 auto; }
}
.fin-chip {
  height: 32px; padding: 0 14px; border-radius: 16px; border: 1px solid var(--fin-line-3);
  background: transparent; color: var(--fin-ink-2); font: 500 13px/1 var(--fin-sans);
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer; white-space: nowrap;
}
.fin-chip:hover { color: var(--fin-ink-1); border-color: var(--fin-line-btn); }
.fin-chip.is-on { border-color: rgba(47,198,232,.45); background: var(--fin-accent-soft); color: var(--fin-accent-text); font-weight: 600; }
.fin-chip:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-chip-x { font-size: 11px; opacity: .85; }
@media (max-width: 767px) { .fin-chip { height: 44px; } }
/* D-FIN-2.1 §08 — os atalhos das perguntas quebram em duas linhas no
   celular, sem rolagem horizontal. */

/* select · "Agrupar por" — chip nunca troca a dimensão (D-FIN-2.0 §9) */
.fin-select-wrap { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.fin-select-lab { font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); white-space: nowrap; }
.fin-select {
  height: 36px; min-width: 168px; padding: 0 36px 0 12px; border-radius: var(--fin-r-btn);
  border: 1px solid var(--fin-line-btn); color: var(--fin-ink-1); font: 500 14px/1 var(--fin-sans);
  background: var(--fin-recessed) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%238FA3B8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center / 12px;
  -webkit-appearance: none; appearance: none; cursor: pointer;
}
.fin-select:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-select option { background: var(--fin-overlay); color: var(--fin-ink-1); }
@media (max-width: 767px) { .fin-select { height: 44px; } }
.fin-ana-ctl { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; margin: 0 0 20px; }
@media (max-width: 640px) { .fin-select-wrap { width: 100%; } .fin-select { flex: 1 1 auto; min-width: 0; } }

/* barra de 10px e legenda */
.fin-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; gap: 2px; margin: 0 0 8px; }
.fin-bar > span { display: block; height: 100%; min-width: 2px; }
.fin-leg { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; min-width: 0; }
.fin-leg > li { margin: 0; min-width: 0; }
.fin-leg-row {
  display: flex; align-items: baseline; gap: 14px; width: 100%; padding: 13px 4px;
  border: 0; border-bottom: 1px solid var(--fin-line); background: transparent;
  color: var(--fin-ink-1); font: inherit; text-align: left; border-radius: 0;
}
.fin-leg > li:last-child > .fin-leg-row, .fin-leg > li.fin-leg-row:last-child { border-bottom: 0; }
button.fin-leg-row { cursor: pointer; }
button.fin-leg-row:hover { background: var(--fin-row-hover); }
button.fin-leg-row.is-on { background: var(--fin-accent-soft); box-shadow: inset 2px 0 0 var(--fin-accent); }
button.fin-leg-row:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: -2px; }
.fin-leg-sw { width: 8px; height: 8px; border-radius: 2px; flex: none; align-self: center; }
.fin-leg-nome { flex: 1 1 auto; min-width: 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.fin-leg-sub { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 400; color: var(--fin-ink-3); }
.fin-leg-val { font-size: 14px; color: var(--fin-ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fin-leg-pct { width: 58px; flex: none; text-align: right; font-size: 14px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { button.fin-leg-row { min-height: 44px; } }

/* os ativos de uma fatia (drill-down) */
.fin-ana-lista-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.fin-ana-lista-h > .fin-btn-ghost:only-child { margin-left: -12px; }
.fin-ana-h3 { margin: 0; font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-ana-ativos { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; }
.fin-ana-ativo {
  width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) 150px 190px 130px; gap: 16px; align-items: center;
  padding: 12px 4px; border: 0; border-bottom: 1px solid var(--fin-line); background: transparent;
  color: var(--fin-ink-1); font: inherit; text-align: left; cursor: pointer; border-radius: 0;
}
.fin-ana-ativos > li:last-child .fin-ana-ativo { border-bottom: 0; }
.fin-ana-ativo:hover { background: var(--fin-row-hover); }
.fin-ana-ativo:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: -2px; }
.fin-ana-ativo-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fin-ana-ativo-id strong { font: 600 14px/1.3 var(--fin-sans); overflow-wrap: anywhere; }
.fin-ana-ativo-id span { font-size: 12.5px; color: var(--fin-ink-3); overflow-wrap: anywhere; }
.fin-ana-ativo-val { text-align: right; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fin-ana-ativo-res { text-align: right; font-size: 13px; color: var(--fin-ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fin-ana-ativo-pct { text-align: right; font-size: 13px; color: var(--fin-ink-3); white-space: nowrap; }
@media (max-width: 1023px) {
  .fin-ana-ativo { grid-template-columns: minmax(0, 1fr) auto; row-gap: 4px; min-height: 44px; }
  .fin-ana-ativo-id { grid-column: 1; grid-row: 1 / span 2; }
  .fin-ana-ativo-val { grid-column: 2; grid-row: 1; }
  .fin-ana-ativo-res { grid-column: 2; grid-row: 2; }
  .fin-ana-ativo-pct { grid-column: 1 / -1; grid-row: 3; text-align: left; }
}
.fin-ana-foot { margin: 16px 0 0; font-size: 13px; line-height: 1.5; color: var(--fin-ink-3); }
.fin-ana-foot .fin-note-lab { margin-right: 10px; }

/* fatos (concentração, vencimentos): rótulo mono, valor, contexto */
.fin-fatos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; }
.fin-fatos-1 { grid-template-columns: minmax(0, 1fr); }
.fin-fatos-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fin-fatos-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fin-fatos-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.fin-fato { display: flex; flex-direction: column; gap: 10px; padding: 0 32px; border-left: 1px solid rgba(255,255,255,.07); min-width: 0; }
.fin-fato:first-child { padding-left: 0; border-left: 0; }
.fin-fato:last-child { padding-right: 0; }
.fin-fato-l { font: 500 11px/1.3 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-fato-v { font: 700 26px/1.1 var(--fin-sans); font-variant-numeric: tabular-nums; color: var(--fin-ink-1); overflow-wrap: anywhere; }
.fin-fatos-venc .fin-fato-v { font-size: 22px; }
.fin-fato.is-vazio .fin-fato-v { color: var(--fin-ink-3); font-size: 26px; }
.fin-fato-s { font-size: 13.5px; line-height: 1.45; color: var(--fin-ink-3); }
.fin-fatos-venc .fin-fato-s { font-size: 13px; }
/* §08 — em 1024 as respostas caem para 2 colunas; abaixo de 1024 viram
   linhas no formato da legenda: rótulo e contexto à esquerda, número à direita. */
@media (max-width: 1279px) {
  .fin-fatos-3, .fin-fatos-4, .fin-fatos-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .fin-fatos .fin-fato:nth-child(odd) { padding-left: 0; border-left: 0; }
  .fin-fatos .fin-fato:nth-child(even) { padding-right: 0; }
}
@media (max-width: 1023px) {
  .fin-fatos, .fin-fatos-3, .fin-fatos-4, .fin-fatos-5 { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .fin-fato, .fin-fatos .fin-fato:nth-child(odd), .fin-fatos .fin-fato:nth-child(even) {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 4px; align-items: baseline;
    padding: 14px 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.07);
  }
  .fin-fato:first-child { border-top: 0; padding-top: 0; }
  .fin-fato-l { grid-column: 1; grid-row: 1; }
  .fin-fato-s { grid-column: 1; grid-row: 2; }
  .fin-fato-v, .fin-fatos-venc .fin-fato-v, .fin-fato.is-vazio .fin-fato-v { grid-column: 2; grid-row: 1 / span 2; align-self: center; text-align: right; font-size: 19px; }
}

/* renda fixa: o único PANEL, e é tabela — abaixo de 768, linha de dois níveis */
.fin-tab-rf { table-layout: fixed; }
.fin-tab-rf thead th:nth-child(2) { width: 180px; }
.fin-tab-rf thead th:nth-child(3) { width: 124px; }
.fin-tab-rf thead th:nth-child(4) { width: 156px; }
.fin-tab-rf tbody th { font-weight: 400; }
.fin-tab-rf .fin-ativo { padding-left: 0; }
.fin-tab-rf .fin-ativo-txt { gap: 2px; }
.fin-tab-rf td.fin-ana-rf-idx { color: var(--fin-ink-2); white-space: normal; }
.fin-tab-rf td.fin-ana-rf-val { font-weight: 600; }
.fin-tab-rf tbody tr { cursor: pointer; }
.fin-tab-rf tbody tr:last-child > * { border-bottom: 0; }
@media (max-width: 767px) {
  .fin-tab-rf, .fin-tab-rf tbody { display: block; width: 100%; }
  .fin-tab-rf thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fin-tab-rf tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 14px 0; border-bottom: 1px solid var(--fin-line); }
  .fin-tab-rf tbody tr:last-child { border-bottom: 0; }
  .fin-tab-rf tbody tr > * { padding: 0 !important; border: 0 !important; background: transparent !important; }
  .fin-tab-rf tbody th { grid-column: 1 / -1; }
  .fin-tab-rf tbody td.fin-ana-rf-idx, .fin-tab-rf tbody td.fin-ana-rf-venc {
    grid-column: 1; text-align: left; white-space: normal; min-width: 0; font-size: 13px; color: var(--fin-ink-2); padding-left: 44px !important;
  }
  .fin-tab-rf tbody td.fin-ana-rf-idx::before, .fin-tab-rf tbody td.fin-ana-rf-venc::before { content: attr(data-rotulo) " · "; color: var(--fin-ink-3); }
  .fin-tab-rf tbody td.fin-ana-rf-idx { grid-row: 2; }
  .fin-tab-rf tbody td.fin-ana-rf-venc { grid-row: 3; }
  .fin-tab-rf tbody td.fin-ana-rf-val { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
  .fin-tab-rf .fin-tk { min-height: 44px; }
}

/* rodapé: encerradas, a rota da rentabilidade e o aviso */
.fin-ana-rodape { display: flex; flex-direction: column; gap: 20px; }
.fin-ana-fonte { margin-top: 16px; }

/* ═══ BARRA DE FILTROS (C-21.4) ═══════════════════════════════════
   Linha 1: busca + até seis selects de 36px com rótulo mono dentro.
   Linha 2: os chips do que está DE FATO aplicado, "Limpar todos" e o
   contador N de M. No celular, os selects vão para um sheet. */
.fin-filtros { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.fin-filtros-l1 { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; min-width: 0; }
.fin-busca {
  display: flex; align-items: center; gap: 9px; height: 36px; width: 230px; padding: 0 13px; flex: 0 0 auto;
  border-radius: 9px; background: var(--fin-recessed); border: 1px solid rgba(255,255,255,.07);
}
.fin-busca:focus-within { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-busca-ico { color: var(--fin-ink-3); font-size: 13px; line-height: 1; }
.fin-busca-in {
  flex: 1 1 auto; min-width: 0; height: 100%; border: 0; background: transparent; outline: none;
  color: var(--fin-ink-1); font: 500 13.5px/1 var(--fin-sans);
}
.fin-busca-in::placeholder { color: var(--fin-ink-3); opacity: 1; }
/* no desktop os selects correm na MESMA linha da busca (C-21.4) */
.fin-filtros-sel { display: contents; }
.fin-sheet-b { display: contents; }
.fin-sheet-h, .fin-sheet-f, .fin-filtros-btn, .fin-sheet-fundo { display: none; }
.fin-fsel {
  position: relative; display: inline-flex; align-items: center; gap: 9px; height: 36px; padding: 0 30px 0 12px;
  flex: 0 0 auto; max-width: 280px; border-radius: 9px; background: var(--fin-recessed); border: 1px solid rgba(255,255,255,.07); cursor: pointer;
}
.fin-fsel::after {
  content: ""; position: absolute; right: 12px; top: 50%; width: 10px; height: 10px; margin-top: -5px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%238FA3B8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 10px;
}
.fin-fsel:focus-within { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-fsel-lab { font: 500 10px/1 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); white-space: nowrap; }
.fin-fsel-in {
  -webkit-appearance: none; appearance: none; border: 0; margin: 0; padding: 0; height: 100%; min-width: 0; max-width: 180px;
  field-sizing: content;
  background: transparent; color: var(--fin-ink-3); font: 500 13.5px/1 var(--fin-sans); text-overflow: ellipsis; cursor: pointer; outline: none;
}
.fin-fsel.is-set .fin-fsel-in { color: var(--fin-ink-1); }
.fin-fsel-in option { background: var(--fin-overlay); color: var(--fin-ink-1); }
.fin-fsel-data { padding-right: 12px; }
.fin-fsel-data::after { display: none; }
.fin-fsel-data .fin-fsel-in { color: var(--fin-ink-1); color-scheme: dark; max-width: 150px; }
.fin-filtros-l2 { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; min-height: 32px; min-width: 0; }
.fin-filtros-lab { font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-filtros-l2 .fin-chip { padding: 0 12px; max-width: 100%; }
.fin-filtros-l2 .fin-chip { overflow: hidden; text-overflow: ellipsis; }
.fin-filtros-limpar { min-height: 32px; height: 32px; padding: 0 8px; font-size: 13px; }
.fin-filtros-cont { margin-left: auto; font-size: 13px; color: var(--fin-ink-3); }
.fin-filtros-cont strong { color: var(--fin-ink-1); font-weight: 600; }
.fin-filtros-n {
  display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 10px; background: var(--fin-accent-soft); color: var(--fin-accent-text); font: 600 12px/1 var(--fin-sans);
}

/* ═══ LANÇAMENTOS (D-FIN-2.1 §05) ═════════════════════════════════
   O livro-razão, denso de propósito: linha de 44px, token de operação,
   origem como coluna e o "…" fixo de 44px. */
.fin-lanc { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.fin-lanc-panel { padding-bottom: 0; overflow: hidden; }
.fin-tab-lanc { table-layout: fixed; }
.fin-tab-lanc th.fin-l-data  { width: 108px; }
.fin-tab-lanc th.fin-l-tipo  { width: 140px; }
.fin-tab-lanc th.fin-l-conta { width: 150px; }
.fin-tab-lanc th.fin-l-qtd   { width: 84px; }
.fin-tab-lanc th.fin-l-val   { width: 146px; }
.fin-tab-lanc th.fin-l-orig  { width: 100px; }
.fin-tab-lanc .fin-c-menu    { width: 44px; padding-left: 0; padding-right: 0; text-align: right; }
.fin-tab-lanc tbody td, .fin-tab-lanc tbody th { padding-top: 12px; padding-bottom: 12px; }
.fin-tab-lanc tbody tr:last-child > * { border-bottom: 0; }
.fin-tab-lanc td.fin-l-data { font: 400 12.5px/1.3 var(--fin-mono); color: var(--fin-ink-2); white-space: nowrap; }
.fin-l-sub { display: block; margin-top: 3px; font: 400 11.5px/1.3 var(--fin-sans); color: var(--fin-ink-3); white-space: normal; }
.fin-tab-lanc .fin-op { display: flex; width: 100%; min-width: 0; padding: 4px 0; }
.fin-tab-lanc tbody th.fin-l-desc { font-size: 14px; font-weight: 400; min-width: 0; }
.fin-l-desc-l1 { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-l-desc .fin-tk.is-tk { font: 600 13px/1.3 var(--fin-mono); }
.fin-l-sep { color: var(--fin-ink-3); }
.fin-l-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; font-size: 12.5px; line-height: 1.4; color: var(--fin-ink-3); }
.fin-l-meta .pc-selo { white-space: normal; max-width: 100%; line-height: 1.35; }
.fin-l-extra { display: none; }
.fin-tab-lanc td.fin-l-conta { font-size: 13px; color: var(--fin-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-tab-lanc td.fin-l-qtd { font-size: 13.5px; color: var(--fin-ink-2); }
.fin-tab-lanc td.fin-l-val { font-weight: 600; }
.fin-tab-lanc td.fin-l-val.is-vazio { font-weight: 400; color: var(--fin-ink-3); white-space: normal; }
.fin-tab-lanc tr.fin-l-semvalor > * { opacity: .72; }
.fin-l-orig-imp {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  font: 500 11.5px/1.3 var(--fin-mono); color: var(--fin-accent-text);
}
.fin-l-orig-imp:hover { text-decoration: underline; text-underline-offset: 3px; }
.fin-l-orig-imp:focus-visible, .fin-tab-lanc .fin-tk:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; border-radius: 3px; }
.fin-l-orig-txt { font-size: 12.5px; color: var(--fin-ink-3); }
.fin-l-orig-hash { font-family: var(--fin-mono); color: var(--fin-accent-text); }
.fin-lanc-rodape {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px;
  margin: 12px -24px 0; padding: 16px 28px; background: var(--fin-recessed); border-top: 1px solid var(--fin-line-2);
  font-size: 13.5px; line-height: 1.45; color: var(--fin-ink-3);
}
.fin-lanc-vazio .fin-sec-sub { margin: 0; }
/* drawer do lançamento: o token e a data acima do título */
.fin-lanc-dr-op { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font: 400 12.5px/1 var(--fin-mono); color: var(--fin-ink-2); }
.fin-dr-sec { margin: 24px 0 6px; font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-ink-3); }

/* 1024–1279 · a Conta sai da tabela e vive no drawer (§08) */
@media (max-width: 1279px) {
  .fin-tab-lanc .fin-l-conta { display: none; }
  /* a quantidade desce para a linha de meta da descrição: sem isso a
     descrição ficaria com ~60px nesta faixa */
  .fin-tab-lanc .fin-l-qtd { display: none; }
  .fin-tab-lanc th.fin-l-data { width: 100px; }
  .fin-tab-lanc th.fin-l-tipo { width: 132px; }
  .fin-tab-lanc th.fin-l-val  { width: 132px; }
  .fin-tab-lanc th.fin-l-orig { width: 88px; }
  .fin-l-extra { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.4; color: var(--fin-ink-3); }
  .fin-l-m-conta { display: none; }
}
/* 768–1023 · linha de dois níveis: tipo, data e descrição / valor e origem */
@media (max-width: 1023px) {
  .fin-tab-lanc, .fin-tab-lanc tbody { display: block; width: 100%; }
  .fin-tab-lanc thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fin-tab-lanc tbody tr {
    display: grid; grid-template-columns: 124px minmax(0, 1fr) auto 44px; column-gap: 14px; row-gap: 6px; align-items: center;
    grid-template-areas: "tipo desc val menu" "data desc orig menu";
    padding: 12px 0; border-bottom: 1px solid var(--fin-line);
  }
  .fin-tab-lanc tbody tr:last-child { border-bottom: 0; }
  .fin-tab-lanc tbody tr > * { padding: 0 !important; border: 0 !important; background: transparent !important; min-width: 0; }
  .fin-tab-lanc .fin-l-tipo { grid-area: tipo; }
  .fin-tab-lanc .fin-l-data { grid-area: data; }
  .fin-tab-lanc .fin-l-desc { grid-area: desc; align-self: start; }
  .fin-tab-lanc .fin-l-val  { grid-area: val; }
  .fin-tab-lanc .fin-l-orig { grid-area: orig; }
  .fin-tab-lanc .fin-c-menu { grid-area: menu; width: auto; }
  .fin-tab-lanc .fin-l-qtd, .fin-tab-lanc .fin-l-conta { display: none !important; }
  .fin-l-extra { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.4; color: var(--fin-ink-3); overflow-wrap: anywhere; }
  .fin-l-m-conta { display: inline; }
  .fin-l-m-qtd + .fin-l-m-conta::before { content: " · "; }
  .fin-tab-lanc .fin-row-menu { width: 44px; height: 44px; }
}
/* ≤640 · cartão por lançamento e filtros em sheet (§08b) */
@media (max-width: 640px) {
  .fin-lanc-panel { background: transparent !important; padding: 0 !important; border-radius: 0; overflow: visible; box-shadow: none; }
  .fin-tab-lanc tbody { display: flex; flex-direction: column; gap: 8px; }
  .fin-tab-lanc tbody tr, .fin-tab-lanc tbody tr:last-child {
    grid-template-columns: auto minmax(0, 1fr) 44px; grid-template-areas: "tipo data menu" "desc desc menu" "val orig menu";
    padding: 14px 4px 14px 16px; border: 0; border-radius: var(--fin-r-card); background: var(--fin-card);
  }
  .fin-tab-lanc .fin-op { width: auto; min-width: 104px; padding: 4px 8px; }
  .fin-tab-lanc .fin-l-orig { justify-self: end; }
  .fin-tab-lanc .fin-l-desc-l1 { white-space: normal; overflow-wrap: anywhere; }
  /* alvo de 44px sem abrir a linha: a margem negativa devolve a altura ao texto */
  .fin-tab-lanc .fin-tk { min-height: 44px; display: inline-flex; align-items: center; margin: -12px 0; vertical-align: middle; }
  .fin-tab-lanc tbody td.fin-l-val { text-align: left; }
  .fin-l-orig-imp { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: flex-end; margin: -12px 0; }
  .fin-lanc-rodape { margin: 12px 0 0; border-radius: var(--fin-r-card); border-top: 0; padding: 14px 16px; }

  .fin-busca { flex: 1 1 auto; width: auto; height: auto; }
  .fin-busca-in { height: 44px; }
  .fin-filtros-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
  .fin-filtros-sel { display: none; }
  .fin-filtros-sel.is-aberto {
    display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 0;
    position: fixed; left: 0; right: 0; bottom: 0; max-height: 82vh; z-index: var(--z-modal, 81);
    background: var(--fin-overlay); border-top: 1px solid var(--fin-line-3); border-radius: var(--fin-r-ovl) var(--fin-r-ovl) 0 0; box-shadow: var(--fin-shadow-ovl);
  }
  html.fin-sheet-aberto .db-bottom-nav { display: none; }
  .fin-sheet-fundo { display: block; position: fixed; inset: 0; z-index: var(--z-backdrop, 80); background: rgba(4,10,18,.6); }
  .fin-sheet-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-bottom: 1px solid var(--fin-line); }
  .fin-sheet-h h2 { margin: 0; font: 600 17px/1.3 var(--fin-sans); color: var(--fin-ink-1); }
  .fin-sheet-b { display: flex; flex-direction: column; gap: 10px; padding: 16px 20px; overflow-y: auto; }
  .fin-sheet-f { display: flex; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--fin-line); }
  .fin-sheet-f .fin-btn-primary { flex: 1 1 auto; min-height: 48px; }
  .fin-fsel { width: 100%; max-width: none; height: 44px; }
  .fin-fsel-in { flex: 1 1 auto; max-width: none; }
  .fin-fsel-data .fin-fsel-in { max-width: none; }
  .fin-filtros-limpar { height: 44px; }
  .fin-filtros-cont { flex-basis: 100%; margin-left: 0; }
}

/* ═══ INFO · nota institucional no topo da página ══════════════════ */
.fin-info {
  display: flex; align-items: baseline; gap: 16px; padding: 16px 20px;
  background: rgba(139,143,232,.05); border-left: 2px solid var(--fin-info); border-radius: 0 10px 10px 0;
}
.fin-info-lab { flex: 0 0 auto; font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .14em; color: var(--fin-info); }
.fin-info p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--fin-ink-2); }
.fin-info strong { color: var(--fin-ink-1); font-weight: 600; }

/* ═══ BADGE DE ESTADO DE PROCESSO (C-21.2) ═════════════════════════
   Mono 10.5/.08em, borda 1px na cor do estado, r4, 3×8. O texto é o
   canal; a cor é redundância. */
.fin-estado {
  display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 4px; border: 1px solid var(--fin-line-btn);
  font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; color: var(--fin-ink-2);
}
.fin-estado-ok     { color: var(--fin-pos);  border-color: rgba(63,207,142,.4); }
.fin-estado-accent { color: var(--fin-accent); border-color: rgba(47,198,232,.4); }
.fin-estado-info   { color: var(--fin-info); border-color: rgba(139,143,232,.4); }
.fin-estado-warn   { color: var(--fin-warn); border-color: rgba(217,160,91,.45); }
.fin-estado-neg    { color: var(--fin-neg);  border-color: rgba(242,119,122,.45); }

/* ═══ CADEIA DE PROCEDÊNCIA (C-21.6) ═══════════════════════════════
   Nós RECESSED r10 com rótulo mono e valor, separados por → em ink-4.
   Quebra em coluna abaixo de 560px. Cada nó com destino é navegável. */
.fin-cadeia { list-style: none; margin: 0; padding: 0; display: flex; align-items: stretch; flex-wrap: wrap; gap: 14px; min-width: 0; }
.fin-cadeia-seta { align-self: center; color: var(--fin-ink-4); font-size: 14px; }
.fin-cadeia-no { flex: 0 1 auto; min-width: 150px; max-width: 100%; }
.fin-cadeia-btn {
  display: flex; flex-direction: column; gap: 6px; width: 100%; height: 100%; min-height: 44px; padding: 14px 16px;
  border: 0; border-radius: 10px; background: var(--fin-recessed); text-align: left; font: inherit; color: inherit;
}
button.fin-cadeia-btn { cursor: pointer; }
button.fin-cadeia-btn:hover { background: #15243A; }
button.fin-cadeia-btn:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-cadeia-rot { font: 500 10px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-cadeia-imp .fin-cadeia-rot { color: var(--fin-accent-text); }
.fin-cadeia-lanc .fin-cadeia-rot { color: var(--fin-pos); }
.fin-cadeia-val { font: 600 14px/1.35 var(--fin-sans); color: var(--fin-ink-1); overflow-wrap: anywhere; }
.fin-cadeia-doc .fin-cadeia-val { font: 600 13px/1.35 var(--fin-mono); }
.fin-cadeia-sub { font: 400 11px/1.3 var(--fin-mono); color: var(--fin-ink-3); overflow-wrap: anywhere; }
.pv-drawer .fin-cadeia { margin-top: 16px; }
.pv-drawer .fin-cadeia-no { min-width: 0; flex: 1 1 120px; }
@media (max-width: 560px) {
  .fin-cadeia { flex-direction: column; gap: 6px; }
  .fin-cadeia-seta { align-self: flex-start; padding-left: 16px; transform: rotate(90deg); line-height: 1; }
  .fin-cadeia-no { min-width: 0; }
}

/* ═══ DOCUMENTOS (D-FIN-2.1 §06) ═══════════════════════════════════
   Procedência, não cofre: o nome em mono é registro; "Confirmados" é o
   único número em ink-1; duplicados e ignorados são contexto. */
.fin-docs { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.fin-docs-arq { font: 600 13px/1.35 var(--fin-mono); color: var(--fin-ink-1); }
.fin-docs-foco { display: flex; flex-direction: column; gap: 16px; }
.fin-docs-foco-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.fin-docs-foco-t { margin: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: inherit; }
.fin-docs-foco-t .fin-docs-arq { overflow-wrap: anywhere; }
.fin-tab-docs { table-layout: fixed; }
.fin-tab-docs th.fin-d-origem { width: 132px; }
.fin-tab-docs th.fin-d-data   { width: 108px; }
.fin-tab-docs th.fin-d-estado { width: 176px; }
.fin-tab-docs th.fin-d-conf-c { width: 116px; }
.fin-tab-docs th.fin-d-dup    { width: 104px; }
.fin-tab-docs th.fin-d-ign    { width: 100px; }
.fin-tab-docs .fin-c-menu     { width: 44px; padding-left: 0; padding-right: 0; text-align: right; }
.fin-tab-docs .fin-d-nao      { display: none; }
.fin-tab-docs tbody tr:last-child > * { border-bottom: 0; }
.fin-tab-docs tbody tr.is-foco > * { background: var(--fin-accent-soft); }
.fin-tab-docs tbody th.fin-d-arq { font-weight: 400; min-width: 0; }
.fin-d-arq .fin-docs-arq { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-d-meta { display: block; margin-top: 3px; font-size: 12.5px; color: var(--fin-ink-3); }
.fin-d-extra { display: none; }
.fin-tab-docs td.fin-d-origem { font-size: 13.5px; color: var(--fin-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-tab-docs td.fin-d-data { font: 400 12.5px/1.3 var(--fin-mono); color: var(--fin-ink-2); white-space: nowrap; }
.fin-d-num { font-size: 14px; font-weight: 600; }
.fin-d-conf {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  font: 600 14px/1.3 var(--fin-sans); color: var(--fin-ink-1); text-decoration: underline; text-decoration-color: rgba(47,198,232,.4); text-underline-offset: 3px;
}
.fin-d-conf:hover { color: var(--fin-accent); }
.fin-d-conf:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; border-radius: 3px; }
.fin-d-warn { color: var(--fin-warn); }
.fin-d-neg  { color: var(--fin-neg); }
.fin-d-zero, .fin-d-traco { color: var(--fin-ink-3); font-weight: 400; }
.fin-d-sub { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--fin-ink-3); white-space: normal; }
.fin-docs-cards { display: none; list-style: none; margin: 0; padding: 0; }
.pc-docs-politica .pc-docs-lista { margin: 0 0 12px; }

/* 1024–1279 · duplicados e ignorados agrupam em "não importados" (§08) */
@media (max-width: 1279px) {
  .fin-tab-docs .fin-d-dup, .fin-tab-docs .fin-d-ign { display: none; }
  .fin-tab-docs .fin-d-nao { display: table-cell; width: 132px; }
  .fin-tab-docs th.fin-d-origem { width: 112px; }
  .fin-tab-docs th.fin-d-estado { width: 168px; }
}
/* 641–1023 · linha de dois níveis: arquivo e meta / estado e números */
@media (max-width: 1023px) {
  .fin-tab-docs, .fin-tab-docs tbody { display: block; width: 100%; }
  .fin-tab-docs thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fin-tab-docs tbody tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto auto 44px; column-gap: 16px; row-gap: 6px; align-items: center;
    grid-template-areas: "arq estado conf menu" "arq nao nao menu"; padding: 14px 0; border-bottom: 1px solid var(--fin-line);
  }
  .fin-tab-docs tbody tr:last-child { border-bottom: 0; }
  .fin-tab-docs tbody tr > * { padding: 0 !important; border: 0 !important; min-width: 0; }
  .fin-tab-docs .fin-d-arq { grid-area: arq; }
  .fin-tab-docs .fin-d-estado { grid-area: estado; }
  .fin-tab-docs .fin-d-conf-c { grid-area: conf; }
  .fin-tab-docs .fin-d-nao { grid-area: nao; display: block; text-align: right; }
  .fin-tab-docs .fin-c-menu { grid-area: menu; width: auto; }
  .fin-tab-docs .fin-d-origem, .fin-tab-docs .fin-d-data { display: none !important; }
  .fin-d-extra { display: block; margin-top: 3px; font-size: 12.5px; color: var(--fin-ink-3); }
  .fin-tab-docs .fin-row-menu { width: 44px; height: 44px; }
  .fin-d-conf { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: flex-end; margin: -12px 0; }
}
/* ≤640 · cartão por documento, com a cadeia em coluna (§08b) */
@media (max-width: 640px) {
  .fin-docs-panel { display: none; }
  .fin-docs-cards { display: flex; flex-direction: column; gap: 12px; }
  .fin-docs-card { display: flex; flex-direction: column; gap: 14px; padding: 16px; border-radius: var(--fin-r-card); background: var(--fin-card); }
  .fin-docs-card.is-foco { box-shadow: inset 0 0 0 1px rgba(47,198,232,.45); }
  .fin-docs-card-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
  .fin-docs-card-id { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
  .fin-docs-card-id .fin-docs-arq { overflow-wrap: anywhere; }
  .fin-docs-card .fin-row-menu { width: 44px; height: 44px; margin: -8px -8px 0 0; }
  .fin-docs-card-o { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--fin-ink-2); }
  .fin-docs-kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
  .fin-docs-kv div { display: flex; flex-direction: column; gap: 4px; }
  .fin-docs-kv dt { font: 500 10px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); }
  .fin-docs-kv dd { margin: 0; font: 600 15px/1.2 var(--fin-sans); color: var(--fin-ink-1); font-variant-numeric: tabular-nums; }
  .fin-docs-ver { align-self: stretch; justify-content: flex-start; min-height: 44px; }
  .fin-info { flex-direction: column; gap: 8px; }
}
.pc-docs-lista li { color: var(--fin-ink-2); }
.pc-docs-sim::before { color: var(--fin-pos); }
.pc-docs-nao::before { color: var(--fin-warn); }
.pc-docs-nao { color: var(--fin-ink-1); }

/* ═══ STEPPER DE PROCESSO (C-21.1) ═════════════════════════════════
   4 nós · círculo 26px · conector 1px · concluído verde com ✓, atual
   acento sólido, pendente ink-4 · rótulo mono 11/.12em. */
.fin-stepper { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0; min-width: 0; }
.fin-step { display: flex; align-items: center; gap: 10px; flex: 1 1 0; min-width: 0; }
.fin-step:last-child { flex: 0 0 auto; }
.fin-step:not(:last-child)::after { content: ""; flex: 1 1 auto; height: 1px; margin: 0 14px; background: var(--fin-line-3); min-width: 16px; }
.fin-step.is-feito:not(:last-child)::after { background: rgba(63,207,142,.45); }
.fin-step-n {
  width: 26px; height: 26px; flex: none; border-radius: 50%; border: 1.5px solid var(--fin-ink-4);
  display: inline-flex; align-items: center; justify-content: center; font: 600 11px/1 var(--fin-mono); color: var(--fin-ink-4);
}
.fin-step-rot { font: 500 11px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-4); white-space: nowrap; }
.fin-step.is-feito .fin-step-n { border-color: var(--fin-pos); color: var(--fin-pos); }
.fin-step.is-atual .fin-step-n { border-color: var(--fin-accent); background: var(--fin-accent); color: var(--fin-accent-ink); }
.fin-step.is-erro .fin-step-n { border-color: var(--fin-neg); color: var(--fin-neg); }
.fin-step.is-feito .fin-step-rot, .fin-step.is-atual .fin-step-rot, .fin-step.is-erro .fin-step-rot { color: var(--fin-ink-1); }
@media (max-width: 640px) {
  .fin-step-rot { display: none; }
  .fin-step.is-atual .fin-step-rot, .fin-step.is-erro .fin-step-rot { display: inline; }
  .fin-step:not(:last-child)::after { margin: 0 8px; }
}

/* ═══ ALERTA · WARNING (conflito que não bloqueia) ═════════════════ */
.fin-alerta {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 14px 20px;
  background: rgba(217,160,91,.06); border-left: 2px solid var(--fin-warn); border-radius: 0 10px 10px 0;
}
.fin-alerta-lab { flex: 0 0 auto; font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--fin-warn); }
.fin-alerta p { flex: 1 1 320px; margin: 0; font-size: 14px; line-height: 1.5; color: var(--fin-ink-2); }

/* ═══ IMPORT (D-FIN-2.1 §03) ═══════════════════════════════════════
   A máquina de estados, visível: cabeçalho por fase, stepper, estado
   em badge, fatos do arquivo, revisão com seleção e UMA ação primária. */
#db-imp-root { row-gap: 24px; }
#db-imp-root > .db-page-head { grid-column: 1 / -1; }
.fin-imp-estado.pc-imp-estado { padding: 0; margin: 0; background: transparent; border: 0; box-shadow: none; min-height: 0; }
.fin-imp-estado .pc-imp-est-txt { gap: 6px 12px; align-items: center; }
.fin-imp-estado .pc-imp-est-txt strong.fin-estado { font: 500 10.5px/1.2 var(--fin-mono); letter-spacing: .08em; }
.fin-imp-estado .pc-imp-est-sub { font-size: 13.5px; color: var(--fin-ink-2); }
.fin-imp-estado .pc-imp-est-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--fin-info); }

/* ── Founder QA · A5 · COMPOSIÇÃO DO UPLOAD ───────────────────────
   O `margin-left: 0` do L9 tirou a área de soltar do centro e deixou o
   bloco encostado à esquerda numa largura de 1176. O fluxo de upload
   volta a ser uma COLUNA centrada, com largura máxima própria, e o
   título, o stepper e o estado continuam alinhados à página. */
.pc-imp-drop-card {
  background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  width: 100%; max-width: 640px; margin: 8px auto 0; text-align: center;
}
.pc-imp-drop { background: var(--fin-recessed); border-color: rgba(255,255,255,.14); width: 100%; max-width: 100%; margin: 0; }
.pc-imp-drop-card .db-card-sub { margin: 0; max-width: 56ch; text-align: center; color: var(--fin-ink-3); }
.pc-imp-drop-card .pc-imp-fmts { justify-content: center; margin: 0; }
.pc-imp-drop-card .pc-imp-arquivo { width: 100%; justify-content: center; }
.pc-imp-drop-card .pc-imp-privacidade { color: var(--fin-ink-2); }
@media (max-width: 640px) { .pc-imp-drop-card { max-width: 100%; gap: 14px; } }
/* Na fase de upload o ESTADO pertence ao fluxo: ele entra na mesma
   coluna centrada, para o eixo não quebrar entre estado e dropzone. */
#db-imp-root[data-imp-estado="EMPTY"] .fin-imp-estado,
#db-imp-root[data-imp-estado="FILE_SELECTED"] .fin-imp-estado,
#db-imp-root[data-imp-estado="PARSING"] .fin-imp-estado,
#db-imp-root[data-imp-estado="FAILED"] .fin-imp-estado {
  width: 100%; max-width: 640px; margin: 0 auto; justify-content: center;
}
#db-imp-root[data-imp-estado="EMPTY"] .pc-imp-est-txt,
#db-imp-root[data-imp-estado="FILE_SELECTED"] .pc-imp-est-txt,
#db-imp-root[data-imp-estado="PARSING"] .pc-imp-est-txt,
#db-imp-root[data-imp-estado="FAILED"] .pc-imp-est-txt { justify-content: center; text-align: center; }
.pc-imp-drop:hover, .pc-imp-drop.is-over { border-color: rgba(47,198,232,.5); background: #13223A; }
.pc-imp-drop:focus-visible { outline-color: var(--fin-accent); }
.pc-imp-drop strong { font-family: var(--fin-sans); color: var(--fin-ink-1); }

/* fatos do documento */
.fin-imp-doc { display: flex; flex-direction: column; gap: 18px; }
.fin-imp-fatos { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: 20px 32px; }
.fin-imp-fato { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fin-imp-fato-l { font: 500 11px/1.2 var(--fin-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-imp-fato-v { font: 600 15px/1.35 var(--fin-sans); color: var(--fin-ink-1); overflow-wrap: anywhere; }
.fin-imp-fato-v.fin-docs-arq { font: 600 14px/1.35 var(--fin-mono); }
.fin-imp-fato-s { font-size: 12.5px; color: var(--fin-ink-3); }
@media (max-width: 767px) { .fin-imp-fatos { grid-template-columns: minmax(0, 1fr); } }

/* chips de grupo: filtro dentro do conjunto. Ficam em 44px também no
   desktop — decisão da 2G.1: é o alvo da revisão. */
.pc-imp-chip { min-height: 44px; border-radius: 22px; border-color: var(--fin-line-3); background: transparent; color: var(--fin-ink-2); font: 500 13px/1 var(--fin-sans); }
.pc-imp-chip strong { color: var(--fin-ink-1); }
.pc-imp-chip.is-ativo { border-color: rgba(47,198,232,.45); background: var(--fin-accent-soft); color: var(--fin-accent-text); }

/* revisão: a tabela financeira canônica com uma coluna de seleção */
.fin-tab-imp { table-layout: fixed; }
.fin-tab-imp th.fin-i-sel  { width: 48px; }
.fin-tab-imp th.fin-i-data { width: 108px; }
.fin-tab-imp th.fin-i-tipo { width: 150px; }
.fin-tab-imp th.fin-i-val  { width: 140px; }
.fin-tab-imp th.fin-i-sit  { width: 200px; }
.fin-tab-imp th.fin-i-acao { width: 104px; }
.fin-tab-imp tbody th.fin-i-data { font: 400 13px/1.3 var(--fin-mono); color: var(--fin-ink-2); white-space: nowrap; }
.fin-tab-imp td.fin-i-sel { padding-left: 4px; padding-right: 0; }
.fin-tab-imp .fin-op { display: flex; width: 100%; min-width: 0; padding: 4px 0; white-space: normal; text-align: center; }
.fin-op-desconhecido { border-style: dashed; }
.fin-i-desc-l1 { display: block; font: 600 13.5px/1.3 var(--fin-mono); color: var(--fin-ink-1); overflow-wrap: anywhere; }
.fin-i-desc-l2 { display: block; margin-top: 2px; font-size: 12.5px; color: var(--fin-ink-2); overflow-wrap: anywhere; }
.fin-i-desc .pc-imp-origem-rot { display: inline-block; margin-top: 4px; font: 500 10px/1.2 var(--fin-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fin-ink-3); }
.fin-i-origem { font: 400 11px/1.3 var(--fin-mono); color: var(--fin-ink-3); overflow-wrap: anywhere; }
.fin-tab-imp td.fin-i-sit { white-space: normal; }
.fin-tab-imp td.fin-i-sit .pc-selo { margin: 4px 4px 0 0; white-space: normal; max-width: 100%; line-height: 1.35; }
.fin-tab-imp td.fin-i-sit .fin-estado { white-space: normal; }
.fin-tab-imp tr.is-sel > * { background: rgba(47,198,232,.04); }
.fin-tab-imp tr.pc-imp-linha-bloq > * { color: var(--fin-ink-3); }
.fin-imp-check {
  -webkit-appearance: none; appearance: none; width: 20px; height: 20px; margin: 0; border-radius: 5px; cursor: pointer; flex: none;
  border: 1.5px solid var(--fin-ink-3); background: transparent; display: inline-grid; place-content: center; position: relative;
}
.fin-imp-check::before { content: "✓"; font: 700 12px/1 var(--fin-sans); color: var(--fin-accent-ink); transform: scale(0); }
.fin-imp-check:checked { background: var(--fin-accent); border-color: var(--fin-accent); }
.fin-imp-check:checked::before { transform: scale(1); }
.fin-imp-check:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-imp-check:disabled { opacity: .5; cursor: progress; }
/* alvo de 44px em volta da caixa de 20px */
.fin-imp-check::after { content: ""; position: absolute; inset: -12px; }
.fin-imp-sel { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 5px; }
.fin-imp-sel.is-nao { border: 1.5px dashed var(--fin-ink-4); }
.fin-imp-sel.is-feito { color: var(--fin-pos); font: 700 13px/1 var(--fin-sans); }
.pc-imp-mini { min-height: 32px; border-radius: 8px; border-color: var(--fin-line-btn); color: var(--fin-ink-2); font: 600 13px/1 var(--fin-sans); }
.pc-imp-mini:hover { color: var(--fin-ink-1); }

/* barra de ação: contagem e a frase à esquerda, UM primário à direita */
.pc-imp-rodape { background: var(--fin-panel) !important; border: 0 !important; box-shadow: none !important; }
.pc-imp-rodape-conta strong { font: 600 15px/1.3 var(--fin-sans); color: var(--fin-ink-1); }
.pc-imp-nao { font-size: 12.5px; color: var(--fin-ink-3); }
.pc-imp-rodape-acoes { gap: var(--fin-action-gap); }
.pc-imp-feito { border: 0 !important; display: flex; flex-direction: column; gap: 20px; }
.fin-imp-kpis .fin-fato-v { font-size: 24px; }
@media (max-width: 1023px) {
  .fin-tab-imp, .fin-tab-imp tbody { display: block; width: 100%; }
  .fin-tab-imp thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fin-tab-imp tbody tr {
    display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 220px); column-gap: 12px; row-gap: 6px; align-items: center;
    grid-template-areas: "sel tipo val" "sel desc sit" "sel data acao"; padding: 14px 0; border-bottom: 1px solid var(--fin-line);
  }
  .fin-tab-imp tbody tr:last-child { border-bottom: 0; }
  .fin-tab-imp tbody tr > * { padding: 0 !important; border: 0 !important; min-width: 0; background: transparent !important; }
  .fin-tab-imp tbody tr.is-sel { background: rgba(47,198,232,.05); box-shadow: inset 2px 0 0 var(--fin-accent); }
  .fin-tab-imp .fin-i-sel { grid-area: sel; align-self: start; display: flex; justify-content: center; padding-top: 12px !important; }
  .fin-tab-imp .fin-i-tipo { grid-area: tipo; justify-self: start; }
  .fin-tab-imp .fin-op { width: auto; min-width: 104px; padding: 4px 8px; }
  .fin-tab-imp .fin-i-desc { grid-area: desc; }
  .fin-tab-imp .fin-i-val { grid-area: val; }
  .fin-tab-imp .fin-i-sit { grid-area: sit; text-align: right; }
  .fin-tab-imp .fin-i-data { grid-area: data; }
  .fin-tab-imp .fin-i-acao { grid-area: acao; text-align: right; }
  .fin-tab-imp .pc-imp-mini { min-height: 44px; margin-right: 0; }
  .fin-tab-imp td.fin-i-desc { white-space: normal; }
}
@media (max-width: 640px) {
  /* 392 · a linha empilha: tipo e data / descrição / valor / situação e ação */
  .fin-tab-imp tbody tr {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    grid-template-areas: "sel tipo data" "sel desc desc" "sel val val" "sel sit acao";
  }
  .fin-tab-imp .fin-i-data { text-align: right; }
  .fin-tab-imp .fin-i-val { text-align: left; }
  .fin-tab-imp .fin-i-sit { text-align: left; }
}
@media (max-width: 640px) {
  /* 392 · o primário de 48px acima, o recuo de 44px abaixo (§08b) */
  .pc-imp-rodape-acoes { flex-direction: column-reverse; align-items: stretch; width: 100%; }
  .pc-imp-rodape-acoes .pc-imp-confirmar { min-height: 48px; }
  .fin-imp-kpis.fin-fatos { grid-template-columns: minmax(0, 1fr); }
}

/* ═══ ALVO MÍNIMO DE LINK DE TEXTO (WCAG 2.2 · 2.5.8) ═════════════
   Ticker, contador e hash são links de texto dentro de tabela densa.
   A caixa visível continua a do texto; o ALVO recebe 24px no desktop
   (44 no toque, já declarado em cada superfície) sem abrir a linha. */
.fin-tk, .pc-link-ficha, .fin-d-conf, .fin-l-orig-imp, .fin-cadeia-btn {
  min-height: 24px; display: inline-flex; align-items: center;
}
.fin-cadeia-btn { display: flex; }
.fin-ativo-l1 .fin-tk { margin: -3px 0; }

/* ═══ ALVO DE TOQUE · varredura 1440→360 ═══════════════════════════
   Abaixo de 768 todo controle tem 44px. Onde o Design pede altura
   visual menor (pílula de moeda, link de fato, comparação), o alvo
   cresce sem abrir a linha: margem negativa devolve a altura. */
@media (max-width: 767px) {
  .pv-ccy-btn, .fin-dash-kpi-top .pv-ccy-btn { min-height: 44px; }
  .fin-dash-link, .fin-kpi .fin-dash-link { min-height: 44px; margin: -6px 0; }
  .pc-gr-cmp-b { min-height: 44px; }
}

/* ═══ ESTADO DE PLANO (Founder QA · A1/A4) ════════════════════════════
   "Premium em desenvolvimento" não é ação: é estado. Mono contido, na
   cor do tier, sem preenchimento e sem cara de link. */
.fin-plano-estado {
  display: inline-flex; align-items: baseline; gap: 8px; padding: 5px 10px;
  border-radius: 6px; border: 1px solid var(--fin-line-3); background: transparent;
  font: 500 11px/1.3 var(--fin-mono); letter-spacing: .1em; color: var(--fin-ink-3);
}
.fin-plano-estado-t { font-weight: 600; letter-spacing: .14em; }
.fin-plano-estado-d { letter-spacing: .04em; text-transform: none; font-family: var(--fin-sans); font-size: 12.5px; }
.fin-plano-estado.premium { border-color: var(--fin-premium-line); background: var(--fin-premium-soft); color: var(--fin-premium); }
.fin-plano-estado.premium .fin-plano-estado-d { color: var(--fin-ink-2); }
.fin-plano-estado.pro { border-color: var(--fin-pro-line); background: var(--fin-pro-soft); color: var(--fin-pro); }
.fin-plano-estado.pro .fin-plano-estado-d { color: var(--fin-ink-2); }
.db-card-action .fin-plano-estado, .db-billing-actions .fin-plano-estado { align-self: center; }

/* Hotfix 06 §2 — CTA comercial do Free ("Desbloquear Pro"). A mesma peça
   do estado de plano, em prata e como AÇÃO: retângulo de borda fina e
   cantos discretos — nunca pílula nem botão inflado. */
.fin-plano-cta {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; padding: 0 16px; border-radius: 6px;
  border: 1px solid var(--fin-pro-line); background: var(--fin-pro-soft);
  font: 600 13px/1 var(--fin-sans); letter-spacing: .02em; color: var(--fin-pro);
  cursor: pointer; text-decoration: none;
  transition: border-color 160ms cubic-bezier(.2,.6,.3,1), background 160ms cubic-bezier(.2,.6,.3,1), color 160ms cubic-bezier(.2,.6,.3,1);
}
.fin-plano-cta:hover { border-color: rgba(199,210,221,.62); background: rgba(199,210,221,.14); color: #EEF3F8; }
.fin-plano-cta:active { background: rgba(199,210,221,.2); }
.fin-plano-cta:focus-visible { outline: 2px solid var(--fin-pro); outline-offset: 2px; }
.fin-plano-cta:disabled, .fin-plano-cta[aria-disabled="true"] {
  opacity: .45; cursor: default; background: transparent; border-color: var(--fin-line-3);
}
.db-card-action .fin-plano-cta { align-self: center; }
@media (max-width: 767px) { .fin-plano-cta { min-height: 44px; } }

/* administração da assinatura: coluna discreta ao lado do plano — o
   lugar da cobrança, sem cara de oferta */
.fin-plano-admin {
  display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
  padding: var(--fin-card-pad); border-radius: var(--fin-r-card); background: var(--fin-recessed);
}
.fin-plano-admin p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--fin-ink-3); }
.fin-plano-admin .db-ghost-action { margin-left: -12px; }

/* cartão REAL de cobrança (cliente de billing, área de Conta): a ação
   existe, então ela fica — como SECONDARY de sistema, não em cyan sólido */
#db-billing-card { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
#db-billing-portal {
  margin-top: 16px !important; min-height: 40px; padding: 0 20px !important; border-radius: var(--fin-r-btn) !important;
  border: 1px solid var(--fin-line-btn) !important; background: transparent !important;
  color: var(--fin-ink-1) !important; font: 600 14px/1 var(--fin-sans) !important;
}
#db-billing-portal:hover { background: rgba(255,255,255,.05) !important; }
#db-billing-card a[href="/pricing/"] {
  margin-top: 16px !important; min-height: 40px; display: inline-flex !important; align-items: center;
  background: var(--fin-accent) !important; color: var(--fin-accent-ink) !important; border-radius: var(--fin-r-btn) !important;
  font: 700 14px/1 var(--fin-sans) !important;
}

/* estado BETA da ferramenta que existe como demonstração (A4) */
.db-status-pill.beta { color: var(--fin-info) !important; border-color: rgba(139,143,232,.4) !important; background: rgba(139,143,232,.08) !important; }
.db-tool-beta-nota { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.5; color: var(--fin-ink-3); }

/* ═══ CARTEIRA · HIERARQUIA E REFINO (Founder QA · A6) ═════════════
   A tabela é densa por contrato, mas densidade não é aperto: a leitura
   precisa de três níveis claros (classe → ativo → meta), respiro entre
   grupos e números que se alinham pela unidade. */

/* 1 · o grupo de classe ganha ar e uma regra própria acima */
.fin-tab-cart tr.fin-grp > * { padding-top: 30px; padding-bottom: 14px; }
.fin-tab-cart tbody.fin-grp-body:first-of-type tr.fin-grp > * { padding-top: 16px; }
.fin-tab-cart tbody.fin-grp-body + tbody.fin-grp-body tr.fin-grp > * { border-top: 1px solid var(--fin-line-2); }
.fin-grp-nome { font-size: 15.5px; letter-spacing: -.01em; }
.fin-grp-n { font-size: 12.5px; color: var(--fin-ink-3); }
.fin-tab-cart tr.fin-grp td.fin-c-val { font-size: 15px; color: var(--fin-ink-1); }
.fin-tab-cart tr.fin-grp td.fin-c-part { color: var(--fin-ink-2); }
/* o selo de marcação vira etiqueta curta, não parágrafo técnico */
.fin-grp-ref {
  display: inline-flex; align-items: center; margin: 6px 0 0 18px; padding: 3px 7px;
  border: 1px solid var(--fin-line-3); border-radius: 4px;
  font: 500 10px/1.2 var(--fin-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fin-ink-3);
}

/* 2 · identidade do ativo: ticker mono forte, nome e meta subordinados */
.fin-tab-cart tbody th.fin-c-ativo { padding-top: 11px; padding-bottom: 11px; }
.fin-ativo { min-height: 44px; }
.fin-tab-cart .fin-tk, .fin-tab-cart .pc-ativo-nome.pc-link-ficha {
  text-decoration: none !important; color: var(--fin-ink-1) !important;
}
.fin-tab-cart .fin-tk:hover, .fin-tab-cart .pc-ativo-nome.pc-link-ficha:hover {
  color: var(--fin-accent) !important; text-decoration: underline !important; text-underline-offset: 3px;
}
.fin-tab-cart .fin-tk.is-tk { font: 600 13.5px/1.35 var(--fin-mono); letter-spacing: .01em; }
.fin-tab-cart .fin-tk:not(.is-tk) { font: 600 14px/1.35 var(--fin-sans); }
.fin-tab-cart .fin-ativo-meta { font-size: 12.5px; line-height: 1.45; color: var(--fin-ink-3); max-width: 46ch; }
.fin-tab-cart .fin-meta-k { color: var(--fin-ink-4); font-weight: 500; }

/* 3 · números: uma família, uma unidade, um peso por papel */
.fin-tab-cart td.fin-c-qtd, .fin-tab-cart td.fin-c-pm, .fin-tab-cart td.fin-c-preco { font-size: 13.5px; color: var(--fin-ink-2); }
.fin-tab-cart td.fin-c-val { font-size: 15px; font-weight: 600; color: var(--fin-ink-1); }
.fin-tab-cart td.fin-c-res .fin-res { font-size: 14px; }
.fin-tab-cart td.fin-c-res .fin-res-sub { font-size: 12.5px; }
.fin-tab-cart td.fin-c-res .fin-cov { display: inline-block; max-width: 22ch; white-space: normal; line-height: 1.4; }
.fin-tab-cart td.fin-c-part { font-size: 13.5px; color: var(--fin-ink-2); }

/* 4 · a fonte oficial, por extenso, fora da leitura principal */
.fin-tab-fonte {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  margin: 12px 4px 4px; font-size: 12.5px; line-height: 1.5; color: var(--fin-ink-3);
}

/* 5 · motivo da exclusão em linguagem de produto (nunca enum) */
.pc-fora { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pc-fora li { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13.5px; color: var(--fin-ink-1); }
.pc-fora-motivo { font-size: 13px; color: var(--fin-ink-3); font-family: var(--fin-sans) !important; letter-spacing: 0 !important; text-transform: none !important; }

/* ═══ ATIVOS NEGOCIADOS (Founder R3 · PARTE 4) ════════════════════
   Superfície histórica, irmã da Carteira. Reaproveita a tabela
   canônica (.pc-tab) e o painel (.db-card.fin-panel-tab): nada de
   componente novo onde o sistema já tem um. */
.fin-neg { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

/* Resumo do ACERVO — duas linhas, sem card: é legenda, não KPI. */
.fin-neg-resumo { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.fin-neg-resumo-t { margin: 0; color: var(--fin-ink-2); font: 400 13.5px/1.5 var(--fin-sans); }
.fin-neg-resumo-v { margin: 0; display: flex; gap: 14px; }
.fin-neg-soma { font: 600 14px/1 var(--fin-mono); color: var(--fin-ink-1); }
.fin-neg-soma.pa-pos { color: var(--fin-pos); }
.fin-neg-soma.pa-neg { color: var(--fin-neg); }

/* Busca: um campo, a lupa dentro, e o X só quando há termo. */
.fin-neg-busca { position: relative; display: flex; align-items: center; max-width: 520px; }
.fin-neg-lupa {
  position: absolute; left: 16px; display: flex; color: var(--fin-ink-4);
  pointer-events: none; width: 16px; height: 16px;
}
.fin-neg-lupa svg { width: 16px; height: 16px; }
.fin-neg-input {
  width: 100%; min-height: 44px; padding: 0 44px 0 42px;
  border: 1px solid var(--fin-line-btn); border-radius: 999px;
  background: var(--fin-recessed); color: var(--fin-ink-1);
  font: 400 14.5px/1 var(--fin-sans); outline: none;
}
.fin-neg-input::placeholder { color: var(--fin-ink-4); }
.fin-neg-input:focus-visible { border-color: rgba(47,198,232,.5); outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-neg-input::-webkit-search-cancel-button { display: none; }
.fin-neg-x {
  position: absolute; right: 8px; width: 32px; height: 32px; border: 0; border-radius: 50%;
  background: transparent; color: var(--fin-ink-3); font: 400 20px/1 var(--fin-sans); cursor: pointer;
}
.fin-neg-x:hover { background: rgba(255,255,255,.06); color: var(--fin-ink-1); }
.fin-neg-x:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }

/* Identidade: ticker mono, nome subordinado, metadado em ink-3.
   Mesma hierarquia da Carteira — o usuário lê a mesma coisa do mesmo
   jeito nas duas telas. */
.fin-neg-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fin-neg-tk { color: var(--fin-ink-1); font: 500 14.5px/1.3 var(--fin-sans); }
.fin-neg-tk.is-tk { font-family: var(--fin-mono); font-size: 13.5px; letter-spacing: .01em; }
.fin-neg-nome { color: var(--fin-ink-2); font: 400 13px/1.35 var(--fin-sans); }
.fin-neg-meta { color: var(--fin-ink-3); font: 400 11.5px/1.35 var(--fin-sans); }

/* Período: as duas pontas, com a contagem discreta. */
.fin-neg-per { color: var(--fin-ink-1); font: 400 13.5px/1.3 var(--fin-sans); white-space: nowrap; }
.fin-neg-seta { color: var(--fin-ink-4); }
.fin-neg-n { margin-left: 8px; color: var(--fin-ink-3); font: 500 11.5px/1 var(--fin-mono); }

/* Resultado por papel: valor em mono, percentual abaixo. */
.fin-neg-res { display: block; font: 600 14px/1.3 var(--fin-mono); color: var(--fin-ink-1); }
.fin-neg-res.pa-pos, .fin-neg-res-p.pa-pos { color: var(--fin-pos); }
.fin-neg-res.pa-neg, .fin-neg-res-p.pa-neg { color: var(--fin-neg); }
.fin-neg-res-p { display: block; font: 400 12px/1.3 var(--fin-mono); color: var(--fin-ink-3); }
/* Desconhecido NÃO é zero, e não usa a cor de resultado. */
.fin-neg-desc { color: var(--fin-ink-3); font: 400 12.5px/1.3 var(--fin-sans); font-style: normal; }

/* Selo de estado: encerrada e parcial são visualmente distintas. */
.fin-neg-selo {
  display: inline-flex; align-items: center; height: 22px; padding: 0 10px;
  border: 1px solid var(--fin-line-2); border-radius: 999px;
  font: 500 11px/1 var(--fin-sans); letter-spacing: .04em; text-transform: uppercase;
}
.fin-neg-selo.is-enc { border-color: var(--fin-line-2); color: var(--fin-ink-3); }
.fin-neg-selo.is-parc { border-color: rgba(217,160,91,.4); color: var(--fin-warn); background: rgba(217,160,91,.06); }
/* F1 §1.1 — a reconciliar: registro inconsistente, não desfecho. */
.fin-neg-selo.is-rec { border-color: rgba(242,119,122,.45); color: var(--fin-neg); background: rgba(242,119,122,.07); }

/* Expansão */
.fin-neg-acao { text-align: right; white-space: nowrap; }
.fin-neg-exp {
  display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px;
  border: 1px solid transparent; border-radius: 8px; background: transparent;
  color: var(--fin-ink-3); font: 500 12.5px/1 var(--fin-sans); cursor: pointer;
}
.fin-neg-exp:hover { color: var(--fin-ink-1); border-color: var(--fin-line-btn); }
.fin-neg-exp:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; }
.fin-neg-chev { display: inline-block; transition: transform .16s ease; font-size: 15px; }
.fin-neg-exp[aria-expanded="true"] .fin-neg-chev { transform: rotate(90deg); }
.fin-neg-exp-linha > td { padding: 0 !important; background: var(--fin-recessed); }
.fin-neg-det { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 14px; }
.fin-neg-fatos { display: flex; flex-wrap: wrap; gap: 8px 32px; margin: 0; }
.fin-neg-fato { display: flex; flex-direction: column; gap: 2px; }
.fin-neg-fato dt { color: var(--fin-ink-3); font: 400 11px/1.3 var(--fin-sans); letter-spacing: .05em; text-transform: uppercase; }
.fin-neg-fato dd { margin: 0; color: var(--fin-ink-1); font: 500 13.5px/1.3 var(--fin-mono); }
.fin-neg-nota { margin: 0; color: var(--fin-ink-3); font: 400 11.5px/1.5 var(--fin-sans); }
.fin-neg-aviso {
  margin: 0; padding: 10px 14px; border-left: 2px solid var(--fin-warn);
  border-radius: 0 8px 8px 0; background: rgba(217,160,91,.05);
  color: var(--fin-ink-2); font: 400 12.5px/1.5 var(--fin-sans);
}
.fin-neg-aviso.is-erro { border-left-color: var(--fin-neg); background: rgba(242,119,122,.05); }
.fin-neg-op { font: 500 12px/1 var(--fin-sans); }
.fin-neg-op.is-c { color: var(--fin-ink-2); }
.fin-neg-op.is-v { color: var(--fin-accent-text); }
.fin-tab-ops { table-layout: auto; }
.fin-tab-ops th, .fin-tab-ops td { padding-top: 8px; padding-bottom: 8px; font-size: 12.5px; }

/* Paginação */
.fin-neg-pag { display: flex; align-items: center; justify-content: center; gap: 16px; }
.fin-neg-pag-n { color: var(--fin-ink-3); font: 400 13px/1 var(--fin-mono); }
.fin-neg-pag-b[disabled] { opacity: .4; cursor: not-allowed; }

/* Cartões do celular */
.fin-neg-cards { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.fin-neg-card {
  padding: 16px; border: 1px solid var(--fin-line); border-radius: 12px;
  background: var(--fin-card); display: flex; flex-direction: column; gap: 12px;
}
.fin-neg-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.fin-neg-card-kv { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; margin: 0; }
.fin-neg-card-kv dt { color: var(--fin-ink-3); font: 400 10.5px/1.3 var(--fin-sans); letter-spacing: .05em; }
.fin-neg-card-kv dd { margin: 2px 0 0; color: var(--fin-ink-1); font: 500 13px/1.3 var(--fin-sans); }
.fin-neg-exp-box { border-top: 1px solid var(--fin-line); margin: 0 -16px -16px; background: var(--fin-recessed); border-radius: 0 0 12px 12px; }
.fin-neg-exp-box .fin-neg-det { padding: 14px 16px 16px; }

@media (max-width: 767px) {
  /* Alvo de toque: a varredura mediu 32px no botão de expandir, abaixo
     dos 44px do WCAG 2.5.5. No celular ele é a ÚNICA porta para as
     operações individuais — pequeno demais, o dado fica inalcançável. */
  .fin-neg-exp { min-height: 44px; width: 100%; justify-content: space-between; }
  .fin-neg-resumo { flex-direction: column; align-items: flex-start; gap: 6px; }
  .fin-neg-busca { max-width: none; }
  .fin-neg-pag { justify-content: space-between; }
  .fin-neg-fatos { gap: 8px 20px; }
}

/* ═══ BARRA DA CARTEIRA ═══════════════════════════════════════════
   Estado (esquerda) e porta para o histórico (direita). Duas
   perguntas diferentes, um só alinhamento. */
.fin-cart-barra {
  grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 8px;
}
.fin-cart-barra > .pc-estados { margin-bottom: 0; }
.fin-cart-neg { min-height: 36px; padding: 0 16px; font-size: 13px; gap: 7px; }
@media (max-width: 640px) {
  .fin-cart-barra { flex-direction: column; align-items: stretch; gap: 10px; margin-bottom: 6px; }
  .fin-cart-neg { min-height: 44px; justify-content: center; }
}

/* ═══ COBERTURA — indicador curto (Founder R3) ════════════════════
   O texto longo saiu da leitura principal. Aqui fica só quantas
   posições e a porta; a causa real mora uma camada abaixo. */
.fin-cob { grid-column: 1 / -1; }
.fin-cob-sum {
  display: flex; align-items: center; gap: 10px; padding: 12px 0;
  cursor: pointer; list-style: none; color: var(--fin-ink-2);
  font: 400 13px/1.4 var(--fin-sans);
}
.fin-cob-sum::-webkit-details-marker { display: none; }
.fin-cob-sum:focus-visible { outline: 2px solid var(--fin-accent); outline-offset: 2px; border-radius: 6px; }
.fin-cob-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--fin-warn); flex: 0 0 auto; }
.fin-cob-n { color: var(--fin-ink-2); }
.fin-cob-ver { color: var(--fin-accent-text); }
.fin-cob-ver::before { content: "· "; color: var(--fin-ink-4); }
.fin-cob[open] .fin-cob-ver { color: var(--fin-ink-3); }
.fin-cob-box {
  padding: 4px 0 16px 16px; border-left: 2px solid rgba(217,160,91,.28); margin-left: 2px;
  display: flex; flex-direction: column; gap: 10px;
}
.fin-cob-sub { margin: 0; color: var(--fin-ink-3); font: 400 12.5px/1.5 var(--fin-sans); }

/* ── F3 §5 · as duas faces de Importar ────────────────────────────
   Mesmo desenho das abas do Patrimônio, classe própria: Importar é
   superfície `fin-`, e herdar a família `pv-` seria o reuso silencioso
   que a trava da 2E-P0 existe para pegar.

   Contagem e revisão aberta vivem NA aba, porque é o número que faz
   alguém querer abrir o histórico. Nada de cartão novo para dizer o
   que cabe em dois dígitos. */
.fin-faces {
  grid-column: span 12; display: flex; gap: 2px;
  border-bottom: 1px solid var(--fin-line-1, rgba(255,255,255,.07));
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  margin-top: 6px;
}
.fin-faces::-webkit-scrollbar { display: none; }
.fin-face {
  flex: none; min-height: 44px; padding: 0 18px; border: 0; background: transparent;
  cursor: pointer; font: 600 13.5px var(--fin-sans); color: var(--fin-ink-3);
  border-bottom: 2px solid transparent; white-space: nowrap;
  display: inline-flex; align-items: center;
}
.fin-face[aria-selected="true"] { color: var(--fin-ink-1); border-bottom-color: var(--fin-accent, #4FD8EF); font-weight: 700; }
.fin-face:focus-visible { outline: 2px solid var(--fin-accent, #4FD8EF); outline-offset: -2px; }
.fin-face .fin-imp-face-n {
  margin-left: 7px; padding: 1px 7px; border-radius: 999px;
  background: rgba(255,255,255,.07); color: var(--fin-ink-3);
  font: 600 11px/1.5 'JetBrains Mono', monospace;
}
.fin-face[aria-selected="true"] .fin-imp-face-n { background: rgba(79,216,239,.14); color: #BFEFF8; }
.fin-face .fin-imp-face-pend {
  margin-left: 7px; padding: 1px 8px; border-radius: 999px;
  border: 1px solid rgba(217,160,91,.4); background: rgba(217,160,91,.08);
  color: var(--fin-warn); font: 500 11px/1.6 var(--fin-sans);
}
@media (max-width: 560px) {
  .fin-face .fin-imp-face-pend { display: none; }
}
