/* Módulo BF26: painel da Black Friday CRD 2026.
   Identidade das LPs da campanha: preto dominante, dourado de destaque,
   IBM Plex Mono nos números, canto chanfrado (etiqueta de preço) no lugar de
   pílula. Tema claro e escuro só dentro de .bf26; o funil é sempre escuro. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap');

.bf26 {
  --b-bg: #f4f3f0; --b-sup: #ffffff; --b-sup-2: #faf9f6; --b-tinta: #0b0c0e; --b-tinta-2: #4a5263; --b-mudo: #6b7280;
  --b-linha: rgba(18,25,44,.12); --b-linha-2: rgba(18,25,44,.06);
  --b-ouro: #d7a94f; --b-ouro-tinta: #7a5a17; --b-ouro-fundo: #f6ecd6;
  --b-ok: #1f7a4d; --b-ok-f: #e3f3ea; --b-and: #8a5a00; --b-and-f: #fdf1d6; --b-mal: #b42318; --b-mal-f: #fde8e6; --b-info: #2f4f8a;
  --b-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --b-chanfro: 9px;
  --o-amagis: #1d4ed8; --o-ipam: #7e22ce; --o-amb: #0f766e; --o-atefesp: #c2410c; --o-amapar: #be123c;
  --o-ajufe: #475569; --o-apajufe: #0e7490; --o-asmego: #15803d; --o-varejo: #a87b23; --o-x: #6b7280;
  color: var(--b-tinta); display: grid; gap: 34px; min-width: 0;
}
.bf26[data-tema="escuro"] {
  --b-bg: #060607; --b-sup: #111214; --b-sup-2: #16171a; --b-tinta: #ecebe6; --b-tinta-2: #b3b1ab; --b-mudo: #8d8b85;
  --b-linha: rgba(236,235,230,.13); --b-linha-2: rgba(236,235,230,.06);
  --b-ouro: #d7a94f; --b-ouro-tinta: #edc77b; --b-ouro-fundo: #2a2213;
  --b-ok: #5fd39a; --b-ok-f: #0f2a1d; --b-and: #f3c35a; --b-and-f: #2d240c; --b-mal: #ff8a7a; --b-mal-f: #331614; --b-info: #8fb4ff;
  --o-amagis: #93b4ff; --o-ipam: #d8a8ff; --o-amb: #5eead4; --o-atefesp: #fdba74; --o-amapar: #fda4af;
  --o-ajufe: #cbd5e1; --o-apajufe: #67e8f9; --o-asmego: #86efac; --o-varejo: #d7a94f; --o-x: #8d8b85;
  color-scheme: dark;
}
html[data-bf-tema="escuro"] body { background: #060607; }
html[data-bf-tema="claro"] body { background: #f4f3f0; }
.bf26 *, .bf26 *::before, .bf26 *::after { box-sizing: border-box; }
.bf26 h2, .bf26 h3, .bf26 h4 { margin: 0; letter-spacing: -.03em; line-height: 1.15; color: var(--b-tinta); }
.bf26 h3 { font-size: 22px; font-weight: 700; }
.bf26 h4 { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.bf26 p { margin: 0; }
.bf26 small { font-size: 12px; color: var(--b-mudo); }
.bf26 .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.b-sec { display: grid; gap: 16px; min-width: 0; scroll-margin-top: 150px; }
.b-tit { display: grid; gap: 6px; }
.b-tit p, .b-mudo { color: var(--b-tinta-2); font-size: 13px; max-width: 80ch; }
.b-sub-tit { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.b-vazio { padding: 22px; border: 1px dashed var(--b-linha); color: var(--b-tinta-2); font-size: 14px; background: var(--b-sup-2); }
.b-ficticio { background: repeating-linear-gradient(135deg, var(--b-and-f) 0 14px, transparent 14px 28px), var(--b-sup); border: 1px solid var(--b-and); color: var(--b-tinta); padding: 12px 16px; font-size: 13px; }
.b-sem-acesso { padding: 40px 0; display: grid; gap: 12px; max-width: 60ch; }
.b-sem-acesso h2 { font-size: 34px; }

/* botões: etiqueta chanfrada, como os CTAs das LPs */
.b-btn { appearance: none; border: 1px solid var(--b-linha); background: var(--b-sup); color: var(--b-tinta); font: 700 12px/1 'Manrope', sans-serif;
  letter-spacing: .02em; padding: 11px 18px 11px 14px; cursor: pointer; min-height: 38px; display: inline-flex; align-items: center; gap: 8px;
  clip-path: polygon(0 0, calc(100% - var(--b-chanfro)) 0, 100% var(--b-chanfro), 100% 100%, 0 100%); transition: background .2s, border-color .2s, color .2s; }
.b-btn:hover { border-color: var(--b-ouro); color: var(--b-ouro-tinta); }
.b-btn:focus-visible, .bf26 select:focus-visible, .bf26 input:focus-visible, .b-fn-et:focus-visible, .b-link:focus-visible, .b-seg button:focus-visible { outline: 2px solid var(--b-ouro); outline-offset: 2px; }
.b-btn[disabled] { opacity: .55; cursor: default; }
.b-btn-ouro { background: var(--b-ouro); border-color: var(--b-ouro); color: #0b0c0e; }
.b-btn-ouro:hover { background: #edc77b; color: #0b0c0e; }
.b-btn-icone { padding: 0; width: 38px; justify-content: center; clip-path: none; }
.b-link { appearance: none; background: none; border: 0; padding: 2px 0; color: var(--b-ouro-tinta); font: 700 12px 'Manrope', sans-serif; cursor: pointer; border-bottom: 1px solid transparent; }
.b-link:hover { border-bottom-color: currentColor; }
.b-link.perigo { color: var(--b-mal); }
.b-acoes { display: inline-flex; gap: 12px; white-space: nowrap; }
.bf26 select, .bf26 input, .bf26 textarea { font: 500 14px 'Manrope', sans-serif; color: var(--b-tinta); background: var(--b-sup); border: 1px solid var(--b-linha); padding: 8px 10px; border-radius: 0; min-height: 38px; max-width: 100%; }
.bf26 select { padding-right: 28px; }

/* ------------------------------------------------------------ cabeçalho */
.b-cab { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 40px; align-items: end; }
.b-cab h2 { font-size: clamp(36px, 5vw, 60px); font-weight: 800; letter-spacing: -.05em; line-height: 1; }
.b-cab h2 em { font-style: normal; color: var(--b-ouro); }
.b-cab-sub { color: var(--b-tinta-2); font-size: 15px; margin-top: 10px !important; }
.b-cab-txt { display: grid; gap: 4px; min-width: 0; }
.b-relogio { margin-top: 18px; display: grid; gap: 8px; max-width: 620px; }
.b-relogio-trilho { position: relative; height: 8px; background: var(--b-linha); }
.b-relogio-trilho i { position: absolute; inset: 0 auto 0 0; background: var(--b-ouro); }
.b-relogio-trilho span { position: absolute; top: -4px; width: 2px; height: 16px; background: var(--b-tinta); opacity: .55; }
.b-relogio-rot { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; }
.b-relogio-rot b { font: 600 14px var(--b-mono); color: var(--b-ouro-tinta); }
.b-relogio-rot span { font-size: 12px; color: var(--b-mudo); }
.b-cab-lado { display: grid; gap: 10px; justify-items: end; text-align: right; }
.b-cab-acoes { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.b-atualizado { font: 500 12px var(--b-mono); color: var(--b-tinta-2); }
.b-fontes { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; justify-content: flex-end; font-size: 12px; color: var(--b-tinta-2); }
.b-fonte i { display: inline-block; width: 8px; height: 8px; margin-right: 6px; background: var(--b-mudo); transform: rotate(45deg); }
.b-fonte.ok i { background: var(--b-ok); } .b-fonte.erro i { background: var(--b-mal); } .b-fonte.erro { color: var(--b-mal); } .b-fonte.manual i { background: var(--b-ouro); }
.b-lps { font-size: 13px; }
.b-lps summary { cursor: pointer; color: var(--b-ouro-tinta); font-weight: 700; }
.b-lps ul { list-style: none; margin: 8px 0 0; padding: 10px 14px; display: grid; gap: 4px; background: var(--b-sup); border: 1px solid var(--b-linha); text-align: left; }
.b-lps li { display: flex; justify-content: space-between; gap: 16px; }
.b-lps a { color: var(--b-tinta); font-weight: 600; }
.b-lps li span { color: var(--b-mudo); font-size: 12px; }

/* --------------------------------------------------------------- filtros */
.b-filtros { position: sticky; top: calc(90px + var(--safe-t, 0px)); z-index: 20; display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: end;
  padding: 12px 14px; background: color-mix(in srgb, var(--b-sup) 92%, transparent); backdrop-filter: blur(10px); border: 1px solid var(--b-linha); }
.b-filtros label { display: grid; gap: 4px; min-width: 0; }
.b-filtros label > span { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--b-mudo); }
.b-filtros .b-chk { display: flex; align-items: center; gap: 8px; min-height: 38px; }
.b-filtros .b-chk span { font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--b-tinta-2); font-weight: 600; }
.b-chk input { min-height: 0; width: 16px; height: 16px; accent-color: var(--b-ouro); }
.b-limpar { appearance: none; background: none; border: 0; color: var(--b-mal); font: 700 12px 'Manrope', sans-serif; cursor: pointer; min-height: 38px; }
.b-ancoras { margin-left: auto; display: flex; gap: 2px 12px; flex-wrap: wrap; font-size: 12px; font-weight: 700; }
.b-ancoras a { color: var(--b-tinta-2); text-decoration: none; padding: 4px 0; border-bottom: 1px solid transparent; }
.b-ancoras a:hover { color: var(--b-ouro-tinta); border-bottom-color: currentColor; }

/* ---------------------------------------------------------------- placar */
.b-placar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--b-linha); border: 1px solid var(--b-linha); }
.b-tile { background: var(--b-sup); padding: 18px 18px 16px; display: grid; gap: 6px; align-content: start; min-width: 0; position: relative; }
.b-tile.grande { grid-column: span 2; grid-row: span 2; background: #0b0c0e; color: #ecebe6; }
.b-tile.grande .b-tile-rot, .b-tile.grande .b-tile-sub { color: #b3b1ab; }
.b-tile.grande .b-tile-num { font-size: clamp(56px, 8vw, 96px); color: #ffffff; }
.b-tile.ouro { background: var(--b-ouro-fundo); }
.b-tile.alerta .b-tile-num { color: var(--b-mal); }
.b-tile-rot { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--b-mudo); }
.b-tile-num { font: 600 clamp(28px, 3.2vw, 40px)/1 var(--b-mono); letter-spacing: -.03em; color: var(--b-tinta); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.b-tile-sub { font-size: 12px; color: var(--b-tinta-2); line-height: 1.45; }
.aguardando .b-tile-num { opacity: .5; }
.b-tile-num.txt { font-size: 20px; letter-spacing: -.01em; line-height: 1.2; }
.b-faisca { width: 100%; height: 34px; margin-top: 6px; }
.b-tile.grande .b-faisca { height: 80px; margin-top: auto; }
.b-faisca path { fill: none; stroke: var(--b-ouro); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.b-faisca path.area { fill: color-mix(in srgb, var(--b-ouro) 18%, transparent); stroke: none; }
.b-faisca.vazia path { stroke: var(--b-linha); stroke-dasharray: 3 4; }
.b-barra { position: relative; height: 6px; background: var(--b-linha); margin-top: 6px; }
.b-barra i { position: absolute; inset: 0 auto 0 0; background: var(--b-ouro); max-width: 100%; }
.b-barra.meta { height: 14px; }
.b-barra.meta span { position: absolute; right: 4px; top: 0; font: 600 10px/14px var(--b-mono); color: var(--b-tinta); }

/* ----------------------------------------------------------------- funil */
.b-fn { position: relative; overflow: hidden; padding: 30px 22px 22px; color: #f3f1ea; display: grid; gap: 18px;
  background: radial-gradient(110% 70% at 50% -10%, rgba(215,169,79,.28) 0%, transparent 60%), radial-gradient(80% 50% at 50% 115%, rgba(229,72,77,.18), transparent 70%), linear-gradient(180deg, #121316, #060607);
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%); }
.b-fn::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .06; background-image: radial-gradient(rgba(255,255,255,.9) 1px, transparent 1px); background-size: 3px 3px; }
.b-fn-topo { display: grid; gap: 6px; text-align: center; justify-items: center; position: relative; z-index: 1; }
.b-fn-topo h3 { color: #fff; font-size: clamp(22px, 3vw, 30px); font-weight: 800; }
.b-fn-topo p { color: #b3b1ab; font-size: 13px; max-width: 64ch; }
.b-fn-palco { display: grid; gap: 5px; max-width: 780px; width: 100%; margin: 0 auto; position: relative; z-index: 1; }
.b-fn-et { all: unset; box-sizing: border-box; position: relative; display: grid; place-items: center; min-height: 70px; cursor: pointer;
  animation: b-entra .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--i) * 70ms); --c: #d7a94f; }
.b-fn-et:nth-child(1) { --c: #8d6a22; } .b-fn-et:nth-child(2) { --c: #a17a2a; } .b-fn-et:nth-child(3) { --c: #b88b33; }
.b-fn-et:nth-child(4) { --c: #c99a3f; } .b-fn-et:nth-child(5) { --c: #d7a94f; } .b-fn-et:nth-child(6) { --c: #edc77b; }
.b-fn-et.gargalo { --c: #d9483b; }
.b-fn-banda { position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--c) 60%, #000), var(--c) 50%, color-mix(in srgb, var(--c) 60%, #000));
  clip-path: polygon(calc(50% - var(--w) / 2) 0, calc(50% + var(--w) / 2) 0, calc(50% + var(--w2) / 2) 100%, calc(50% - var(--w2) / 2) 100%); opacity: .8; transition: opacity .2s, filter .2s; }
.b-fn-et:hover .b-fn-banda { opacity: 1; filter: brightness(1.12); }
.b-fn-et.ativo .b-fn-banda { opacity: 1; filter: brightness(1.18) drop-shadow(0 0 16px var(--c)); }
.b-fn-et.gargalo .b-fn-banda { animation: b-pulsa 2.4s ease-in-out infinite; }
.b-fn-txt { position: relative; display: flex; align-items: center; gap: 14px; padding: 8px 10px; text-shadow: 0 1px 10px rgba(0,0,0,.6); color: #fff; }
.b-fn-txt b { font: 600 clamp(24px, 4vw, 36px)/1 var(--b-mono); font-variant-numeric: tabular-nums; letter-spacing: -.03em; min-width: 2ch; text-align: right; }
.b-fn-txt > span { display: grid; font: 700 14px/1.2 'Manrope', sans-serif; text-align: left; }
.b-fn-txt small { font: 500 11px/1.3 'Manrope', sans-serif; color: rgba(255,255,255,.72); }
.b-fn-conv { position: absolute; right: 0; top: -10px; font: 600 11px/1 var(--b-mono); color: #ecebe6; background: #060607; border: 1px solid rgba(215,169,79,.4); padding: 4px 7px; z-index: 2; }
.b-fn-et.gargalo .b-fn-conv { border-color: #d9483b; color: #ffb4a8; }
.b-fn-det { max-width: 780px; width: 100%; margin: 0 auto; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.04); padding: 16px 18px; position: relative; z-index: 1; }
.b-fn-det p { color: #ecebe6; font-size: 14px; line-height: 1.6; }
.b-fn-det b { color: #fff; }
.b-fn-det-grade { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 22px; align-items: end; }
.b-fn-det-grade > div:first-child { display: grid; gap: 6px; }
.b-fn-det-rot { font: 600 11px var(--b-mono); letter-spacing: .08em; text-transform: uppercase; color: #edc77b; }
.b-fn-dica { color: #b3b1ab !important; font-size: 13px !important; }
.b-fn-det-acoes { display: grid; gap: 8px; }
.b-fn-det .b-btn:not(.b-btn-ouro) { background: transparent; color: #ecebe6; border-color: rgba(255,255,255,.25); }
.b-fn-esp { text-align: center; }
.b-fn-rodape { text-align: center; font-size: 12px; color: #8d8b85; position: relative; z-index: 1; }
.b-fn-rodape i.g { display: inline-block; width: 10px; height: 10px; background: #d9483b; margin-right: 6px; vertical-align: -1px; }
@keyframes b-entra { from { opacity: 0; transform: translateY(12px) scaleX(.7); } to { opacity: 1; transform: none; } }
@keyframes b-pulsa { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.25) drop-shadow(0 0 20px #d9483b); } }

/* portas de entrada do funil */
.b-fn-portas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 780px; width: 100%; margin: 0 auto; position: relative; z-index: 1; }
.b-fn-portas.uma { grid-template-columns: minmax(0, 1fr); max-width: 520px; }
.b-fn-porta { all: unset; box-sizing: border-box; display: grid; gap: 10px; padding: 14px 16px; color: #fff; min-width: 0;
  background: linear-gradient(135deg, rgba(141,106,34,.75), rgba(91,68,20,.6)); border: 1px solid rgba(215,169,79,.35);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); transition: filter .2s; }
.b-fn-porta.b { background: linear-gradient(135deg, rgba(37,161,98,.55), rgba(15,82,52,.55)); border-color: rgba(95,211,154,.35); }
.b-fn-porta:hover, .b-fn-porta.ativo { filter: brightness(1.2); }
.b-fn-porta.ativo { outline: 2px solid #edc77b; outline-offset: 2px; }
.b-fn-porta.gargalo { background: linear-gradient(135deg, rgba(217,72,59,.75), rgba(120,30,24,.6)); border-color: #d9483b; }
.b-fn-porta:focus-visible { outline: 2px solid #ffc24d; outline-offset: 2px; }
.b-fn-porta-rot { font: 600 11px var(--b-mono); letter-spacing: .04em; color: #edc77b; }
.b-fn-porta.b .b-fn-porta-rot { color: #9ff0c4; }
.b-fn-porta-linha { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: center; }
.b-fn-porta-linha > span { display: grid; gap: 2px; min-width: 0; }
.b-fn-porta-linha b { font: 600 clamp(22px, 3vw, 30px)/1 var(--b-mono); }
.b-fn-porta-linha small { color: rgba(255,255,255,.75); font-size: 11px; line-height: 1.3; }
.b-fn-porta-linha i { font: 600 12px var(--b-mono); font-style: normal; padding: 4px 8px; background: #060607; border: 1px solid rgba(255,255,255,.2); }
.b-fn-porta-linha i:empty { display: none; }
.b-fn-soma { text-align: center; font-size: 13px; color: #b3b1ab; position: relative; z-index: 1; }
.b-fn-soma b { color: #fff; }
.b-porta { display: block; color: var(--b-ouro-tinta) !important; font-weight: 600; }

/* saúde dos números */
.b-nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 14px; }
.b-num { background: var(--b-sup); border: 1px solid var(--b-linha); border-top: 4px solid var(--b-mudo); padding: 18px; display: grid; gap: 12px; align-content: start; min-width: 0; --q: var(--b-mudo); }
.b-num.green { --q: var(--b-ok); } .b-num.yellow { --q: var(--b-and); } .b-num.red { --q: var(--b-mal); }
.b-num { border-top-color: var(--q); }
.b-num header { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.b-num header > div:first-child { display: grid; gap: 2px; }
.b-num h4 { font-size: 20px; }
.b-num-tel { font: 600 15px var(--b-mono); }
.b-num-q { display: grid; justify-items: end; gap: 2px; }
.b-num-q i { width: 14px; height: 14px; background: var(--q); transform: rotate(45deg); }
.b-num-q b { font: 600 16px var(--b-mono); color: var(--q); }
.b-num-dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; margin: 0; font-size: 13px; }
.b-num-dl dt { color: var(--b-mudo); } .b-num-dl dd { margin: 0; font-weight: 600; }
.b-num-lim { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; font-size: 13px; }
.b-num-lim .b-barra { margin: 0; height: 10px; }
.b-num-lim b { font: 600 13px var(--b-mono); }
.b-num-lim small { grid-column: 2 / -1; text-align: right; }
.b-num-hoje { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
.b-num-hoje div { border-top: 1px solid var(--b-linha-2); padding-top: 8px; display: grid; gap: 2px; }
.b-num-hoje b { font: 600 20px var(--b-mono); }
.b-num-hoje span { font-size: 11px; color: var(--b-mudo); }

/* ----------------------------------------------------------- diagnóstico */
.b-diag-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.b-diag { background: var(--b-sup); border: 1px solid var(--b-linha); border-top: 3px solid var(--b-mudo); padding: 16px 18px; display: grid; gap: 10px; align-content: start; min-width: 0; }
.b-diag.bom { border-top-color: var(--b-ok); } .b-diag.ruim { border-top-color: var(--b-mal); } .b-diag.acao { border-top-color: var(--b-ouro); }
.b-diag ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: 13px; color: var(--b-tinta-2); }
.b-diag p { font-size: 13px; color: var(--b-mudo); }
.b-diag b { color: var(--b-tinta); }

/* ----------------------------------------------------------------- leads */
.b-leads-barra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.b-drill { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; background: var(--b-ouro-fundo); padding: 6px 6px 6px 12px; border-left: 3px solid var(--b-ouro); }
.b-drill button { appearance: none; border: 0; background: none; color: var(--b-tinta); cursor: pointer; display: grid; place-items: center; width: 28px; height: 28px; }
.b-busca { margin-left: auto; }
.b-busca input { width: 300px; }
.b-tab-rolar { overflow-x: auto; border: 1px solid var(--b-linha); background: var(--b-sup); max-width: 100%; }
.b-tab { border-collapse: collapse; width: 100%; font-size: 13px; }
.b-tab th { text-align: left; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--b-mudo); padding: 10px 12px; border-bottom: 1px solid var(--b-linha); background: var(--b-sup-2); white-space: nowrap; position: sticky; top: 0; }
.b-tab td { padding: 10px 12px; border-bottom: 1px solid var(--b-linha-2); vertical-align: top; }
.b-tab td small { display: block; margin-top: 2px; }
.b-tab tr.teste td { background: repeating-linear-gradient(135deg, transparent 0 10px, var(--b-linha-2) 10px 20px); }
.b-l-nome { min-width: 150px; }
.b-l-nome b { white-space: nowrap; }
.b-l-nome .b-origem { display: block; margin-top: 6px; }
.b-tl { display: grid; grid-template-columns: 44px auto; gap: 6px; line-height: 1.6; }
.b-tl em { font: 600 10px/1.9 'Manrope', sans-serif; font-style: normal; color: var(--b-mudo); text-transform: uppercase; letter-spacing: .04em; }
.b-tl i { font-style: normal; font-family: 'Manrope', sans-serif; color: var(--b-tinta-2); }
.b-tl i.lento { color: var(--b-and); font-weight: 700; }
.b-l-al { margin-top: 6px; }
.b-l-t { font-family: var(--b-mono); font-size: 12px; white-space: nowrap; }
.b-l-t small { font-family: 'Manrope', sans-serif; }
.b-l-t .vencida, .alerta { color: var(--b-mal); font-weight: 700; }
small.lento { color: var(--b-and); font-weight: 700; }
.b-l-utm small { font-family: var(--b-mono); font-size: 11px; white-space: nowrap; }
.b-mudo { color: var(--b-mudo); }
.b-origem { font-weight: 700; color: var(--c); white-space: nowrap; }
.b-origem::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--c); margin-right: 6px; transform: rotate(45deg); vertical-align: 1px; }
.b-etapa { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 9px 3px 7px; background: var(--b-linha-2); white-space: nowrap;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%); }
.b-etapa.n3 { background: color-mix(in srgb, var(--b-ouro) 16%, transparent); }
.b-etapa.n4 { background: color-mix(in srgb, var(--b-ouro) 32%, transparent); }
.b-etapa.ganho { background: var(--b-ok-f); color: var(--b-ok); }
.b-etapa.perdido { background: var(--b-mal-f); color: var(--b-mal); }
.b-regua { display: inline-flex; gap: 3px; }
.b-regua i { font: 600 10px/20px var(--b-mono); font-style: normal; width: 24px; text-align: center; background: var(--b-linha-2); color: var(--b-mudo); border: 1px solid var(--b-linha); }
.b-regua i.feito { background: var(--b-ok-f); color: var(--b-ok); border-color: var(--b-ok); }
.b-regua i.atrasado { background: var(--b-mal); color: #fff; border-color: var(--b-mal); }
.b-regua i.perdido { background: var(--b-mal-f); color: var(--b-mal); border-color: var(--b-mal); text-decoration: line-through; }
.b-regua i.hoje { border-color: var(--b-ouro); color: var(--b-ouro-tinta); background: var(--b-ouro-fundo); }
.b-regua i.encerrado { opacity: .45; }
.b-l-al { display: flex; flex-wrap: wrap; gap: 4px; }
.b-l-al span { font-size: 11px; font-weight: 700; color: var(--b-mal); background: var(--b-mal-f); padding: 2px 7px; white-space: nowrap; }
.b-lcartoes { display: none; list-style: none; margin: 0; padding: 0; gap: 10px; }
.b-lc { background: var(--b-sup); border: 1px solid var(--b-linha); padding: 14px; display: grid; gap: 8px; min-width: 0; }
.b-lc.teste { border-style: dashed; }
.b-lc-topo { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.b-lc-topo .b-etapa { margin-left: auto; }
.b-lc-meta { font-size: 13px; color: var(--b-tinta-2); }
.b-lc dl { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 2px 10px; margin: 0; font-size: 12px; }
.b-lc dt { color: var(--b-mudo); } .b-lc dd { margin: 0; font-family: var(--b-mono); }

/* --------------------------------------------------------------- frentes */
.b-frentes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.b-frente { background: var(--b-sup); border: 1px solid var(--b-linha); border-top: 4px solid var(--c); padding: 16px; display: grid; gap: 14px; align-content: start; min-width: 0; }
.b-frente header { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.b-frente h4 { color: var(--c); font-size: 18px; }
.b-frente-marca { width: 48px; height: 48px; display: grid; place-items: center; background: #0b0c0e; overflow: hidden; clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%); }
.b-frente-marca img { max-width: 40px; max-height: 40px; object-fit: contain; }
.b-mono { font: 600 16px var(--b-mono); color: #d7a94f; }
.bf26[data-tema="escuro"] .b-frente-marca { background: #1c1d21; }
.b-ver { appearance: none; background: none; border: 1px solid var(--b-linha); color: var(--b-tinta-2); font: 700 11px 'Manrope', sans-serif; padding: 6px 10px; cursor: pointer; }
.b-ver:hover { border-color: var(--c); color: var(--c); }
.b-frente-nums { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; align-items: end; }
.b-frente-nums div { position: relative; display: grid; gap: 2px; padding: 8px 4px 6px; min-height: 66px; align-content: end; text-align: center; z-index: 0; }
.b-frente-nums i { position: absolute; left: 0; right: 0; bottom: 0; background: color-mix(in srgb, var(--c) 14%, transparent); z-index: -1; min-height: 2px; }
.b-frente-nums b { font: 600 18px/1 var(--b-mono); }
.b-frente-nums span { font-size: 11px; color: var(--b-mudo); white-space: nowrap; }
.b-frente-email { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--b-linha); border: 1px solid var(--b-linha); }
.b-frente-email div { background: var(--b-sup-2); padding: 6px 7px; display: grid; gap: 1px; min-width: 0; }
.b-frente-email span { font: 600 11px var(--b-mono); color: var(--b-tinta); }
.b-frente-email b { font-size: 11px; color: var(--b-ouro-tinta); }
.b-frente-email small { font-size: 10px; line-height: 1.3; }
.b-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--b-linha-2); }
.b-ck { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--b-linha-2); font-size: 13px; }
.b-ck > span { display: grid; min-width: 0; }
.b-ck small { font-size: 11px; line-height: 1.35; }
.b-ck i { width: 10px; height: 10px; border: 1.5px solid var(--b-mudo); transform: rotate(45deg); }
.b-ck.ok i { background: var(--b-ok); border-color: var(--b-ok); }
.b-ck.andamento i { background: var(--b-and); border-color: var(--b-and); }
.b-ck.bloqueado i { background: var(--b-mal); border-color: var(--b-mal); }
.b-ck.na i { opacity: .3; } .b-ck.na > span { opacity: .55; text-decoration: line-through; }
.b-ck select { font-size: 12px; padding: 4px 24px 4px 6px; min-height: 30px; width: 124px; }
.b-ck em { font-style: normal; font-size: 12px; color: var(--b-tinta-2); }

/* ----------------------------------------------------------- atendimento */
.b-at-duas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.b-at { background: var(--b-sup); border: 1px solid var(--b-linha); padding: 18px; display: grid; gap: 12px; min-width: 0; }
.b-at header { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.b-at header h4 { font-size: 22px; }
.b-at header span { font: 600 13px var(--b-mono); color: var(--b-ouro-tinta); }
.b-at-barra { position: relative; height: 10px; background: var(--b-linha); }
.b-at-barra i { position: absolute; inset: 0 auto 0 0; background: var(--b-ouro); }
.b-at-barra .meta { position: absolute; top: -4px; width: 2px; height: 18px; background: var(--b-tinta); }
.b-at-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0 14px; }
.b-at-grade div { border-top: 1px solid var(--b-linha-2); padding: 10px 0; display: grid; gap: 2px; align-content: start; }
.b-at-grade span { font-size: 11px; color: var(--b-mudo); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.b-at-grade b { font: 600 22px/1.1 var(--b-mono); }
.b-at-grade .alerta b { color: var(--b-mal); }
.b-aviso { font-size: 12px; color: var(--b-and); background: var(--b-and-f); padding: 8px 10px; border-left: 3px solid var(--b-and); }

/* ----------------------------------------------------------------- mídia */
.b-midia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 14px; }
.b-midia-col { background: var(--b-sup); border: 1px solid var(--b-linha); padding: 18px; display: grid; gap: 12px; align-content: start; min-width: 0; }
.b-verba, .b-fase { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; font-size: 13px; }
.b-verba .b-barra, .b-fase .b-barra { margin: 0; height: 12px; }
.b-verba b, .b-fase b { font: 600 13px var(--b-mono); text-align: right; }
.b-verba small, .b-fase small { grid-column: 2 / -1; text-align: right; }
.b-fase.atual span:first-child { color: var(--b-ouro-tinta); font-weight: 700; }
.b-fase.atual .b-barra { outline: 1px solid var(--b-ouro); outline-offset: 2px; }
.b-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--b-linha-2); }
.b-kpi { background: var(--b-sup); padding: 10px 8px 10px 0; display: grid; gap: 2px; min-width: 0; }
.b-kpi span { font-size: 11px; color: var(--b-mudo); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.b-kpi b { font: 600 20px/1.1 var(--b-mono); overflow-wrap: anywhere; }
.b-equil { display: grid; gap: 8px; padding-top: 6px; }
.b-equil-trilho { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 3px; }
.b-equil-trilho i { height: 22px; background: var(--b-linha-2); border: 1px solid var(--b-linha); clip-path: polygon(0 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 0 100%); }
.b-equil-trilho i.on { background: var(--b-ouro); border-color: var(--b-ouro); }
.b-equil p { font-size: 12px; color: var(--b-tinta-2); }
.b-cen { border-collapse: collapse; font-size: 12px; width: 100%; }
.b-cen th, .b-cen td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--b-linha-2); }
.b-cen th { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--b-mudo); }
.b-cen td:not(:first-child) { font-family: var(--b-mono); }
.b-cen tr.real td { font-weight: 700; color: var(--b-ouro-tinta); }
.b-tab-midia td { font-family: var(--b-mono); font-size: 12px; white-space: nowrap; }

/* ------------------------------------------------------------ calendário */
.b-cal { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--b-linha); }
.b-cal > li { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--b-linha-2); }
.b-cal time { display: grid; align-content: start; }
.b-cal time b { font: 600 20px/1 var(--b-mono); }
.b-cal li.chave time b { color: var(--b-ouro-tinta); }
.b-cal li.passado { opacity: .62; }
.b-cal li.hoje { background: var(--b-ouro-fundo); box-shadow: -10px 0 0 var(--b-ouro-fundo), 10px 0 0 var(--b-ouro-fundo); border-left: 3px solid var(--b-ouro); padding-left: 8px; }
.b-cal li.feriado time small { color: var(--b-mal); }
.b-cal h4 { margin-bottom: 6px; }
.b-cal-ev { display: flex; justify-content: space-between; gap: 6px 14px; flex-wrap: wrap; align-items: center; font-size: 13px; padding: 3px 0; color: var(--b-tinta-2); }
.b-cal-est { display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.b-cal-env { font-size: 12px; padding: 3px 8px; background: var(--b-linha-2); color: var(--b-tinta-2); }
.b-cal-env b { color: var(--b-tinta); }
.b-cal-env.ok { background: var(--b-ok-f); color: var(--b-ok); } .b-cal-env.and { background: var(--b-and-f); color: var(--b-and); }
.b-cal-sel { font-size: 12px !important; min-height: 30px !important; padding: 3px 24px 3px 6px !important; }
.b-cal-sel.ok { border-color: var(--b-ok) !important; color: var(--b-ok) !important; }

/* ------------------------------------------------- pendências, notas, registro */
.b-duas { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; }
.b-bloco { display: grid; gap: 12px; min-width: 0; }
.b-pd-grupo { font-size: 12px !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--b-mudo) !important; margin-top: 6px !important; }
.b-pd-grupo span { font-family: var(--b-mono); color: var(--b-tinta); }
.b-pds { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.b-pd { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto auto; gap: 8px 12px; align-items: center; background: var(--b-sup); border: 1px solid var(--b-linha); padding: 10px 12px; }
.b-pd time { display: grid; } .b-pd time b { font: 600 15px var(--b-mono); }
.b-pd > div { display: grid; gap: 2px; min-width: 0; font-size: 13px; }
.b-pd.atrasada { border-left: 3px solid var(--b-mal); } .b-pd.atrasada time b { color: var(--b-mal); }
.b-pd.bloqueada { border-left: 3px solid var(--b-and); }
.b-pd.feita { opacity: .6; } .b-pd.feita > div b { text-decoration: line-through; }
.b-pd select { font-size: 12px; min-height: 30px; padding: 3px 24px 3px 6px; }
.b-notas, .b-lanc { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.b-notas li { background: var(--b-sup); border: 1px solid var(--b-linha); border-left: 3px solid var(--b-mudo); padding: 10px 12px; display: grid; gap: 4px; }
.b-notas li.decisao { border-left-color: var(--b-ouro); }
.b-notas li > span { font-size: 11px; color: var(--b-mudo); font-weight: 700; }
.b-notas p { font-size: 13px; white-space: pre-wrap; }
.b-lanc li { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; padding: 8px 0; border-bottom: 1px solid var(--b-linha-2); }
.b-seg { display: inline-flex; border: 1px solid var(--b-linha); background: var(--b-sup); flex-wrap: wrap; }
.b-seg button { appearance: none; border: 0; background: none; padding: 8px 12px; font: 700 12px 'Manrope', sans-serif; color: var(--b-tinta-2); cursor: pointer; min-height: 34px; }
.b-seg button[aria-pressed="true"] { background: var(--b-tinta); color: var(--b-bg); }
.b-reg { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--b-linha); max-height: 640px; overflow-y: auto; }
.b-reg li { display: grid; grid-template-columns: 96px 92px minmax(0, 1fr) auto; gap: 4px 14px; padding: 9px 0; border-bottom: 1px solid var(--b-linha-2); font-size: 13px; align-items: baseline; }
.b-reg time { font: 600 12px var(--b-mono); color: var(--b-tinta-2); }
.b-reg-cat { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--b-ouro-tinta); }
.b-reg li.auto .b-reg-cat { color: var(--b-info); }
.b-reg p { color: var(--b-tinta); overflow-wrap: anywhere; }

/* ----------------------------------------------------------------- diálogo */
.b-dlg:not([open]) { display: none; }
.b-dlg[open] { display: block; border: 1px solid var(--b-linha); background: var(--b-sup); color: var(--b-tinta); padding: 0; width: min(720px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); overflow: auto; }
.b-dlg::backdrop { background: rgba(6,6,7,.62); backdrop-filter: blur(3px); }
.b-form { display: grid; gap: 16px; padding: 20px; }
.b-form header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.b-form header h3 { font-size: 19px; }
.b-seg-form { width: 100%; }
.b-seg-form button { flex: 1 1 auto; }
.b-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.b-campo { display: grid; gap: 5px; min-width: 0; }
.b-campo.largo { grid-column: 1 / -1; }
.b-campo > span { font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--b-mudo); }
.b-campo input, .b-campo select, .b-campo textarea { width: 100%; }
.b-form footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.b-form-erro { color: var(--b-mal); background: var(--b-mal-f); padding: 8px 10px; font-size: 13px; }

/* ------------------------------------------------------------- responsivo */
@media (max-width: 1100px) {
  .b-frentes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .b-midia { grid-template-columns: 1fr; }
  .b-ancoras { display: none; }
}
@media (max-width: 760px) {
  .bf26 { gap: 26px; }
  .b-cab { grid-template-columns: 1fr; }
  .b-cab-lado { justify-items: start; text-align: left; }
  .b-cab-acoes, .b-fontes { justify-content: flex-start; }
  .b-filtros { top: calc(64px + var(--safe-t, 0px)); padding: 10px; gap: 8px; }
  .b-filtros label:not(.b-chk) { flex: 1 1 140px; }
  .b-filtros select { width: 100%; }
  .b-placar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .b-tile.grande { grid-row: auto; }
  .b-tile { padding: 14px 12px; }
  .b-fn { padding: 24px 10px 16px; }
  .b-fn-et { min-height: 60px; }
  .b-fn-txt { gap: 8px; } .b-fn-txt > span { font-size: 12px; } .b-fn-txt small { display: none; }
  .b-fn-conv { top: -8px; font-size: 10px; }
  .b-fn-det-grade { grid-template-columns: 1fr; }
  .b-diag-grade, .b-at-duas, .b-frentes, .b-duas, .b-nums, .b-fn-portas { grid-template-columns: 1fr; }
  .b-num-lim { grid-template-columns: 84px minmax(0, 1fr) auto; }
  .b-tab-rolar:has(.b-tab:not(.b-tab-midia)) { display: none; }
  .b-lcartoes { display: grid; }
  .b-busca { margin-left: 0; width: 100%; } .b-busca input { width: 100%; }
  .b-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .b-reg li { grid-template-columns: 1fr auto; }
  .b-reg li p { grid-column: 1 / -1; }
  .b-pd { grid-template-columns: 56px minmax(0, 1fr); }
  .b-pd select, .b-pd .b-acoes { grid-column: 2; justify-self: start; }
  .b-campos { grid-template-columns: 1fr; }
  .b-cal > li { grid-template-columns: 58px minmax(0, 1fr); gap: 10px; }
  .b-frente-email { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .b-fn-et, .b-fn-banda { animation: none !important; } }