/* Finanças — estilo base. Paleta segura para daltonismo: azul × laranja × amarelo nas séries;
   sempre com ícone junto da cor. Nada de roxo ao lado de azul nem vermelho/verde. */

:root {
  /* tema escuro (padrão) */
  --fundo: #0e141b;
  --fundo-2: #151d27;
  --fundo-3: #1d2733;
  --borda: #2a3644;
  --texto: #e8edf2;
  --texto-2: #a9b4c0;
  --texto-3: #74818f;

  /* paleta de séries (trocada pelo app.js conforme a escolha nas Configurações) */
  --s1: #4c9be8;   /* azul */
  --s2: #f28e2b;   /* laranja */
  --s3: #f2d24b;   /* amarelo */
  --s4: #9fd0f5;   /* azul claro */
  --s5: #8f8f8f;   /* cinza neutro (R=G=B) */
  --s6: #ffffff;   /* branco */

  /* linhas de limite: estilo próprio que nenhuma série usa
     (cinza-claro neutro + traço-ponto; atenção e alerta mudam o padrão do traço) */
  --limite: #d4d4d4;

  /* situações (cor + ícone, nunca só a cor): Normal = CINZA ✓ · Informativo = BRANCO i · Atenção = AMARELO ! ·
     Alerta = VERMELHO ✕. Alta/positivo = AZUL e baixa/negativo = VERMELHO (variáveis --gama-*, do app.js). */
  --ok: var(--s5);
  --info: var(--texto);
  --atencao: var(--s3);
  --alerta: var(--gama-neg, #e5484d);
  --sem-dado: var(--texto-3);

  --raio: 10px;
  --menu-largura: 230px;
  --fonte: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --mono: "Cascadia Mono", Consolas, "Roboto Mono", monospace;
}

:root[data-tema="claro"] {
  --fundo: #f4f6f9;
  --fundo-2: #ffffff;
  --fundo-3: #eef1f5;
  --borda: #d6dce4;
  --texto: #18212b;
  --texto-2: #4a5765;
  --texto-3: #7a8693;
  --s1: #1f6fc0;
  --s2: #d26a0c;
  --s3: #b88c00;
  --s4: #5aa7e0;
  --s5: #707070;
  --s6: #18212b;
  --limite: #3a3a3a;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--fundo);
  color: var(--texto);
  font-family: var(--fonte);
  font-size: 15px;
  line-height: 1.45;
}
a { color: var(--s1); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.35rem; margin: 0 0 .25rem; }
h2 { font-size: 1.1rem; margin: 1.5rem 0 .6rem; }
h3 { font-size: 1rem; margin: 0 0 .4rem; }
.mono, .valor { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.sutil { color: var(--texto-2); }
.mini { font-size: .8rem; color: var(--texto-3); }

/* ------------------------------------------------------------------ estrutura */
.topo {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: .75rem;
  padding: .6rem 1rem;
  background: var(--fundo-2);
  border-bottom: 1px solid var(--borda);
}
.topo .marca { font-weight: 700; letter-spacing: .02em; color: var(--texto); }
.topo .marca span { color: var(--s2); }
.topo .espaco { flex: 1; }
.topo .usuario { color: var(--texto-2); font-size: .85rem; }
.botao-menu {
  display: none;
  background: none; border: 1px solid var(--borda); color: var(--texto);
  border-radius: 8px; padding: .35rem .6rem; font-size: 1rem; cursor: pointer;
}

.corpo { display: flex; min-height: calc(100vh - 50px); }
.menu {
  width: var(--menu-largura); flex-shrink: 0;
  background: var(--fundo-2);
  border-right: 1px solid var(--borda);
  padding: .75rem .5rem 2rem;
  overflow-y: auto;
  position: sticky; top: 50px; height: calc(100vh - 50px);
}
.menu .grupo { margin: .9rem .5rem .3rem; font-size: .72rem; text-transform: uppercase;
               letter-spacing: .08em; color: var(--texto-3); }
.menu a {
  display: flex; align-items: center; justify-content: space-between; gap: .4rem;
  padding: .45rem .6rem; border-radius: 8px; color: var(--texto-2);
}
.menu a:hover { background: var(--fundo-3); color: var(--texto); text-decoration: none; }
.menu a.ativa { background: var(--fundo-3); color: var(--texto); box-shadow: inset 3px 0 0 var(--s1); }
.etiqueta {
  font-size: .66rem; border: 1px solid var(--borda); border-radius: 999px;
  padding: .05rem .4rem; color: var(--texto-3); white-space: nowrap;
}
.etiqueta.v1 { border-color: var(--s1); color: var(--s1); }

/* a página ocupa a largura toda da janela (sem teto de largura); as grades se refazem sozinhas */
.conteudo { flex: 1; min-width: 0; padding: 1rem 1.25rem 3rem; }
.rodape { margin-top: 3rem; padding-top: .8rem; border-top: 1px solid var(--borda);
          font-size: .78rem; color: var(--texto-3); }

/* ------------------------------------------------------------------ menu recolhível */
.item-menu { display: inline-flex; align-items: center; gap: .55rem; min-width: 0; }
.icone-menu { display: inline-block; width: 1.2rem; text-align: center; font-size: .95rem; flex-shrink: 0; }
.recolher-menu {
  display: block; margin: 0 .3rem .2rem auto; background: none; border: 1px solid var(--borda);
  color: var(--texto-2); border-radius: 6px; padding: .1rem .5rem; cursor: pointer; font-size: .95rem;
}
.recolher-menu:hover { color: var(--texto); border-color: var(--s1); }
.menu { transition: width .2s ease; }
@media (min-width: 861px) {
  html.menu-recolhido .menu { width: 58px; padding-left: .3rem; padding-right: .3rem; }
  html.menu-recolhido .menu .grupo { font-size: 0; margin: .5rem .2rem; border-top: 1px solid var(--borda); }
  html.menu-recolhido .menu .nome-menu, html.menu-recolhido .menu .etiqueta { display: none; }
  html.menu-recolhido .menu a { justify-content: center; padding: .45rem .2rem; }
  html.menu-recolhido .recolher-menu { margin: 0 auto .2rem; }
}
@media (max-width: 860px) { .recolher-menu { display: none; } }

/* ------------------------------------------------------------------ componentes */
.grade { display: grid; gap: .9rem; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.cartao {
  background: var(--fundo-2); border: 1px solid var(--borda); border-radius: var(--raio);
  padding: .9rem 1rem;
}
.cartao .rotulo { font-size: .78rem; color: var(--texto-2); display: flex; justify-content: space-between; gap: .5rem; }
.cartao .valor { font-size: 1.6rem; margin: .2rem 0 .1rem; }
.cartao .datas { font-size: .74rem; color: var(--texto-3); }
.cartao .datas b { color: var(--texto-2); font-weight: 600; }

.info { position: relative; display: inline-block; }
.info > summary {
  list-style: none; cursor: pointer; width: 1.2rem; height: 1.2rem; line-height: 1.2rem;
  text-align: center; border-radius: 50%; border: 1px solid var(--borda);
  font-size: .72rem; color: var(--texto-2);
}
.info > summary::-webkit-details-marker { display: none; }
.info[open] > div {
  position: absolute; right: 0; top: 1.5rem; z-index: 10; width: min(320px, 80vw);
  background: var(--fundo-3); border: 1px solid var(--borda); border-radius: 8px;
  padding: .6rem .7rem; font-size: .8rem; color: var(--texto); box-shadow: 0 6px 20px rgba(0,0,0,.35);
}

.status { display: inline-flex; align-items: center; gap: .3rem; font-size: .78rem; font-weight: 600;
          border-radius: 999px; padding: .1rem .55rem; border: 1px solid currentColor; }
.status.ok { color: var(--ok); }
.status.atencao { color: var(--atencao); }
.status.alerta { color: var(--alerta); }
.status.sem-dado { color: var(--sem-dado); }
.status .ic { font-family: var(--mono); }

.metodologia {
  margin-top: 1.5rem; background: var(--fundo-2); border: 1px dashed var(--borda);
  border-radius: var(--raio); padding: .8rem 1rem; font-size: .85rem; color: var(--texto-2);
}
.metodologia h3 { color: var(--texto); }

table.tabela { width: 100%; border-collapse: collapse; font-size: .88rem; }
.tabela th, .tabela td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid var(--borda); }
.tabela th { color: var(--texto-2); font-weight: 600; font-size: .78rem; }
.tabela td.num { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
.rolagem { overflow-x: auto; }

.amostras { display: flex; flex-wrap: wrap; gap: .6rem; }
.amostra { display: flex; align-items: center; gap: .5rem; background: var(--fundo-2);
           border: 1px solid var(--borda); border-radius: 8px; padding: .4rem .7rem; font-size: .85rem; }
.amostra i { display: inline-block; width: 1.4rem; height: .9rem; border-radius: 3px; }

.botao {
  display: inline-block; background: var(--fundo-3); color: var(--texto); border: 1px solid var(--borda);
  border-radius: 8px; padding: .45rem .9rem; font-size: .88rem; cursor: pointer;
}
.botao:hover { border-color: var(--s1); text-decoration: none; }
.botao.primario { background: var(--s1); border-color: var(--s1); color: #fff; }
.botao.ativo { border-color: var(--s1); color: var(--s1); }
.botoes { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0; }

.grafico { width: 100%; height: 360px; background: var(--fundo-2); border: 1px solid var(--borda);
           border-radius: var(--raio); }
.voltar-normal { display: block; margin: 0 0 .35rem auto; font-size: .76rem; padding: .2rem .55rem; }
.grafico-componentes { height: 360px; }
.frase-cartao { margin: .1rem 0 .35rem; color: var(--texto-2); }
.aviso-ficticio { font-size: .78rem; color: var(--atencao); margin: .3rem 0; }

.construcao {
  background: var(--fundo-2); border: 1px solid var(--borda); border-radius: var(--raio);
  padding: 1.5rem; max-width: 720px;
}
.construcao .icone { font-size: 2rem; }

/* ------------------------------------------------------------------ Brasil · Níveis */
.barra-brasil { display: flex; align-items: center; gap: .6rem; margin: .8rem 0; }
.caixa-geracao { margin: .8rem 0 1rem; }
.ativo-topo { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.log { background: var(--fundo); border: 1px solid var(--borda); border-radius: 8px; padding: .6rem .7rem;
       font-family: var(--mono); font-size: .78rem; max-height: 260px; overflow: auto; white-space: pre-wrap;
       color: var(--texto-2); margin: .7rem 0 0; }
.datas-dia { color: var(--texto-2); margin: .4rem 0 .8rem; }
.caixa-avisos { background: var(--fundo-2); border: 1px solid var(--alerta); border-radius: var(--raio);
                padding: .7rem 1rem; margin: .6rem 0 1rem; }
.caixa-avisos ul { margin: .4rem 0 0 1.1rem; padding: 0; font-size: .88rem; }
.dois-ativos { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 1rem; }
.entradas { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .5rem .9rem; }
.entradas > div { display: flex; flex-direction: column; border-bottom: 1px solid var(--borda); padding-bottom: .3rem; }
.caixa-codigo { margin: .6rem 0; }
.caixa-codigo textarea { width: 100%; height: 220px; background: var(--fundo); color: var(--texto);
                         border: 1px solid var(--borda); border-radius: 8px; font-family: var(--mono); font-size: .75rem; }
.msg-copia { min-height: 1em; margin: .3rem 0 0; }
.niveis td { padding-top: .32rem; padding-bottom: .32rem; }
.marca-nivel { display: inline-block; width: .9rem; height: .25rem; border-radius: 2px; margin-right: .45rem;
               vertical-align: middle; background: var(--s5); }
.tipo-wall .marca-nivel { background: var(--s1); height: .35rem; }
.tipo-wall td:first-child { font-weight: 600; }
.tipo-mid .marca-nivel { background: var(--s5); }
.tipo-fibo .marca-nivel { background: transparent; border-top: 2px dotted var(--s5); height: 0; }
.tipo-fibo td { color: var(--texto-2); }
.tipo-flip .marca-nivel { background: var(--s3); height: .4rem; }
.tipo-flip td:first-child { color: var(--s3); font-weight: 700; }
.tipo-max-gamma .marca-nivel { background: var(--s4); height: .45rem; }
.tipo-min-gamma .marca-nivel { background: var(--s2); height: .45rem; }
@media (max-width: 860px) { .dois-ativos { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------ Open Interest */
.linha-dado { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap;
              margin: .6rem 0 1rem; font-size: .9rem; }
.oi-grade { display: grid; grid-template-columns: minmax(0, 1fr) clamp(320px, 22vw, 460px); gap: 1rem; align-items: start; }
.oi-grade > div { min-width: 0; }
.grafico-cheio { height: 600px; }   /* altura recalculada pelo JS para caber na janela (FIN.alturaNaJanela) */
.abas .botao { font-size: .85rem; }
.controles { align-items: center; }
.grupo-ctrl { display: inline-flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-right: .6rem; }
.grafico-alto { height: 520px; }
.resumo-oi .tabela td, .resumo-oi .tabela th { padding: .3rem .35rem; white-space: nowrap; font-size: .82rem; }
.resumo-oi .tabela td .mini { white-space: nowrap; }
.desligado { opacity: .35; pointer-events: none; }
.botao:disabled { cursor: not-allowed; }
.aviso-brasil { border-color: var(--atencao); }
#ctrl-marcas label { display: inline-flex; align-items: center; gap: .2rem; margin-right: .5rem; }
@media (max-width: 1100px) { .oi-grade { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .grafico-alto { height: 380px; } }

/* ------------------------------------------------------------------ Research */
.placar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .8rem 0; }
.status.info { color: var(--info); }
.status.so-icone { padding: 0 .35rem; margin-right: .3rem; }
.tabela-mac .titulo-grupo td { background: var(--fundo-3); font-weight: 700; font-size: .8rem; letter-spacing: .03em;
                               text-transform: uppercase; color: var(--texto-2); }
.tabela-mac .linha-mac[onclick] { cursor: pointer; }
.tabela-mac .linha-mac:hover td { background: var(--fundo-2); }
.tabela-mac td { vertical-align: middle; }
.spark { display: block; }
/* gráficos: todos do MESMO tamanho; colunas pela largura da janela (estreita = 1; 1920 = 2; 2560 = 3; ultrawide = 4+).
   auto-fill (e não auto-fit): um gráfico sozinho na aba fica do tamanho dos outros, sem esticar na largura toda */
/* a largura de cada gráfico é calculada pelo research.js (RES.arruma): linha incompleta divide a largura em partes
   iguais; um gráfico sozinho na linha fica do tamanho de uma coluna. Sem o JS, cai neste flex parecido. */
.grade-graficos { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; }
.grade-graficos > * { flex: 0 0 auto; width: 100%; max-width: 100%; }
@media (min-width: 1100px) { .grade-graficos > * { width: calc(50% - .5rem); } }
.grade-graficos h3 { margin: .2rem 0 .4rem; }
.caixa-graf { min-width: 0; }
.caixa-graf .botoes { margin: .3rem 0; }
.grafico.sem-dado-graf { display: flex; align-items: center; justify-content: center; }
.grafico.sem-dado-graf::after { content: attr(data-vazio); color: var(--texto-3); font-size: .85rem; padding: 1rem; text-align: center; }

/* topo das telas: título + linha fina de status na mesma linha (quebra só se não couber) */
.topo-tela { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.2rem; margin-bottom: .4rem; }
.topo-tela h1 { margin: 0; }
.topo-tela .botoes { margin: 0; }
.linha-status { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .7rem; font-size: .82rem;
                color: var(--texto-2); padding: .2rem 0; }
.linha-status .mini { font-size: .78rem; }
.linha-status .log-detalhe { flex-basis: 100%; }
.linha-status .log { max-height: 180px; margin-top: .3rem; }
.botao-fino { padding: .2rem .6rem; font-size: .8rem; }
.topo-tela .barra-brasil, .linha-status.caixa-geracao { margin: 0; }
.linha-status.linha-dado { margin: .2rem 0 .5rem; justify-content: space-between; }
.linha-status.linha-dado > div { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .6rem; }
.linha-status.aviso-brasil { border-left: 3px solid var(--atencao); padding-left: .6rem; }
.faixa-topo { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .5rem; margin: .4rem 0 .2rem; }
.faixa-item { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .5rem; background: var(--fundo-2);
              border: 1px solid var(--borda); border-radius: 8px; padding: .4rem .65rem; }
.faixa-item > .mini:first-child { flex-basis: 100%; color: var(--texto-2); }
.faixa-item b { font-family: var(--mono); font-size: 1.1rem; }
.faixa-alertas { display: flex; flex-wrap: wrap; gap: .35rem .5rem; align-items: center; margin: .2rem 0 .6rem; }
.faixa-alertas .status { font-weight: 500; }
.caixa-nota { background: var(--fundo-2); border-left: 3px solid var(--s1); border-radius: 6px; padding: .45rem .7rem;
              margin: .3rem 0 .8rem; color: var(--texto-2); }
.tabela-metodo td { vertical-align: top; }
.tabela-metodo td:first-child { min-width: 14rem; }
.metodologia .rolagem { margin-top: .4rem; }

/* ------------------------------------------------------------------ COT (cores do padrão: azul = comprado, vermelho = vendido;
   sempre com ▲/▼ e o texto, para não depender só da cor) */
.cot-pos { color: var(--gama-pos); }
.cot-neg { color: var(--gama-neg); }
.cot-pos-bg { background: var(--gama-pos) !important; }
.cot-neg-bg { background: var(--gama-neg) !important; }
.sinal-cot { display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; font-weight: 700; white-space: nowrap;
             border: 1px solid currentColor; border-radius: 999px; padding: .05rem .5rem; text-transform: uppercase; letter-spacing: .02em; }
.sinal-cot.pos { color: var(--gama-pos); }
.sinal-cot.neg { color: var(--gama-neg); }
.sinal-cot.neutro { color: var(--texto-2); }
.sinal-cot .ic { font-family: var(--mono); }
.grupo-cot { margin-bottom: .4rem; }
.grupo-cot h3 { margin: .4rem 0 .3rem; text-transform: uppercase; letter-spacing: .06em; }
.grade-cot { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); }
.cartao-cot { display: block; padding: .5rem .65rem; color: var(--texto); border-left: 3px solid var(--borda); }
.cartao-cot:hover { text-decoration: none; border-color: var(--s1); }
.cartao-cot.pos { border-left-color: var(--gama-pos); }
.cartao-cot.neg { border-left-color: var(--gama-neg); }
.cartao-cot.ativo { outline: 2px solid var(--s1); }
.cab-cot { display: flex; justify-content: space-between; align-items: center; gap: .4rem; flex-wrap: wrap; }
.nome-cot { color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topo-ativo-cot { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem; margin: 1rem 0 .3rem; }
.topo-ativo-cot h2 { margin: 0; }
.painel-cot .grupo-painel { border-top: 1px solid var(--borda); padding-top: .55rem; margin-top: .55rem; }
.score-cot { text-align: center; margin: .6rem 0; }
.score-cot .valor { font-size: 1.8rem; }
.regua { position: relative; height: 6px; border-radius: 3px; margin: .3rem .2rem .1rem;
         background: linear-gradient(90deg, var(--gama-neg), var(--fundo-3) 50%, var(--gama-pos)); }
.regua .marca { position: absolute; top: -4px; width: 4px; height: 14px; margin-left: -2px; border-radius: 2px; background: var(--texto); }
.regua-rot { display: flex; justify-content: space-between; }
.regua-ci { height: 5px; background: var(--fundo-3); border-radius: 3px; margin-top: .25rem; }
.regua-ci span { display: block; height: 100%; border-radius: 3px; background: var(--s5); }
.ls-cot { display: flex; justify-content: space-between; gap: .5rem; margin: .3rem 0; font-family: var(--mono); }
.ls-cot .dir { text-align: right; }
.barra-ls { display: flex; height: 6px; border-radius: 3px; overflow: hidden; }
.barra-ls .l { background: var(--gama-pos); }
.barra-ls .s { background: var(--gama-neg); }
.escala-cot { display: flex; align-items: center; gap: .5rem; margin-top: .4rem; }
.escala-cot i { flex: 0 1 220px; height: 8px; border-radius: 4px;
                background: linear-gradient(90deg, var(--gama-neg), var(--s5), var(--gama-pos)); }
.linha-leitura { display: block; color: var(--texto); padding: .45rem .2rem; border-bottom: 1px solid var(--borda); }
.linha-leitura:hover { text-decoration: none; background: var(--fundo-3); }
.valor-leitura { font-family: var(--mono); font-size: 1.15rem; }
.tabela-cot td, .tabela-cot th { white-space: nowrap; padding: .3rem .45rem; font-size: .8rem; }
.tabela-cot .linha-cot { cursor: pointer; }
.tabela-cot .linha-cot:hover td { background: var(--fundo-2); }
.tabela-cot .titulo-grupo td { background: var(--fundo-3); font-weight: 700; font-size: .75rem; text-transform: uppercase; color: var(--texto-2); }

/* ------------------------------------------------------------------ login */
.login-caixa {
  max-width: 360px; margin: 12vh auto 0; background: var(--fundo-2); border: 1px solid var(--borda);
  border-radius: var(--raio); padding: 1.5rem;
}
.login-caixa label { display: block; font-size: .85rem; color: var(--texto-2); margin: .8rem 0 .3rem; }
.login-caixa input {
  width: 100%; padding: .6rem .7rem; border-radius: 8px; border: 1px solid var(--borda);
  background: var(--fundo); color: var(--texto); font-size: 1rem;
}
.login-caixa button { width: 100%; margin-top: 1.2rem; padding: .65rem; font-size: 1rem; }
.erro { color: var(--alerta); font-size: .88rem; margin-top: .8rem; }

select {
  background: var(--fundo); color: var(--texto); border: 1px solid var(--borda);
  border-radius: 8px; padding: .4rem .6rem; font-size: .9rem;
}

/* ------------------------------------------------------------------ celular */
@media (max-width: 860px) {
  .botao-menu { display: inline-block; }
  .menu {
    position: fixed; top: 50px; left: 0; bottom: 0; height: auto; z-index: 30;
    transform: translateX(-100%); transition: transform .2s ease;
    width: min(82vw, 300px); box-shadow: 4px 0 20px rgba(0,0,0,.4);
  }
  body.menu-aberto .menu { transform: translateX(0); }
  .conteudo { padding: 1rem .9rem 3rem; }
  .cartao .valor { font-size: 1.4rem; }
  .grafico { height: 300px; }
  .topo .usuario { display: none; }
}

/* o atributo hidden sempre esconde (mesmo em elementos com display próprio, como .botoes) */
[hidden] { display: none !important; }

/* Manchetes */
/* lista em colunas que se refazem pela largura (1 coluna na janela estreita, 2–3 em 2560, 4+ no ultrawide) */
.lista-manchetes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 520px), 1fr)); gap: .6rem; align-items: start; }
.lista-manchetes > p { grid-column: 1 / -1; }
.manchete { padding: .65rem .8rem; }
.cab-manchete { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.texto-manchete { margin: .35rem 0; white-space: pre-wrap; word-break: break-word; line-height: 1.4; }
.etiqueta { border: 1px solid var(--borda); border-radius: 4px; padding: 0 .35rem; }
.etiqueta-botao { padding: .05rem .45rem; font-size: .78rem; }
.repostagens { margin: .3rem 0 0 .4rem; }
.botao-link { background: none; border: none; color: var(--s4); cursor: pointer; padding: 0; margin-right: .8rem; font: inherit; text-decoration: underline; }
.manchete a { color: var(--s4); }
.tabela-canais { width: 100%; table-layout: fixed; }
.tabela-canais td:first-child { width: auto; overflow-wrap: anywhere; white-space: normal; overflow: hidden; }
.tabela-canais td:nth-child(2) { width: 3.2rem; }
.tabela-canais td:nth-child(3) { width: 7.2rem; }
.tabela-canais .botao { padding: .2rem .45rem; font-size: .78rem; white-space: nowrap; }

/* Manchetes · Ao vivo: manchetes à esquerda, calendário do dia à direita; em tela estreita, o calendário vai para cima */
.grade-aovivo { display: grid; grid-template-columns: minmax(0, 1fr) clamp(420px, 32vw, 640px); gap: 1rem; align-items: start; }
.grade-aovivo > * { min-width: 0; }
@media (max-width: 1100px) { .grade-aovivo { grid-template-columns: 1fr; } .col-calendario { order: -1; } }
.col-calendario { display: flex; flex-direction: column; gap: .8rem; }
.cal-dia { padding: .7rem .8rem; }
.prox-alto { display: flex; flex-direction: column; gap: .1rem; border-left: 3px solid var(--alerta); padding: .3rem .6rem;
             background: var(--fundo-3); border-radius: 6px; }
.prox-alto b { font-size: 1.15rem; }
.tabela-cal td, .tabela-cal th { padding: .3rem .4rem; font-size: .8rem; vertical-align: top; }
.tabela-cal td:first-child { white-space: nowrap; }
.imp-cal { display: inline-block; font-size: .7rem; font-weight: 700; border: 1px solid currentColor; border-radius: 999px;
           padding: 0 .45rem; white-space: nowrap; }
.imp-alto { color: var(--alerta); }
.imp-medio { color: var(--atencao); }
.imp-baixo { color: var(--texto-3); }
.ev-cal.imp-l-alto td:first-child { box-shadow: inset 3px 0 0 var(--alerta); }
.cmp-cal { color: var(--texto-2); white-space: nowrap; }
.credito-cal { margin-top: .5rem; }
.filtros-cal .botao-fino { padding: .12rem .45rem; }
.semana-dias { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 640px), 1fr)); gap: .8rem; margin-top: .6rem; }
.dia-cal h3 { margin: 0 0 .4rem; text-transform: capitalize; }
#caixa-canais summary { cursor: pointer; }
.etiqueta-fonte { font-size: .7rem; }
.etiqueta-fonte.fonte-rss { border-color: var(--s1); color: var(--s1); }

/* Juros Globais */
.grade-bancos { grid-template-columns: repeat(5, minmax(0, 1fr)); }   /* 10 bancos = 5 + 5, sem buraco */
@media (max-width: 1250px) { .grade-bancos { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); } }
/* Títulos Públicos: Brasil e EUA lado a lado; um embaixo do outro no celular */
.grade-titulos { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); margin-bottom: .9rem; }
@media (max-width: 1000px) { .grade-titulos { grid-template-columns: minmax(0, 1fr); } }
.linha-destaque td { background: var(--fundo-destaque, rgba(41, 121, 255, .08)); }
.caixa-dif-cheia { width: 100%; margin-top: .6rem; }
.cartao-banco .valor { font-size: 1.7rem; }
.selecao-juros { padding: .5rem .8rem; margin-bottom: .6rem; }
.selecao-juros summary { cursor: pointer; }
.selecao-juros .botoes { margin: .35rem 0; }
.cartao-dif { cursor: pointer; padding: .55rem .7rem; }
.cartao-dif:hover { border-color: var(--s1); }
.cartao-dif .valor { font-size: 1.3rem; }
.grafico-dif { height: 440px; }

/* seletor de ativos (Live e Open Interest) */
.seletor-ativos { padding: .6rem .8rem; margin-bottom: .8rem; }
.seletor-ativos .botoes { margin: .3rem 0; }
.abas-ativos { align-items: center; }
.aba-ativo { font-weight: 600; }
.lista-ativos .botao { padding: .3rem .6rem; }
.lista-ativos .botao .mini { color: var(--texto-3); }
.botao.indisponivel { opacity: .55; border-style: dashed; }
.busca-ativo { display: inline-flex; gap: .3rem; margin-left: auto; }
.busca-ativo input { width: 10rem; padding: .3rem .5rem; background: var(--fundo-2); color: var(--texto);
  border: 1px solid var(--borda); border-radius: 6px; }

/* Gestão de Risco */
.bloqueio-risco { border: 3px solid var(--alerta); background: var(--fundo-2); border-radius: var(--raio); padding: .8rem 1rem;
  margin: .4rem 0 .6rem; }
.bloqueio-risco .titulo-bloqueio { font-size: 1.5rem; font-weight: 800; color: var(--alerta); letter-spacing: .02em; }
.bloqueio-risco p { margin: .35rem 0; }
.situacao-risco { margin: .4rem 0 .3rem; padding: .55rem .8rem; }
.situacao-risco.ok { border-left: 4px solid var(--ok); }
.situacao-risco.atencao { border-left: 4px solid var(--atencao); }
.aviso-profit { margin: .2rem 0 .5rem; font-size: .85rem; color: var(--texto-2); }
.aviso-profit .ic { color: var(--atencao); }
.aviso-risco { margin: .15rem 0; }
.grade-risco { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); margin: .6rem 0 1rem; }
.cartao-limite .valor { font-size: 1.45rem; }
.barra-uso { height: 10px; background: var(--fundo-3); border-radius: 5px; margin: .4rem 0 .2rem; overflow: hidden; }
.barra-uso span { display: block; height: 100%; background: var(--s1); border-radius: 5px; }
.barra-uso.perto span { background: var(--atencao); }
.barra-uso.cheia span { background: var(--alerta); }
.chips-dias { display: flex; flex-wrap: wrap; gap: 3px; margin-top: .35rem; }
.chip-dia { display: inline-block; min-width: 1.2rem; text-align: center; font-size: .72rem; border-radius: 3px;
  background: var(--fundo-3); color: var(--texto-3); }
.chip-dia.pos { color: var(--gama-pos); }
.chip-dia.neg { color: var(--gama-neg); }
.tag-proposta { border-color: var(--atencao); color: var(--atencao); font-size: .68rem; font-weight: 700; margin-left: .3rem; }
.tag-confirmado { border-color: var(--ok); color: var(--ok); font-size: .68rem; margin-left: .3rem; }
.form-risco h3 { margin: 0 0 .5rem; }
.form-risco .campos { display: grid; gap: .55rem .8rem; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); margin-bottom: .5rem; }
.form-risco .campos .largo { grid-column: span 2; }
.erros-op { border: 1px solid var(--borda); border-radius: 6px; padding: .4rem .6rem; margin: 0 0 .5rem; display: grid; gap: .25rem .8rem;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); min-width: 0; }
.erros-op label { display: flex; gap: .35rem; align-items: flex-start; }
.niveis tr.linha-agora td { border-top: 2px dashed var(--texto); border-bottom: 2px dashed var(--texto); }
.data-dado { margin: .15rem 0 .35rem; }
tr.linha-apagada td { opacity: .55; }
.cartao-edicao { border-left: 3px solid var(--borda); padding-left: .6rem; margin-top: .5rem; }
.form-risco label { display: flex; flex-direction: column; justify-content: flex-end; gap: .2rem; font-size: .8rem; color: var(--texto-2); }
.form-risco input, .form-risco select { width: 100%; min-width: 0; padding: .4rem .55rem; border-radius: 6px; border: 1px solid var(--borda);
  background: var(--fundo); color: var(--texto); font-size: .92rem; font-family: inherit; }
.form-risco input:disabled { opacity: .5; }
.campos-config { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)) !important; }
.par-pct { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .2rem .5rem; border: 1px solid var(--borda); border-radius: 8px; padding: .4rem .5rem; min-width: 0; }
.par-pct > *, .campos-config > * { min-width: 0; }
.form-risco .etiqueta { white-space: normal; }
.par-pct .nome-campo { grid-column: 1 / -1; font-size: .8rem; font-weight: 600; }
.grade-calc { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); align-items: start; }
.resultado-calc { border-top: 1px solid var(--borda); padding-top: .5rem; }
.valor-mao { font-size: 1.3rem; }
.valor-mao b { font-size: 2.2rem; }
.tabela-mao td { padding: .25rem .4rem; }
.vol-ativo { border-bottom: 1px solid var(--borda); padding: .5rem 0; }
.vol-ativo .botao { margin-top: .35rem; }
.tabela-diario td, .tabela-diario th { padding: .3rem .4rem; font-size: .8rem; white-space: nowrap; }
.tabela-diario .texto-op { white-space: normal; min-width: 10rem; max-width: 22rem; overflow-wrap: anywhere; }
.tabela-diario .acoes { white-space: nowrap; }
.tabela-contas td, .tabela-contas th { white-space: nowrap; }
@media (max-width: 560px) { .form-risco .campos .largo { grid-column: auto; } .par-pct { grid-template-columns: 1fr; } }
.tabela-conta-stop { width: 100%; margin: .3rem 0; }
.tabela-conta-stop td { padding: .2rem .4rem; font-size: .8rem; }
.comparar-intra { border-left: 3px solid var(--borda); padding-left: .5rem; margin: .4rem 0; }
/* COT: cartão numa linha só; lista da Comparar com a altura do mapa; cabeçalho fixo na Geral */
.linha-cartao-cot { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .72rem; }
#lista-leitura { overflow-y: auto; }
.rolagem-cot { max-height: calc(100vh - 140px); overflow: auto; }
.rolagem-cot thead th { position: sticky; z-index: 2; background: var(--fundo-2); }
.rolagem-cot thead tr:first-child th { top: 0; }
.rolagem-cot thead tr:nth-child(2) th { top: 1.75rem; }
.legenda-preco { margin-top: .25rem; }
/* títulos de coluna numérica alinhados com os números (todas as tabelas) */
.tabela th.num { text-align: right; }
/* Histórico do calendário: tabela compacta (sem o vão no meio) */
.tabela.tabela-hist { width: auto !important; min-width: 0; }
.tabela-hist td, .tabela-hist th { padding: .25rem .8rem; }
.texto-manchete.so-link { color: var(--texto-3); font-style: italic; }
.linha-traducao { margin: .2rem 0 .5rem; }
.linha-traducao input { width: 4.5rem; padding: .1rem .3rem; background: var(--fundo); color: var(--texto); border: 1px solid var(--borda); border-radius: 4px; }
.tag-reserva { border-color: var(--atencao); color: var(--atencao); font-size: .68rem; margin-right: .4rem; }

/* ----------------------------------------------------------------- Volatility */
.titulo-secao { font-size: 1.1rem; margin: 1rem 0 .4rem; }
.titulo-secao .mini { font-weight: 400; margin-left: .4rem; }
.grade-vol { display: grid; gap: .8rem; margin: .7rem 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 560px), 1fr)); }
.grade-vol.grade-vix { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.grade-vol > .cartao { min-width: 0; }
.grafico-vol { height: 460px; }
.grafico-estr { height: 240px; margin-top: .4rem; }
.titulo-grafico { font-size: .95rem; margin: .4rem 0; }
.tabela-vol tr.linha-vol { cursor: pointer; }
.tabela-vol tr.linha-vol:hover td, .tabela-vol tr.linha-vol.ativo td { background: var(--fundo-3, rgba(127,127,127,.12)); }
.tabela-vol td, .tabela-faixas td { vertical-align: top; }
.grade-ir { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: .4rem 0; }
.grade-ir .valor { font-size: 1.4rem; }
#cartao-vix .valor, #cartao-vxewz .valor { font-size: 1.8rem; margin: .2rem 0; }
@media (max-width: 860px) { .grafico-vol { height: 360px; } .grade-ir { grid-template-columns: 1fr 1fr; } }
.cartao-largo { margin: .7rem 0; min-width: 0; }
.aviso-topo-plataforma { border-left: 3px solid var(--atencao); padding: .4rem .7rem; margin: 0 0 .7rem; font-size: .85rem; background: var(--fundo-2); }

/* ----------------------------------------------------------------- RRG */
.grafico-rrg { height: 440px; }
.grafico-rotacao { height: 520px; }
.tabela-rrg tr.linha-vol { cursor: pointer; }
.tabela-rrg td { vertical-align: top; }
td.celula-atual { outline: 2px solid var(--texto-2); outline-offset: -2px; font-weight: 700; }
@media (max-width: 860px) { .grafico-rrg { height: 360px; } .grafico-rotacao { height: 420px; } }

/* ------------------------------------------------------------------ Briefing */
.grafico-br-pequeno { height: 240px; margin-top: .5rem; }
.texto-briefing { margin: .4rem 0; line-height: 1.45; }
.lista-plano { margin: .2rem 0 .5rem 1.1rem; padding: 0; }
.lista-plano li { margin: .15rem 0; }
#br-secoes > .cartao { min-width: 0; }
.grafico-periodo { height: 120px; margin-bottom: .2rem; }

/* ------------------------------------------------------------------ Forex */
.grafico-fx-barras { height: 300px; }
.grafico-fx-linha { height: 360px; }
.grafico-fx-par { height: 820px; }
@media (max-width: 860px) { .grafico-fx-par { height: 680px; } }

/* ------------------------------------------------------------------ Manchetes: sirene, prévia e agenda do Ao vivo */
.manchete-sirene { border-left: 4px solid var(--alerta); }
.titulo-previa { font-weight: 600; }
.descricao-previa { margin: -.2rem 0 .35rem; }
.prefixo-previa { margin-bottom: .1rem; }
.cal-periodo .controles { margin: 0 0 .3rem; }
.agenda-lista { max-height: 520px; overflow-y: auto; }
.agenda-dia { padding: .35rem 0; border-top: 1px solid var(--borda); }
.agenda-ev { font-size: .82rem; padding: .12rem 0 .12rem .4rem; border-left: 3px solid transparent; }
.agenda-ev.imp-l-alto { border-left-color: var(--alerta); }
.agenda-ev.imp-l-medio { border-left-color: var(--atencao); }
.seletor-preco .controles { margin: .3rem 0; }

/* ------------------------------------------------------------------ Integrações e Início */
.sit { font-weight: 600; white-space: nowrap; }
/* avisos compridos (ex.: "Mesma aposta: 3 sinais contra..." no Início) quebram linha em vez de alargar a página */
div.sit { white-space: normal; overflow-wrap: anywhere; }
.sit-ok { color: var(--gama-pos); }
.sit-parada { color: var(--alerta); }
.sit-atrasada { color: var(--atencao); }
.sit-cinza { color: var(--texto-3, #8a8f98); }
.tabela-integracoes tr.linha-parada td:first-child { border-left: 3px solid var(--alerta); }
.tabela-integracoes tr.linha-atrasada td:first-child { border-left: 3px solid var(--atencao); }
.aviso-fonte-parada { border-left-color: var(--alerta); }
.inicio-grade { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); margin: .6rem 0; }
.inicio-grade > .cartao { min-width: 0; }
.inicio-leitura { font-size: 1.6rem; font-weight: 700; margin: .2rem 0; }
.inicio-lista { margin: .2rem 0; padding-left: 1rem; }
.inicio-lista li { margin: .15rem 0; }
@media (max-width: 560px) { .inicio-leitura { font-size: 1.3rem; } }
.grafico-inicio-votos { height: 170px; margin-top: .4rem; }