/* =========================================================
   Sistema Estúdio Humble — estilo base (bold editorial)
   ========================================================= */

/* ---------- Fontes ---------- */
@font-face {
  font-family: "Helvetica Neue Humble";
  src: url("../fonts/helvetica-neue-5/HelveticaNeueMedium.otf") format("opentype");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica Neue Humble";
  src: url("../fonts/helvetica-neue-5/HelveticaNeueBold.otf") format("opentype");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica Neue Humble";
  src: url("../fonts/helvetica-neue-5/HelveticaNeueHeavy.otf") format("opentype");
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica Neue Humble";
  src: url("../fonts/helvetica-neue-5/HelveticaNeueBlack.otf") format("opentype");
  font-weight: 900;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/Instrument_Sans/InstrumentSans-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  /* cores definidas na direção de arte */
  --vermelho: #F61E00;
  --branco: #FFFFFF;
  --preto: #000000;
  /* neutros de apoio */
  --superficie: #F2F2F2;
  --texto-2: #5C5C5C;
  --fio: #000000;
  --fio-leve: #DCDCDC;

  /* cores por responsável */
  --pessoa-fernanda: var(--vermelho);
  --pessoa-socio-a: var(--preto);
  --pessoa-socio-b: var(--branco);
  --pessoa-colab: var(--superficie);

  --display: "Helvetica Neue Humble", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --texto: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;

  --raio-card: 22px;
  --raio-caixa: 28px;
  --sombra-card: 0 1px 2px rgba(0, 0, 0, .06), 0 14px 30px -14px rgba(0, 0, 0, .28);
  --sombra-flutuante: 0 2px 4px rgba(0, 0, 0, .08), 0 24px 48px -16px rgba(0, 0, 0, .35);

  --margem: clamp(20px, 3.4vw, 48px);
  --largura: 1480px;

  --ease-saida: cubic-bezier(.16, 1, .3, 1);
  --ease-pulo: cubic-bezier(.34, 1.56, .64, 1);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--branco);
  color: var(--preto);
  font-family: var(--texto);
  font-size: 16px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  padding-bottom: 120px;
}
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid var(--vermelho); outline-offset: 3px; border-radius: 6px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.titulo {
  font-family: var(--display);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: -.045em;
  line-height: .86;
  margin: 0;
}

.envelope { max-width: var(--largura); margin: 0 auto; padding: 0 var(--margem); }

/* ---------- Barra superior ---------- */
.topo {
  position: sticky; top: 0; z-index: 30;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--fio-leve);
}
.topo .envelope { display: flex; align-items: center; gap: 28px; height: 76px; }
.topo__logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.topo__logo img { height: 30px; width: auto; }
.topo__nav { display: flex; gap: 6px; margin-left: 12px; }
.pilula {
  display: inline-flex; align-items: center; gap: 8px;
  height: 40px; padding: 0 18px;
  border-radius: 999px; border: 1px solid var(--preto);
  background: transparent; font-size: 14px; font-weight: 500; white-space: nowrap;
  text-decoration: none; color: inherit;
  transition: background .2s, color .2s;
}
.pilula:hover { background: var(--preto); color: var(--branco); }
.pilula--cheia { background: var(--preto); color: var(--branco); }
.pilula--leve { border-color: transparent; }
.pilula--leve:hover { background: var(--superficie); color: var(--preto); }
.topo__direita { display: flex; align-items: center; gap: 10px; position: relative; margin-left: auto; }
.topo__cadastro { margin-left: auto; display: flex; gap: 6px; padding-left: 16px; border-left: 1px solid var(--fio-leve); }
.topo__novo { position: relative; display: none; margin-left: auto; }
.pilula--cadastro { height: 36px; padding: 0 14px 0 12px; gap: 6px; font-size: 13.5px; }
.pilula--cadastro svg { color: var(--vermelho); transition: color .2s; }
.pilula--cadastro:hover { background: var(--vermelho); border-color: var(--vermelho); color: var(--branco); }
.pilula--cadastro:hover svg { color: var(--branco); }
.topo .menu-rapido--topo { bottom: auto; top: 46px; left: auto; right: 0; transform-origin: top right; transform: translateY(-8px) scale(.96); }
.topo .menu-rapido--topo.aberto { transform: none; }
.botao-icone {
  width: 40px; height: 40px; border-radius: 50%; color: var(--preto); text-decoration: none;
  border: 1px solid var(--fio-leve); background: var(--branco);
  display: grid; place-items: center;
}
.botao-icone:hover { border-color: var(--preto); }
.avatar {
  --cor: var(--pessoa-fernanda);
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--cor); color: var(--branco);
  display: grid; place-items: center;
  font-family: var(--display); font-weight: 700; font-size: 13px; letter-spacing: -.02em;
  position: relative; flex-shrink: 0;
}
.avatar--sm { width: 28px; height: 28px; font-size: 10px; }
.avatar[data-pessoa="socio-a"], .avatar[data-pessoa="geovani"] { --cor: var(--pessoa-socio-a); }
.avatar[data-pessoa="socio-b"], .avatar[data-pessoa="guilherme"] { --cor: var(--branco); color: var(--preto); box-shadow: inset 0 0 0 1px var(--preto); }
.avatar[data-pessoa="colab"] { --cor: var(--superficie); color: var(--preto); }
.avatar.em-foco::after {
  content: ""; position: absolute; inset: -5px; border-radius: 50%;
  border: 2px solid var(--vermelho);
  animation: anel 1.8s ease-in-out infinite;
}
@keyframes anel { 50% { transform: scale(1.08); opacity: .5; } }
.status-foco {
  position: absolute; right: 0; top: calc(100% + 8px); white-space: nowrap;
  font-size: 12px; color: var(--branco); background: var(--vermelho); font-weight: 600;
  padding: 3px 10px; border-radius: 999px;
  opacity: 0; transform: translateY(-4px); transition: opacity .3s, transform .3s; pointer-events: none;
}
.status-foco.ativo { opacity: 1; transform: none; }

.aviso-prototipo {
  font-size: 12px; color: var(--texto-2);
  padding: 10px 0 0;
}

/* ---------- Saudação ---------- */
.saudacao { padding-top: clamp(40px, 7vw, 104px); padding-bottom: clamp(28px, 3vw, 40px); }
.saudacao .aviso-prototipo, .saudacao__data { text-align: center; }
.saudacao__data { font-size: 15px; color: var(--texto-2); margin: 0 0 20px; }
.saudacao__titulo {
  font-size: clamp(26px, 3vw, 44px);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: .98;
  margin: 0 auto;
  text-align: center;
}
.saudacao__linha { display: block; text-wrap: balance; }
/* a máscara da animação tem folga em volta da palavra, para não cortar acentos, cedilha, vírgula e pontuação */
.palavra { display: inline-block; overflow: hidden; vertical-align: top; padding: .18em .08em .24em; margin: -.18em -.08em -.24em; }
.palavra > span { display: inline-block; transform: translateY(105%); }
.carregado .palavra > span { animation: subir .9s var(--ease-saida) forwards; animation-delay: calc(var(--i) * 70ms + 120ms); }
@keyframes subir { to { transform: none; } }

.resumo {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 48px);
  align-items: stretch;
  margin-top: clamp(32px, 4vw, 56px);
}
.caixa-vermelha {
  background: var(--vermelho); color: var(--branco);
  border-radius: var(--raio-caixa);
  padding: clamp(24px, 3vw, 40px);
  box-shadow: var(--sombra-card);
  display: flex; flex-direction: column; justify-content: space-between; gap: 28px;
  min-height: 240px;
  position: relative; overflow: hidden;
  clip-path: inset(0 100% 0 0 round var(--raio-caixa));
}
.carregado .caixa-vermelha { animation: revelar 1s var(--ease-saida) .55s forwards; }
@keyframes revelar { to { clip-path: inset(0 0 0 0 round var(--raio-caixa)); } }
.caixa-vermelha--central {
  max-width: 600px; margin: clamp(24px, 2.6vw, 36px) auto 0; min-height: 0;
  padding: clamp(22px, 2.2vw, 30px) clamp(24px, 3vw, 40px);
  text-align: center; align-items: center; gap: 10px;
  clip-path: inset(0 50% 0 50% round var(--raio-caixa));
}
.caixa-vermelha--central .caixa-vermelha__texto { max-width: 44ch; font-size: clamp(16px, 1.35vw, 19px); line-height: 1.35; }
.caixa-vermelha--central .caixa-vermelha__rotulo { font-size: 13px; }
.caixa-vermelha__rotulo { font-size: 14px; opacity: .85; margin: 0; }
.caixa-vermelha__texto {
  font-size: clamp(22px, 2.1vw, 30px); line-height: 1.18; font-weight: 500;
  letter-spacing: -.01em; margin: 0; max-width: 32ch;
}


.indicadores { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--fio); }
.indicador { padding: 18px 0 0; border-right: 1px solid var(--fio-leve); padding-right: 16px; }
.indicador + .indicador { padding-left: 18px; }
.indicador:last-child { border-right: 0; }
.indicador__numero {
  font-family: var(--display); font-weight: 900; letter-spacing: -.06em;
  font-size: clamp(64px, 7.2vw, 116px); line-height: .82; display: block;
  font-variant-numeric: tabular-nums;
}
.indicador__numero--alerta { color: var(--vermelho); }
.indicador__rotulo { display: block; margin-top: 14px; font-size: 14px; color: var(--texto-2); max-width: 16ch; }

.acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.acoes .pilula { height: 46px; padding: 0 22px; font-size: 15px; }

/* ---------- Seções ---------- */
.secao { padding-top: clamp(48px, 6vw, 88px); }
.secao__cabecalho {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  border-top: 1px solid var(--fio); padding-top: 18px; margin-bottom: 28px;
}
.secao__titulo { font-size: clamp(36px, 4.4vw, 68px); }
.secao__apoio { margin: 0; font-size: 15px; color: var(--texto-2); max-width: 46ch; }

.grade-2 { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); }
.grade-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 3vw, 48px); }

/* ---------- Meu dia ---------- */
.lista { list-style: none; margin: 0; padding: 0; }
.tarefa {
  display: grid;
  grid-template-columns: 40px 34px minmax(0, 1fr) auto;
  gap: 16px; align-items: start;
  padding: 18px 0; border-bottom: 1px solid var(--fio-leve);
  transition: opacity .4s, background .4s;
}
.tarefa:first-child { border-top: 1px solid var(--fio-leve); }
.tarefa__ordem { font-family: var(--display); font-weight: 700; font-size: 15px; padding-top: 6px; color: var(--texto-2); }
.check {
  width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--preto);
  background: var(--branco); display: grid; place-items: center; margin-top: 2px;
  transition: background .25s, transform .25s var(--ease-pulo);
}
.check svg { opacity: 0; transform: scale(.4); transition: opacity .2s, transform .3s var(--ease-pulo); }
.check:hover { background: var(--superficie); }
.tarefa.concluida .check { background: var(--preto); transform: scale(1.06); }
.tarefa.concluida .check svg { opacity: 1; transform: none; }
.tarefa.concluida .tarefa__titulo { text-decoration: line-through; text-decoration-thickness: 2px; }
.tarefa.concluida { opacity: .55; }
.tarefa__titulo { font-size: 19px; font-weight: 600; margin: 0 0 6px; letter-spacing: -.01em; }
.tarefa__cliente { font-size: 14px; color: var(--texto-2); margin: 0 0 10px; }
.tarefa__marcas { display: flex; flex-wrap: wrap; gap: 6px; }
.tarefa__direita { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.datas { display: flex; gap: 14px; font-size: 13px; }
.datas dt { color: var(--texto-2); }
.datas dd { margin: 0; font-weight: 600; }
.datas div { text-align: right; }

.etiqueta {
  display: inline-flex; align-items: center; gap: 6px;
  height: 26px; padding: 0 11px; border-radius: 999px;
  border: 1px solid var(--preto); font-size: 12.5px; font-weight: 500;
  background: var(--branco); position: relative; cursor: help;
}
.etiqueta--bloqueada {
  border-color: var(--vermelho); color: var(--vermelho);
  background: repeating-linear-gradient(135deg, rgba(246, 30, 0, .12) 0 2px, transparent 2px 7px), var(--branco);
}
.etiqueta--depende { background: var(--vermelho); border-color: var(--vermelho); color: var(--branco); }
.etiqueta--ajuste { border-style: dashed; }

.botao-foco {
  display: inline-flex; align-items: center; gap: 7px; color: var(--preto); white-space: nowrap;
  height: 34px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--preto); background: var(--branco); font-size: 13px; font-weight: 600;
  transition: background .2s, color .2s;
}
.botao-foco:hover, .botao-foco[aria-pressed="true"] { background: var(--preto); color: var(--branco); }

/* ---------- Ajuda contextual (pop-up) ---------- */
.dica {
  position: fixed; z-index: 80; max-width: 280px;
  background: var(--preto); color: var(--branco);
  border-radius: 14px; padding: 12px 14px;
  font-size: 13px; line-height: 1.4;
  box-shadow: var(--sombra-flutuante);
  pointer-events: none;
  opacity: 0; transform: translateY(6px) scale(.96); transform-origin: top left;
  transition: opacity .18s, transform .22s var(--ease-saida);
}
.dica.visivel { opacity: 1; transform: none; }
.dica strong { display: block; font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: -.02em; font-size: 14px; margin-bottom: 4px; }
.dica--vermelha { background: var(--vermelho); }

/* ---------- Listas laterais ---------- */
.bloco + .bloco { margin-top: 44px; }
.bloco__titulo { font-size: clamp(26px, 2.4vw, 36px); margin-bottom: 14px; }
.linha {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: baseline;
  padding: 13px 0; border-bottom: 1px solid var(--fio-leve);
}
.linha:first-of-type { border-top: 1px solid var(--fio); }
.linha__titulo { font-weight: 600; font-size: 15.5px; }
.linha__sub { display: block; font-size: 13px; color: var(--texto-2); font-weight: 400; margin-top: 2px; }
.linha__valor { font-size: 13px; text-align: right; white-space: nowrap; }
.linha__valor strong { display: block; font-size: 14px; }
.linha--alerta .linha__valor strong { color: var(--vermelho); }
.ponto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--vermelho); margin-right: 6px; vertical-align: 1px; }

/* ---------- Quadro da semana ---------- */
.quadro__barra { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; margin-bottom: 22px; }
.alternador { display: inline-flex; padding: 4px; border-radius: 999px; background: var(--superficie); }
.alternador button {
  border: 0; background: transparent; height: 36px; padding: 0 18px; border-radius: 999px;
  font-size: 14px; font-weight: 500; transition: background .25s, color .25s;
}
.alternador button[aria-pressed="true"] { background: var(--preto); color: var(--branco); }
.mini-indicadores { display: flex; gap: 28px; margin-left: auto; }
.mini-indicadores div { font-size: 13px; color: var(--texto-2); }
.mini-indicadores strong { display: block; font-family: var(--display); font-weight: 800; font-size: 34px; letter-spacing: -.05em; line-height: .9; color: var(--preto); }
.legenda { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: var(--texto-2); margin-bottom: 18px; }
.legenda > span { display: inline-flex; align-items: center; gap: 7px; }

.quadro { display: grid; gap: 14px; grid-template-columns: repeat(var(--colunas, 5), minmax(200px, 1fr)); overflow-x: auto; padding-bottom: 12px; }
.coluna { display: flex; flex-direction: column; gap: 12px; min-height: 320px; border-radius: var(--raio-card); padding: 4px; transition: background .2s; }
.coluna.alvo { background: var(--superficie); }
.coluna__cabecalho { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 6px 8px; border-bottom: 1px solid var(--fio); }
.coluna__nome { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.03em; font-size: 20px; }
.coluna__nome small { font-weight: 500; letter-spacing: -.01em; font-size: 15px; margin-left: 6px; }
.coluna.hoje .coluna__nome::after { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--vermelho); margin-left: 8px; vertical-align: 4px; }
.coluna__conta { font-size: 13px; color: var(--texto-2); }

.card {
  --fundo: var(--branco); --tinta: var(--preto); --segmento: var(--preto); --segmento-vazio: var(--fio-leve);
  background: var(--fundo); color: var(--tinta);
  border-radius: var(--raio-card); padding: 16px 16px 14px;
  box-shadow: var(--sombra-card);
  display: flex; flex-direction: column; gap: 12px;
  cursor: grab; user-select: none; position: relative; overflow: hidden;
  transition: transform .25s var(--ease-saida), box-shadow .25s;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--sombra-flutuante); }
.card:active { cursor: grabbing; }
.card.arrastando { opacity: .35; }
.card[data-pessoa="fernanda"] { --fundo: var(--vermelho); --tinta: var(--branco); --segmento: var(--branco); --segmento-vazio: rgba(255, 255, 255, .35); }
.card[data-pessoa="socio-a"], .card[data-pessoa="geovani"] { --fundo: var(--preto); --tinta: var(--branco); --segmento: var(--branco); --segmento-vazio: rgba(255, 255, 255, .28); }
.card[data-pessoa="socio-b"], .card[data-pessoa="guilherme"] { box-shadow: inset 0 0 0 1.5px var(--preto), var(--sombra-card); }
.card[data-pessoa="colab"] { --fundo: var(--superficie); }
.card__topo { display: flex; justify-content: space-between; gap: 8px; }
.card__titulo { font-size: 15px; font-weight: 600; line-height: 1.25; margin: 0; letter-spacing: -.005em; }
.card__cliente { font-size: 12.5px; opacity: .78; margin: 3px 0 0; }
.card__etapa { font-size: 12px; opacity: .85; }
.progresso { position: relative; height: 4px; border-radius: 999px; background: var(--segmento-vazio, var(--fio-leve)); overflow: hidden; }
.progresso > span { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--segmento, var(--preto)); transition: width .6s var(--ease-saida); }
.progresso-anima .progresso > span { animation: progresso-enche 1s var(--ease-saida) both; }
@keyframes progresso-enche { from { width: 0; } }
@media (prefers-reduced-motion: reduce) { .progresso > span { animation: none; transition: none; } }
.card__rodape { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.card__rodape .avatar { box-shadow: 0 0 0 1.5px var(--tinta); }
.card__datas { margin-left: auto; text-align: right; line-height: 1.25; }
.card__datas b { font-weight: 600; }
.card.bloqueado::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(135deg, currentColor 0 1px, transparent 1px 8px);
  opacity: .16;
}
.selo {
  display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; background: var(--branco); color: var(--vermelho);
  border: 1px solid var(--vermelho); cursor: help; white-space: nowrap; position: relative; z-index: 1;
}
.card[data-pessoa="fernanda"] .selo { border-color: var(--branco); }
.selo--ajuste { color: var(--preto); border: 1px dashed var(--preto); }
.card.liberado { animation: liberar 1.2s var(--ease-saida); }
@keyframes liberar {
  0% { transform: scale(1); }
  25% { transform: scale(1.05) rotate(-1deg); }
  60% { transform: scale(.98); }
  100% { transform: none; }
}
.espaco-livre {
  border-radius: var(--raio-card); min-height: 86px;
  border: 1px dashed #BDBDBD;
  background: repeating-linear-gradient(135deg, #E6E6E6 0 1px, transparent 1px 9px);
  display: grid; place-items: center;
  font-size: 13px; font-weight: 500; color: var(--texto-2);
  transition: border-color .2s, color .2s;
}
.espaco-livre:hover { border-color: var(--preto); color: var(--preto); }
.espaco-livre span { background: var(--branco); padding: 6px 12px; border-radius: 999px; }

/* ---------- Painel dos sócios ---------- */
.painel { background: var(--preto); color: var(--branco); border-radius: var(--raio-caixa); padding: clamp(24px, 2.6vw, 36px); box-shadow: var(--sombra-card); }
.painel .bloco__titulo { color: var(--branco); }
.painel__acesso { font-size: 13px; color: rgba(255, 255, 255, .6); margin: -6px 0 22px; }
.meta__numero { font-family: var(--display); font-weight: 900; font-size: clamp(76px, 7vw, 120px); letter-spacing: -.06em; line-height: .82; }
.meta__rotulo { font-size: 14px; color: rgba(255, 255, 255, .7); margin: 10px 0 14px; }
.meta__barra { height: 14px; border-radius: 999px; background: rgba(255, 255, 255, .16); overflow: hidden; }
.meta__barra span { display: block; height: 100%; width: 0; background: var(--vermelho); border-radius: 999px; transition: width 1.6s var(--ease-saida); }
.painel__numeros { display: grid; grid-template-columns: 1fr 1fr; margin-top: 26px; border-top: 1px solid rgba(255, 255, 255, .25); }
.painel__numeros div { padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .25); font-size: 13px; color: rgba(255, 255, 255, .7); }
.painel__numeros div:nth-child(odd) { padding-right: 12px; border-right: 1px solid rgba(255, 255, 255, .25); }
.painel__numeros div:nth-child(even) { padding-left: 14px; }
.painel__numeros strong { display: block; color: var(--branco); font-family: var(--display); font-weight: 800; font-size: 26px; letter-spacing: -.04em; }

/* ---------- Mural ---------- */
.mural__form { display: flex; gap: 8px; margin-bottom: 18px; }
.mural__form input {
  flex: 1; min-width: 0; height: 46px; border-radius: 999px; border: 1px solid var(--preto);
  padding: 0 18px; font-size: 15px; background: var(--branco);
}
.mural__form input::placeholder { color: #8A8A8A; }
.mural__lista { display: flex; flex-direction: column; gap: 10px; }
.mural__form { max-width: 720px; }
.mural__lista--grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.mural__lista--grade .vazio { grid-column: 1 / -1; max-width: 720px; }
.ideia {
  background: var(--superficie); border-radius: 18px; padding: 14px 16px; font-size: 15px;
  animation: entrarIdeia .5s var(--ease-pulo);
}
.ideia small { display: block; font-size: 12px; color: var(--texto-2); margin-top: 6px; }
@keyframes entrarIdeia { from { transform: translateY(10px) scale(.96); opacity: 0; } }
.vazio { font-size: 14px; color: var(--texto-2); border: 1px dashed #BDBDBD; border-radius: 18px; padding: 18px; }

/* ---------- Barra flutuante + pomodoro ---------- */
.barra-flutuante {
  position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 40;
  display: flex; align-items: center; gap: 6px; padding: 6px;
  background: var(--branco); border-radius: 999px; box-shadow: var(--sombra-flutuante);
  border: 1px solid var(--fio-leve);
}
.barra-flutuante .botao-icone { border-color: transparent; width: 46px; height: 46px; }
.barra-flutuante .botao-icone:hover { background: var(--superficie); }
.pomodoro {
  display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 8px 0 16px;
  border-radius: 999px; background: var(--superficie); transition: background .3s, color .3s;
}
.pomodoro.rodando { background: var(--vermelho); color: var(--branco); }
.pomodoro.pausa-curta { background: var(--preto); color: var(--branco); }
.pomodoro__tempo { font-family: var(--display); font-weight: 800; font-size: 20px; letter-spacing: -.03em; font-variant-numeric: tabular-nums; min-width: 58px; }
.pomodoro__rotulo { font-size: 12.5px; max-width: 180px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .85; }
.pomodoro button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .08); display: grid; place-items: center; color: inherit; }
.pomodoro.rodando button, .pomodoro.pausa-curta button { background: rgba(255, 255, 255, .2); }
.menu-rapido {
  position: absolute; bottom: 64px; left: 6px; background: var(--branco); border-radius: 22px;
  box-shadow: var(--sombra-flutuante); border: 1px solid var(--fio-leve); padding: 8px; width: 220px;
  display: flex; flex-direction: column;
  opacity: 0; transform: translateY(10px) scale(.96); transform-origin: bottom left; pointer-events: none;
  transition: opacity .2s, transform .3s var(--ease-saida);
}
.menu-rapido.aberto { opacity: 1; transform: none; pointer-events: auto; }
.menu-rapido button { text-align: left; border: 0; background: transparent; padding: 11px 14px; border-radius: 14px; font-size: 15px; }
.menu-rapido button:hover { background: var(--superficie); }

/* ---------- Aviso (toast) ---------- */
.aviso {
  position: fixed; left: 50%; bottom: 96px; z-index: 85;
  transform: translate(-50%, 20px); opacity: 0;
  background: var(--preto); color: var(--branco); border-radius: 999px; padding: 12px 20px;
  font-size: 14px; font-weight: 500; box-shadow: var(--sombra-flutuante);
  transition: opacity .25s, transform .35s var(--ease-saida); pointer-events: none; white-space: nowrap;
}
.aviso.visivel { opacity: 1; transform: translate(-50%, 0); }

/* ---------- Momento marcado (celebração) ---------- */
.celebracao { position: fixed; inset: 0; z-index: 90; pointer-events: none; overflow: hidden; }
.celebracao__traco { position: absolute; height: 5px; border-radius: 3px; background: var(--preto); transform-origin: left center; animation: traco .9s var(--ease-saida) forwards; }
@keyframes traco {
  0% { transform: rotate(var(--a)) translateX(0) scaleX(.1); opacity: 1; }
  100% { transform: rotate(var(--a)) translateX(var(--d)) scaleX(1); opacity: 0; }
}


/* ---------- Kanban da home ---------- */
.kanban .coluna__nome { font-size: 18px; }
.kanban .card { cursor: grab; }

/* ---------- Páginas internas ---------- */
.pagina-topo { padding-top: clamp(40px, 6vw, 88px); }
.pagina-topo__volta { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--texto-2); text-decoration: none; margin-bottom: 24px; }
.pagina-topo__volta:hover { color: var(--preto); }
.pagina-topo__titulo { font-size: clamp(48px, 8vw, 132px); font-weight: 900; letter-spacing: -.055em; line-height: .92; max-width: 12ch; margin-top: 18px; }
.pagina-topo__apoio { margin: 22px 0 0; font-size: 17px; color: var(--texto-2); max-width: 56ch; }
.pagina-topo__acesso { display: inline-block; margin-top: 18px; font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 999px; background: var(--vermelho); color: var(--branco); }

.tabela { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.tabela th { text-align: left; font-weight: 500; font-size: 13px; color: var(--texto-2); padding: 10px 12px 10px 0; border-bottom: 1px solid var(--fio); white-space: nowrap; }
.tabela td { padding: 14px 12px 14px 0; border-bottom: 1px solid var(--fio-leve); vertical-align: top; }
.tabela td strong { font-weight: 600; }
.tabela-rola { overflow-x: auto; }
.estado { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; border: 1px solid var(--preto); }
.estado--atrasado { background: var(--vermelho); border-color: var(--vermelho); color: var(--branco); }

.cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.cartao {
  border-radius: var(--raio-card); background: var(--branco); padding: 20px;
  box-shadow: inset 0 0 0 1px var(--fio-leve), var(--sombra-card);
  display: flex; flex-direction: column; gap: 10px;
  transition: transform .3s var(--ease-saida), box-shadow .3s;
}
.cartao:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px var(--preto), var(--sombra-flutuante); }
.cartao__rotulo { font-size: 13px; color: var(--texto-2); margin: 0; }
.cartao__titulo { font-size: 22px; margin: 0; }
.cartao__texto { font-size: 14px; color: var(--texto-2); margin: 0; }
.cartao__rodape { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--fio-leve); display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.cartao--vermelho { background: var(--vermelho); color: var(--branco); box-shadow: var(--sombra-card); }
.cartao--vermelho .cartao__rotulo, .cartao--vermelho .cartao__texto { color: rgba(255, 255, 255, .85); }
.cartao--vermelho .cartao__rodape { border-color: rgba(255, 255, 255, .35); }
.cartao--preto { background: var(--preto); color: var(--branco); box-shadow: var(--sombra-card); }
.cartao--preto .cartao__rotulo, .cartao--preto .cartao__texto { color: rgba(255, 255, 255, .7); }
.cartao--preto .cartao__rodape { border-color: rgba(255, 255, 255, .25); }

/* funil */
.funil { display: flex; flex-direction: column; gap: 8px; }
.funil__linha { display: grid; grid-template-columns: 170px minmax(0, 1fr) 64px; gap: 16px; align-items: center; }
.funil__nome { font-size: 15px; font-weight: 500; }
.funil__barra { height: 44px; border-radius: 12px; background: var(--superficie); overflow: hidden; }
.funil__barra span { display: block; height: 100%; width: 0; background: var(--preto); border-radius: 12px; transition: width 1.2s var(--ease-saida); }
.funil__linha:last-child .funil__barra span { background: var(--vermelho); }
.funil__qtd { font-family: var(--display); font-weight: 800; font-size: 30px; letter-spacing: -.04em; text-align: right; }
.funil__taxa { font-size: 12.5px; color: var(--texto-2); margin: -2px 0 2px 186px; }

/* ---------- Responsivo ---------- */
@media (max-width: 1340px) {
  .topo__cadastro { display: none; }
  .topo__novo { display: block; }
}
@media (max-width: 1100px) {
  .topo .envelope { flex-wrap: wrap; height: auto; padding-top: 12px; padding-bottom: 10px; row-gap: 10px; }
  .topo__nav { order: 3; width: 100%; margin-left: 0; overflow-x: auto; scrollbar-width: none; }
  .topo__nav::-webkit-scrollbar { display: none; }
  .topo__nav .pilula { height: 36px; padding: 0 14px; }
  .resumo, .grade-2 { grid-template-columns: minmax(0, 1fr); }
  .grade-3 { grid-template-columns: 1fr 1fr; }
  .grade-3 > :last-child { grid-column: 1 / -1; }
  .mini-indicadores { margin-left: 0; }
}
@media (max-width: 700px) {
  .funil__linha { grid-template-columns: 110px minmax(0, 1fr) 48px; gap: 10px; }
  .funil__qtd { font-size: 24px; }
  .funil__taxa { margin-left: 120px; }
  .topo .envelope { gap: 12px; }
  .topo__logo img { height: 24px; }
  .grade-3 { grid-template-columns: 1fr; }
  .indicadores { grid-template-columns: 1fr 1fr 1fr; }
  .indicador__rotulo { font-size: 12.5px; }
  .tarefa { grid-template-columns: 34px minmax(0, 1fr); }
  .tarefa__ordem { display: none; }
  .tarefa__direita { grid-column: 2; align-items: flex-start; }
  .datas div { text-align: left; }
  .pomodoro__rotulo { display: none; }
  .quadro { grid-template-columns: repeat(var(--colunas, 5), 78vw); }
}

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .palavra > span { transform: none; }
  .caixa-vermelha { clip-path: none; }
  .celebracao { display: none; }
}

/* ---------- Detector de lead já abordado ---------- */
.detector { display: flex; flex-wrap: wrap; gap: 8px; max-width: 920px; }
.detector input {
  flex: 1; min-width: 200px; height: 52px; border-radius: 999px; border: 1px solid var(--preto);
  padding: 0 20px; font-size: 16px; background: var(--branco);
}
.detector .pilula { height: 52px; padding: 0 26px; font-size: 15px; }
.detector__resultado { margin-top: 18px; max-width: 920px; }
.resultado { border-radius: var(--raio-card); padding: 22px 24px; display: grid; gap: 6px; animation: entrarIdeia .45s var(--ease-pulo); }
.resultado__titulo { font-size: clamp(26px, 2.6vw, 36px); }
.resultado p { margin: 0; font-size: 15px; }
.resultado--abordado { background: var(--vermelho); color: var(--branco); box-shadow: var(--sombra-card); }
.resultado--parecido { background: var(--preto); color: var(--branco); box-shadow: var(--sombra-card); }
.resultado--novo { background: var(--superficie); }

/* ---------- Fluxos ---------- */
.fluxo { display: grid; grid-template-columns: 240px minmax(0, 1fr) auto; gap: 20px; align-items: start; padding: 18px 0; border-bottom: 1px solid var(--fio-leve); }
.fluxo:first-child { border-top: 1px solid var(--fio); }
.fluxo__nome { font-size: 22px; }
.fluxo__etapas { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; counter-reset: etapa; }
.fluxo__etapas li { counter-increment: etapa; }
.fluxo__etapas .etiqueta::before { content: counter(etapa); font-family: var(--display); font-weight: 700; font-size: 11px; color: var(--texto-2); margin-right: 2px; }
.cartao .avatares { display: flex; }
.cartao .avatares .avatar { margin-left: -6px; box-shadow: 0 0 0 2px var(--branco); }
.cartao .avatares .avatar:first-child { margin-left: 0; }
.cartao .progresso { --segmento: var(--preto); --segmento-vazio: var(--fio-leve); }
.cartao--vermelho .progresso { --segmento: var(--branco); --segmento-vazio: rgba(255, 255, 255, .35); }
.cartao--vermelho .avatares .avatar { box-shadow: 0 0 0 2px var(--vermelho); }
@media (max-width: 800px) {
  .fluxo { grid-template-columns: 1fr; gap: 12px; }
}

/* ---------- Calendário do mês ---------- */
.alternador[hidden], .mini-indicadores[hidden], .quadro[hidden], .mes[hidden] { display: none; }
.mes__cabecalho, .mes__grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.mes__cabecalho { border-bottom: 1px solid var(--fio); }
.mes__cabecalho span { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.03em; font-size: 18px; padding: 6px 8px 8px; }
.mes__grade { border-left: 1px solid var(--fio-leve); }
.mes__dia { min-height: 124px; padding: 8px; border-right: 1px solid var(--fio-leve); border-bottom: 1px solid var(--fio-leve); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mes__dia--fds { background: #FAFAFA; }
.mes__dia--fora { background: repeating-linear-gradient(135deg, #EDEDED 0 1px, transparent 1px 9px); }
.mes__numero { font-family: var(--display); font-weight: 800; font-size: 20px; letter-spacing: -.03em; line-height: 1; display: inline-flex; align-items: center; gap: 6px; }
.mes__semana { display: none; font-weight: 700; font-size: 14px; text-transform: uppercase; }
.mes__dia--hoje .mes__numero { color: var(--vermelho); }
.mes__dia--hoje { box-shadow: inset 0 0 0 2px var(--vermelho); }
.mes__itens { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mes__chip {
  --fundo: var(--branco); --tinta: var(--preto);
  display: block; font-size: 12px; font-weight: 500; line-height: 1.25;
  padding: 4px 8px; border-radius: 8px; background: var(--fundo); color: var(--tinta);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: help;
}
.mes__chip[data-pessoa="fernanda"] { --fundo: var(--vermelho); --tinta: var(--branco); }
.mes__chip[data-pessoa="socio-a"], .mes__chip[data-pessoa="geovani"] { --fundo: var(--preto); --tinta: var(--branco); }
.mes__chip[data-pessoa="socio-b"], .mes__chip[data-pessoa="guilherme"] { box-shadow: inset 0 0 0 1px var(--preto); }
.mes__chip[data-pessoa="colab"] { --fundo: var(--superficie); }
.mes__chip--cliente { background: var(--branco); color: var(--vermelho); box-shadow: inset 0 0 0 1px var(--vermelho); font-weight: 600; }
.mes__chip--projeto { background: var(--branco); color: var(--preto); box-shadow: inset 0 0 0 1px var(--preto); font-weight: 600; background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.08) 0 1px, transparent 1px 6px); }
.mes__mais { border: 0; background: transparent; text-align: left; font-size: 12px; font-weight: 600; padding: 2px 8px; color: var(--texto-2); }
.mes__mais:hover { color: var(--preto); text-decoration: underline; }
@media (max-width: 800px) {
  .mes__cabecalho { display: none; }
  .mes__grade { grid-template-columns: 1fr; border-left: 0; }
  .mes__dia--fora, .mes__dia--vazio { display: none; }
  .mes__dia { min-height: 0; flex-direction: row; align-items: flex-start; gap: 14px; padding: 12px 0; border-right: 0; }
  .mes__dia--hoje { box-shadow: none; }
  .mes__numero { width: 64px; flex-shrink: 0; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 28px; }
  .mes__semana { display: block; }
  .mes__itens { flex: 1; }
  .mes__chip { white-space: normal; }
}


/* ---------- Meu dia e prazos (lado a lado, centralizados) ---------- */
.dupla { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 5vw, 80px); align-items: start; }
.atalho { font-size: 14px; color: var(--texto-2); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--fio-leve); transition: color .2s, text-decoration-color .2s; }
.atalho:hover { color: var(--preto); text-decoration-color: var(--vermelho); }
.indicadores--compacto { border-top: 0; margin-bottom: 26px; }
.indicadores--compacto .indicador { padding-top: 0; }
.indicadores--compacto .indicador__numero { font-size: clamp(44px, 4vw, 60px); }
.indicadores--compacto .indicador__rotulo { margin-top: 10px; font-size: 13px; }
@media (max-width: 1000px) {
  .dupla { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Mural (botão no topo + painel lateral) ---------- */
.botao-mural { position: relative; }
.botao-mural__contador {
  position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: var(--vermelho); color: var(--branco);
  font-size: 11px; font-weight: 700; display: grid; place-items: center;
}
.botao-mural__contador[hidden] { display: none; }
.gaveta-fundo { position: fixed; inset: 0; z-index: 65; background: rgba(0, 0, 0, .32); opacity: 0; transition: opacity .3s; }
.gaveta-fundo.aberto { opacity: 1; }
.gaveta-fundo[hidden] { display: none; }
.gaveta {
  position: fixed; top: 0; right: 0; z-index: 70; height: 100%; width: min(460px, 100vw);
  background: var(--branco); box-shadow: var(--sombra-flutuante);
  padding: 28px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px;
  transform: translateX(100%); visibility: hidden;
  transition: transform .45s var(--ease-saida), visibility 0s linear .45s;
}
.gaveta.aberta { transform: none; visibility: visible; transition: transform .45s var(--ease-saida); }
.gaveta__topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; border-bottom: 1px solid var(--fio); padding-bottom: 16px; }
.gaveta__titulo { font-size: 34px; }
.gaveta__apoio { margin: 0; font-size: 14px; color: var(--texto-2); }
.gaveta .mural__form { max-width: none; margin: 0; }
.dupla--esquerda { margin: 0; max-width: 760px; display: block; }

/* títulos lado a lado na visão geral cabem em uma linha */
.dupla .secao__titulo { font-size: clamp(32px, 3.4vw, 52px); white-space: nowrap; }
@media (max-width: 700px) { .dupla .secao__titulo { white-space: normal; } }

/* ---------- Meu dia em largura total (cards, até 3 por linha) ---------- */
.cabecalho-meu-dia { align-items: flex-end; justify-content: flex-start; column-gap: clamp(28px, 4vw, 64px); }
.cabecalho-meu-dia .atalho { margin-left: auto; padding-bottom: 6px; }
/* números do dia em corpo de texto, como uma lista com divisores */
.indicadores--linha { display: flex; flex-wrap: wrap; align-items: center; gap: 0; border: 0; padding-bottom: 8px; }
.indicadores--linha .indicador { display: inline-flex; align-items: baseline; gap: 5px; padding: 0 14px; border: 0; }
.indicadores--linha .indicador:first-child { padding-left: 0; }
.indicadores--linha .indicador + .indicador { padding-left: 14px; border-left: 1px solid var(--fio-leve); }
.indicadores--linha .indicador__numero { font-family: var(--texto); font-weight: 600; font-size: 14px; letter-spacing: 0; line-height: 1.3; display: inline; }
.indicadores--linha .indicador__rotulo { margin: 0; font-size: 14px; line-height: 1.3; max-width: none; color: var(--texto-2); }

.lista--grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lista--grade .tarefa {
  position: relative; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: 1fr auto;
  gap: 16px 14px; padding: 22px; border: 1px solid var(--fio-leve); border-radius: var(--raio-card);
  background: var(--branco);
}
.lista--grade .tarefa:first-child { border-top: 1px solid var(--fio-leve); }
.lista--grade .tarefa__ordem { position: absolute; top: 22px; right: 22px; padding: 0; }
.lista--grade .tarefa__titulo { padding-right: 30px; }
.lista--grade .tarefa__direita {
  grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center;
  border-top: 1px solid var(--fio-leve); padding-top: 14px;
}
.lista--grade .datas div { text-align: left; }

/* ---------- Prazos da semana em largura total (até 3 por linha) ---------- */
.prazos-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(28px, 3vw, 48px); }
.prazos-grade .linha, .prazos-grade .linha:first-of-type { border-top: 0; border-bottom: 1px solid var(--fio-leve); padding: 16px 0; }

@media (max-width: 1100px) {
  .lista--grade, .prazos-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .lista--grade, .prazos-grade { grid-template-columns: minmax(0, 1fr); }
  .cabecalho-meu-dia { row-gap: 18px; }
  .cabecalho-meu-dia .atalho { margin-left: 0; }
  .indicadores--linha { width: 100%; flex-direction: column; align-items: stretch; padding-bottom: 0; }
  .indicadores--linha .indicador, .indicadores--linha .indicador + .indicador { padding: 8px 0; border-left: 0; border-bottom: 1px solid var(--fio-leve); }
  .lista--grade .tarefa__ordem { display: block; }
}

/* ---------- Caixa de mensagens (topo) ---------- */
.caixa-mensagens { position: relative; }
.painel-mensagens {
  position: absolute; top: 52px; right: 0; z-index: 35; width: min(380px, calc(100vw - 32px));
  background: var(--branco); border-radius: var(--raio-card); box-shadow: var(--sombra-flutuante);
  padding: 20px; opacity: 0; transform: translateY(-8px) scale(.97); transform-origin: top right;
  pointer-events: none; transition: opacity .2s, transform .3s var(--ease-saida);
}
.painel-mensagens.aberto { opacity: 1; transform: none; pointer-events: auto; }
.painel-mensagens__topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-bottom: 1px solid var(--fio); padding-bottom: 12px; }
.painel-mensagens__titulo { font-size: 22px; }
.painel-mensagens__topo .atalho { border: 0; background: none; padding: 0; font-size: 13px; cursor: pointer; }
.painel-mensagens__lista { max-height: 360px; overflow-y: auto; }
.mensagem { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--fio-leve); cursor: default; position: relative; }
.mensagem:last-child { border-bottom: 0; }
.mensagem__texto { margin: 0 0 4px; font-size: 14px; line-height: 1.4; color: var(--texto-2); }
.mensagem--nova { cursor: pointer; }
.mensagem--nova .mensagem__texto { color: var(--preto); }
.mensagem--nova::after { content: ""; position: absolute; top: 20px; right: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--vermelho); }
.mensagem--nova .mensagem__texto { padding-right: 18px; }
.mensagem small { font-size: 12px; color: var(--texto-2); }

/* ---------- Pop-up de tarefa liberada ---------- */
.popup-liberada {
  position: fixed; top: 92px; right: 24px; z-index: 62; width: min(400px, calc(100vw - 32px));
  background: var(--vermelho); color: var(--branco); border-radius: var(--raio-card);
  padding: 20px 22px 22px; box-shadow: var(--sombra-flutuante);
  opacity: 0; transform: translateY(-14px); transition: opacity .25s, transform .45s var(--ease-saida);
}
.popup-liberada.visivel { opacity: 1; transform: none; }
.popup-liberada[hidden] { display: none; }
.popup-liberada__topo { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.popup-liberada__topo .avatar { box-shadow: 0 0 0 1.5px var(--branco); }
.popup-liberada__rotulo { font-size: 13px; opacity: .9; }
.popup-liberada__fechar { margin-left: auto; width: 30px; height: 30px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .16); color: var(--branco); display: grid; place-items: center; cursor: pointer; }
.popup-liberada__fechar:hover { background: rgba(255, 255, 255, .3); }
.popup-liberada__texto { margin: 0 0 18px; font-size: 18px; line-height: 1.3; letter-spacing: -.01em; }
.popup-liberada__texto strong { font-weight: 600; }
.popup-liberada__acoes { display: flex; gap: 8px; }
.popup-liberada .pilula { height: 40px; padding: 0 18px; font-size: 14px; background: var(--branco); color: var(--preto); border-color: var(--branco); }
.popup-liberada .pilula--contorno-claro { background: transparent; color: var(--branco); border: 1px solid rgba(255, 255, 255, .7); }
.popup-liberada .pilula--contorno-claro:hover { border-color: var(--branco); }
@media (max-width: 700px) {
  .popup-liberada { top: auto; bottom: 96px; right: 16px; }
  .painel-mensagens { position: fixed; top: 70px; right: 16px; }
}

@media (max-width: 700px) {
  .painel-mensagens { top: 66px; }
}

/* ---------- Fim da página ---------- */
.fim-da-pagina { margin-top: clamp(64px, 8vw, 120px); text-align: center; }
.fim-da-pagina__texto { margin: 0; padding-top: clamp(40px, 5vw, 72px); border-top: 1px solid var(--fio); font-size: clamp(22px, 2.4vw, 34px); font-weight: 500; letter-spacing: -.035em; }

/* ---------- Botões de cadastro dentro de cada área ---------- */
.pagina-topo__acoes, .subarea__acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.pagina-topo__acoes .pilula--cadastro, .subarea__acoes .pilula--cadastro { height: 42px; padding: 0 18px 0 15px; font-size: 14.5px; }

/* ---------- Interno: financeiro e comercial ---------- */
.subnav { display: flex; gap: 6px; margin-top: 28px; }
.subnav .pilula { border-color: var(--fio-leve); }
.subnav .pilula:hover { border-color: var(--preto); }
.subarea { padding-top: clamp(64px, 8vw, 120px); scroll-margin-top: 80px; }
.subarea__titulo { font-size: clamp(44px, 6vw, 96px); font-weight: 900; letter-spacing: -.055em; line-height: .92; margin: 0; }
.subarea__linha { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px 24px; padding-top: 22px; border-top: 3px solid var(--preto); }
.subarea + .secao { padding-top: clamp(28px, 3vw, 44px); }

/* botões de cadastro na mesma linha do título, no canto */
.pagina-topo__linha { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px 24px; margin-top: 18px; }
.pagina-topo__linha .pagina-topo__titulo { margin: 0; }
.pagina-topo__linha .pagina-topo__acoes, .subarea__linha .subarea__acoes { padding-bottom: 6px; }
button.atalho { border: 0; background: none; padding: 0; cursor: pointer; font-family: inherit; }

/* ---------- Cartão de projeto que abre a janela ---------- */
.cartao--abre { cursor: pointer; }
.cartao--abre:focus-visible { outline: 2px solid var(--vermelho); outline-offset: 3px; }

/* ---------- Janela flutuante centralizada ---------- */
body.sem-rolagem { overflow: hidden; }
.janela-fundo {
  position: fixed; inset: 0; z-index: 74; background: rgba(0, 0, 0, .36);
  display: grid; place-items: center; padding: 24px;
  opacity: 0; transition: opacity .25s;
}
.janela-fundo.aberto { opacity: 1; }
.janela-fundo[hidden] { display: none; }
.janela {
  width: min(880px, 100%); max-height: min(88vh, 960px); display: flex; flex-direction: column;
  background: var(--branco); border-radius: var(--raio-caixa); box-shadow: var(--sombra-flutuante); overflow: hidden;
  transform: translateY(16px) scale(.98); transition: transform .4s var(--ease-saida);
}
.janela-fundo.aberto .janela { transform: none; }
.janela__barra { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 18px 14px 28px; border-bottom: 1px solid var(--fio-leve); }
.janela__caminho { font-size: 13px; color: var(--texto-2); }
.janela__corpo { overflow-y: auto; padding: 28px 40px 44px; }
.janela__rotulo { margin: 0 0 8px; font-size: 14px; color: var(--texto-2); }
.janela__titulo { font-size: clamp(32px, 4vw, 52px); margin: 0 0 24px; }
.janela__apoio { margin: -8px 0 20px; font-size: 14px; color: var(--texto-2); max-width: 60ch; }
.janela__bloco { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.02em; font-size: 16px; margin: 36px 0 12px; padding-top: 16px; border-top: 1px solid var(--fio); display: flex; gap: 10px; align-items: baseline; }
.janela__conta { font-family: var(--texto); font-weight: 500; text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--texto-2); }
.janela__bloco span[tabindex] { cursor: help; }

.propriedades { margin: 0; }
.propriedade { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 16px; padding: 9px 0; align-items: center; font-size: 14.5px; }
.propriedade + .propriedade { border-top: 1px solid var(--fio-leve); }
.propriedade dt { color: var(--texto-2); }
.propriedade dt span { cursor: help; border-bottom: 1px dotted #BDBDBD; }
.propriedade dd { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.propriedade__extra { color: var(--texto-2); }
.propriedade__pessoas { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.propriedade__pessoas > span { display: inline-flex; align-items: center; gap: 7px; }
.propriedade__link { color: var(--preto); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--vermelho); display: inline-flex; align-items: center; gap: 5px; }
.selo-socios { font-size: 11.5px; font-weight: 600; padding: 3px 8px; border-radius: 999px; background: var(--vermelho); color: var(--branco); }

.janela__fluxo { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.janela__fluxo li { display: inline-flex; align-items: center; gap: 6px; }
.janela__fluxo-marca { width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid #BDBDBD; }
.janela__fluxo li.feito .janela__fluxo-marca { background: var(--preto); border-color: var(--preto); }
.janela__fluxo li.feito .etiqueta { color: var(--texto-2); border-color: var(--fio-leve); }
.janela__fluxo li.atual .janela__fluxo-marca { background: var(--vermelho); border-color: var(--vermelho); }
.janela__fluxo li.atual .etiqueta { background: var(--vermelho); border-color: var(--vermelho); color: var(--branco); }

.janela__tarefa { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 18px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--fio-leve); }
.janela__tarefa:last-child { border-bottom: 0; }
.janela__tarefa.concluida { opacity: .5; }
.janela__tarefa.concluida .janela__tarefa-titulo { text-decoration: line-through; }
.janela__tarefa-titulo { margin: 0 0 3px; font-weight: 600; font-size: 15.5px; }
.janela__tarefa-sub { margin: 0; font-size: 13px; color: var(--texto-2); }
.janela__tarefa .tarefa__marcas { margin-top: 8px; }

.janela__notas { min-height: 96px; padding: 14px 16px; border-radius: 16px; background: var(--superficie); font-size: 15px; line-height: 1.5; outline: none; white-space: pre-wrap; }
.janela__notas:focus { box-shadow: inset 0 0 0 1.5px var(--preto); background: var(--branco); }

.janela__ajustes { list-style: none; margin: 0; padding: 0; }
.janela__ajustes li { border-bottom: 1px solid var(--fio-leve); }
.janela__ajustes label { display: flex; align-items: center; gap: 12px; padding: 10px 0; cursor: pointer; font-size: 15px; }
.janela__ajustes input { appearance: none; width: 20px; height: 20px; flex-shrink: 0; border-radius: 6px; border: 1.5px solid var(--preto); display: grid; place-items: center; margin: 0; cursor: pointer; }
.janela__ajustes input:checked { background: var(--preto); }
.janela__ajustes input:checked::after { content: ""; width: 5px; height: 9px; border: solid var(--branco); border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.janela__ajustes input:checked + span { text-decoration: line-through; color: var(--texto-2); }
.janela__novo-ajuste { display: flex; gap: 8px; margin-top: 12px; }
.janela__novo-ajuste input { flex: 1; height: 42px; border-radius: 999px; border: 1px solid var(--fio-leve); padding: 0 16px; font: inherit; font-size: 14.5px; }
.janela__novo-ajuste input:focus { outline: none; border-color: var(--preto); }
.janela__novo-ajuste .pilula { height: 42px; }

.janela__fluxos .fluxo { grid-template-columns: 200px minmax(0, 1fr) auto; }
.janela__fluxos .fluxo__nome { font-size: 18px; }

@media (max-width: 700px) {
  .janela-fundo { padding: 10px; align-items: end; }
  .janela { max-height: 92vh; }
  .janela__corpo { padding: 22px 20px 36px; }
  .propriedade { grid-template-columns: 1fr; gap: 4px; }
  .janela__tarefa { grid-template-columns: minmax(0, 1fr) auto; }
  .janela__tarefa .datas { grid-column: 1 / -1; }
  .janela__fluxos .fluxo { grid-template-columns: 1fr; }
}

/* ---------- Projetos: kanban por serviço ---------- */
.quadro--servicos { grid-template-columns: repeat(var(--colunas, 5), minmax(240px, 1fr)); }
.quadro--servicos[hidden], .calendario-projetos[hidden] { display: none; }
.quadro--servicos .coluna { min-height: 200px; }
.quadro--servicos .coluna__nome { font-size: 17px; cursor: help; }
.quadro--servicos .coluna__cabecalho { gap: 12px; }
.quadro--servicos .coluna__conta { white-space: nowrap; }
.coluna__selo { align-self: flex-start; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; border: 1px dashed var(--preto); }
.cartao--compacto { padding: 16px; gap: 8px; }
.cartao--compacto .cartao__titulo { font-size: 18px; }
.cartao--compacto .cartao__texto { font-size: 13px; }
.cartao--novo { animation: cartao-novo 1.6s var(--ease-saida); }
@keyframes cartao-novo { 0%, 30% { box-shadow: inset 0 0 0 2px var(--vermelho), var(--sombra-flutuante); } 100% { box-shadow: inset 0 0 0 1px var(--fio-leve), var(--sombra-card); } }
.fluxo__selo { display: block; margin-top: 6px; font-family: var(--texto); font-weight: 500; text-transform: none; letter-spacing: 0; font-size: 12px; color: var(--texto-2); }

/* ---------- Projetos: calendário com filtros ---------- */
.cal__filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-bottom: 16px; }
.cal__mes { display: flex; align-items: center; gap: 8px; }
.cal__mes-nome { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.03em; font-size: 22px; min-width: 210px; text-align: center; }
.cal__hoje { height: 40px; border-color: var(--fio-leve); }
.cal__campo { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--texto-2); }
.cal__campo select, .formulario select, .importar__coluna select {
  height: 40px; border-radius: 999px; border: 1px solid var(--fio-leve); background: var(--branco);
  padding: 0 36px 0 16px; font: inherit; font-size: 14px; color: var(--preto); appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}
.cal__campo select:focus, .formulario select:focus { outline: none; border-color: var(--preto); }
.cal__pessoas { display: flex; flex-wrap: wrap; gap: 6px; }
.filtro-pessoa {
  display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px 0 6px; border-radius: 999px;
  border: 1px solid var(--fio-leve); background: var(--branco); font-size: 13.5px; cursor: pointer; transition: border-color .2s, background .2s, color .2s;
}
.filtro-pessoa:first-child:not(:has(.avatar)) { padding: 0 16px; }
.filtro-pessoa:hover { border-color: var(--preto); }
.filtro-pessoa[aria-pressed="true"], .filtro-pessoa:has(input:checked) { background: var(--preto); border-color: var(--preto); color: var(--branco); }
.filtro-pessoa input { position: absolute; opacity: 0; pointer-events: none; }
.filtro-pessoa:has(input:focus-visible) { outline: 2px solid var(--vermelho); outline-offset: 2px; }
.filtro-pessoa .avatar { box-shadow: 0 0 0 1.5px var(--branco); }
.cal__legenda { gap: 8px; }
.cal__tipo {
  display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--fio-leve); background: var(--branco); font-size: 13px; color: var(--preto); cursor: pointer;
}
.cal__tipo::before { width: 14px; height: 10px; border-radius: 3px; }
.cal__tipo--entrega::before, .cal__tipo--interno::before, .cal__tipo--reuniao::before,
.cal__tipo--tarefa::before, .cal__tipo--cliente::before, .cal__tipo--projeto::before { content: ""; }
.cal__tipo--entrega::before { box-shadow: inset 0 0 0 1.5px var(--vermelho); }
.cal__tipo--interno::before { box-shadow: inset 0 0 0 1.5px var(--preto); background: repeating-linear-gradient(135deg, rgba(0,0,0,.25) 0 1px, transparent 1px 4px); }
.cal__tipo--reuniao::before { background: var(--preto); }
.cal__tipo--tarefa::before { background: var(--superficie); box-shadow: inset 0 0 0 1.5px #9A9A9A; }
.cal__tipo--cliente::before { box-shadow: inset 0 0 0 1.5px var(--vermelho); }
.cal__tipo--projeto::before { box-shadow: inset 0 0 0 1.5px var(--preto); }
.cal__tipo[aria-pressed="false"] { color: #9A9A9A; text-decoration: line-through; }
.cal__tipo[aria-pressed="false"]::before { opacity: .3; }
.mes__chip--reuniao { background: var(--preto); color: var(--branco); }
.mes__chip[data-projeto] { cursor: pointer; }
.cal__vazio { margin-top: 14px; }

/* ---------- Formulário (cadastro de projeto) ---------- */
.formulario { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.campo { display: flex; flex-direction: column; gap: 8px; min-width: 0; border: 0; padding: 0; margin: 0; }
.campo--largo { grid-column: 1 / -1; }
.campo > span, .campo > legend { font-size: 13px; color: var(--texto-2); padding: 0; display: inline-flex; align-items: center; gap: 8px; }
.campo > span[data-dica-texto] { cursor: help; text-decoration: underline dotted #BDBDBD; text-underline-offset: 4px; align-self: flex-start; }
.campo > legend { margin-bottom: 8px; }
.formulario input[type="text"], .formulario input[type="url"], .formulario input[type="date"], .formulario input[type="month"], .formulario input[type="email"], .formulario input[type="tel"], .formulario textarea, .meta-form input {
  height: 44px; border-radius: 14px; border: 1px solid var(--fio-leve); background: var(--branco);
  padding: 0 14px; font: inherit; font-size: 15px; color: var(--preto); width: 100%;
}
.formulario textarea { height: auto; padding: 12px 14px; resize: vertical; line-height: 1.45; }
.formulario select { height: 44px; border-radius: 14px; width: 100%; }
.formulario input:focus, .formulario textarea:focus { outline: none; border-color: var(--preto); }
.campo--outro { padding: 16px; border-radius: 16px; background: var(--superficie); gap: 10px; }
.campo--outro[hidden], .campo[hidden] { display: none; }
.campo__ajuda { margin: 0; font-size: 13px; color: var(--texto-2); line-height: 1.45; }
.formulario__erro { grid-column: 1 / -1; margin: 0; min-height: 1em; font-size: 14px; color: var(--vermelho); font-weight: 500; }
.formulario__acoes { display: flex; justify-content: flex-end; gap: 8px; }
.formulario__acoes .pilula { height: 44px; padding: 0 22px; }

@media (max-width: 700px) {
  .formulario { grid-template-columns: 1fr; }
  .cal__mes-nome { min-width: 0; font-size: 18px; }
  .cal__campo { width: 100%; }
  .cal__campo select { flex: 1; }
  .quadro--servicos { grid-template-columns: repeat(var(--colunas, 5), 78vw); }
}

/* ---------- Calendário (visão geral e Projetos) ----------
   Semana: sete colunas lado a lado com cartões. Mês: grade com linhas resumidas.
   Fios pretos finos e a diagonal nos dias fora do mês, como na referência. */
.agenda__barra { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-bottom: 16px; }
.agenda__hoje { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--vermelho); color: var(--branco); }
.cal-corpo { margin-top: 24px; }
.cal__semana, .cal__grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal__semana { border-bottom: 1px solid var(--preto); }
.cal__semana span { font-family: var(--display); font-weight: 500; text-transform: uppercase; letter-spacing: -.03em; font-size: 15px; padding: 0 12px 10px; color: var(--texto-2); }
.cal__grade { border-left: 1px solid var(--preto); }
.cal__dia { position: relative; min-width: 0; border-right: 1px solid var(--preto); border-bottom: 1px solid var(--preto); padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.cal--mes .cal__dia { min-height: 136px; }
.cal--semana .cal__dia { min-height: 420px; }
.cal__dia--fds { background: #FAFAFA; }
.cal__dia--fora .cal__dia-numero { opacity: .35; }
.cal__dia-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cal__dia-numero { font-family: var(--display); font-weight: 500; letter-spacing: -.02em; font-size: 16px; line-height: 1; display: inline-flex; align-items: baseline; gap: 6px; }
.cal__dia-semana { display: none; font-size: 14px; text-transform: uppercase; color: var(--texto-2); letter-spacing: -.02em; }
.cal__dia--passado .cal__dia-numero { opacity: .35; }
.cal__dia--hoje { box-shadow: inset 0 0 0 2px var(--vermelho); }
.cal__dia--hoje .cal__dia-numero { color: var(--vermelho); }
.cal__dia-itens { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cal__nada { font-size: 12px; color: #9A9A9A; }

/* linha resumida (mês) */
.cal__linha {
  display: block; font-size: 12px; line-height: 1.3; padding: 4px 10px; border-radius: 999px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: help; position: relative;
  background: var(--superficie); color: var(--preto);
}
.cal__linha b { font-weight: 600; }
.cal__linha--reuniao { background: var(--preto); color: var(--branco); }
.cal__linha--destaque { background: var(--branco); color: var(--vermelho); box-shadow: inset 0 0 0 1px var(--vermelho); font-weight: 600; }
.cal__linha--projeto, .cal__linha--interno { background: var(--branco); box-shadow: inset 0 0 0 1px var(--preto); }
.cal__linha--feito { opacity: .45; text-decoration: line-through; }
.cal__linha--abre { cursor: pointer; }
.cal__linha:focus-visible, .cal__item:focus-visible { outline: 2px solid var(--vermelho); outline-offset: 2px; }
.cal__mais { border: 0; background: transparent; text-align: left; font-size: 12px; font-weight: 600; padding: 2px 0; color: var(--texto-2); cursor: pointer; }
.cal__mais:hover { color: var(--preto); text-decoration: underline; }

/* cartão (semana) */
.cal__item { display: flex; flex-direction: column; gap: 4px; padding: 10px 0 12px; border-top: 1px solid var(--preto); min-width: 0; }
.cal__dia-itens .cal__item:first-child { border-top-color: transparent; padding-top: 2px; }
.cal__item-topo { display: flex; justify-content: space-between; align-items: center; gap: 6px; min-height: 22px; }
.cal__item-tipo { font-size: 11px; color: var(--texto-2); }
.cal__item--destaque .cal__item-tipo { color: var(--vermelho); font-weight: 600; }
.cal__item--reuniao .cal__item-tipo { color: var(--preto); font-weight: 600; }
.cal__item-pessoas { display: flex; }
.cal__item-pessoas .avatar { width: 22px; height: 22px; font-size: 8.5px; margin-left: -5px; box-shadow: 0 0 0 2px var(--branco); }
.cal__item-pessoas .avatar:first-child { margin-left: 0; }
.cal__item-alerta { align-self: flex-start; font-size: 10.5px; font-weight: 600; padding: 1px 7px; border-radius: 999px; border: 1px solid var(--vermelho); color: var(--vermelho); }
.cal__item-titulo { margin: 0; font-size: 14px; font-weight: 500; line-height: 1.25; letter-spacing: -.01em; overflow-wrap: anywhere; transition: color .2s; }
.cal__item-sub { margin: 0; font-size: 12px; color: var(--texto-2); }
.cal__item-rodape { margin: 6px 0 0; display: flex; flex-direction: column; gap: 1px; font-size: 10px; line-height: 1.35; text-transform: uppercase; letter-spacing: .04em; color: var(--texto-2); }
.cal__item-rodape span:first-child { color: var(--preto); }
.cal__item--feito { opacity: .45; }
.cal__item--feito .cal__item-titulo { text-decoration: line-through; }
.cal__item--abre { cursor: pointer; }
.cal__item--abre:hover .cal__item-titulo { color: var(--vermelho); }
.cal__vazio { margin-top: 14px; }

@media (max-width: 1100px) {
  .cal--semana .cal__semana { display: none; }
  .cal--semana .cal__dia-semana { display: inline; }
  .cal--semana .cal__grade { grid-template-columns: repeat(7, 220px); overflow-x: auto; border-top: 1px solid var(--preto); }
}
@media (max-width: 700px) {
  .cal--mes .cal__semana { display: none; }
  .cal--mes .cal__grade { grid-template-columns: 1fr; border-left: 0; border-top: 1px solid var(--preto); }
  .cal--mes .cal__dia--fora, .cal--mes .cal__dia--vazio { display: none; }
  .cal--mes .cal__dia { min-height: 0; flex-direction: row; align-items: flex-start; gap: 14px; padding: 12px 0; border-right: 0; }
  .cal--mes .cal__dia--hoje { box-shadow: none; }
  .cal--mes .cal__dia-cabecalho { width: 64px; flex-shrink: 0; flex-direction: column; align-items: flex-start; }
  .cal--mes .cal__dia-semana { display: block; }
  .cal--mes .cal__dia-numero { flex-direction: column; gap: 2px; font-size: 20px; }
  .cal--mes .cal__dia-itens { flex: 1; }
  .cal--mes .cal__linha { white-space: normal; }
  .cal--semana .cal__grade { grid-template-columns: repeat(7, 78vw); }
}

/* ---------- Projetos: aguardando cliente e bloqueadas, lado a lado ---------- */
.dupla--larga { max-width: none; margin: 0; }
.secao__cabecalho--coluna { flex-direction: column; align-items: flex-start; gap: 10px; }
.bloqueio { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start; padding: 14px 0; border-bottom: 1px solid var(--fio-leve); }
.bloqueio:first-child { border-top: 1px solid var(--fio); }
.bloqueio__espera { margin: 8px 0 0; font-size: 13px; color: var(--texto-2); }
.bloqueio__espera strong { color: var(--preto); font-weight: 600; }
.bloqueio__quem { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; font-size: 13px; color: var(--texto-2); cursor: help; }
.bloqueio__quem strong { color: var(--preto); font-weight: 600; font-size: 13.5px; }
.bloqueio__pessoas { display: inline-flex; align-items: center; gap: 6px; color: var(--preto); margin-bottom: 2px; }
.bloqueio--eu .bloqueio__quem strong { color: var(--vermelho); }
.bloqueio--eu .bloqueio__pessoas { color: var(--vermelho); }
@media (max-width: 700px) {
  .bloqueio { grid-template-columns: 1fr; }
  .bloqueio__quem { align-items: flex-start; text-align: left; }
}

/* ---------- Página do projeto (janela) ---------- */
.janela { width: min(1120px, 100%); transition: transform .4s var(--ease-saida), width .35s var(--ease-saida), max-height .35s var(--ease-saida), border-radius .35s; }
.janela__botoes { display: flex; align-items: center; gap: 8px; }
.janela__voltar { height: 40px; padding: 0 16px 0 12px; gap: 6px; border-color: var(--fio-leve); font-size: 13.5px; }
.janela__voltar:hover { border-color: var(--preto); }
.janela-fundo--cheia { padding: 0; }
.janela-fundo--cheia .janela { width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
.janela-fundo--cheia .janela__corpo { padding-left: clamp(24px, 4vw, 64px); padding-right: clamp(24px, 4vw, 64px); }
.janela-fundo--cheia .janela__barra { padding-left: clamp(24px, 4vw, 64px); padding-right: clamp(18px, 3vw, 48px); }
#tela-cheia[aria-pressed="true"] { background: var(--preto); color: var(--branco); border-color: var(--preto); }

.janela__titulo--editavel { outline: none; border-radius: 10px; margin-left: -8px; padding: 2px 8px; transition: background .2s; cursor: text; }
.janela__titulo--editavel:hover { background: var(--superficie); }
.janela__titulo--editavel:focus { background: var(--superficie); box-shadow: inset 0 0 0 1.5px var(--preto); }

/* campos editáveis: parecem texto, viram campo ao passar o cursor */
.propriedades--editaveis .propriedade { padding: 5px 0; min-height: 46px; }
.editavel {
  font: inherit; font-size: 14.5px; color: var(--preto); background: transparent;
  border: 1px solid transparent; border-radius: 10px; height: 36px; padding: 0 10px; margin-left: -10px;
  min-width: 0; max-width: 100%; transition: background .2s, border-color .2s;
}
input.editavel[type="text"], input.editavel[type="url"] { width: min(420px, 100%); }
.editavel::placeholder { color: #9A9A9A; }
.editavel:hover { background: var(--superficie); }
.editavel:focus { outline: none; background: var(--branco); border-color: var(--preto); }
select.editavel { appearance: none; cursor: pointer; padding-right: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239A9A9A' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; }
.propriedade__abrir { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--preto); border: 1px solid var(--fio-leve); }
.propriedade__abrir:hover { border-color: var(--preto); }
.filtro-pessoa--mini { height: 34px; font-size: 13px; padding: 0 12px 0 4px; }
.filtro-pessoa--mini .avatar { width: 26px; height: 26px; font-size: 9.5px; }

/* Status e Prazos */
.janela__vistas { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin: 36px 0 18px; padding-top: 20px; border-top: 1px solid var(--fio); }
.janela__fluxo-info { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--texto-2); cursor: help; }
.janela__fluxo-info:hover, .janela__fluxo-info:focus { color: var(--preto); }
.status { display: grid; grid-template-columns: repeat(var(--colunas, 5), minmax(200px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 10px; }
.status[hidden], .janela__prazos[hidden] { display: none; }
.status__coluna { display: flex; flex-direction: column; gap: 10px; min-height: 220px; border-radius: var(--raio-card); padding: 4px; transition: background .2s; }
.status__coluna.alvo { background: var(--superficie); }
.status__cabecalho { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 6px 6px 8px; border-bottom: 1px solid var(--preto); }
.status__nome { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.02em; font-size: 14px; line-height: 1.15; cursor: help; }
.status__coluna--atual .status__nome::after { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--vermelho); margin-left: 6px; vertical-align: 2px; }
.status__conta { font-size: 12px; color: var(--texto-2); }
.status__card {
  display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 16px; background: var(--branco);
  box-shadow: inset 0 0 0 1px var(--fio-leve), var(--sombra-card); cursor: grab; transition: box-shadow .2s, opacity .2s;
}
.status__card:hover { box-shadow: inset 0 0 0 1px var(--preto), var(--sombra-card); }
.status__card.arrastando { opacity: .4; }
.status__card.bloqueada { box-shadow: inset 0 0 0 1px var(--vermelho), var(--sombra-card); }
.status__card.concluida { opacity: .55; }
.status__card.concluida .status__titulo { text-decoration: line-through; }
.status__titulo { margin: 0; font-weight: 600; font-size: 14.5px; line-height: 1.3; }
.status__rodape { display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; font-size: 11.5px; color: var(--texto-2); text-align: right; padding-top: 8px; border-top: 1px solid var(--fio-leve); }
.status__rodape b { color: var(--preto); font-weight: 600; }
.status__pessoa { display: inline-flex; align-items: center; gap: 6px; color: var(--preto); text-align: left; }
.status .espaco-livre { min-height: 64px; }
.janela__prazos .cal--mes .cal__dia { min-height: 110px; }
.janela__prazos .agenda__barra { margin-bottom: 10px; }

@media (max-width: 700px) {
  .janela__voltar span { display: none; }
  .janela__voltar { width: 40px; padding: 0; justify-content: center; }
  .status { grid-template-columns: repeat(var(--colunas, 5), 72vw); }
  .editavel { margin-left: 0; }
}

/* ---------- Projetos: tarefas atrasadas por pessoa ---------- */
.indicador--link { color: inherit; text-decoration: none; cursor: pointer; }
.indicador--link .indicador__rotulo { text-decoration: underline; text-decoration-color: var(--vermelho); text-underline-offset: 3px; }
#secao-atrasadas { scroll-margin-top: 90px; }
.atrasos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--preto); }
.atraso { padding: 16px 18px 20px; border-left: 1px solid var(--fio-leve); min-width: 0; }
.atraso:first-child { border-left: 0; padding-left: 0; }
.atraso__pessoa { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--fio-leve); }
.atraso__nome { font-weight: 600; font-size: 15px; }
.atraso__conta { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--vermelho); }
.atraso--em-dia .atraso__conta { color: var(--texto-2); font-weight: 400; }
.atraso__tarefa { padding: 12px 0; border-bottom: 1px solid var(--fio-leve); }
.atraso__tarefa:last-child { border-bottom: 0; }
.atraso__titulo { margin: 0 0 3px; font-weight: 600; font-size: 14.5px; line-height: 1.3; }
.atraso__sub { margin: 0; font-size: 12.5px; color: var(--texto-2); }
.atraso__datas { margin: 6px 0 0; font-size: 12px; color: var(--texto-2); }
.atraso__datas strong { color: var(--vermelho); font-weight: 600; }
.atraso__tarefa .tarefa__marcas { margin-top: 8px; }
.atraso__vazio { margin: 12px 0 0; font-size: 13px; color: var(--texto-2); }
@media (max-width: 1100px) {
  .atrasos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atraso:nth-child(odd) { border-left: 0; padding-left: 0; }
  .atraso:nth-child(n + 3) { border-top: 1px solid var(--fio-leve); }
}
@media (max-width: 700px) {
  .atrasos { grid-template-columns: 1fr; }
  .atraso { border-left: 0; padding: 14px 0 16px; }
  .atraso + .atraso { border-top: 1px solid var(--fio-leve); }
}

/* ---------- Conteúdos: cartões de clientes ---------- */
.cartao--cliente { gap: 14px; }
.cartao__responsaveis { display: flex; flex-direction: column; gap: 8px; }
.cartao__legenda { font-size: 12px; color: var(--texto-2); }
.cartao__pessoas { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; }
.cartao__pessoas > span { display: inline-flex; align-items: center; gap: 7px; }
.cartao__rodape--redes { align-items: flex-end; }
.redes { display: flex; flex-wrap: wrap; gap: 6px; }
.rede { font-size: 12.5px; font-weight: 600; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--preto); color: var(--preto); white-space: nowrap; }

/* ---------- Pop-up do fluxo de social media ---------- */
.janela--estreita { width: min(640px, 100%); }
.fluxo-lista { list-style: none; margin: 0 0 24px; padding: 0; }
.fluxo-lista li { display: grid; grid-template-columns: 32px auto minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--fio-leve); }
.fluxo-lista__numero { font-family: var(--display); font-weight: 500; font-size: 14px; color: var(--texto-2); }
.fluxo-lista__texto { font-size: 13.5px; color: var(--texto-2); line-height: 1.4; }
@media (max-width: 700px) {
  .fluxo-lista li { grid-template-columns: 28px minmax(0, 1fr); }
  .fluxo-lista__texto { grid-column: 2; }
}

/* ---------- Filtros da tabela (calendário editorial) ---------- */
.filtros-tabela { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-bottom: 18px; }
.filtros-tabela select.ativo { background-color: var(--preto); color: var(--branco); border-color: var(--preto);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.filtros-tabela__conta { margin-left: auto; font-size: 13px; color: var(--texto-2); }
@media (max-width: 700px) {
  .filtros-tabela .cal__campo { width: 100%; }
  .filtros-tabela .cal__campo span { width: 74px; flex-shrink: 0; }
  .filtros-tabela__conta { margin-left: 0; }
}

/* ---------- Conteúdos: indicadores que filtram a tabela ---------- */
.secao__apoio--abaixo { margin: -6px 0 22px; max-width: 70ch; }
.indicador--filtro { border: 0; background: none; font: inherit; color: inherit; cursor: pointer; }
.indicadores--linha .indicador--filtro .indicador__rotulo { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; transition: text-decoration-color .2s, color .2s; }
.indicador--filtro:hover .indicador__rotulo { text-decoration-color: var(--fio); color: var(--preto); }
.indicador--filtro[aria-pressed="true"] .indicador__rotulo { color: var(--preto); font-weight: 600; text-decoration-color: var(--vermelho); text-decoration-thickness: 2px; }
.indicador[tabindex] { cursor: help; }
.etiqueta--mini { margin-top: 6px; font-size: 11px; padding: 2px 8px; }

/* ---------- Interno: botões de acesso alinhados ao título ---------- */
.subarea__linha--acessos { align-items: flex-end; }
.subarea__cabeca { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.subarea__cabeca .indicadores--linha { padding-bottom: 0; }
.acessos { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 640px; }
.acessos .pilula--leve { height: 42px; padding: 0 18px; font-size: 14.5px; border-color: var(--fio-leve); }
.acessos .pilula--leve:hover { border-color: var(--preto); }
.subarea__linha--acessos .acessos { padding-bottom: 6px; }
.janela__outras { margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--fio); }
.janela__outras-rotulo { margin: 0 0 12px; font-size: 13px; color: var(--texto-2); }
.acessos--janela { justify-content: flex-start; max-width: none; }
.acessos--janela .pilula--leve { height: 38px; font-size: 13.5px; padding: 0 15px; }
@media (max-width: 900px) {
  .acessos { justify-content: flex-start; max-width: none; }
}

/* ---------- Interno: financeiro ---------- */
.janela__topo-linha { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 20px; }
.janela__topo-linha .janela__titulo { margin: 0; }
.mes-nav { display: flex; align-items: center; gap: 8px; }
.mes-nav__nome { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.02em; font-size: 17px; min-width: 190px; text-align: center; }
.mes-nav__hoje { height: 40px; padding: 0 14px; font-size: 13.5px; border-color: var(--fio-leve); }
.janela__linha-acoes { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px 24px; margin-bottom: 16px; }
.janela__linha-acoes .indicadores--linha { padding-bottom: 0; }
.janela__linha-acoes .pilula--cadastro { height: 42px; padding: 0 18px 0 15px; font-size: 14.5px; }
.meta__barra--dupla { position: relative; }
.meta__barra--dupla span { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 999px; transition: width 1.4s var(--ease-saida); }
.meta__barra--dupla .meta__previsto { background: rgba(246, 30, 0, .38); }
.meta__barra--dupla .meta__recebido { background: var(--vermelho); }
.meta__legenda { margin: 10px 0 0; font-size: 13px; color: rgba(255, 255, 255, .6); }
.meta-form { display: grid; grid-template-columns: minmax(0, 320px) max-content; justify-content: start; align-items: end; gap: 10px 12px; margin-top: 28px; }
.meta-form .pilula { height: 44px; padding: 0 22px; }
.meta-form__ajuda, .meta-form .formulario__erro { grid-column: 1 / -1; }
.estado--recebido { background: var(--preto); color: var(--branco); }
.tabela tr.linha--feita td { color: var(--texto-2); }
.tabela tr.linha--feita strong { font-weight: 500; }
.tabela__acoes { white-space: nowrap; text-align: right; }
.tabela__acoes .atalho { margin-left: 10px; font-size: 13px; }
.tabela .etiqueta[tabindex] { cursor: help; }
.etiqueta--asaas { border-color: var(--vermelho); color: var(--vermelho); }
.asaas { display: grid; gap: 18px; max-width: 760px; }
.asaas__estado { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; }
.asaas__ponto { width: 10px; height: 10px; border-radius: 50%; background: #BDBDBD; }
.asaas__passos { list-style: none; margin: 0; padding: 0; counter-reset: passo; }
.asaas__passos li { counter-increment: passo; display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--fio-leve); }
.asaas__passos li::before { content: counter(passo, decimal-leading-zero); grid-row: span 2; font-family: var(--display); font-weight: 500; font-size: 14px; color: var(--texto-2); padding-top: 2px; }
.asaas__passos strong { font-weight: 600; font-size: 15px; }
.asaas__passos span { font-size: 14px; color: var(--texto-2); line-height: 1.45; margin-top: 3px; }
@media (max-width: 700px) {
  .meta-form { grid-template-columns: 1fr; }
  .mes-nav__nome { min-width: 0; font-size: 15px; }
}

/* ---------- Interno: produtividade ---------- */
.prod-filtros { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 22px; }
.prod-pessoas { display: flex; flex-wrap: wrap; gap: 6px; }
.prod-painel .meta__rotulo { max-width: 40ch; }
.graf-legenda { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--texto-2); margin-bottom: 14px; }
.graf-legenda span { display: inline-flex; align-items: center; gap: 7px; }
.graf__amostra { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.graf__seg--adiantada { background: var(--preto); }
.graf__seg--nodia { background: #757575; }
.graf__seg--atrasada { background: var(--vermelho); }
.graf-colunas { position: relative; display: flex; align-items: flex-end; gap: 6px; height: 220px; padding: 0 0 26px 28px; border-bottom: 0; background: linear-gradient(var(--fio-leve), var(--fio-leve)) 28px calc(100% - 26px) / calc(100% - 28px) 1px no-repeat, linear-gradient(var(--fio-leve), var(--fio-leve)) 28px 0 / calc(100% - 28px) 1px no-repeat; }
.graf-colunas__max { position: absolute; left: 0; top: -7px; font-size: 12px; color: var(--texto-2); }
.graf-coluna { position: relative; flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; outline: none; cursor: default; }
.graf-coluna::before { content: ""; position: absolute; inset: 0 -3px; border-radius: 8px; background: transparent; transition: background .15s; }
.graf-coluna:hover::before, .graf-coluna:focus-visible::before { background: rgba(0, 0, 0, .04); }
.graf-coluna__pilha { position: relative; width: min(100%, 44px); display: flex; flex-direction: column; gap: 2px; }
.graf-coluna__pilha .graf__seg { min-height: 3px; }
.graf-coluna__pilha .graf__seg:first-child { border-radius: 4px 4px 0 0; }
.graf-coluna__rotulo { position: absolute; bottom: -24px; font-size: 12px; color: var(--texto-2); white-space: nowrap; }
.prod-resumo { margin-top: 0; }
.prod-onde { gap: clamp(24px, 3vw, 48px); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.prod-onde__titulo { margin: 0 0 8px; font-size: 13px; color: var(--texto-2); }
.graf-ranking { display: flex; flex-direction: column; }
.graf-ranking__linha { display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr) 72px; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--fio-leve); outline: none; }
button.graf-ranking__linha { border: 0; border-bottom: 1px solid var(--fio-leve); background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; width: 100%; }
.graf-ranking__linha:hover, .graf-ranking__linha:focus-visible { background: var(--superficie); }
.graf-ranking__nome { font-size: 14.5px; font-weight: 500; display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.graf-ranking__trilho { height: 12px; }
.graf-ranking__barra { display: block; height: 100%; background: var(--preto); border-radius: 0 4px 4px 0; }
.graf-ranking__barra--pior { background: var(--vermelho); }
.graf-ranking__valor { font-weight: 600; font-size: 15px; text-align: right; line-height: 1.15; }
.graf-ranking__valor small { display: block; font-weight: 400; font-size: 12px; color: var(--texto-2); }
.graf-ranking--equipe { margin-bottom: 8px; }
.prod-tabela { margin-top: 36px; }
.prod-tabela summary { cursor: pointer; font-size: 14px; color: var(--texto-2); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--fio-leve); margin-bottom: 12px; }
.prod-tabela summary:hover { color: var(--preto); text-decoration-color: var(--vermelho); }
@media (max-width: 760px) {
  .prod-onde { grid-template-columns: 1fr; }
  .graf-ranking__linha { grid-template-columns: minmax(0, 110px) minmax(0, 1fr) 60px; gap: 10px; }
  .graf-colunas { gap: 3px; }
}

/* ---------- Projetos: botões por serviço e janela do serviço ---------- */
.secao__cabecalho--acessos { align-items: flex-end; }
.secao__cabecalho--acessos .indicadores--linha { padding-bottom: 0; }
.secao__cabecalho--acessos .acessos { padding-bottom: 4px; }
.quadro__barra { justify-content: space-between; }
.quadro__atalho { padding-bottom: 2px; }
.janela__acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.janela__acoes .pilula--cadastro { height: 42px; padding: 0 18px 0 15px; font-size: 14.5px; }
.janela__linha-acoes .atalho { margin-left: auto; }
.janela__abas { margin: 6px 0 22px; max-width: 100%; overflow-x: auto; }
.janela__abas button { white-space: nowrap; }
.janela__aba[hidden] { display: none; }
.status--servico .cartao { margin: 0; }
.status__coluna--vazia .status__cabecalho { opacity: .55; }
.status--servico { padding: 2px 8px 12px 2px; }
/* botões de serviço embaixo dos indicadores, um ao lado do outro */
.secao__cabecalho--acessos .subarea__cabeca { width: 100%; }
.acessos--linha { justify-content: flex-start; max-width: none; margin-top: 4px; }
.secao__cabecalho--acessos .acessos--linha { padding-bottom: 0; }

/* ---------- Indicadores à direita, alinhados ao título (todas as páginas) ---------- */
.cabecalho-com-lado { justify-content: space-between; align-items: flex-end; column-gap: clamp(24px, 3vw, 56px); }
.cabecalho-lado { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; margin-left: auto; min-width: 0; padding-bottom: 6px; }
.cabecalho-lado .indicadores--linha { justify-content: flex-end; padding-bottom: 0; }
.cabecalho-lado .indicadores--linha .indicador:last-child { padding-right: 0; }
.cabecalho-lado .acessos { justify-content: flex-end; max-width: 720px; padding-bottom: 0; }
.cabecalho-lado .janela__acoes { justify-content: flex-end; align-items: center; gap: 10px 14px; }
.cabecalho-lado .atalho { padding-bottom: 0; margin: 0; }
.subarea__linha--acessos .cabecalho-lado { padding-bottom: 8px; }
.janela__topo-linha { align-items: flex-end; }
.janela__topo-linha .cabecalho-lado { padding-bottom: 4px; }
@media (max-width: 900px) {
  .cabecalho-lado { width: 100%; align-items: flex-start; margin-left: 0; }
  .cabecalho-lado .indicadores--linha, .cabecalho-lado .acessos, .cabecalho-lado .janela__acoes { justify-content: flex-start; }
}
@media (max-width: 700px) {
  .cabecalho-lado { align-items: stretch; }
}
.acessos--servicos { flex-basis: 100%; justify-content: flex-end; max-width: none; margin-top: -4px; }
@media (max-width: 900px) { .acessos--servicos { justify-content: flex-start; margin-top: 0; } }

/* ---------- Interno: relatório do mês ---------- */
.relatorio { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 20px 32px; }
.relatorio .cartao__texto { max-width: 52ch; }
.relatorio .cartao__rodape { flex-direction: column; align-items: stretch; gap: 8px; border: 0; padding: 0; margin: 0; }
.relatorio .pilula { height: 46px; justify-content: center; padding: 0 22px; }
.relatorio__gerar { background: var(--vermelho); border-color: var(--vermelho); color: var(--branco); }
.relatorio__gerar:hover { background: var(--branco); border-color: var(--branco); color: var(--preto); }
.relatorio__imprimir { background: transparent; border-color: rgba(255, 255, 255, .45); color: var(--branco); }
.relatorio__imprimir:hover { border-color: var(--branco); background: rgba(255, 255, 255, .08); }
.relatorio__aviso { margin-top: 12px; }
.relatorio__numeros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--fio); }
.relatorio__numeros div { padding: 14px 14px 14px 0; border-bottom: 1px solid var(--fio-leve); display: flex; flex-direction: column; gap: 4px; }
.relatorio__numeros span { font-size: 13px; color: var(--texto-2); }
.relatorio__numeros strong { font-family: var(--display); font-weight: 800; font-size: 24px; letter-spacing: -.03em; }
.relatorio__numeros strong.alerta { color: var(--vermelho); }
.relatorio__numeros small { font-size: 12.5px; color: var(--texto-2); }
.relatorio__resultado { grid-column: span 2; }
@media (max-width: 760px) {
  .relatorio { grid-template-columns: 1fr; }
  .relatorio__numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.relatorio > div:first-child { display: flex; flex-direction: column; gap: 10px; }
.relatorio .cartao__rotulo, .relatorio .cartao__titulo, .relatorio .cartao__texto { margin: 0; }
.relatorio .cartao__titulo { line-height: .95; }

/* ---------- Interno: equipe ---------- */
.campo--grupo { border: 0; padding: 0; margin: 0; min-width: 0; }
.campo--grupo legend { padding: 0; margin-bottom: 8px; font-size: 13px; color: var(--texto-2); }
.campo--grupo .cal__pessoas { display: flex; flex-wrap: wrap; gap: 6px; }
.campo--grupo .filtro-pessoa input { margin: 0 4px 0 0; accent-color: var(--vermelho); }
.pessoa-linha { display: inline-flex; align-items: center; gap: 10px; }
.etiqueta--acesso { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.campo--grupo .filtro-pessoa:has(input:checked) { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.campo--grupo .filtro-pessoa input { position: absolute; opacity: 0; pointer-events: none; }
.campo--grupo .filtro-pessoa { padding: 0 16px; }

/* ---------- Comercial: scripts por canal ---------- */
.scripts__filtros { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 8px; }
.scripts__filtros .filtro-pessoa { padding: 0 16px; }
.scripts__aviso { margin: -6px 0 16px; padding: 10px 14px; border-radius: 12px; background: rgba(246, 30, 0, .07); color: var(--preto); font-size: 13.5px; max-width: 70ch; }
.scripts__cartoes { margin-bottom: 8px; }
.script-cartao { text-align: left; font: inherit; color: inherit; cursor: pointer; display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--fio-leve); background: var(--branco); }
.script-cartao:hover, .script-cartao:focus-visible { border-color: var(--preto); outline: none; }
.script-cartao .cartao__titulo { margin: 0; }
.script-cartao__trecho { font-size: 14px; color: var(--texto-2); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.script-cartao .cartao__rodape { margin-top: auto; }
.script-cartao__abrir { font-weight: 600; color: var(--preto); }
.script { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 28px; align-items: start; margin-top: 8px; }
.script__campos { display: flex; flex-direction: column; gap: 12px; position: sticky; top: 0; }
.script__campos-titulo { margin: 0; font-weight: 600; font-size: 14px; }
.script__campos input { height: 42px; border: 1px solid var(--fio-leve); border-radius: 12px; padding: 0 12px; font: inherit; font-size: 14.5px; width: 100%; }
.script__campos input:focus { outline: none; border-color: var(--preto); }
.script__previa { border: 1px solid var(--fio-leve); border-radius: 18px; padding: clamp(18px, 2.4vw, 30px); font-size: 15px; line-height: 1.6; max-width: 72ch; }
.script__previa p { margin: 0 0 12px; }
.script__previa p:last-child { margin-bottom: 0; }
.script__previa a { color: var(--vermelho); text-underline-offset: 3px; word-break: break-word; }
.script__assunto { padding-bottom: 12px; border-bottom: 1px solid var(--fio-leve); font-weight: 600; }
.script__assunto span { display: block; font-weight: 400; font-size: 12.5px; color: var(--texto-2); margin-bottom: 2px; }
.script__var { background: rgba(246, 30, 0, .1); color: var(--vermelho); border-radius: 4px; padding: 0 3px; font-weight: 600; }
@media (max-width: 800px) { .script { grid-template-columns: 1fr; } .script__campos { position: static; } }

/* ---------- Ideias de melhoria ---------- */
.gaveta__titulo { line-height: .95; }
.gaveta__titulo-nota { display: block; margin-top: 8px; font-family: var(--texto); font-weight: 400; font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--texto-2); }

/* ---------- Base de leads ---------- */
.leads__filtros .leads__busca input { min-width: 240px; }
.leads__filtros input[type="search"] { height: 40px; border-radius: 999px; border: 1px solid var(--fio-leve); padding: 0 16px; font: inherit; font-size: 14px; background: var(--branco); }
.leads__filtros input[type="search"]:focus { outline: none; border-color: var(--preto); }
.tabela--leads { font-size: 13.5px; min-width: 1180px; }
.tabela--leads td { padding: 12px 12px 12px 0; }
.tabela--leads td:nth-child(2) { max-width: 180px; overflow-wrap: anywhere; }
.lead__linha { cursor: pointer; transition: background .15s; }
.lead__linha:hover, .lead__linha:focus-visible { background: var(--superficie); outline: none; }
.lead__linha--bloqueado td { color: var(--texto-2); }
.lead__perfil { color: inherit; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.lead__obs { max-width: 240px; color: var(--texto-2); }
.etiqueta--lead { white-space: nowrap; }
.etiqueta--lead[data-status="Fechado"] { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.etiqueta--lead[data-status="Proposta enviada"], .etiqueta--lead[data-status="Reunião agendada"] { background: var(--vermelho); color: var(--branco); border-color: var(--vermelho); }
.etiqueta--lead[data-status="Não abordar"], .etiqueta--lead[data-status="Perdido"] { text-decoration: line-through; color: var(--texto-2); }
.leads__mais { margin-top: 18px; }
.lead__duplicado { margin: 0; padding: 14px 16px; border-radius: 14px; background: var(--superficie); font-size: 14px; line-height: 1.5; }
.lead__duplicado--igual { background: var(--vermelho); color: var(--branco); }
.lead__duplicado--igual .atalho { color: var(--branco); }
.lead__duplicado[hidden] { display: none; }
.lead__excluir { margin-right: auto; color: var(--vermelho); }

/* importação */
.importar__area { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 48px 24px; border: 1.5px dashed var(--preto); border-radius: 24px; text-align: center; cursor: pointer; margin-bottom: 18px; transition: background .15s; }
.importar__area:hover, .importar__area.arrastando, .importar__area:focus-within { background: var(--superficie); }
.importar__area input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.importar__area strong { font-family: var(--display); text-transform: uppercase; letter-spacing: -.02em; font-size: 20px; }
.importar__area span { font-size: 13px; color: var(--texto-2); }
.importar__area + .campo__ajuda, .campo__ajuda + .campo__ajuda { margin-top: 8px; max-width: 640px; }
.importar__resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 26px; }
.importar__resumo div { background: var(--superficie); border-radius: 18px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.importar__resumo div:first-child { background: var(--preto); color: var(--branco); }
.importar__resumo strong { font-family: var(--display); font-size: 34px; line-height: 1; letter-spacing: -.03em; }
.importar__resumo span { font-size: 13px; }
.importar__colunas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin-bottom: 18px; }
.importar__coluna { display: grid; grid-template-columns: 150px minmax(0, 1fr); grid-template-rows: auto auto; gap: 2px 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--fio-leve); }
.importar__campo { font-size: 13.5px; font-weight: 600; grid-row: span 2; }
.importar__coluna select { height: 38px; width: 100%; }
.importar__exemplo { font-size: 12px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 1em; }
.importar__lista { margin: 0 0 14px; padding-left: 18px; font-size: 14px; line-height: 1.55; }
.importar__opcao { display: flex; gap: 10px; align-items: center; font-size: 14px; margin-bottom: 22px; cursor: pointer; }
.importar__opcao input { width: 18px; height: 18px; accent-color: var(--preto); }
@media (max-width: 700px) {
  .importar__resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .importar__colunas { grid-template-columns: 1fr; }
  .importar__coluna { grid-template-columns: 1fr; }
  .importar__campo { grid-row: auto; }
  .leads__filtros .leads__busca input { min-width: 0; width: 100%; }
}
.lead__vencido { display: block; margin-top: 3px; font-size: 12px; font-weight: 600; color: var(--vermelho); white-space: nowrap; }

/* ---------- Tarefa clicável ---------- */
#meu-dia .tarefa { cursor: pointer; }
#meu-dia .tarefa:hover .tarefa__titulo { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px; }
#meu-dia .tarefa:focus-visible, #quadro-kanban .card:focus-visible, .status__card:focus-visible, [data-abrir-tarefa]:focus-visible { outline: 2px solid var(--preto); outline-offset: 3px; }
[data-abrir-tarefa] { cursor: pointer; }
[data-abrir-tarefa]:hover .atraso__titulo, [data-abrir-tarefa]:hover .linha__titulo { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Página da tarefa ---------- */
.tarefa-pagina .janela__titulo { margin-bottom: 14px; }
.etiqueta--situacao { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.etiqueta--situacao[data-situacao="em ajuste"], .etiqueta--situacao[data-situacao="bloqueada"] { background: var(--vermelho); border-color: var(--vermelho); }
.etiqueta--situacao[data-situacao="concluída"] { background: var(--branco); color: var(--preto); }
.tarefa-pagina__dados { margin: 28px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); border-top: 1px solid var(--preto); border-bottom: 1px solid var(--fio-leve); }
.tarefa-pagina__item { padding: 14px 18px 16px 0; display: flex; flex-direction: column; gap: 8px; }
.tarefa-pagina__item + .tarefa-pagina__item { padding-left: 18px; border-left: 1px solid var(--fio-leve); }
.tarefa-pagina__item dt { font-size: 12.5px; color: var(--texto-2); width: fit-content; }
.tarefa-pagina__item dd { margin: 0; font-size: 15px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; line-height: 1.35; }
.tarefa-pagina__link { border: 0; background: none; padding: 0; font: inherit; font-size: 15px; text-align: left; color: var(--preto); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--fio-leve); cursor: pointer; }
.tarefa-pagina__link:hover { text-decoration-color: var(--preto); }
.tarefa-pagina__quem { font-size: 13px; color: var(--texto-2); }
.tarefa-pagina__fraco { color: var(--texto-2); font-size: 14px; }
.tarefa-pagina__progresso { margin-top: 26px; }
.tarefa-pagina__progresso-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.tarefa-pagina__progresso-topo .janela__bloco { margin: 0; padding: 0; border: 0; }
.tarefa-pagina__progresso-topo > span { font-size: 14px; }
.tarefa-pagina__progresso .progresso { height: 8px; --segmento: var(--vermelho); --segmento-vazio: var(--superficie); }
.tarefa-pagina__nota { margin: 10px 0 0; font-size: 13px; }
.tarefa-pagina__secao { margin-top: 8px; }

/* kanban das etapas do serviço */
.tarefa-pagina__kanban { position: relative; overflow-x: auto; margin: 0 -4px; padding: 0 4px 6px; scroll-behavior: smooth; }
.etapas-kanban { display: grid; grid-template-columns: repeat(var(--colunas), minmax(150px, 1fr)); gap: 8px; min-width: calc(var(--colunas) * 158px); }
.etapas-kanban__coluna { background: var(--superficie); border-radius: 16px; padding: 10px; min-height: 150px; display: flex; flex-direction: column; gap: 8px; transition: box-shadow .15s, background .15s; }
.etapas-kanban__coluna.atual { box-shadow: inset 0 0 0 1.5px var(--preto); }
.etapas-kanban__coluna.sobre { background: var(--branco); box-shadow: inset 0 0 0 1.5px var(--vermelho); }
.etapas-kanban__nome { margin: 0 0 4px; display: flex; gap: 8px; align-items: baseline; font-size: 13px; font-weight: 600; line-height: 1.25; width: fit-content; }
.etapas-kanban__nome span { font-family: var(--display); font-size: 11px; color: var(--texto-2); flex-shrink: 0; }
.etapas-kanban__card { background: var(--branco); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; cursor: pointer; box-shadow: 0 1px 0 var(--fio-leve); transition: transform .15s var(--ease-saida), box-shadow .15s; }
.etapas-kanban__card:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.etapas-kanban__card:focus-visible { outline: 2px solid var(--preto); outline-offset: 2px; }
.etapas-kanban__card.esta { background: var(--vermelho); color: var(--branco); cursor: grab; }
.etapas-kanban__card.esta .avatar { box-shadow: 0 0 0 1.5px var(--branco); }
.etapas-kanban__card.feita:not(.esta) { opacity: .5; }
.etapas-kanban__card.bloqueada:not(.esta) { background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgba(246, 30, 0, .08) 6px 7px); }
.etapas-kanban__card.arrastando { opacity: .35; }
.etapas-kanban__titulo { font-size: 13.5px; font-weight: 500; line-height: 1.3; }
.etapas-kanban__pe { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.etapas-kanban__pe .avatar--sm { width: 22px; height: 22px; font-size: 8.5px; }
.etapas-kanban__esta { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }

/* notas e ajustes */
.tarefa-pagina__duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 40px; align-items: start; }
.tarefa-ajustes li { display: flex; align-items: center; gap: 8px; }
.tarefa-ajustes label { flex: 1; }
.tarefa-ajustes__remover { border: 0; background: none; color: var(--texto-2); font-size: 20px; line-height: 1; width: 28px; height: 28px; border-radius: 50%; cursor: pointer; opacity: 0; transition: opacity .15s; }
.tarefa-ajustes li:hover .tarefa-ajustes__remover, .tarefa-ajustes__remover:focus-visible { opacity: 1; }
.tarefa-ajustes__remover:hover { color: var(--vermelho); }
.tarefa-ajustes__vazio { padding: 10px 0; font-size: 14px; color: var(--texto-2); }
.tarefa-pagina__erro { margin: 8px 0 0; font-size: 13px; font-weight: 500; color: var(--vermelho); }
.tarefa-pagina__erro:empty { display: none; }

/* ações pequenas no rodapé */
.tarefa-pagina__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--fio-leve); }
.mini-botao { height: 32px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--fio-leve); background: var(--branco); color: var(--preto); font: inherit; font-size: 13px; cursor: pointer; transition: border-color .15s, background .15s; }
.mini-botao:hover:not(:disabled) { border-color: var(--preto); }
.mini-botao--cheio { background: var(--preto); color: var(--branco); border-color: var(--preto); }
.mini-botao--cheio:hover:not(:disabled) { background: var(--vermelho); border-color: var(--vermelho); }
.mini-botao:disabled { opacity: .35; cursor: not-allowed; }
.tarefa-pagina__status { margin-left: auto; }
.tarefa-pagina__status select { height: 32px; border-radius: 999px; border: 1px solid var(--fio-leve); background-color: var(--branco); padding: 0 30px 0 12px; font: inherit; font-size: 13px; color: var(--preto); appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; }
@media (hover: none) { .tarefa-ajustes__remover { opacity: 1; } }
@media (max-width: 760px) {
  .tarefa-pagina__duas { grid-template-columns: 1fr; }
  .tarefa-pagina__item + .tarefa-pagina__item { padding-left: 0; border-left: 0; border-top: 1px solid var(--fio-leve); }
  .tarefa-pagina__item { padding-right: 0; }
  .tarefa-pagina__status { margin-left: 0; }
}

/* social media: primeiro mês de estruturação */
.fluxo__fases { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.fluxo__fase { margin: 2px 0 -2px; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
.fluxo__fase + .fluxo__etapas + .fluxo__fase { margin-top: 8px; }
.status__coluna--inicio { background: var(--superficie); border-radius: 16px; padding-left: 10px; padding-right: 10px; }

/* janela do projeto: data interna e data do cliente na mesma linha */
.propriedade-dupla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid var(--fio-leve); }
.propriedade-dupla + .propriedade { border-top: 1px solid var(--fio-leve); }
.propriedade-dupla .propriedade + .propriedade { border-top: 0; grid-template-columns: auto minmax(0, 1fr); padding-left: 24px; border-left: 1px solid var(--fio-leve); }
@media (max-width: 640px) {
  .propriedade-dupla { grid-template-columns: 1fr; }
  .propriedade-dupla .propriedade + .propriedade { padding-left: 0; border-left: 0; border-top: 1px solid var(--fio-leve); grid-template-columns: 1fr; }
}

/* ---------- Editor de fluxo ---------- */
.formulario--uma { grid-template-columns: minmax(0, 1fr); }
.formulario--uma .campo { max-width: 420px; }
.fluxo-editor { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.fluxo-editor__linha { display: grid; grid-template-columns: 28px minmax(140px, .8fr) minmax(0, 1.4fr) auto; gap: 8px; align-items: center; }
.fluxo-editor__linha:last-child .fluxo-editor__numero { background: var(--preto); color: var(--branco); }
.fluxo-editor__numero { font-family: var(--display); font-weight: 700; font-size: 11px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--fio-leve); }
.fluxo-editor input { height: 40px; border-radius: 12px; border: 1px solid var(--fio-leve); padding: 0 12px; font: inherit; font-size: 14px; background: var(--branco); min-width: 0; }
.fluxo-editor input:focus { outline: none; border-color: var(--preto); }
.fluxo-editor__descricao { color: var(--texto-2); }
.fluxo-editor__botoes { display: flex; gap: 2px; }
.botao-icone--mini { width: 30px; height: 30px; font-size: 15px; line-height: 1; }
.fluxo-editor__mais { margin-top: 10px; display: inline-flex; align-items: center; gap: 6px; }
.fluxo__novo { width: 100%; margin-top: 18px; min-height: 64px; }
@media (max-width: 700px) {
  .fluxo-editor__linha { grid-template-columns: 28px minmax(0, 1fr) auto; }
  .fluxo-editor__nome { grid-column: 2; grid-row: 1; }
  .fluxo-editor__botoes { grid-column: 3; grid-row: 1; }
  .fluxo-editor__descricao { grid-column: 2 / -1; }
}
.formulario--uma .janela__bloco { margin-top: 8px; }

/* ---------- Busca geral ---------- */
.busca-fundo { position: fixed; inset: 0; z-index: 90; background: rgba(0, 0, 0, .28); display: flex; justify-content: center; align-items: flex-start; padding: 12vh 20px 20px; opacity: 0; transition: opacity .18s; }
.busca-fundo.aberto { opacity: 1; }
.busca-fundo[hidden] { display: none; }
.busca { width: min(680px, 100%); max-height: 70vh; display: flex; flex-direction: column; background: var(--branco); border-radius: 24px; box-shadow: 0 24px 80px rgba(0, 0, 0, .25); overflow: hidden; transform: translateY(-8px); transition: transform .25s var(--ease-saida); }
.busca-fundo.aberto .busca { transform: none; }
.busca__campo { display: flex; align-items: center; gap: 12px; padding: 0 20px; border-bottom: 1px solid var(--fio-leve); }
.busca__campo input { flex: 1; height: 64px; border: 0; font: inherit; font-size: 18px; background: transparent; color: var(--preto); min-width: 0; }
.busca__campo input:focus { outline: none; }
.busca__campo input::-webkit-search-cancel-button { display: none; }
.busca__tecla { font: inherit; font-size: 11px; color: var(--texto-2); border: 1px solid var(--fio-leve); border-radius: 6px; padding: 3px 6px; }
.busca__resultados { overflow-y: auto; padding: 8px 10px 14px; }
.busca__grupo { margin: 12px 10px 4px; font-family: var(--display); font-weight: 800; text-transform: uppercase; font-size: 12px; letter-spacing: -.01em; }
.busca__item { display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left; border: 0; background: none; border-radius: 12px; padding: 9px 10px; font: inherit; cursor: pointer; color: var(--preto); }
.busca__item:hover, .busca__item.ativo { background: var(--superficie); }
.busca__item.ativo { box-shadow: inset 3px 0 0 var(--vermelho); }
.busca__titulo { font-size: 15px; font-weight: 500; }
.busca__sub { font-size: 12.5px; color: var(--texto-2); }
.busca__vazio { margin: 18px 10px; font-size: 14px; color: var(--texto-2); }
@media (max-width: 600px) { .busca-fundo { padding-top: 8px; } .busca__tecla { display: none; } }

/* + Tarefa na janela do projeto e na ficha do cliente */
.janela__nova-tarefa { order: 3; margin-left: auto; }
.pilula--mini { height: 34px; padding: 0 14px; font-size: 13px; }
.linha__valor--acoes { display: inline-flex; align-items: center; gap: 14px; }

/* histórico da tarefa */
.historico { list-style: none; margin: 0; padding: 0; max-height: 280px; overflow-y: auto; }
.historico__item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--fio-leve); font-size: 14px; }
.historico__item:first-child .historico__texto strong { color: var(--vermelho); }
.historico__item .avatar--sm { width: 24px; height: 24px; font-size: 9px; }
.historico__texto strong { font-weight: 600; }
.historico__quando { font-size: 12.5px; color: var(--texto-2); white-space: nowrap; }

/* ideias de melhoria: novas e "marcar todas como lidas" */
.mural__barra { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 10px; font-size: 13px; color: var(--texto-2); }
.mural__barra[hidden] { display: none; }
.mural__barra .atalho:disabled { opacity: .4; cursor: default; }
.ideia--nova { position: relative; cursor: pointer; box-shadow: inset 3px 0 0 var(--vermelho); }
.ideia--nova::after { content: ""; position: absolute; top: 14px; right: 14px; width: 8px; height: 8px; border-radius: 50%; background: var(--vermelho); }

/* resumo do dia em lista: uma frase por linha */
.caixa-vermelha__lista { list-style: none; padding: 0; width: 100%; text-align: left; display: flex; flex-direction: column; }
.caixa-vermelha__lista li { display: flex; gap: 12px; align-items: baseline; padding: 10px 0; border-top: 1px solid rgba(255, 255, 255, .35); }
.caixa-vermelha__lista li:first-child { border-top: 0; padding-top: 4px; }
.caixa-vermelha__lista li:last-child { padding-bottom: 0; }
.caixa-vermelha__lista li::before { content: ""; flex-shrink: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--branco); transform: translateY(-3px); }
.caixa-vermelha--central .caixa-vermelha__lista { max-width: none; }

/* ---------- Menu da conta ---------- */
.menu-conta { position: relative; }
.avatar--botao { border: 0; cursor: pointer; padding: 0; }
.avatar--botao:focus-visible { outline: 2px solid var(--preto); outline-offset: 3px; }
.menu-conta__painel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 60; min-width: 240px; background: var(--branco); border-radius: 18px; box-shadow: 0 18px 50px rgba(0, 0, 0, .16); padding: 16px 18px; }
.menu-conta__painel[hidden] { display: none; }
.menu-conta__nome { margin: 0; font-weight: 600; font-size: 15px; }
.menu-conta__email { margin: 2px 0 14px; font-size: 13px; color: var(--texto-2); overflow-wrap: anywhere; }
.menu-conta__sair { width: 100%; height: 38px; }

/* ---------- Carregando o sistema ---------- */
.carregando-sistema { position: fixed; inset: 0; z-index: 200; background: var(--branco); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; transition: opacity .35s; }
.carregando-sistema.saindo { opacity: 0; pointer-events: none; }
.carregando-sistema .titulo { margin: 0; font-size: clamp(28px, 5vw, 44px); }
.carregando-sistema span { font-size: 14px; color: var(--texto-2); max-width: 36ch; text-align: center; }
.carregando-sistema span::after { content: ""; display: inline-block; width: 1.2em; text-align: left; animation: pontinhos 1.2s steps(4) infinite; }
@keyframes pontinhos { 0% { content: ""; } 25% { content: "."; } 50% { content: ".."; } 75% { content: "..."; } }

/* ---------- Tela de entrada ---------- */
.pagina-entrar { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.entrar { width: min(420px, 100%); display: flex; flex-direction: column; gap: 24px; }
.entrar__logo { width: 150px; height: auto; }
.entrar__titulo { margin: 0; font-size: clamp(34px, 6vw, 52px); line-height: .92; }
.entrar__form { display: flex; flex-direction: column; gap: 16px; }
.entrar__form input { height: 52px; border-radius: 16px; border: 1px solid var(--fio-leve); padding: 0 16px; font: inherit; font-size: 16px; }
.entrar__form input:focus { outline: none; border-color: var(--preto); }
.entrar__botao { height: 52px; font-size: 16px; }
.entrar__botao:disabled { opacity: .6; }
.entrar__ajuda { margin: 0; font-size: 13px; color: var(--texto-2); }