/* ════════════════════════════════════════════════════════════
   REDESIGN — TOKENS E COMPONENTES BASE
   ------------------------------------------------------------
   Fonte de verdade: design/lilia-referencia-layout.html (13 telas,
   celular 393×852 e desktop 1440×900). Os valores aqui são copiados
   de lá, não reinterpretados — o LEIA-PRIMEIRO.md pede explicitamente
   para não arredondar para uma grade de 4/8px.

   Este arquivo NÃO muda nenhuma tela existente: define variáveis (que
   só valem quando alguém as usa) e classes novas, com prefixo `rd-`,
   que só o markup novo pede. A troca de cada tela é passo a passo.

   DUAS COISAS AQUI CONTRARIAM REGRAS ANTIGAS DA CASA, de propósito,
   porque a referência é mais nova e é a fonte de verdade:

   1. RAIO. O CSS antigo tem `--raio:0px` e a regra "nada arredondado,
      em lugar NENHUM". A referência arredonda tudo: cartão 16px,
      herói 20px, pílula 999px. O redesign reverte a regra.
   2. TAMANHO DE FONTE. O piso da casa era 12.5px. Os rótulos de seção
      da referência são 11px e 10.5px. Aqui eles entram multiplicados
      por `--esc`, como todo o resto do sistema, para que o ajuste de
      escala dela continue valendo.
   ════════════════════════════════════════════════════════════ */

:root{
  /* ---- cor ---- */
  --rd-verde-800:#4E5F51;   /* cartão herói, botão primário, confirmado */
  --rd-verde-700:#3E4D41;   /* trilho dentro do herói, texto sobre bege */
  --rd-verde-300:#9DB399;   /* preenchimento de barra sobre o herói */
  --rd-areia-50:#FBF8F3;    /* barra de navegação, coluna lateral */
  --rd-areia-100:#F5F1EA;   /* fundo da aplicação */
  --rd-areia-200:#EFEADF;   /* cartão de nota, atalhos */
  --rd-areia-300:#EBE6DA;   /* item ativo da navegação, trilho do seletor */
  --rd-branco:#FFFFFF;
  --rd-borda:#E7E0D5;
  --rd-borda-forte:#DED7CB; /* borda de botão-pílula secundário */
  --rd-divisoria:#F0EBE1;   /* filete entre linhas dentro do cartão */
  --rd-texto-1:#2B2B28;     /* títulos e valores */
  --rd-texto-2:#6B675E;     /* corpo de apoio — 4,7:1 sobre o bege */
  --rd-texto-3:#6F6858;     /* rótulo em caixa alta — 4,9:1 */
  --rd-texto-nav:#5F594E;   /* item inativo da navegação lateral */

  --rd-ambar-bg:#F6E9D3; --rd-ambar-fg:#7A5A22; --rd-ambar-borda:#E8D6B4;
  --rd-vermelho-bg:#F7E0DA; --rd-vermelho-fg:#8E3B26; --rd-vermelho-borda:#E5B6A6;

  --rd-saude-ok:#6E8A6C; --rd-saude-atencao:#C4863A; --rd-saude-critico:#B3452F;

  /* sobre o herói verde, o texto não é branco puro */
  --rd-sobre-verde:#F2EFE8; --rd-sobre-verde-2:#D6DED3; --rd-sobre-verde-3:#CBD6C8;

  /* ---- forma ---- */
  --rd-raio-cartao:16px;
  --rd-raio-heroi:20px;
  --rd-raio-bloco:18px;
  --rd-raio-nav:11px;
  --rd-pilula:999px;

  /* ---- tipo ---- */
  --rd-serif:'Newsreader',Georgia,'Instrument Serif',serif;
  --rd-sans:'Karla','Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;

  /* ---- medida das colunas do desktop ---- */
  --rd-col-nav:236px;
  --rd-col-contexto:336px;
}

/* ------------------------------------------------------------
   RÓTULO DE SEÇÃO
   O elemento que dá o ar editorial da referência: caixa alta,
   espaçado, cinza. NÃO é heading — a tela tem um <h1> só.
   ------------------------------------------------------------ */
.rd-rotulo{
  font-family:var(--rd-sans);
  font-size:calc(11px * var(--esc,1));
  letter-spacing:.15em; text-transform:uppercase;
  color:var(--rd-texto-3); font-weight:600;
}
.rd-rotulo-linha{display:flex;align-items:center;justify-content:space-between;gap:12px}
/* o "ver tudo →" ao lado do rótulo: alvo de 44px sem empurrar o layout */
.rd-rotulo-acao{
  font-family:var(--rd-sans); font-size:calc(13px * var(--esc,1)); font-weight:600;
  color:var(--rd-verde-800); background:none; border:0; cursor:pointer;
  padding:10px 12px; margin:-10px -12px; border-radius:8px;
}

/* ------------------------------------------------------------
   CABEÇALHO DA TELA — rótulo → título → uma linha
   ------------------------------------------------------------ */
.rd-cabeca{display:flex;flex-direction:column;gap:7px}
.rd-cabeca h1{
  font-family:var(--rd-serif);
  font-size:calc(42px * var(--esc,1)); line-height:1.05; font-weight:400;
  margin:0; color:var(--rd-texto-1);
}
.rd-cabeca p{
  font-size:calc(14.5px * var(--esc,1)); line-height:1.5;
  color:var(--rd-texto-2); margin:0; max-width:620px;
}

/* ------------------------------------------------------------
   HERÓI — um número por tela, com a frase que diz o que ele significa.
   Três variantes: cheio (verde), atenção (âmbar) e excesso (vermelho).
   ------------------------------------------------------------ */
.rd-heroi{
  border-radius:var(--rd-raio-heroi);
  padding:22px 26px;
  display:flex; align-items:center; gap:22px;
  background:var(--rd-verde-800); color:var(--rd-sobre-verde);
  border:1px solid transparent;
}
.rd-heroi.rd-atencao{
  background:var(--rd-ambar-bg); border-color:var(--rd-ambar-borda); color:var(--rd-ambar-fg);
}
.rd-heroi.rd-excesso{
  background:var(--rd-vermelho-bg); border-color:var(--rd-vermelho-borda); color:var(--rd-vermelho-fg);
  padding:24px 26px; flex-direction:column; align-items:stretch; gap:16px;
}
.rd-heroi-corpo{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.rd-heroi-rotulo{
  font-size:calc(11px * var(--esc,1)); letter-spacing:.14em; text-transform:uppercase;
  font-weight:600; color:var(--rd-sobre-verde-3);
}
.rd-heroi.rd-atencao .rd-heroi-rotulo{color:var(--rd-ambar-fg)}
.rd-heroi.rd-excesso .rd-heroi-rotulo{color:var(--rd-vermelho-fg)}
.rd-heroi-titulo{font-size:calc(18px * var(--esc,1));font-weight:600}
.rd-heroi-apoio{font-size:calc(13px * var(--esc,1));color:var(--rd-sobre-verde-2)}
.rd-heroi-numero{
  font-family:var(--rd-serif); font-size:calc(44px * var(--esc,1)); line-height:1;
}
/* botão redondo dentro do herói (pausar cronômetro) */
.rd-heroi-bt{
  width:52px;height:52px;flex:none;border-radius:15px;background:var(--rd-verde-700);
  border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;
}

/* barra de três parcelas na mesma escala, com a linha de 100% */
.rd-barra{
  position:relative;height:22px;border-radius:11px;background:#EFD8D0;overflow:hidden;display:flex;
}
.rd-barra .rd-confirmado{background:var(--rd-verde-800)}
.rd-barra .rd-potencial{background:#D9B98A}
.rd-barra .rd-excedente{background:var(--rd-saude-critico)}
.rd-barra .rd-cem{position:absolute;top:0;bottom:0;width:2px;background:#5A2A1B}
.rd-barra-legenda{position:relative;height:16px;font-size:calc(12.5px * var(--esc,1));color:#7A4A34}
.rd-barra-legenda span{position:absolute;white-space:nowrap}

/* ------------------------------------------------------------
   CARTÃO DE CONTEXTO — no máximo três por tela, um CTA cada
   ------------------------------------------------------------ */
.rd-contexto{
  background:var(--rd-branco); border:1px solid var(--rd-borda);
  border-radius:var(--rd-raio-cartao); padding:18px 20px;
  display:flex; flex-direction:column; gap:6px;
}
.rd-contexto-rotulo{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-contexto-numero{font-family:var(--rd-serif);font-size:calc(32px * var(--esc,1));line-height:1;color:var(--rd-texto-1)}
.rd-contexto-conclusao{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2)}
.rd-contexto-conclusao.rd-alerta{color:var(--rd-vermelho-fg)}
.rd-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}

/* cartão que é botão: mesma caixa, com foco visível */
a.rd-contexto,button.rd-contexto{
  font:inherit;text-align:left;cursor:pointer;text-decoration:none;width:100%;
}
.rd-contexto:focus-visible,.rd-rotulo-acao:focus-visible,
.rd-nav-item:focus-visible,.rd-pilula:focus-visible{
  outline:2px solid var(--rd-verde-800); outline-offset:2px;
}

/* ------------------------------------------------------------
   BLOCO DE ATENÇÃO — um por tela, sempre com o que fazer
   ------------------------------------------------------------ */
.rd-atencao-bloco{
  background:var(--rd-ambar-bg); border:1px solid var(--rd-ambar-borda);
  border-radius:var(--rd-raio-bloco); padding:18px 22px;
  display:flex; align-items:center; gap:18px;
}
.rd-atencao-bloco.rd-vermelho{
  background:var(--rd-vermelho-bg); border-color:var(--rd-vermelho-borda);
}
.rd-atencao-texto{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.rd-atencao-titulo{font-size:calc(15px * var(--esc,1));font-weight:700;color:var(--rd-ambar-fg)}
.rd-atencao-apoio{font-size:calc(12.5px * var(--esc,1));color:var(--rd-ambar-fg)}
.rd-vermelho .rd-atencao-titulo,.rd-vermelho .rd-atencao-apoio{color:var(--rd-vermelho-fg)}

/* pílula de ação */
.rd-pilula{
  font-family:var(--rd-sans); font-size:calc(13px * var(--esc,1)); font-weight:600;
  padding:13px 22px; border-radius:var(--rd-pilula); border:0; cursor:pointer; flex:none;
  background:var(--rd-ambar-fg); color:#FBF3E4;
}
.rd-pilula.rd-sec{background:none;border:1px solid var(--rd-borda-forte);color:var(--rd-verde-800)}
.rd-pilula.rd-mini{font-size:calc(12.5px * var(--esc,1));padding:9px 16px;
  background:none;border:1px solid #CFC7B8;color:var(--rd-verde-800)}
.rd-vermelho .rd-pilula{background:var(--rd-vermelho-fg);color:#FBF1ED}
.rd-vermelho .rd-pilula.rd-sec{background:none;border-color:#C08C79;color:var(--rd-vermelho-fg)}

/* ------------------------------------------------------------
   LISTA DENTRO DE CARTÃO — "Precisa de você", agenda
   ------------------------------------------------------------ */
.rd-lista{background:var(--rd-branco);border:1px solid var(--rd-borda);
  border-radius:var(--rd-raio-cartao);padding:4px 20px}
.rd-lista-linha{display:flex;align-items:center;gap:14px;padding:15px 0;
  border-bottom:1px solid var(--rd-divisoria)}
.rd-lista-linha:last-child{border-bottom:0}
.rd-lista-nome{flex:1;font-size:calc(14px * var(--esc,1));font-weight:600;color:var(--rd-texto-1)}
.rd-lista-apoio{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2)}
.rd-ponto{width:8px;height:8px;border-radius:50%;flex:none}
.rd-ponto.rd-ok{background:var(--rd-saude-ok)}
.rd-ponto.rd-atende{background:var(--rd-saude-atencao)}
.rd-ponto.rd-critico{background:var(--rd-saude-critico)}

/* ------------------------------------------------------------
   NAVEGAÇÃO LATERAL (desktop, 236px)
   ------------------------------------------------------------ */
.rd-nav-lateral{
  width:var(--rd-col-nav); flex:none; background:var(--rd-areia-50);
  border-right:1px solid var(--rd-borda);
  display:flex; flex-direction:column; padding:26px 16px 20px;
}
.rd-nav-marca{display:flex;align-items:center;justify-content:space-between;padding:0 8px 22px}
.rd-nav-marca b{font-family:var(--rd-serif);font-size:calc(27px * var(--esc,1));font-weight:400;color:var(--rd-texto-1)}
.rd-nav-escritorio{font-size:calc(10.5px * var(--esc,1));letter-spacing:.12em;
  text-transform:uppercase;color:var(--rd-texto-3);font-weight:600}
.rd-nav-lista{display:flex;flex-direction:column;gap:3px}
.rd-nav-item{
  display:flex;align-items:center;gap:12px;width:100%;min-height:44px;
  padding:10px 14px;border:0;border-radius:var(--rd-raio-nav);
  background:transparent;color:var(--rd-texto-nav);
  font-family:var(--rd-sans);font-size:calc(14px * var(--esc,1));font-weight:500;
  cursor:pointer;text-align:left;text-decoration:none;
}
.rd-nav-item[aria-current="page"]{background:var(--rd-areia-300);color:var(--rd-texto-1);font-weight:600}
.rd-nav-item:hover{background:var(--rd-areia-200)}
.rd-nav-espaco{flex:1}
.rd-nav-pe{display:flex;flex-direction:column;gap:14px}

/* seletor Essencial/Completo, sempre visível */
.rd-seletor{display:flex;flex-direction:column;gap:7px;padding:0 6px}
.rd-seletor-trilho{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;
  background:var(--rd-areia-300);border-radius:var(--rd-raio-nav);padding:4px;
}
.rd-seletor-trilho button{
  min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--rd-texto-nav);
  font-family:var(--rd-sans);font-size:calc(12.5px * var(--esc,1));font-weight:600;cursor:pointer;
}
.rd-seletor-trilho button[aria-pressed="true"]{background:var(--rd-branco);color:var(--rd-texto-1)}

.rd-nav-conta{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;
  padding:8px 10px;border:0;border-radius:var(--rd-raio-nav);background:transparent;
  cursor:pointer;text-align:left;font-family:var(--rd-sans)}
.rd-nav-conta .rd-iniciais{width:34px;height:34px;border-radius:50%;background:var(--rd-verde-800);
  color:var(--rd-sobre-verde);display:flex;align-items:center;justify-content:center;
  font-size:calc(12.5px * var(--esc,1));font-weight:600;flex:none}

/* ------------------------------------------------------------
   NAVEGAÇÃO INFERIOR (celular) — 4 destinos + criar
   ------------------------------------------------------------ */
.rd-nav-inferior{
  position:absolute;left:0;right:0;bottom:0;height:84px;
  background:var(--rd-areia-50);border-top:1px solid var(--rd-borda);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:stretch;padding:8px 8px 14px;
}
.rd-nav-inferior button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  min-height:46px;background:none;border:0;padding:4px;font:inherit;cursor:pointer;border-radius:12px;
}
.rd-nav-inferior span{font-size:calc(12.5px * var(--esc,1));color:#726C5F}
.rd-nav-inferior button[aria-current="page"] span{color:var(--rd-texto-1);font-weight:600}
.rd-criar{
  position:absolute;left:50%;bottom:54px;transform:translateX(-50%);
  width:60px;height:60px;border-radius:50%;background:var(--rd-verde-800);
  border:4px solid var(--rd-areia-100);display:flex;align-items:center;justify-content:center;
  padding:0;cursor:pointer;
}

/* ------------------------------------------------------------
   ESQUELETO DE CARREGAMENTO
   No formato da tela final. Nunca "Sem nome", "0 projetos" ou
   "crie o primeiro projeto" antes de decidir o estado.
   ------------------------------------------------------------ */
.rd-osso{display:block;background:#E9E3D7;border-radius:6px;animation:rd-pulso 1.5s ease-in-out infinite}
@keyframes rd-pulso{0%,100%{opacity:1}50%{opacity:.55}}
@media (prefers-reduced-motion: reduce){ .rd-osso{animation:none} }
.rd-osso-heroi{height:112px;border-radius:var(--rd-raio-heroi);width:100%}
.rd-osso-cartao{height:116px;border-radius:var(--rd-raio-cartao);width:100%}
.rd-osso-bloco{height:78px;border-radius:var(--rd-raio-bloco);width:100%}
.rd-osso-lista{height:150px;border-radius:var(--rd-raio-bloco);width:100%}
.rd-osso-nav{height:44px;border-radius:var(--rd-raio-nav);width:100%;margin-bottom:3px}

/* a faixa que diz em que pé está a sincronização */
.rd-faixa{
  position:absolute;left:50%;bottom:34px;transform:translateX(-50%);
  display:flex;align-items:center;gap:12px;
  background:var(--rd-areia-50);border:1px solid var(--rd-borda-forte);
  border-radius:var(--rd-pilula);padding:13px 22px;
  font-size:calc(13px * var(--esc,1));color:#3F3A32;z-index:5;
}
.rd-faixa .rd-sinal{width:9px;height:9px;border-radius:50%;flex:none;background:var(--rd-saude-atencao)}
.rd-faixa.rd-local .rd-sinal{background:var(--rd-texto-3)}
.rd-faixa.rd-falha .rd-sinal{background:var(--rd-saude-critico)}

/* ------------------------------------------------------------
   ARMAÇÃO DA TELA — nav | principal | contexto
   ------------------------------------------------------------ */
.rd-tela{display:flex;min-height:100%;background:var(--rd-areia-100)}
.rd-principal{flex:1;display:flex;gap:26px;padding:34px 38px;min-width:0}
.rd-coluna{flex:1;display:flex;flex-direction:column;gap:20px;min-width:0}
.rd-contexto-coluna{width:var(--rd-col-contexto);flex:none;display:flex;flex-direction:column;gap:14px}

@media (max-width: 1100px){
  .rd-principal{flex-direction:column;padding:24px 20px}
  .rd-contexto-coluna{width:auto}
  .rd-trio{grid-template-columns:1fr}
}

/* ------------------------------------------------------------
   HERÓI EM COLUNA — quando o número precisa de uma barra abaixo
   (Capacidade). Sobre o verde escuro, o trilho e o preenchimento
   mudam: cinza-claro sobre verde some.
   ------------------------------------------------------------ */
.rd-heroi.rd-coluna{flex-direction:column;align-items:stretch;gap:16px}
.rd-heroi.rd-coluna .rd-heroi-topo{display:flex;align-items:center;gap:10px}
.rd-heroi.rd-coluna .rd-heroi-frase{font-size:calc(17px * var(--esc,1));font-weight:700}
.rd-heroi.rd-coluna .rd-heroi-pe{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.rd-heroi.rd-coluna .rd-heroi-pe .rd-conclusao{flex:1;min-width:220px;
  font-size:calc(14px * var(--esc,1));line-height:1.5}

/* sobre o verde escuro */
.rd-heroi:not(.rd-atencao):not(.rd-excesso) .rd-barra{background:var(--rd-verde-700)}
.rd-heroi:not(.rd-atencao):not(.rd-excesso) .rd-barra .rd-confirmado{background:var(--rd-verde-300)}
.rd-heroi:not(.rd-atencao):not(.rd-excesso) .rd-barra-legenda{color:var(--rd-sobre-verde-2)}
.rd-heroi:not(.rd-atencao):not(.rd-excesso) .rd-pilula{background:var(--rd-sobre-verde);color:var(--rd-verde-800)}
.rd-heroi:not(.rd-atencao):not(.rd-excesso) .rd-pilula.rd-sec{background:none;
  border:1px solid var(--rd-verde-300);color:var(--rd-sobre-verde)}
/* sobre o âmbar */
.rd-heroi.rd-atencao .rd-barra{background:#EDDDC0}
.rd-heroi.rd-atencao .rd-barra-legenda{color:var(--rd-ambar-fg)}

/* ------------------------------------------------------------
   CARGA POR PESSOA — nome, barra dupla, percentuais
   ------------------------------------------------------------ */
.rd-pessoa{display:flex;align-items:center;gap:18px;padding:16px 0;
  border-bottom:1px solid var(--rd-divisoria)}
.rd-pessoa:last-child{border-bottom:0}
.rd-pessoa-nome{font-size:calc(14px * var(--esc,1));font-weight:600;width:92px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-pessoa-barra{flex:1;height:10px;border-radius:5px;background:#EAE4D8;overflow:hidden;display:flex;min-width:80px}
.rd-pessoa-barra .rd-confirmado{background:var(--rd-verde-800)}
.rd-pessoa-barra .rd-potencial{background:#D9B98A}
.rd-pessoa-barra .rd-excedente{background:var(--rd-saude-critico)}
.rd-pessoa-pct{font-size:calc(13px * var(--esc,1));color:var(--rd-texto-2);
  width:150px;text-align:right;flex:none}
.rd-pessoa-pct.rd-alerta{color:var(--rd-vermelho-fg);font-weight:600}

/* lista com pouco respiro por dentro (agenda, propostas) */
.rd-lista.rd-solta{padding:6px 20px}
.rd-lista-item{display:flex;flex-direction:column;gap:4px;padding:16px 0;
  border-bottom:1px solid var(--rd-divisoria)}
.rd-lista-item:last-child{border-bottom:0}

/* cartão de nota — a explicação que evita a desconfiança */
/* v416: os escritórios do projeto, com o estado do vínculo ao lado do nome */
.rd-parc-chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.rd-parc-chips .rd-parc-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;
  border:1px solid var(--borda);border-radius:999px;font-size:calc(13.5px * var(--esc,1))}
.rd-parc-chips .rd-parc-chip b{font-weight:600}
.rd-nota-alerta{border-left:3px solid var(--erro);align-items:flex-start}
/* white-space:normal e min-width:0 porque o aviso vive DENTRO de tabela,
   e a celula herda nowrap: sem isto a frase nao quebra linha nenhuma, estica
   a celula e empurra a coluna dos valores para fora da janela (v420).
   align-items:flex-start em coluna faz o filho medir a frase inteira, entao
   o texto tambem precisa esticar. */
.rd-nota{background:var(--rd-areia-200);border-radius:var(--rd-raio-bloco);
  padding:18px 20px;display:flex;flex-direction:column;gap:9px;
  white-space:normal;min-width:0}
.rd-nota > span{align-self:stretch;min-width:0;overflow-wrap:anywhere}
.rd-nota b{font-size:calc(13.5px * var(--esc,1));font-weight:700;color:var(--rd-verde-700)}
.rd-nota span{font-size:calc(12.5px * var(--esc,1));line-height:1.5;color:var(--rd-verde-800)}

/* ------------------------------------------------------------
   ÁREA DE CONTEÚDO sem a coluna de navegação — é o que as telas
   novas usam enquanto a casca antiga ainda está de pé.
   ------------------------------------------------------------ */
.rd-area{display:flex;gap:26px;align-items:flex-start}
/* 18.12 (v412): empilhadas, as colunas ESTICAM até a largura da tela. Com align-items:flex-start herdado da
   linha, cada coluna ficava com a largura do próprio conteúdo (a Capacidade media 496px num telefone de 375)
   e a tela rolava de lado. */
@media (max-width: 1100px){ .rd-area{flex-direction:column;align-items:stretch} .rd-area>*{width:100%;max-width:100%} }

/* a mesma barra, fina, na linha de cada pessoa */
.rd-barra.rd-fina{height:10px;border-radius:5px;background:#EAE4D8;flex:1;min-width:80px}
.rd-barra.rd-fina .rd-cem{width:1px;background:#8E3B26}

/* ------------------------------------------------------------
   CONTRASTE DO APOIO DO HERÓI (v335)
   ------------------------------------------------------------
   "A linha '26min apontadas hoje · 17 atrasadas' está clara demais sobre o
    bege — não passa em 4.5:1. É justamente a linha que traduz o número
    protagonista, então é a última que pode sumir."

   --rd-sobre-verde-2 (#D6DED3) foi escolhido para o cartão VERDE ESCURO.
   Sobre o âmbar e sobre o vermelho ele desaparece. Cada tom tem o seu
   texto de apoio, e é o mesmo que a referência usa nos rótulos.
   ------------------------------------------------------------ */
.rd-heroi.rd-atencao .rd-heroi-apoio,
.rd-heroi.rd-atencao .rd-heroi-titulo,
.rd-heroi.rd-atencao .rd-heroi-numero{color:var(--rd-ambar-fg)}
.rd-heroi.rd-excesso .rd-heroi-apoio,
.rd-heroi.rd-excesso .rd-heroi-titulo,
.rd-heroi.rd-excesso .rd-heroi-numero{color:var(--rd-vermelho-fg)}

/* ------------------------------------------------------------
   O ESTILO DA REFERÊNCIA NA BARRA ANTIGA (v335)
   ------------------------------------------------------------
   "A estrutura do sistema vence a minha. Mantenha as áreas que existem,
    acrescente Obras, e aplique só o ESTILO da referência."

   A coluna continua sendo a do sistema — com Minhas tarefas e Comercial,
   que a referência não tinha porque foi desenhada antes. O que muda é a
   aparência: item ativo com fundo areia-300 e raio 11px, ícone 19px,
   altura mínima 44px.

   Fica aqui, e não em styles.css, porque é regra do redesign: quando a
   barra inteira for convertida, isto sai junto com o resto.
   ------------------------------------------------------------ */
.nav-principal .nav-item{
  min-height:44px; padding:10px 14px; border-radius:var(--rd-raio-nav);
  color:var(--rd-texto-nav); font-size:calc(14px * var(--esc,1)); font-weight:500;
  gap:12px;
}
.nav-principal .nav-item .ico svg{width:19px;height:19px}
.nav-principal .nav-item:hover{background:var(--rd-areia-200)}
/* o ativo era preto invertido; passa a ser o realce discreto da referência */
.nav-principal .nav-item.ativo{
  background:var(--rd-areia-300)!important; color:var(--rd-texto-1)!important;
  font-weight:600;
}
.nav-principal .nav-item:focus-visible{outline:2px solid var(--rd-verde-800);outline-offset:2px}

/* ------------------------------------------------------------
   ITEM 1 DO ADENDO (02/09): TODO NÚMERO QUE APONTA UM PROBLEMA
   LEVA A ALGUM LUGAR.

   Só as classes NOVAS moram aqui. O reset dos elementos antigos
   que viraram <button> (.agenda-item, .ag-txt, .aba, .ajuda) está
   em styles.css, junto do resto do mundo antigo — este arquivo não
   pode virar o lugar onde as duas linguagens se misturam.
   ------------------------------------------------------------ */
.rd-heroi-ir, .rd-num-link{
  background:none; border:0; padding:0; margin:0;
  font:inherit; color:inherit; text-align:inherit;
  letter-spacing:inherit; text-transform:inherit;
  cursor:pointer; appearance:none; -webkit-appearance:none;
}
/* o herói inteiro é o alvo: o número é o maior da tela */
.rd-heroi-ir{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; width:100%; min-height:44px;
}
.rd-heroi-ir:hover .rd-heroi-titulo{text-decoration:underline;text-underline-offset:3px}
.rd-heroi-ir:focus-visible{outline:2px solid var(--rd-areia-100);outline-offset:3px}

/* os dois números do título da agenda */
.rd-num-link{
  min-height:44px; display:inline-flex; align-items:center;
  text-decoration:underline; text-decoration-color:transparent;
  text-underline-offset:3px; transition:text-decoration-color .12s;
}
.rd-num-link:hover{text-decoration-color:currentColor}
.rd-num-link.rd-alerta{color:var(--erro)}

/* ------------------------------------------------------------
   AVISO NA LINHA — a barra que fica DENTRO da página.

   .rd-faixa é a barra flutuante de sincronia: position:absolute,
   centrada na parte de baixo da tela. Eu a reusei para as pílulas
   de filtro e para o aviso da agenda, e elas saíram flutuando por
   cima do conteúdo — o teste passava porque conferia o TEXTO, não
   o desenho.

   Esta é a versão que ocupa o seu lugar no fluxo.
   ------------------------------------------------------------ */
.rd-nota-linha{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:var(--rd-areia-50); border:1px solid var(--rd-borda-forte);
  border-radius:var(--rd-raio-cartao); padding:12px 16px;
  font-size:calc(14px * var(--esc,1)); color:#3F3A32;
}
.rd-nota-linha > b{font-weight:600}
/* quando o aviso tem duas linhas de texto, elas empilham e as ações
   ficam embaixo — em vez de virarem colunas lado a lado */
.rd-nota-linha.rd-empilha{flex-direction:column; align-items:flex-start; gap:6px}


/* ------------------------------------------------------------
   PASSO 6 — A PRIMEIRA DOBRA DA FICHA DO PROJETO
   Só classes novas. A capa antiga (.proj-capa) fica como faixa fina,
   sem texto: o texto passou para a cabeça da referência.
   ------------------------------------------------------------ */
.rd-proj-dobra{margin-bottom:18px}
.rd-capa-fina{height:96px;margin-bottom:14px;border-radius:var(--rd-raio-cartao);border:0}
.rd-capa-fina .capa-veu{background:linear-gradient(180deg,rgba(43,43,40,.05),rgba(43,43,40,.22))}
.rd-cabeca-acoes{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rd-cabeca-acoes .rd-cabeca{flex:1;min-width:260px}
.rd-acoes{display:flex;align-items:center;gap:8px;padding-top:26px}
.rd-acoes .rd-pilula{text-decoration:none}

.rd-saude-linha{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:14px;
  font-size:calc(14.5px * var(--esc,1))}
.rd-saude-ponto{width:10px;height:10px;border-radius:50%;flex:none;align-self:center}
.rd-saude-pct{font-family:var(--rd-serif);font-size:calc(22px * var(--esc,1));line-height:1}
.rd-saude-frase{color:var(--rd-texto-2, var(--texto2))}
.rd-progresso{height:8px;border-radius:999px;background:var(--rd-areia-200);overflow:hidden;margin-top:8px}
.rd-progresso > span{display:block;height:100%;background:var(--rd-verde-800);border-radius:999px}
.rd-progresso-leg{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3, var(--texto2));margin-top:6px}

.rd-entrega{display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin-top:16px;padding:14px 16px;border:1px solid var(--rd-borda-forte);
  border-radius:var(--rd-raio-cartao);background:var(--rd-areia-50)}
.rd-entrega > div{display:flex;flex-direction:column;gap:3px;min-width:0}
.rd-entrega b{font-size:calc(15.5px * var(--esc,1))}
.rd-entrega.rd-alerta{border-color:var(--rd-saude-critico, var(--erro))}
.rd-entrega .rd-pilula{flex:none;min-height:44px}

.rd-tarefa-linha{display:grid;grid-template-columns:1fr auto auto auto;gap:12px;
  align-items:center;min-height:44px;padding:6px 0;border-top:1px solid var(--rd-borda);
  font-size:calc(14px * var(--esc,1));color:var(--rd-texto-2, var(--texto2))}
.rd-tarefa-linha:first-child{border-top:0}
.rd-tarefa-nome{background:none;border:0;padding:0;margin:0;font:inherit;color:var(--rd-texto-1, var(--texto));
  text-align:left;cursor:pointer;min-height:44px;font-weight:600}
.rd-tarefa-nome:hover{text-decoration:underline;text-underline-offset:3px}
.rd-tarefa-linha .rd-alerta{color:var(--rd-saude-critico, var(--erro))}
@media (max-width:760px){
  .rd-tarefa-linha{grid-template-columns:1fr auto}
  .rd-tarefa-linha > span:nth-child(2), .rd-tarefa-linha > span:nth-child(4){display:none}
  .rd-acoes{padding-top:0}
}

/* ------------------------------------------------------------
   RESSALVA — sempre visível, nos dois modos (A3, v346)
   O Completo acrescenta tabela, filtro, histórico e análise; a nota
   sobre a confiabilidade do número nunca mora lá.
   ------------------------------------------------------------ */
.rd-ressalva{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2);line-height:1.5}
.rd-saude-ressalva{margin-top:-4px}

/* ------------------------------------------------------------
   O ESQUELETO NO TELEFONE (v352) — a forma da casca de quatro abas,
   sem um pixel fixo de largura. O véu do arranque é position:fixed, e o
   Safari do iPhone deixa arrastar o que passa da janela mesmo ali dentro.
   ------------------------------------------------------------ */
.rd-tela-celular{display:flex;flex-direction:column;width:100%;max-width:100%;min-height:100vh;
  overflow:hidden;background:var(--rd-areia-100)}
.rd-esq-corpo{flex:1;display:flex;flex-direction:column;gap:12px;padding:20px 16px;min-width:0}
.rd-osso-linha{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--rd-borda);min-width:0}
.rd-esq-barra{display:flex;gap:6px;padding:8px 10px;border-top:1px solid var(--rd-borda)}
.rd-tela[aria-busy] .rd-osso{max-width:100%}


/* ═════════════════════════════════════════════════
   OBRAS (v362) — artboards "Obra · Cronograma", "Obra no celular", "Reagendar"
   ═════════════════════════════════════════════════ */
.rd-ob-tela{display:flex;flex-direction:column;gap:14px;max-width:none}   /* 12.11 (v386): a tela usa a largura que tem */
.rd-ob-rotulo{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#6F6858;font-weight:600}
.rd-ob-cabeca{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.rd-ob-cabeca-texto{display:flex;flex-direction:column;gap:5px}
.rd-ob-titulo{font-family:'Newsreader',Georgia,serif;font-size:36px;line-height:1.03;font-weight:400;margin:0}
/* 21/09 (v456): AQUI MORAVA .rd-ob-linha COM font-size:13px;color:#6B675E;margin:0 — o texto miúdo do cabeçalho.
   O nome já era usado mais abaixo pela LINHA do gráfico de Gantt (display:flex, min-width:860px, borda, cursor de
   mão), que vem depois e ganhava: todo <p class="rd-ob-linha"> saía 860px de largura, inclusive no telefone de
   390px. O texto do cabeçalho passou a usar .rd-ob-cabeca-linha (logo abaixo), que já dizia o que é; a letra e a
   margem que as linhas do Gantt herdavam desta regra foram para a regra delas. Uma palavra, uma coisa. */
/* 14.12 (v395): a linha do cabeçalho da obra — texto corrido, quebra por palavra, um link só */
.rd-ob-cabeca-linha{font-size:13px;color:#6B675E;margin:0;max-width:720px;line-height:1.5}
/* 21/09 (v456): O LINK NO FIM DA FRASE NÃO ABRE BURACO NO MEIO DELA.
   .rd-num-link é uma caixa de 44px (o alvo do dedo) em inline-flex. Enquanto este parágrafo era uma
   FAIXA flex — a colisão de nome que a v456 desfez —, o link era item do flex e a altura dele não
   encostava no texto. Virando texto corrido, ele passou a ser uma caixa de 44px DENTRO de uma linha
   de texto de 19,5px: a linha que o carrega estica para 44px e a frase ganha um buraco. Medido na
   frase de abertura de Obras, a 1440 e a 1100: salto de 31px entre as duas linhas da mesma sentença,
   e o ponto-e-vírgula órfão no fim da primeira.
   O desenho não muda — quem cresce é a ÁREA de toque, por um ::after invisível que não ocupa espaço
   no fluxo. É o truque do "?" e do .alvo-44 (css/styles.css): "uma bolha de 44px no meio da frase
   empurraria o texto; o pseudo-elemento não ocupa espaço nenhum". */
.rd-ob-cabeca-linha .rd-num-link{white-space:nowrap;display:inline;min-height:0;position:relative}
.rd-ob-cabeca-linha .rd-num-link::after{content:'';position:absolute;left:0;top:50%;width:100%;height:44px;transform:translateY(-50%)}
.rd-ob-cabeca-acoes{display:flex;align-items:center;gap:9px}
.rd-ob-bt{font-size:12.5px;font-weight:600;color:#F2EFE8;background:#4E5F51;border:0;border-radius:999px;padding:11px 18px;cursor:pointer;font-family:inherit}
.rd-ob-bt-sec{color:#4E5F51;background:#fff;border:1px solid #CFC7B8}
.rd-ob-bt-vermelho{flex:none;background:#8E3B26;color:#FBF1ED;font-size:12.5px;font-weight:600;padding:12px 18px;border-radius:999px;border:0;cursor:pointer;font-family:inherit}
.rd-ob-bt-vazado{background:none;border:1px solid #C08C79;color:#8E3B26}
.rd-ob-heroi{background:#4E5F51;color:#F2EFE8;border-radius:18px;padding:16px 22px;display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.rd-ob-heroi-num{display:flex;flex-direction:column;gap:2px}
.rd-ob-heroi-pct{font-family:'Newsreader',Georgia,serif;font-size:36px;line-height:1}
.rd-ob-heroi-leg{font-size:12.5px;color:#D6DED3}
.rd-ob-heroi-frase{font-size:14px;color:#F2EFE8}
.rd-ob-heroi-meio{flex:1;min-width:220px;display:flex;flex-direction:column;gap:7px}
.rd-ob-barra{height:7px;border-radius:4px;background:#3E4D41;overflow:hidden;display:flex}
.rd-ob-barra>span{background:#9DB399;display:block}
.rd-ob-heroi-datas{display:flex;gap:26px;text-align:right}
.rd-ob-heroi-datas>div{display:flex;flex-direction:column;gap:2px}
.rd-ob-data-orig{font-size:19px;font-weight:600;color:#D6DED3}
.rd-ob-data-atual{font-size:22px;font-weight:700;color:#D6DED3}
.rd-ob-data-atual.rd-ob-tarde{color:#F0D9AB}
.rd-ob-gantt{background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:4px 20px 8px;display:flex;flex-direction:column;overflow-x:auto}
.rd-ob-gantt-cab,.rd-ob-linha{display:flex;align-items:center;gap:12px;min-width:860px}
.rd-ob-gantt-cab{align-items:flex-end;padding:12px 0 8px;border-bottom:1px solid #E7E0D5}
.rd-ob-gantt-cab>span{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#6F6858;font-weight:600}
/* v456: font-size e margin vêm daqui — até a v455 as linhas herdavam os dois da regra do texto miúdo do cabeçalho,
   que usava este mesmo nome de classe lá em cima. A letra da linha é a mesma de sempre (13px). */
.rd-ob-linha{padding:10px 0;border-bottom:1px solid #F0EBE1;background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left;cursor:pointer;font-family:inherit;color:inherit;font-size:13px;margin:0}
.rd-ob-linha:last-of-type{border-bottom:0}
.rd-ob-linha:hover{background:#FBF8F3}
.rd-ob-col-macro{width:214px;flex:none;display:flex;flex-direction:column;gap:2px}
.rd-ob-macro-nome{font-size:13px;font-weight:600;color:#2B2B28}
.rd-ob-macro-fase{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:#6F6858;font-weight:600}
/* 19.22 (12/09): a linha da obra civil que volta depois de uma pausa diz isso sob o nome — apoio pequeno, sem vermelho:
   não é desvio nem atraso ("ele pausa e volta") */
.rd-ob-macro-pausa{font-size:12.5px;letter-spacing:0;text-transform:none;color:#6B675E;font-weight:400;line-height:1.25;white-space:normal}
.rd-ob-col-prev{width:116px;flex:none;font-size:12.5px;color:#736C5D}
.rd-ob-col-atual{width:116px;flex:none;font-size:12.5px;color:#2B2B28;font-weight:600}
.rd-ob-col-dur{width:46px;flex:none;font-size:12.5px;color:#6B675E;text-align:right}
.rd-ob-col-desvio{width:58px;flex:none;font-size:12.5px;font-weight:600;color:#6B675E;text-align:right}
.rd-ob-vermelho{color:#8E3B26!important}
.rd-ob-ambar{color:#7A5A22!important}
/* Guarda 13 (v414): NO HERÓI VERDE-ESCURO, O ÂMBAR É O CLARO. "previsão em elaboração" saía em âmbar
   escuro sobre verde escuro — contraste 1,08:1, praticamente invisível. A mesma classe serve às duas
   situações (linha clara da tabela e faixa escura do herói); no herói ela usa o âmbar claro que já existe. */
.rd-ob-data-atual.rd-ob-ambar{color:#F0D9AB!important}
.rd-ob-col-gantt{flex:1;position:relative;height:24px;min-width:0}
.rd-ob-eixo{height:16px}
.rd-ob-eixo span{position:absolute;transform:translateX(-50%);font-size:12.5px;color:#6F6858;font-weight:600;white-space:nowrap}
/* 19.14 (11/09): "Cronograma com mais de 6 meses pode ter rolagem lateral para evitar isso" — as datas do eixo
   sobrepostas. Só no quadro do cronograma (.rd-ob-gantt-cron): cada semana tem a largura do rótulo dd/mm/aaaa
   (88px, o rótulo mede 80), a linha cresce com o conteúdo e o quadro rola para o lado; o nome da linha fica fixo à
   esquerda. Obra curta cabe na tela e não rola — nada muda para ela. Compras, corrente e Planejado × Executado
   são grades com largura própria e ficam como estavam. O trilho recua 40px de cada lado para o primeiro e o
   último rótulo caberem centrados na marca. */
.rd-ob-gantt-cron .rd-ob-gantt-cab,.rd-ob-gantt-cron .rd-ob-linha:not(.rd-ob-linha-estatica){width:max-content;min-width:100%}
.rd-ob-gantt-cron .rd-ob-col-gantt{min-width:calc(var(--semanas,1) * 88px + 80px)}
.rd-ob-trilho{position:absolute;left:40px;right:40px;top:0;bottom:0;display:block}
.rd-ob-gantt-cron .rd-ob-col-macro{position:sticky;left:0;background:#fff;z-index:1}
.rd-ob-gantt-cron .rd-ob-linha:hover .rd-ob-col-macro{background:#FBF8F3}
.rd-ob-heroi-ressalva{color:#F0D9AB}
.rd-ob-grade{position:absolute;left:0;right:0;top:0;bottom:0;background:repeating-linear-gradient(to right,#EFEADF 0 1px,transparent 1px 12.5%)}
.rd-ob-hoje{position:absolute;top:-6px;bottom:-6px;width:1.5px;background:#B3452F;opacity:.55}
.rd-ob-barra-orig{position:absolute;top:3px;height:6px;border-radius:3px;background:#DED7CB}
.rd-ob-barra-atual{position:absolute;top:12px;height:10px;border-radius:5px}
.rd-ob-legenda{display:flex;align-items:center;gap:18px;padding:10px 0 2px;flex-wrap:wrap}
.rd-ob-legenda>span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#6B675E}
.rd-ob-legenda>span>i{display:inline-block;width:20px;height:9px;border-radius:5px}
.rd-ob-legenda .rd-ob-vermelho{font-weight:600}
.rd-ob-legenda-hoje{margin-left:auto;color:#8E3B26!important}
.rd-ob-hoje-leg{width:1.5px!important;height:13px!important;background:#B3452F;border-radius:0!important}
.rd-ob-duplo{display:flex;gap:13px;flex-wrap:wrap}
.rd-ob-alerta{flex:1.4;min-width:320px;background:#F7E0DA;border:1px solid #E5B6A6;border-radius:18px;padding:15px 19px;display:flex;align-items:center;gap:16px}
.rd-ob-alerta>span{flex:1;font-size:13px;line-height:1.5;color:#8E3B26}
.rd-ob-calmo{flex:1.4;min-width:320px;background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:15px 19px;display:flex;align-items:center;gap:12px;font-size:13px;color:#4E5F51}
.rd-ob-atrasos{flex:1;min-width:280px;background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:14px 19px;display:flex;align-items:center;gap:20px}
.rd-ob-atraso{display:flex;align-items:baseline;gap:5px}
.rd-ob-atraso>b{font-family:'Newsreader',Georgia,serif;font-size:24px;font-weight:400}
.rd-ob-atraso>small{font-size:12.5px;color:#6B675E}
.rd-ob-link{margin-left:auto;font-size:12.5px;color:#4E5F51;font-weight:600;background:none;border:0;padding:10px 8px;margin-right:-8px;cursor:pointer;font-family:inherit}
.rd-ob-equipes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.rd-ob-equipe{background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:14px 19px;display:flex;flex-direction:column;gap:4px;text-align:left;cursor:pointer;font-family:inherit;color:inherit}
.rd-ob-equipe-num{font-family:'Newsreader',Georgia,serif;font-size:28px;line-height:1}
.rd-ob-equipe-num>small{font-size:12.5px;color:#6B675E;font-family:'Karla',system-ui,sans-serif}
.rd-ob-equipe-pct{font-size:12.5px;color:#6B675E}
.rd-ob-lista{background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:4px 20px 8px;display:flex;flex-direction:column}
.rd-ob-lista-cab,.rd-ob-obra-linha{display:grid;grid-template-columns:2fr .6fr .9fr 1.4fr 1.2fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #F0EBE1}
.rd-ob-lista-cab>span{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#6F6858;font-weight:600}
.rd-ob-obra-linha{background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left;cursor:pointer;font-family:inherit;color:inherit}
.rd-ob-obra-linha:hover{background:#FBF8F3}
.rd-ob-obra-nascer{cursor:default}
.rd-ob-obra-nome{display:flex;flex-direction:column;gap:2px}
.rd-ob-obra-nome>b{font-size:13.5px}
.rd-ob-obra-nome>small{font-size:12.5px;color:#6B675E}
.rd-ob-obra-pct{font-family:'Newsreader',Georgia,serif;font-size:22px}
.rd-ob-obra-entrega{font-size:13px;font-weight:600}
.rd-ob-obra-entrega>em{font-style:normal;color:#7A5A22;font-size:12.5px;margin-left:4px}
.rd-ob-obra-prox,.rd-ob-obra-alerta{font-size:12.5px;color:#6B675E}
.rd-ob-vazio{padding:14px 0;font-size:13px;color:#6B675E}
.rd-ob-reagendar .rd-ob-data-grande{font-family:'Newsreader',Georgia,serif;font-size:26px}
.rd-ob-impacto{margin-top:10px;font-size:13.5px;line-height:1.5;color:#2B2B28;background:#EFEADF;border-radius:14px;padding:12px 14px}
.rd-ob-impacto-num{font-family:'Newsreader',Georgia,serif;font-size:22px;color:#8E3B26;font-weight:400}
/* celular */
.rd-obc-tela{display:flex;flex-direction:column;gap:12px;padding:6px 0 90px}
.rd-obc-cabeca{display:flex;flex-direction:column;gap:6px}
/* v455: o que o cliente está vendo no portal, no telefone — sem virar alarme (é informação, não aviso): a mesma
   letra e cor do texto do cabeçalho, um pouco mais apagada. (A classe .rd-ob-linha, que nasceu valendo duas
   coisas, virou só a linha do Gantt na v456; o texto do cabeçalho é .rd-ob-cabeca-linha.) */
.rd-ob-cel-portal{font-size:13px;line-height:1.5;color:#6B675E;margin:0;opacity:.9}
.rd-obc-titulo{font-family:'Newsreader',Georgia,serif;font-size:30px;line-height:1.03;font-weight:400;margin:0}
.rd-obc-heroi{background:#4E5F51;color:#F2EFE8;border-radius:18px;padding:17px 19px;display:flex;flex-direction:column;gap:10px}
.rd-obc-heroi-topo{display:flex;align-items:flex-end;justify-content:space-between}
.rd-obc-heroi-topo>div{display:flex;flex-direction:column;gap:2px}
.rd-obc-pct{font-family:'Newsreader',Georgia,serif;font-size:42px;line-height:1}
.rd-obc-leg{font-size:12.5px;color:#D6DED3}
.rd-obc-fase{font-size:12.5px;color:#D6DED3;text-align:right;max-width:150px;line-height:1.35}
.rd-obc-heroi .rd-ob-barra{height:6px;border-radius:3px}
.rd-obc-alerta{background:#F7E0DA;border:1px solid #E5B6A6;border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.rd-obc-alerta-t{font-size:14px;font-weight:700;color:#8E3B26}
.rd-obc-alerta-x{font-size:12.5px;line-height:1.5;color:#8E3B26}
.rd-obc-alerta-bts{display:flex;gap:8px}
.rd-obc-secao{display:flex;flex-direction:column;gap:9px}
.rd-obc-lista{background:#fff;border:1px solid #E7E0D5;border-radius:16px;padding:2px 15px}
.rd-obc-item{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #F0EBE1;width:100%;background:none;border-left:0;border-right:0;border-top:0;text-align:left;font-family:inherit;color:inherit}
.rd-obc-item:last-child{border-bottom:0}
.rd-obc-ponto{width:8px;height:8px;border-radius:50%;flex:none;display:inline-block}
.rd-obc-item-t{flex:1;display:flex;flex-direction:column;gap:2px}
.rd-obc-item-t>b{font-size:14px;font-weight:600}
.rd-obc-item-t>small{font-size:12.5px;color:#6B675E}
.rd-obc-botoes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.rd-obc-botoes>button{background:#EFEADF;border:0;border-radius:14px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:7px;min-height:78px;justify-content:center;cursor:pointer;font-family:inherit}
.rd-obc-botoes>button>span{font-size:12.5px;color:#3E4D41;font-weight:600}
@media (max-width:760px){
  .rd-ob-tela{gap:12px}
  .rd-ob-titulo{font-size:30px}
  .rd-ob-heroi{gap:16px;padding:14px 16px}
  .rd-ob-heroi-datas{width:100%;justify-content:space-between;text-align:left}
  .rd-ob-equipes{grid-template-columns:1fr}
  .rd-ob-lista-cab{display:none}
  .rd-ob-obra-linha{grid-template-columns:1fr 1fr;row-gap:4px}
}

/* A3 — a corrente (v363) */
.rd-ob-corrente-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0 6px;flex-wrap:wrap}
.rd-ob-corrente-elos{font-size:12.5px;color:#6B675E;display:inline-flex;align-items:center;gap:6px}
.rd-ob-corrente-linha{display:grid;grid-template-columns:214px repeat(6,minmax(0,1fr));gap:10px;min-width:860px}
.rd-ob-corrente-linha .rd-ob-col-macro{width:auto}
.rd-ob-elo{font-size:12.5px;font-weight:600;color:#2B2B28;display:flex;flex-direction:column;gap:2px}
.rd-ob-elo>small{font-size:12.5px;color:#6B675E;font-weight:400}
.rd-ob-chip{display:inline-block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;padding:2px 7px;border-radius:999px;width:fit-content}
.rd-ob-chip-ok{background:#E3EBDF;color:#3B4A3E}
.rd-ob-chip-meio{background:#F3E6CC;color:#7A5A22}
.rd-ob-chip-erro{background:#F7E0DA;color:#8E3B26}
.rd-ob-desembolso{flex-wrap:wrap}
.rd-ob-antes{color:#7A5A22;border-color:#E9D9B5;background:#FBF4E4}
.rd-ob-mexeu{margin-top:8px;font-size:12.5px;color:#6B675E}

/* A4 — compras e entregas (v364) */
.rd-ob-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.rd-ob-conta{background:#fff;border:1px solid #E7E0D5;border-radius:18px;padding:14px 19px;display:flex;align-items:baseline;gap:10px}
.rd-ob-conta>b{font-family:'Newsreader',Georgia,serif;font-size:28px;font-weight:400;line-height:1}
.rd-ob-conta>span{font-size:12.5px;color:#6B675E}
.rd-ob-conta-erro>b{color:#8E3B26}
.rd-ob-conta-meio>b{color:#7A5A22}
.rd-ob-compras-linha{display:grid;grid-template-columns:2fr 1.2fr 1.1fr .8fr 1.1fr 1.6fr;gap:10px;min-width:860px;align-items:center}
.rd-ob-compras-linha .rd-ob-col-macro{width:auto}
.rd-ob-linha-estatica{cursor:default}
.rd-ob-linha-estatica:hover{background:none}
@media (max-width:760px){ .rd-ob-trio{grid-template-columns:1fr} }

/* A5 — planejado × executado (v365) */
.rd-ob-pxe-linha{display:grid;grid-template-columns:2fr 1fr 1fr 1fr .7fr;gap:10px;min-width:720px;align-items:center;font-size:13px}
.rd-ob-lote-linha{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr;gap:10px;min-width:860px;align-items:center;font-size:13px}
.rd-ob-lote-linha .rd-ob-col-macro,.rd-ob-pxe-linha .rd-ob-col-macro{width:auto}
.rd-ob-ok{color:#4E5F51!important}

/* A7 — projeto atrás da obra (v366) */
.rd-ob-descompasso{border-color:#E5B6A6;background:#FBF3F0}


/* ------------------------------------------------------------
   O CARTÃO DA PESSOA NO RODAPÉ DA BARRA E O PAINEL DELE (v367 · B1)
   ------------------------------------------------------------ */
.rd-conta-caixa{display:flex;flex-direction:column;gap:0}
.rd-conta-txt{display:flex;flex-direction:column;gap:1px;min-width:0}
.rd-conta-nome{font-size:calc(13.5px * var(--esc,1));font-weight:600;color:var(--rd-texto-1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-conta-papel{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-conta-sinc{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3);padding:0 10px 2px 54px}
.rd-conta-cab{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.rd-conta-cab .rd-iniciais{width:40px;height:40px;border-radius:50%;background:var(--rd-verde-800);
  color:var(--rd-sobre-verde);display:flex;align-items:center;justify-content:center;
  font-size:calc(13.5px * var(--esc,1));font-weight:600;flex:none}
.rd-conta-cab b{font-size:calc(16px * var(--esc,1))}
.rd-conta-painel{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.rd-conta-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;
  background:none;text-align:left;font-family:inherit;font-size:calc(15px * var(--esc,1));
  color:var(--rd-texto-1);cursor:pointer;border-radius:var(--rd-raio-nav);text-decoration:none}
.rd-conta-item:hover{background:rgba(0,0,0,.05)}
.rd-conta-item svg{width:16px;height:16px;opacity:.7;flex:none}
.rd-conta-pe{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;
  padding-top:10px;border-top:1px solid var(--rd-borda);font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2)}
.rd-conta-pe .selo-versao{margin:0}

/* o bloco de conclusão com ação na ficha do projeto (B6, v367) */
.rd-conclusao-bloco{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 16px;border:1px solid var(--rd-borda);border-radius:var(--rd-raio-cartao);
  background:var(--rd-areia-50)}
.rd-conclusao-bloco .rd-conclusao{font-size:calc(14.5px * var(--esc,1));color:var(--rd-texto-1)}


/* ------------------------------------------------------------
   A CASCA DO CELULAR (v368 · C1–C3): topo, barra de quatro, +, Mais
   ------------------------------------------------------------ */
.rd-cel-topo{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 4px}
.rd-cel-marca{font-family:var(--rd-serif);font-size:calc(27px * var(--esc,1));letter-spacing:.01em;
  color:var(--rd-texto-1);text-decoration:none;line-height:1}
.rd-cel-topo-bts{display:flex;gap:8px}
.rd-cel-redondo{width:44px;height:44px;border-radius:50%;border:1px solid var(--rd-borda-forte);
  background:var(--rd-areia-50);color:var(--rd-texto-2);display:flex;align-items:center;justify-content:center;
  padding:0;cursor:pointer;font-family:inherit}
.rd-cel-avatar{background:var(--rd-verde-800);border-color:var(--rd-verde-800);color:var(--rd-sobre-verde);
  font-size:calc(13px * var(--esc,1));font-weight:600}
.rd-cel-voltar{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:8px 0 4px;
  font:inherit;font-size:calc(13.5px * var(--esc,1));font-weight:600;color:var(--rd-verde-800);cursor:pointer}
body.celular .rd-nav-inferior{position:fixed;z-index:70}
body.celular .rd-criar{position:fixed;z-index:71}
body.celular .cel-raiz{padding-bottom:110px}
.rd-cel-mais{display:flex;flex-direction:column;margin-top:8px}
.rd-cel-mais .rd-conta-item{border-bottom:1px solid var(--rd-borda);border-radius:0;padding:13px 4px;min-height:48px}
.rd-cel-modo{margin-top:8px}
body.celular .rd-cel-modo .modo-visao{display:inline-flex}
.rd-cel-acoes{display:flex;flex-direction:column;margin-top:6px}
.rd-cel-acao{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:10px 4px;border:0;
  border-bottom:1px solid var(--rd-borda);background:none;text-align:left;font:inherit;color:var(--rd-texto-1);cursor:pointer}
.rd-cel-acao-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rd-cel-acao-txt b{font-size:calc(15px * var(--esc,1));font-weight:600}
.rd-cel-acao-txt small{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-2)}
.rd-cel-acao .go{width:30px;height:30px;border:1px solid var(--rd-borda);flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%}
.rd-cel-acao .go.cheio{background:var(--rd-verde-800);border-color:var(--rd-verde-800);color:var(--rd-sobre-verde)}
.rd-cel-item{width:100%;text-align:left;font:inherit;color:inherit;background:none;border:0;border-bottom:1px solid var(--rd-borda)}
/* C8: o que estourava os 390px */
body.celular .rd-rotulo-linha{flex-wrap:wrap}
body.celular .rotina-fio{flex-wrap:wrap}
body.celular .rd-trio{display:flex;flex-direction:column}
body.celular .hoje-g2{grid-template-columns:1fr}
body.celular .cel-desktop-view .rd-heroi{gap:14px}
/* 18.12 (v412): as duas últimas linhas que passavam da borda no telefone */
body.celular .pa-lin{flex-wrap:wrap}
body.celular .pa-ct{flex-shrink:1;min-width:0;white-space:normal;overflow-wrap:anywhere}
body.celular .rd-pessoa{flex-wrap:wrap;gap:8px 12px}
body.celular .rd-pessoa-nome{width:auto;max-width:45%}
body.celular .rd-pessoa-barra{flex:1 1 110px;min-width:60px}
body.celular .rd-pessoa-pct{width:auto;flex:0 1 auto;text-align:left}
/* título de cartão com botões dentro (os três do gráfico de rosca) quebra linha em vez de empurrar a tela */
body.celular .card h3{flex-wrap:wrap}
/* a legenda da barra de capacidade é posicionada por porcentagem (left:0, left:40%, right:0): num telefone os três
   rótulos se encavalam ("aguardando aprovaçãoexcesso 0%"). No celular ela vira uma linha que se distribui. */
body.celular .rd-barra-legenda{position:static;height:auto;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
body.celular .rd-barra-legenda span{position:static!important;left:auto!important;right:auto!important;white-space:normal}


/* ------------------------------------------------------------
   O HOJE E A FICHA NO CELULAR (v368 · C4–C7)
   ------------------------------------------------------------ */
.rd-cel-linha-dia{font-size:calc(13.5px * var(--esc,1));line-height:1.45;color:var(--rd-texto-2);margin:4px 0 12px}
.rd-cel-heroi{display:flex;flex-direction:column;gap:12px}
.rd-cel-heroi-meio{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.rd-cel-heroi-ir{display:flex;flex-direction:column;gap:3px;min-width:0;background:none;border:0;padding:0;
  text-align:left;font:inherit;color:inherit;cursor:pointer}
.rd-cel-heroi-ir b{font-size:calc(15.5px * var(--esc,1));font-weight:600;line-height:1.25}
.rd-cel-heroi-ir small{font-size:calc(12.5px * var(--esc,1));color:inherit;opacity:.85}
.rd-cel-heroi-tempo{flex:none}
.rd-cel-heroi-bts{display:flex;gap:8px}
.rd-cel-bt{flex:1;min-height:44px;border-radius:12px;font:inherit;font-size:calc(13.5px * var(--esc,1));font-weight:600;cursor:pointer;padding:0 12px}
.rd-cel-bt-linha{border:1px solid #7C8F7E;background:none;color:var(--rd-sobre-verde)}
.rd-cel-bt-cheio{border:0;background:var(--rd-sobre-verde);color:var(--rd-texto-1)}
.rd-cel-sec{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.rd-cel-sec-cab{display:flex;align-items:baseline;justify-content:space-between}
.rd-cel-sec-cab b{font-size:calc(14.5px * var(--esc,1))}
.rd-cel-sec-cab span{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-cel-pv{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;background:var(--rd-card, #fff);
  border:1px solid var(--rd-borda);border-radius:var(--rd-raio-cartao);padding:12px 15px;font:inherit;color:inherit;text-align:left;cursor:pointer}
.rd-cel-pv-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rd-cel-pv-txt b{font-size:calc(14px * var(--esc,1));font-weight:600}
.rd-cel-pv-txt small{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-cel-pv-acao{font-size:calc(13px * var(--esc,1));color:var(--rd-verde-800);font-weight:600;flex:none}
body.celular .cel-lista .cab .rd-num-link{margin-left:10px}
body.celular .cel-lista .mais{background:none;border:0;padding:10px 0;font:inherit;color:var(--rd-verde-800);font-weight:600;cursor:pointer;text-align:left;width:100%}
/* a ficha */
body.celular .rd-cabeca h1{font-size:calc(30px * var(--esc,1));line-height:1.06}
.rd-cel-capa{height:84px;border-radius:var(--rd-raio-cartao);background-size:cover;background-position:center;margin-bottom:8px}
.rd-cel-acoes-ficha{display:flex;gap:8px;margin:2px 0 8px}
.rd-cel-heroi-proj{display:flex;flex-direction:column;gap:11px}
.rd-cel-hp-topo{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.rd-cel-hp-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.rd-cel-hp-estado{display:flex;align-items:center;gap:7px;font-size:calc(13px * var(--esc,1));color:inherit}
.rd-cel-hp-ponto{width:8px;height:8px;border-radius:50%;flex:none}
.rd-cel-hp-motivo{font-size:calc(12.5px * var(--esc,1));color:inherit;opacity:.85;line-height:1.35}
.rd-cel-hp-barra{height:7px;border-radius:4px;background:rgba(0,0,0,.22);overflow:hidden;display:flex;margin:0}
.rd-cel-hp-barra span{background:#9DC49A;display:block}
.rd-cel-hp-pe{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:calc(12.5px * var(--esc,1));color:inherit;opacity:.9}
.rd-cel-hp-diag{background:none;border:0;padding:6px 0;font:inherit;font-size:calc(12.5px * var(--esc,1));font-weight:600;color:inherit;text-decoration:underline;cursor:pointer;white-space:nowrap}
.rd-heroi.rd-atencao .rd-cel-hp-barra span{background:var(--rd-ambar-fg)}
.rd-heroi.rd-excesso .rd-cel-hp-barra span{background:var(--rd-vermelho-fg)}
.rd-heroi.rd-atencao .rd-cel-hp-barra,.rd-heroi.rd-excesso .rd-cel-hp-barra{background:rgba(0,0,0,.12)}
/* a etiqueta de aprovação do cliente na lista de tarefas, em Karla (v368) */
.rd-tag-cliente,.rd-tag-acao{font-size:calc(12.5px * var(--esc,1));font-weight:600;color:var(--texto2);flex-shrink:0;border:1px solid var(--borda);padding:2px 6px;border-radius:6px}
.rd-cel-ressalva{margin:2px 0}
.rd-cel-ressalva summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;padding:6px 0;
  font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3);line-height:1.4}
.rd-cel-ressalva summary::-webkit-details-marker{display:none}
.rd-cel-ressalva summary span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-cel-ressalva[open] summary span{white-space:normal}
.rd-cel-ressalva summary b{color:var(--rd-verde-800);font-weight:600;flex:none}
.rd-cel-ressalva .rd-ressalva{margin:4px 0}
.rd-cel-ressalva-uma{font-size:calc(12.5px * var(--esc,1))}
.rd-cel-etapa{display:flex;flex-direction:column;gap:8px}
.rd-cel-etapa-cab{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.rd-cel-etapa-cab b{font-size:calc(14.5px * var(--esc,1))}
.rd-cel-lista{background:var(--rd-card, #fff);border:1px solid var(--rd-borda);border-radius:var(--rd-raio-cartao);overflow:hidden}
.rd-cel-tarefa{display:flex;align-items:center;gap:11px;width:100%;padding:11px 15px;background:none;border:0;
  border-top:1px solid var(--rd-borda);font:inherit;color:inherit;text-align:left;cursor:pointer;min-height:48px}
.rd-cel-tarefa:first-child{border-top:0}
.rd-cel-caixa{width:15px;height:15px;border-radius:4px;border:1.5px solid #A79F8E;background:var(--rd-areia-50);flex:none}
.rd-cel-tarefa-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rd-cel-tarefa-txt b{font-size:calc(13.5px * var(--esc,1));font-weight:600}
.rd-cel-tarefa-txt small{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-cel-tarefa-txt small.rd-cel-sem-dono{color:#C4863A}
body.celular .rd-cel-tres{display:flex;flex-direction:row;gap:8px}
body.celular .rd-cel-tres .rd-contexto{flex:1;min-width:0;padding:9px 11px;min-height:0}
body.celular .rd-cel-tres .rd-contexto-numero{font-size:calc(18px * var(--esc,1))}
body.celular .rd-cel-tres .rd-contexto-rotulo{font-size:calc(12.5px * var(--esc,1))}
body.celular .rd-cel-tres .rd-contexto-conclusao{font-size:calc(12.5px * var(--esc,1));line-height:1.3}
/* 18.12 (v412): as abas QUEBRAM LINHA no celular em vez de rolar de lado. A faixa que rolava mostrava o último
   rótulo cortado ("Calendár", "Recrutament") e, em Minhas tarefas, encolhia para 45px ao lado dos botões. Nada
   no celular rola na horizontal: conteúdo largo se reorganiza. min-width:100% vence o flex:1 em linha. */
body.celular .abas{display:flex;flex-wrap:wrap;overflow:visible;white-space:normal;min-width:100%}
body.celular .rotina-fio .rf-rot{flex:1 1 100%;min-width:0;max-width:100%;white-space:normal}
/* tabela larga rola DENTRO DO PRÓPRIO BLOCO (celEnvolverTabelas), nunca a página */
body.celular .cel-rola{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;margin:0 0 6px;scrollbar-width:thin}
body.celular .cel-rola>table{margin-bottom:0}
/* A BORDA DA TABELA QUE ROLA (10/09)
   "Elementos vazando no layout para o celular" — a tabela rolava de lado
   dentro de uma caixa sem limite visível, e ao arrastar parecia que a linha
   escapava por cima do fundo escuro da janela. A caixa passa a ter recorte,
   moldura e uma sombra na borda direita enquanto houver conteúdo a ver. */
body.celular .cel-rola{border:1px solid var(--borda);border-radius:10px;overflow:hidden auto;overflow-x:auto;
  background:linear-gradient(to right,var(--card) 30%,rgba(0,0,0,0)),
             linear-gradient(to left,var(--card) 30%,rgba(0,0,0,0)) 100% 0,
             radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.14),rgba(0,0,0,0)),
             radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.14),rgba(0,0,0,0)) 100% 0;
  background-repeat:no-repeat;background-size:34px 100%,34px 100%,14px 100%,14px 100%;
  background-attachment:local,local,scroll,scroll}
body.celular .cel-rola>table{margin-bottom:0;border-radius:10px}

/* ------------------------------------------------------------
   DOCUMENTOS EM LISTA ESTREITA: UM CARTÃO POR DOCUMENTO (14/09; revisão de 14/09)
   "Tela de documentos com muita rolagem lateral para chegar aos botões de ação." A tabela de cinco colunas
   (640px de largura mínima, sem quebra de linha) virava um bloco que rolava de lado: num telefone de 390px o
   primeiro botão de ação começava a 1.040px. Numa lista estreita cada documento vira um cartão — marcar, o
   nome, o tipo e a data, quem vê, e os botões numa fileira que quebra linha. Nada rola de lado.
   Revisão: o cartão valia só com a tela de celular (até 760px) — com o telefone deitado (844, 915px) e no
   tablet (768, 1024px) a lista voltava a rolar. Quem decide agora é a LARGURA DA LISTA (a caixa .doc-tabela-caixa
   é um container, styles.css): abaixo de 600px, cartão; acima, tabela com o nome quebrando. Régua:
   testes/teste-celular-documentos-cabem.html.
   ------------------------------------------------------------ */
@container doclista (max-width: 599.98px){
  table.lista.doc-tabela{display:block;min-width:0;width:100%;max-width:100%;overflow:visible;white-space:normal}
  table.lista.doc-tabela thead,table.lista.doc-tabela tbody{display:block}
  table.lista.doc-tabela thead tr{display:flex;align-items:center}
  table.lista.doc-tabela thead th{display:none}
  table.lista.doc-tabela thead th:first-child{display:flex;align-items:center;gap:8px;width:auto!important;border:0;padding:4px 0 8px;
    text-transform:none;letter-spacing:0;font-size:calc(13.5px * var(--esc,1))}
  table.lista.doc-tabela thead th:first-child::after{content:'Selecionar todos';color:var(--texto2);font-weight:600}
  table.lista.doc-tabela tbody tr{display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:8px;row-gap:8px;
    padding:12px 0;border-bottom:1px solid var(--borda)}
  table.lista.doc-tabela tbody tr>td{display:block;min-width:0;width:auto!important;border:0;padding:0;
    white-space:normal!important;text-align:left!important;background:none}
  table.lista.doc-tabela tbody tr>td.doc-td-marca{grid-row:1 / span 4;padding-top:2px}
  table.lista.doc-tabela tbody tr>td:not(.doc-td-marca){grid-column:2}
  table.lista.doc-tabela tbody tr>td[colspan]{grid-column:1 / -1}
  table.lista.doc-tabela .doc-td-nome{overflow-wrap:anywhere}
  table.lista.doc-tabela .doc-td-nome select{max-width:100%!important}
  table.lista.doc-tabela .doc-td-quem{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
  table.lista.doc-tabela .doc-nota{flex:1 1 100%;min-width:0}
  table.lista.doc-tabela .doc-td-acoes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
  table.lista.doc-tabela .doc-td-acoes .fica{flex:1 1 100%}
}
/* os três números da ficha: "R$ 10.920,00" não quebra (o espaço do valor é inseparável) e empurrava a ficha
   inteira 13px para o lado. O cartão não encolhe abaixo do número; a fileira quebra linha em vez de rolar. */
body.celular .rd-cel-tres{flex-wrap:wrap}
body.celular .rd-cel-tres .rd-contexto{min-width:min-content}
/* os arquivos de uma tarefa: o nome na linha de cima, o resto quebra embaixo */
body.celular .doc-tarefa-linha>span:first-child{flex:1 1 100%;min-width:0;overflow-wrap:anywhere}


/* ------------------------------------------------------------
   CONFIGURAÇÕES › FERIADOS (v369)
   ------------------------------------------------------------ */
.rd-fer-lista{display:flex;flex-direction:column}
.rd-fer-linha{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--rd-borda);flex-wrap:wrap}
.rd-fer-linha.rd-fer-ignorado .rd-fer-nome,.rd-fer-linha.rd-fer-ignorado .rd-fer-data{color:var(--rd-texto-3);text-decoration:line-through}
.rd-fer-data{font-variant-numeric:tabular-nums;min-width:96px;color:var(--rd-texto-2)}
.rd-fer-nome{flex:1;min-width:160px;font-weight:600}
.rd-fer-tag{white-space:nowrap}
.rd-fer-para{display:flex;align-items:center;gap:6px;font-size:calc(13px * var(--esc,1));color:var(--rd-texto-2);cursor:pointer}
.rd-fer-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:end;padding:12px 0}
body.celular .rd-fer-form{grid-template-columns:1fr}

/* as perguntas do calendário e a discordância da obra (v370) */
.rd-fer-pergunta{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid var(--rd-ambar-fg, #C08C3A);
  background:var(--rd-ambar-bg, #F6E9D3);border-radius:var(--rd-raio-cartao);margin:4px 0 8px}
.rd-fer-pergunta > b{font-size:calc(14.5px * var(--esc,1))}
.rd-fer-lado{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rd-fer-lado > span{min-width:110px;font-size:calc(13px * var(--esc,1));color:var(--rd-texto-2)}
.rd-fer-opc{min-height:36px;padding:0 12px;border-radius:18px;border:1px solid var(--rd-borda-forte);background:var(--rd-areia-50);
  font:inherit;font-size:calc(13px * var(--esc,1));font-weight:600;color:var(--rd-texto-1);cursor:pointer}
.rd-fer-opc[aria-pressed="true"]{background:var(--rd-verde-800);border-color:var(--rd-verde-800);color:var(--rd-sobre-verde)}
.rd-fer-decide{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rd-fer-decide > span{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3);margin-left:6px}
.rd-fer-nome small{display:block;font-weight:400;font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-ob-fer-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px 16px;margin-top:6px}
.rd-ob-fer-item{display:flex;flex-direction:column;gap:4px;font-size:calc(13.5px * var(--esc,1))}

/* o calendário da obra e a espera do cliente (v371) */
.rd-ob-cal{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.rd-ob-cal-dias{display:flex;flex-wrap:wrap;gap:6px 14px}
.rd-ob-cal-dias .check-linha{padding:6px 10px}
.rd-ob-esperas{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid var(--rd-borda);
  border-radius:var(--rd-raio-cartao);background:var(--rd-areia-50);margin:4px 0 10px}
.rd-ob-esperas-frase{font-size:calc(15px * var(--esc,1))}
.rd-ob-espera-item{display:flex;flex-direction:column;gap:2px;font-size:calc(13.5px * var(--esc,1))}
.rd-ob-espera-item span{color:var(--rd-texto-2)}

/* ------------------------------------------------------------
   D · PAINEL DE ORÇAMENTOS (v372) — a decisão como herói
   ------------------------------------------------------------ */
.rd-orc-tela{display:flex;flex-direction:column;gap:18px;margin-top:14px}
.rd-heroi.rd-orc-heroi .rd-heroi-topo{flex-direction:column;align-items:flex-start;gap:4px}
.rd-heroi.rd-orc-heroi .rd-heroi-apoio{font-size:calc(14px * var(--esc,1));line-height:1.5;max-width:720px}
.rd-orc-props{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.rd-orc-prop{background:var(--rd-verde-700);border-radius:14px;padding:16px 18px;
  display:flex;flex-direction:column;gap:6px;color:var(--rd-sobre-verde);min-width:0}
.rd-orc-prop.rd-aprovada{outline:2px solid var(--rd-verde-300);outline-offset:-2px}
.rd-orc-prop-quem{font-size:calc(14px * var(--esc,1));font-weight:600}
.rd-orc-prop-preco{font-family:var(--rd-serif);font-size:calc(30px * var(--esc,1));line-height:1.05}
.rd-orc-prop-cond{font-size:calc(13px * var(--esc,1));color:var(--rd-sobre-verde-2);display:flex;flex-direction:column;gap:2px}
.rd-orc-prop-cond span{display:block}
.rd-orc-sem{font-style:italic}
.rd-orc-prop-prazo{font-size:calc(12.5px * var(--esc,1));color:var(--rd-sobre-verde-3)}
.rd-orc-marcas{display:flex;flex-wrap:wrap;gap:6px;min-height:22px}
.rd-orc-marca{font-size:calc(12.5px * var(--esc,1));font-weight:600;padding:3px 10px;border-radius:999px;
  background:var(--rd-verde-300);color:var(--rd-verde-700)}
.rd-orc-marca.rd-orc-marca-aprov{background:var(--rd-sobre-verde);color:var(--rd-verde-800)}
.rd-orc-prop .rd-pilula{align-self:flex-start;margin-top:4px}
/* v454 (20/09): negociar e aprovar na mesma linha — são os dois passos da mesma decisão */
.rd-orc-prop-acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px}
.rd-orc-prop-acoes .rd-pilula{margin-top:0}
/* a mesma proposta sobre fundo claro (janela do tipo) */
.rd-orc-props.rd-clara .rd-orc-prop{background:var(--rd-areia-100);color:var(--rd-texto-1);border:1px solid var(--rd-borda)}
.rd-orc-props.rd-clara .rd-orc-prop-cond{color:var(--rd-texto-2)}
.rd-orc-props.rd-clara .rd-orc-prop-prazo{color:var(--rd-texto-3)}
.rd-orc-props.rd-clara .rd-orc-marca{background:#DDE7DA;color:var(--rd-verde-700)}
.rd-orc-props.rd-clara .rd-orc-marca.rd-orc-marca-aprov{background:var(--rd-verde-800);color:var(--rd-sobre-verde)}
.rd-orc-props.rd-clara .rd-orc-prop.rd-aprovada{outline-color:var(--rd-verde-800)}
.rd-orc-props.rd-clara .rd-orc-prop .rd-pilula.rd-mini{background:var(--rd-verde-800);border-color:transparent;color:var(--rd-sobre-verde)}
/* a lista por projeto */
.rd-orc-proj{display:flex;align-items:baseline;gap:10px;padding:8px 0 4px}
.rd-orc-proj-nome{font-size:calc(15px * var(--esc,1));font-weight:600;color:var(--rd-texto-1);flex:1}
.rd-lista-nome.rd-orc-abrir{background:none;border:0;padding:0;text-align:left;cursor:pointer;
  font-family:inherit;font-size:calc(14px * var(--esc,1));font-weight:600;color:var(--rd-texto-1);flex:0 1 auto;min-width:0}
.rd-lista-nome.rd-orc-abrir:hover{text-decoration:underline}
.rd-orc-pe{font-size:calc(13px * var(--esc,1));color:var(--rd-texto-2);margin:0;padding:2px 0}
/* dentro da janela */
.rd-orc-modal{display:flex;flex-direction:column;gap:14px}
.rd-orc-modal .rd-cabeca h1{font-size:calc(28px * var(--esc,1))}
.rd-orc-modal .modal-acoes{margin-top:4px}
@media (max-width:760px){
  .rd-orc-props{grid-template-columns:1fr}
  .rd-orc-proj{flex-wrap:wrap}
}

/* ------------------------------------------------------------
   E · ADITIVO DE ESCOPO (v373) — o degrau antes de gravar
   ------------------------------------------------------------ */
.rd-ad-contas{display:flex;flex-direction:column;gap:6px;background:var(--rd-areia-200);
  border:1px solid var(--rd-borda);border-radius:var(--rd-raio-cartao);padding:14px 16px;margin-top:8px}
.rd-ad-par{display:grid;grid-template-columns:130px 1fr auto 1fr;align-items:baseline;gap:10px;
  font-size:calc(14px * var(--esc,1));color:var(--rd-texto-1)}
.rd-ad-rot{font-size:calc(12.5px * var(--esc,1));color:var(--rd-texto-3)}
.rd-ad-val{font-weight:600}
.rd-ad-seta{color:var(--rd-texto-3)}
.rd-ad-par.rd-ad-aditivo{grid-template-columns:130px 1fr;border-top:1px solid var(--rd-borda);padding-top:8px;margin-top:4px}
.rd-ad-par.rd-ad-aditivo .rd-ad-val{font-family:var(--rd-serif);font-size:calc(24px * var(--esc,1));font-weight:400}
.rd-ad-trava{margin:4px 0 0;padding:10px 12px;border-radius:12px;background:var(--rd-ambar-bg);
  border:1px solid var(--rd-ambar-borda);color:var(--rd-ambar-fg);font-size:calc(13.5px * var(--esc,1));line-height:1.5}
@media (max-width:760px){ .rd-ad-par{grid-template-columns:1fr;gap:2px} .rd-ad-seta{display:none} }

/* v380 · Bloco 9: planejamento montado, totais de duração, data com margem */
.rd-ob-heroi-plano .rd-ob-heroi-sem{color:#B7AE9C}
.rd-ob-data-margem{font-size:22px;font-weight:600;color:#6B675E;letter-spacing:-.01em}
.rd-ob-totais{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.rd-ob-total{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;font-size:13px;color:#4E5F51;background:#F7F4EE;border-radius:12px;padding:8px 12px}
.rd-ob-total b{font-weight:600}
.rd-ob-total.rd-ob-vermelho,.rd-ob-total.rd-ob-vermelho b{color:#B3452F}
.rd-ob-total-nome{flex:1;min-width:160px}
.rd-ob-obra-plano .rd-ob-obra-pct{color:#6B675E;font-weight:500}

/* v381 · Bloco 10: linhas de lote, ordem, recálculo */
.rd-ob-linha-lote .rd-ob-col-macro{padding-left:18px}
.rd-ob-linha-grupo .rd-ob-macro-nome{font-weight:600}
.rd-ob-ordem-linha{display:grid;grid-template-columns:1fr 1.2fr;gap:8px 12px;align-items:start;padding:8px 0;border-bottom:1px solid var(--borda)}
.rd-ob-ordem-linha select{width:100%;font-size:13px}
.rd-ob-ordem-linha .check-linha{grid-column:1 / -1}
.rd-ob-recalculo{flex-direction:column;align-items:flex-start}

/* v382 · A5: a margem é faixa, não data */
.rd-ob-faixa{display:inline-block;font-size:12.5px;padding:3px 10px;border-radius:999px;background:#F7F4EE;color:#6B675E;margin-top:4px}
.rd-ob-faixa-dentro{background:#F6E9D3;color:#7A5A22}
.rd-ob-faixa-fora{background:#F7E0DA;color:#8E3B26;font-weight:600}
.rd-ob-heroi-fora{box-shadow:inset 0 0 0 2px #B3452F}


/* v386 · 12.11: linha sem prazo não ganha barra */
.rd-ob-sem-prazo{position:absolute;top:4px;font-size:12.5px;color:#7A5A22;background:#F6E9D3;border:1px dashed #E8D6B4;border-radius:999px;padding:1px 8px;white-space:nowrap}

/* ---------- v389 · B1: a entrega obra por obra, a publicação explícita ---------- */
.rd-ob-quadro-entregas{margin:0 0 18px;padding:14px 16px;background:var(--card,#fff);border:1px solid var(--borda)}
.rd-ob-quadro-entregas .rd-lista-apoio{margin:4px 0 10px}
.rd-ob-tabela-entregas td,.rd-ob-tabela-entregas th{vertical-align:top;font-size:calc(14px * var(--esc,1))}
.rd-ob-tabela-entregas small{font-size:calc(12.5px * var(--esc,1));color:var(--texto2)}
.rd-ob-tabela-entregas .n{text-align:right;white-space:nowrap}
.rd-ob-verde{color:#4E5F51;font-weight:700}
.rd-ob-cinza{color:#6B675E}
.rd-ob-publicacao{border-color:#7A5A22}
/* v455: a linha da publicação carrega o botão de publicar — ele fica na ponta, e quebra para baixo no celular.
   A frase vai dentro de um <span> de propósito: solta, cada <b> virava um item do flex e a linha ganhava
   buracos e um dois-pontos órfão ("esperando a sua decisão : hoje o cronograma diz"). */
.rd-ob-publicada{margin:0 0 12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rd-ob-publicada>span{flex:1;min-width:0}
.rd-ob-publicada>button{flex:none}
/* a linha da publicação só existe no computador: abaixo de 760px a rota #/obra cai em celTelaObra,
   que não desenha esta linha. A regra de celular que estava aqui (max-width:640px) nunca podia valer. */
.rd-ob-publicar-num{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.rd-ob-publicar-num>div{padding:12px 14px;border:1px solid var(--borda);display:flex;flex-direction:column;gap:4px}
.rd-ob-publicar-num b{font-size:calc(17px * var(--esc,1))}
.rd-ob-publicar-num small{color:var(--texto2);font-size:calc(12.5px * var(--esc,1))}
@media (max-width:640px){ .rd-ob-publicar-num{grid-template-columns:1fr} }

/* ---------- v391 · 13.3: o calendário como visão das tarefas ---------- */
.rd-cal{display:flex;flex-direction:column;gap:10px}
.rd-cal-topo{display:flex;flex-direction:column;gap:8px}
.rd-cal-filtros{display:flex;gap:6px;flex-wrap:wrap}
.rd-cal-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--borda);background:var(--card);padding:5px 10px;font:inherit;font-size:calc(13px * var(--esc,1));color:var(--texto2);cursor:pointer;min-height:36px}
.rd-cal-chip i{width:10px;height:10px;background:var(--cor);opacity:.35;flex-shrink:0}
.rd-cal-chip b{font-family:var(--mono);font-weight:500;font-size:calc(12.5px * var(--esc,1))}
.rd-cal-chip.on{color:var(--texto);border-color:var(--cor)}
.rd-cal-chip.on i{opacity:1}
/* v405: o chip segue a régua do redesign — pílula, e a cor em bolinha ("tudo passou a ter a borda arredondada") */
.rd-cal-chip,.rd-cal-pessoa{border-radius:var(--rd-pilula)}
.rd-cal-chip i{border-radius:50%}
.rd-cal-pessoas{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.rd-cal-pessoa{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--borda);background:var(--card);padding:5px 10px;font:inherit;font-size:calc(13px * var(--esc,1));cursor:pointer;min-height:36px}
.rd-cal-pessoa i{width:9px;height:9px;border-radius:50%;background:var(--cor,#999)}
.rd-cal-pessoa.on{border-color:var(--texto);font-weight:700}
.rd-cal-pessoa.sobre{outline:2px dashed var(--cor-primaria);outline-offset:-2px}
.rd-cal-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rd-cal-nav .rd-lista-apoio{margin:0}
.rd-cal-proposta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 12px;border:1px dashed #6B675E;background:var(--card);font-size:calc(14px * var(--esc,1))}
.rd-cal-proposta-bts{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.rd-cal-corpo{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start}
.rd-cal-meses{min-width:0}
.rd-cal-mes{margin-bottom:18px}
.rd-cal-mes h3{font-size:calc(16px * var(--esc,1));margin:0 0 6px;position:sticky;top:0;background:var(--bg);padding:6px 0;z-index:2}
.rd-cal-semana{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;font-size:calc(12.5px * var(--esc,1));letter-spacing:.06em;font-weight:800;color:var(--texto2);margin-bottom:3px}
.rd-cal-grade{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:minmax(96px,auto);gap:4px}
.rd-cal-dia{background:var(--card);border:1px solid var(--borda);padding:4px 5px;min-width:0;display:flex;flex-direction:column;gap:3px}
.rd-cal-dia.vazio{background:transparent;border-color:transparent}
.rd-cal-dia.folga{background:var(--bg)}
.rd-cal-dia.hoje{border-color:var(--cor-primaria);box-shadow:inset 0 0 0 1px var(--cor-primaria)}
.rd-cal-dia.sobre{outline:2px dashed var(--cor-primaria);outline-offset:-2px}
.rd-cal-num{font-size:calc(12.5px * var(--esc,1));font-weight:800;color:var(--texto2);display:flex;gap:6px;align-items:baseline}
.rd-cal-num small{font-weight:500;letter-spacing:.04em;text-transform:uppercase;font-size:calc(12.5px * var(--esc,1))}
.rd-cal-item{border-left:3px solid var(--texto2);background:var(--bg);padding:3px 6px;font-size:calc(13px * var(--esc,1));line-height:1.3;cursor:pointer;overflow-wrap:anywhere;white-space:normal}
.rd-cal-item[draggable="true"]{cursor:grab}
.rd-cal-item.arrastando{opacity:.5}
.rd-cal-item .rd-cal-tit{display:block;font-weight:600}
.rd-cal-item small{display:block;color:var(--texto2);font-size:calc(12.5px * var(--esc,1))}
.rd-cal-item small i{font-style:normal;color:#8E3B26}
.rd-cal-promessa{color:#8E7A4E;font-style:normal}
.rd-cal-item.est-programada{border-left-color:#4E5F51;background:#4E5F5118}
.rd-cal-item.est-realizada{border-left-color:#9B978E;opacity:.55;text-decoration:line-through}
.rd-cal-item.est-atrasada{border-left-color:#7A5A22;background:#7A5A2222}
.rd-cal-item.est-atrasada .rd-cal-tit::before{content:"▲ ";color:#7A5A22;font-size:.8em}
.rd-cal-item.est-semDono{border-left-color:#6B675E;background:#6B675E14}
.rd-cal-item.est-proposta{border:1px dashed #6B675E;border-left:3px dashed #6B675E;background:transparent;color:var(--texto2)}
.rd-cal-item.est-proposta.estoura{border-color:#8E3B26;color:#8E3B26}
.rd-cal-parede{border-top:2px solid #6E4C8A;color:#6E4C8A;font-size:calc(12.5px * var(--esc,1));padding-top:2px;overflow-wrap:anywhere}
.rd-cal-mais{border:none;background:transparent;color:var(--acento);font:inherit;font-size:calc(12.5px * var(--esc,1));font-weight:700;text-align:left;padding:2px 0;cursor:pointer;min-height:28px}
.rd-cal-gaveta{background:var(--card);border:1px solid var(--borda);padding:12px;position:sticky;top:0;max-height:calc(100vh - 20px);overflow-y:auto;display:flex;flex-direction:column;gap:6px}
.rd-cal-gaveta.sobre{outline:2px dashed var(--cor-primaria);outline-offset:-2px}
.rd-cal-gaveta-cab{display:flex;justify-content:space-between;align-items:baseline;font-size:calc(15px * var(--esc,1))}
.rd-cal-gaveta-cab span{font-family:var(--mono);color:var(--texto2);font-size:calc(12.5px * var(--esc,1))}
.rd-cal-gaveta .rd-lista-apoio{margin:0 0 6px}
.rd-cal-gaveta-tit{font-size:calc(12.5px * var(--esc,1));letter-spacing:.06em;text-transform:uppercase;font-weight:800;color:var(--texto2);margin:8px 0 2px;display:flex;justify-content:space-between}
.rd-cal-gaveta .rd-cal-item{display:flex;flex-direction:column;gap:2px}
.rd-cal-gaveta .rd-cal-item .btn{align-self:flex-start;margin-top:2px}
@media (max-width:900px){ .rd-cal-corpo{grid-template-columns:1fr} .rd-cal-gaveta{position:static;max-height:none} }
@media (max-width:640px){ .rd-cal-semana{display:none} .rd-cal-grade{grid-template-columns:1fr;grid-auto-rows:auto} .rd-cal-dia.vazio{display:none} .rd-cal-dia:not(.hoje):empty{display:none} }

/* 15.5 (v401): o cartão do calendário diz o projeto pelo nome, embaixo do título */
.rd-cal-proj{display:block;color:var(--texto2);font-size:calc(12.5px * var(--esc,1));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 15.5.4 (v401): todos os dias do mesmo tamanho, quadrados; só o clique expande */
@media (min-width:641px){ .rd-cal-grade{grid-auto-rows:auto} .rd-cal-dia{aspect-ratio:1/1;overflow:hidden} .rd-cal-dia.expandido{aspect-ratio:auto;overflow:visible} }
/* 16.23 (v414): o que é cortado são os ITENS; o botão de ampliar fica sempre por baixo deles,
   dentro do quadrado, alcançável. Sem isto, com dois itens o botão nascia fora do corte. */
.rd-cal-itens{display:flex;flex-direction:column;gap:3px;min-height:0;flex:1;overflow:hidden}
/* 16.23 (v414): no quadrado, o cartão do dia é COMPACTO — uma linha de título e uma de projeto, com
   reticência. Com o cartão inteiro (título, projeto, lugar, pessoa) cabia meio item num quadrado de
   107px, e a pessoa via um pedaço de letra. Ampliado, o cartão volta inteiro. */
.rd-cal-dia:not(.expandido) .rd-cal-item{padding:2px 5px;line-height:1.25}
.rd-cal-dia:not(.expandido) .rd-cal-item .rd-cal-tit{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-cal-dia:not(.expandido) .rd-cal-item .rd-cal-proj{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-cal-dia:not(.expandido) .rd-cal-item small:not(.rd-cal-proj){display:none}
.rd-cal-dia.expandido .rd-cal-itens{overflow:visible}
.rd-cal-mais{flex:0 0 auto;align-self:flex-start}

/* 16.1 (v403): a linha do dia em que a obra entrou na lilia — o que vem antes foi declarado, não medido aqui */
.rd-ob-declarado{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed #7A5A22;z-index:1}
.rd-ob-legenda-declarado{color:#7A5A22}
.rd-ob-declarado-leg{display:inline-block;width:14px;height:0;border-top:2px dashed #7A5A22;vertical-align:middle;margin-right:4px}

/* v408 · 16.14: linha sem prazo é discreta; o aviso é um só, no alto; contratada tem chip */
.rd-ob-linha-indefinida{opacity:.68}
.rd-ob-linha-indefinida .rd-ob-macro-nome{font-weight:400}
.rd-ob-nao-definido{font-style:italic;color:#7A5A22;font-size:12.5px}
.rd-ob-resumo-sem-prazo{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#F6E9D3;border:1px solid #E8D6B4;border-radius:12px;padding:8px 12px;color:#7A5A22;font-size:13.5px;margin:0 0 6px}
.rd-ob-resumo-sem-prazo strong{font-weight:600}
.rd-ob-levantamento td,.rd-ob-levantamento th{vertical-align:top;font-size:13px}
.rd-ob-levantamento .n{text-align:right;white-space:nowrap}

/* ---------- PÍLULA DE FILTRO ESCOLHIDO (09/09) ----------
   "tem que ter a opção de selecionar quais áreas ou projetos visualizar
    (mais de um se quiser)". O seletor acrescenta; cada escolha vira uma
   pílula com × — é por ela que se tira uma sem mexer nas outras. */
.rd-pil-filtro{
  font-family:var(--rd-sans); font-size:calc(12.5px * var(--esc,1)); font-weight:600;
  padding:6px 12px; border-radius:var(--rd-pilula); cursor:pointer; flex:none;
  background:var(--rd-verde-100,#E8EAE3); border:1px solid #CFC7B8; color:var(--rd-verde-800,#2F3A31);
  max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.rd-pil-filtro:hover{ border-color:var(--rd-verde-800,#2F3A31) }
.rd-pil-filtro span{ opacity:.6; margin-left:2px }

/* revisão v451 (16/09): "Serviços e prazos" no celular — a tabela de 6 colunas mostrava só o nome do serviço, com os dias
   úteis, a origem e Excluir escondidos à direita. Estreita, cada serviço vira um cartão empilhado (rótulo · valor). */
@media (max-width: 640px){
  table.lista.rd-ob-svc-tabela thead{ display:none }
  table.lista.rd-ob-svc-tabela, table.lista.rd-ob-svc-tabela tbody, table.lista.rd-ob-svc-tabela tr{ display:block; width:100% }
  table.lista.rd-ob-svc-tabela tr{ border-bottom:1px solid var(--borda); padding:8px 0 }
  table.lista.rd-ob-svc-tabela td{ display:block; width:auto; border:0; padding:3px 0; white-space:normal !important; text-align:left }
  table.lista.rd-ob-svc-tabela td[data-rot]:not(:first-child)::before{ content:attr(data-rot) ' · '; font-size:calc(12.5px * var(--esc,1)); color:var(--texto2) }
  table.lista.rd-ob-svc-tabela td.rd-ob-svc-acoes{ display:flex; gap:6px; flex-wrap:wrap; padding-top:6px }
}