/* Obra Andracon — casco de aplicação sobre o design system da Verticci (tokens --v-*).
   Cor, tipo e espaçamento vêm do bundle; aqui só layout. */

html { overflow-x: clip; }
body { background: var(--v-canvas); min-block-size: 100svh; }
.v-logo-mascara { inline-size: auto; align-self: flex-start; }
.carimbo { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); }

/* ------------------------------------------------------------------ entrada */
.entrada { min-block-size: 100svh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.entrada__marca { display: flex; flex-direction: column; justify-content: space-between; gap: var(--v-espaco-8); padding: var(--v-espaco-12); background: var(--v-canvas); color: var(--v-texto); }
.entrada__tese { font-family: var(--v-fonte-display); font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem); font-weight: var(--v-peso-semibold); letter-spacing: var(--v-ls-display); line-height: var(--v-lh-display); max-inline-size: 18ch; }
.entrada__tese span { color: var(--v-acento-texto); }
.entrada__apoio { color: var(--v-texto-suave); max-inline-size: 44ch; margin-block-start: var(--v-espaco-5); }
.entrada__form { display: flex; align-items: center; justify-content: center; padding: var(--v-espaco-10) var(--v-espaco-6); }
.entrada__form form { inline-size: min(24rem, 100%); display: flex; flex-direction: column; gap: var(--v-espaco-5); }
.entrada__form h1 { font-family: var(--v-fonte-display); font-size: var(--v-fs-h3); font-weight: var(--v-peso-semibold); letter-spacing: var(--v-ls-titulo); }
.campo { display: flex; flex-direction: column; gap: var(--v-espaco-1); min-inline-size: 0; }
.campo label { font-size: var(--v-fs-legenda); color: var(--v-texto-suave); font-weight: var(--v-peso-medium); }
.campo .v-input { inline-size: 100%; }

/* Atalhos de entrada da equipe: o botão escolhe a conta, a senha é digitada. */
.botoes-equipe { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: var(--v-espaco-3); }
.botoes-equipe [aria-pressed='true'] { border-color: var(--v-acento); box-shadow: inset 0 0 0 1px var(--v-acento); }

/* ------------------------------------------------------------------ casco */
.topo__conta { display: flex; align-items: center; gap: var(--v-espaco-3); }
.topo { display: flex; align-items: center; justify-content: space-between; gap: var(--v-espaco-4); padding: var(--v-espaco-4) var(--v-espaco-6); border-block-end: var(--v-traco-fino) solid var(--v-borda); }
.principal { max-inline-size: 72rem; margin-inline: auto; padding: var(--v-espaco-8) var(--v-espaco-6); display: flex; flex-direction: column; gap: var(--v-espaco-6); }
.principal h1 { font-family: var(--v-fonte-display); font-size: var(--v-fs-h2); font-weight: var(--v-peso-semibold); letter-spacing: var(--v-ls-titulo); }
.linha-form { display: flex; gap: var(--v-espaco-3); align-items: end; flex-wrap: wrap; }
.linha-form .campo { flex: 1 1 16rem; }
.lista { display: flex; flex-direction: column; border-block-start: var(--v-traco-fino) solid var(--v-borda); }
.lista li { list-style: none; display: flex; justify-content: space-between; gap: var(--v-espaco-4); padding-block: var(--v-espaco-3); border-block-end: var(--v-traco-fino) solid var(--v-borda); }

.toast { position: fixed; inset-block-end: var(--v-espaco-6); inset-inline-end: var(--v-espaco-6); max-inline-size: 26rem; padding: var(--v-espaco-4) var(--v-espaco-5); border-radius: var(--v-raio-md); background: var(--v-superficie-alta); border: var(--v-traco-fino) solid var(--v-borda); box-shadow: var(--v-sombra-lg); }
.toast--erro { box-shadow: inset 3px 0 0 var(--v-critico), var(--v-sombra-lg); }
.toast--ok { box-shadow: inset 3px 0 0 var(--v-sucesso), var(--v-sombra-lg); }

@media (max-width: 900px) {
  .entrada { grid-template-columns: minmax(0, 1fr); }
  .entrada__marca { padding: var(--v-espaco-8) var(--v-espaco-5); }
  .topo, .principal { padding-inline: var(--v-espaco-4); }
}

/* ------------------------------------------------------------ painel de obra */
.topo__marca { display: flex; align-items: center; gap: var(--v-espaco-4); }
.topo__nome { font-family: var(--v-fonte-display); font-weight: var(--v-peso-semibold); color: var(--v-texto); text-decoration: none; }
.cabeca { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--v-espaco-5); flex-wrap: wrap; }

.bloco { display: flex; flex-direction: column; gap: var(--v-espaco-4); }
.bloco__titulo { font-family: var(--v-fonte-display); font-size: var(--v-fs-h4); font-weight: var(--v-peso-semibold); display: flex; align-items: center; gap: var(--v-espaco-3); }
.bloco__titulo--alta { color: var(--v-critico); }
.contador { font-size: var(--v-fs-legenda); font-weight: var(--v-peso-medium); color: var(--v-texto-sutil); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-sm); padding: 0 .4em; }

.alertas { display: flex; flex-direction: column; gap: var(--v-espaco-3); list-style: none; }
.alerta { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--v-espaco-4); padding: var(--v-espaco-4) var(--v-espaco-5); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); background: var(--v-superficie); }
.alerta--alta { box-shadow: inset 3px 0 0 var(--v-critico); }
.alerta--media { box-shadow: inset 3px 0 0 var(--v-atencao, var(--v-acento)); }
.alerta--info { box-shadow: inset 3px 0 0 var(--v-borda-forte, var(--v-borda)); }
.alerta__corpo { display: flex; flex-direction: column; gap: var(--v-espaco-1); min-inline-size: 0; }
.alerta__titulo { font-weight: var(--v-peso-semibold); }

.cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: var(--v-espaco-4); }
.cartao { display: flex; flex-direction: column; gap: var(--v-espaco-2); padding: var(--v-espaco-5); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); background: var(--v-superficie); color: inherit; text-decoration: none; }
.cartao:hover { border-color: var(--v-acento); }
.cartao__codigo { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); letter-spacing: var(--v-ls-micro, .04em); text-transform: uppercase; }
.cartao__codigo em { font-style: normal; color: var(--v-critico); }
.cartao__nome { font-family: var(--v-fonte-display); font-size: var(--v-fs-h5, 1.1rem); font-weight: var(--v-peso-semibold); }
.cartao__dados { display: grid; grid-template-columns: 1fr 1fr; gap: var(--v-espaco-2) var(--v-espaco-4); margin-block-start: var(--v-espaco-2); }
.cartao__dados dt { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); }
.cartao__dados dd { font-variant-numeric: tabular-nums; }

.numeros { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--v-espaco-4); }
.numero { display: flex; flex-direction: column; gap: var(--v-espaco-1); padding: var(--v-espaco-4) var(--v-espaco-5); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); }
.numero span { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); }
.numero strong { font-family: var(--v-fonte-display); font-size: var(--v-fs-h4); font-variant-numeric: tabular-nums; }
.numero--ruim strong { color: var(--v-critico); }

.tabela-rolo { overflow-x: auto; }
.tabela { inline-size: 100%; border-collapse: collapse; font-size: var(--v-fs-corpo); }
.tabela th, .tabela td { text-align: start; padding: var(--v-espaco-3) var(--v-espaco-3); border-block-end: var(--v-traco-fino) solid var(--v-borda); white-space: nowrap; }
.tabela th { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); font-weight: var(--v-peso-medium); }
.tabela td:nth-child(2) { white-space: normal; }
.num { text-align: end !important; font-variant-numeric: tabular-nums; }
.ruim, .linha--ruim td:first-child { color: var(--v-critico); }
.selo { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-sm); padding: 0 .4em; }
.lista--links a { color: var(--v-acento-texto, var(--v-texto)); }

/* ------------------------------------------------------------ diario */
.form-diario { display: flex; flex-direction: column; gap: var(--v-espaco-5); max-inline-size: 52rem; }
.dupla { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--v-espaco-4); }
.grupo { display: flex; flex-direction: column; gap: var(--v-espaco-3); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); padding: var(--v-espaco-5); }
.grupo legend { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); font-weight: var(--v-peso-medium); padding-inline: var(--v-espaco-2); }
.grupo [data-add] { align-self: flex-start; }
.linha-item { display: grid; grid-template-columns: minmax(7rem, 1fr) minmax(5rem, .6fr) minmax(7rem, 1fr) auto; gap: var(--v-espaco-2); align-items: center; }
.linha-item--larga { grid-template-columns: minmax(9rem, 1.2fr) minmax(9rem, 1.4fr) minmax(6rem, .8fr) minmax(5rem, .5fr) auto; }
.acoes { display: flex; gap: var(--v-espaco-3); flex-wrap: wrap; }
.aviso-reabre { padding: var(--v-espaco-3) var(--v-espaco-4); border-radius: var(--v-raio-sm); border: var(--v-traco-fino) solid var(--v-borda); color: var(--v-texto-suave); }

@media (max-width: 720px) {
  .linha-item, .linha-item--larga { grid-template-columns: 1fr 1fr; }
  .linha-item [data-rm] { grid-column: 2; justify-self: end; }
  .alerta { flex-direction: column; align-items: stretch; }
  .cabeca .v-btn { inline-size: 100%; text-align: center; }
  .principal { gap: var(--v-espaco-5); }
}

/* ------------------------------------------------------------ abas de agente */
.abas { display: flex; gap: var(--v-espaco-1); flex-wrap: wrap; border-block-end: var(--v-traco-fino) solid var(--v-borda); }
.aba { padding: var(--v-espaco-3) var(--v-espaco-4); color: var(--v-texto-suave); text-decoration: none; font-size: var(--v-fs-corpo); border-block-end: 2px solid transparent; margin-block-end: -1px; }
.aba:hover { color: var(--v-texto); }
.aba--ativa { color: var(--v-texto); border-block-end-color: var(--v-acento); font-weight: var(--v-peso-medium); }
#conteudo-aba { display: flex; flex-direction: column; gap: var(--v-espaco-6); }
#conteudo-aba.entrou > * { animation: surgir 360ms cubic-bezier(0.2, 0, 0, 1) both; }

@keyframes surgir { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ------------------------------------------------------------------ graficos */
.gfx { display: flex; flex-direction: column; gap: var(--v-espaco-3); margin: 0; }
.gfx__titulo { font-family: var(--v-fonte-display); font-size: var(--v-fs-h5, 1.05rem); font-weight: var(--v-peso-semibold); }
.gfx__legenda { display: flex; gap: var(--v-espaco-4); flex-wrap: wrap; list-style: none; font-size: var(--v-fs-legenda); color: var(--v-texto-suave); }
.gfx__legenda li { display: flex; align-items: center; gap: var(--v-espaco-2); }
.gfx__marca { inline-size: 10px; block-size: 10px; border-radius: 2px; display: inline-block; }
.gfx__dados summary { font-size: var(--v-fs-legenda); color: var(--v-texto-suave); cursor: pointer; padding-block: var(--v-espaco-2); }
.gfx__dados[open] summary { margin-block-end: var(--v-espaco-3); }

/* barras: rotulo | trilho | valor, em grade — o texto nunca deforma */
.bars { display: flex; flex-direction: column; gap: var(--v-espaco-2); }
.bar { display: grid; grid-template-columns: minmax(8rem, 15rem) 1fr minmax(5.5rem, auto); gap: var(--v-espaco-4);
  align-items: center; animation: aparecer 300ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.bar__rotulo { font-size: var(--v-fs-legenda); color: var(--v-texto-suave); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar__trilho { display: block; block-size: 12px; background: var(--v-superficie-alta); border-radius: 2px; overflow: hidden; }
.bar__fill { display: block; block-size: 100%; inline-size: var(--largura); border-radius: 2px;
  animation: estender 360ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.bar__valor { font-family: var(--v-fonte-mono, monospace); font-variant-numeric: tabular-nums; font-size: var(--v-fs-legenda); text-align: end; }
.bar--par .bar__duplo { display: flex; flex-direction: column; gap: 2px; }
.bar--par .bar__valor { display: flex; flex-direction: column; line-height: 1.25; }

/* gantt */
.gt { display: flex; flex-direction: column; gap: var(--v-espaco-2); }
.gt__escala { display: flex; justify-content: space-between; font-size: var(--v-fs-legenda); color: var(--v-texto-sutil);
  padding-inline-start: calc(15rem + var(--v-espaco-4)); }
.gt__linha { display: grid; grid-template-columns: minmax(8rem, 15rem) 1fr 3.5rem; gap: var(--v-espaco-4); align-items: center;
  animation: aparecer 300ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.gt__nome { font-size: var(--v-fs-legenda); color: var(--v-texto-suave); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt__nome strong { color: var(--v-texto); font-family: var(--v-fonte-mono, monospace); }
.gt__pista { position: relative; display: block; block-size: 18px; background: var(--v-superficie-alta); border-radius: 2px; }
.gt__chuva { position: absolute; inset-block: 0; background: var(--v-serie-2); opacity: .16; }
.gt__estouro { position: absolute; inset-block: 3px; background: var(--v-critico); opacity: .3; border-radius: 2px; }
.gt__barra { position: absolute; inset-block: 3px; background: var(--v-serie-2); opacity: .45; border-radius: 2px; }
.gt__feito { position: absolute; inset-block: 0; inset-inline-start: 0; inline-size: var(--largura); border-radius: 2px; opacity: 1;
  animation: estender 360ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.gt__hoje { position: absolute; inset-block: -3px; inline-size: 2px; background: var(--v-critico); }
.gt__valor { font-family: var(--v-fonte-mono, monospace); font-variant-numeric: tabular-nums; font-size: var(--v-fs-legenda); text-align: end; }

@keyframes estender { from { inline-size: 0; } to { inline-size: var(--largura); } }
@keyframes aparecer { from { opacity: 0; } to { opacity: 1; } }

/* ------------------------------------------------------------------- avancos */
.avancos { display: flex; flex-direction: column; gap: var(--v-espaco-4); }
.av { display: flex; flex-direction: column; gap: var(--v-espaco-2); animation: aparecer 300ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.av__topo { display: flex; justify-content: space-between; align-items: baseline; gap: var(--v-espaco-3); }
.av__nome { font-size: var(--v-fs-corpo); }
.av__num { font-family: var(--v-fonte-mono, monospace); font-variant-numeric: tabular-nums; color: var(--v-texto-suave); }
.av__trilho { position: relative; block-size: 10px; border-radius: 2px; background: var(--v-superficie-alta); border: var(--v-traco-fino) solid var(--v-borda); overflow: hidden; }
.av__feito { block-size: 100%; inline-size: var(--largura); border-radius: 2px; animation: estender 360ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }
.av__meta { position: absolute; inset-block: -3px; inline-size: 2px; background: var(--v-texto); opacity: .55; }

/* -------------------------------------------------------------------- faixas */
.faixa { padding: var(--v-espaco-4) var(--v-espaco-5); border-radius: var(--v-raio-md); border: var(--v-traco-fino) solid var(--v-borda); background: var(--v-superficie); color: var(--v-texto-suave); }
.faixa strong { color: var(--v-texto); }
.faixa--atencao { box-shadow: inset 3px 0 0 var(--v-atencao, var(--v-serie-5)); }
.faixa--critica { box-shadow: inset 3px 0 0 var(--v-critico); }
.faixa code, .comando { font-family: var(--v-fonte-mono, monospace); font-size: var(--v-fs-legenda); }
.comando { padding: var(--v-espaco-3) var(--v-espaco-4); background: var(--v-superficie-alta); border-radius: var(--v-raio-sm); overflow-x: auto; }
.vazio { display: flex; flex-direction: column; gap: var(--v-espaco-3); }
.melhor { font-weight: var(--v-peso-semibold); color: var(--v-acento-texto, var(--v-texto)); }
.numero { animation: aparecer 300ms cubic-bezier(0.2, 0, 0, 1) both; animation-delay: var(--atraso, 0ms); }

@media (prefers-reduced-motion: reduce) {
  .bar, .bar__fill, .gt__linha, .gt__feito, .av, .av__feito, .numero, #conteudo-aba.entrou > * { animation: none !important; }
}

/* No celular a grade de tres colunas esmaga a barra: rotulo em cima, barra inteira embaixo. */
@media (max-width: 760px) {
  .bar, .bar--par {
    grid-template-columns: 1fr auto;
    grid-template-areas: "rotulo valor" "trilho trilho";
    gap: var(--v-espaco-1) var(--v-espaco-3);
    row-gap: var(--v-espaco-2);
  }
  .bar__rotulo { grid-area: rotulo; white-space: normal; }
  .bar__valor { grid-area: valor; text-align: end; }
  .bar__trilho, .bar__duplo { grid-area: trilho; }
  .bar--par .bar__valor { flex-direction: row; gap: var(--v-espaco-2); align-items: baseline; }
  .bars { gap: var(--v-espaco-4); }

  .gt__linha { grid-template-columns: 1fr 3.5rem; grid-template-areas: "nome valor" "pista pista"; row-gap: var(--v-espaco-2); }
  .gt__nome { grid-area: nome; white-space: normal; }
  .gt__valor { grid-area: valor; }
  .gt__pista { grid-area: pista; }
  .gt__escala { padding-inline-start: 0; }
  .gt { gap: var(--v-espaco-4); }
}

/* ===================================================================== v6 */
/* Navegação por papel: só aparece o que a conta pode abrir. Rola no celular. */
.menu { display: flex; gap: var(--v-espaco-1); padding-inline: var(--v-espaco-6); border-block-end: var(--v-traco-fino) solid var(--v-borda); overflow-x: auto; scrollbar-width: thin; background: var(--v-canvas); position: sticky; inset-block-start: 0; z-index: 5; }
.menu__item { padding: var(--v-espaco-3) var(--v-espaco-3); color: var(--v-texto-suave); text-decoration: none; white-space: nowrap; border-block-end: 2px solid transparent; margin-block-end: -1px; display: inline-flex; align-items: center; gap: var(--v-espaco-2); }
.menu__item:hover { color: var(--v-texto); }
.menu__item--ativo { color: var(--v-texto); border-block-end-color: var(--v-acento); font-weight: var(--v-peso-medium); }
.menu__item:focus-visible, .filtro:focus-visible, .aba:focus-visible { outline: none; box-shadow: var(--v-sombra-foco); border-radius: var(--v-raio-sm); }
.contador--menu { color: var(--v-acento-contraste); background: var(--v-acento); border-color: var(--v-acento); }
.topo__quem { display: inline-flex; align-items: center; gap: var(--v-espaco-2); color: var(--v-texto-suave); text-decoration: none; }
.topo__quem:hover { color: var(--v-texto); }
.faixa--link { text-decoration: none; display: inline-block; }

/* Selos de estado e de confiança. Cor só para estado, sempre com texto. */
.selo--ruim { color: var(--v-critico); border-color: var(--v-critico); }
.selo--atencao { color: var(--v-texto); border-color: var(--v-atencao); background: var(--v-atencao-suave); }
.selo--bom { color: var(--v-texto); border-color: var(--v-sucesso); background: var(--v-sucesso-suave, transparent); }
.conf { font-size: var(--v-fs-legenda); border-radius: var(--v-raio-sm); padding: 0 .45em; border: var(--v-traco-fino) solid var(--v-borda); white-space: nowrap; }
.conf--confirmado { border-color: var(--v-sucesso); }
.conf--aproximado { border-color: var(--v-atencao); background: var(--v-atencao-suave); color: var(--v-texto); }
.conf--a_confirmar { border-style: dashed; color: var(--v-texto-suave); }

/* Formulários de painel: recolhidos por padrão, para a lista vir primeiro. */
.painel-form summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: var(--v-espaco-2); }
.painel-form summary::before { content: '+'; font-family: var(--v-fonte-mono, monospace); color: var(--v-acento-texto, var(--v-texto)); }
.painel-form[open] summary::before { content: '−'; }
.painel-form[open] summary { margin-block-end: var(--v-espaco-4); }
.grade-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: var(--v-espaco-4); align-items: end; }
.grade-form .campo--largo { grid-column: 1 / -1; }
.grade-form .acoes { grid-column: 1 / -1; }
.pilha-form { display: flex; flex-direction: column; gap: var(--v-espaco-4); }
.form-estreito { max-inline-size: 28rem; }
.opcao { display: flex; gap: var(--v-espaco-3); align-items: flex-start; padding-block: var(--v-espaco-2); cursor: pointer; }
.opcao input { margin-block-start: .3em; }
.opcao--linha { align-items: center; white-space: nowrap; font-size: var(--v-fs-legenda); color: var(--v-texto-suave); }
.v-input--p { padding-block: .25rem; min-block-size: auto; }

/* Diário: serviço por item da planilha e ocorrência com causa. */
.linha-item--servico { grid-template-columns: minmax(9rem, 1.1fr) minmax(10rem, 1.4fr) minmax(6rem, .7fr) minmax(4rem, .4fr) minmax(3rem, .3fr) minmax(5rem, .6fr) minmax(4.5rem, .4fr) auto; }
.linha-item--ocorrencia { grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 1.8fr) minmax(6rem, .5fr) auto auto; }
.linha-item + .linha-item { margin-block-start: var(--v-espaco-2); }

/* Filtros e listas. */
.filtros { display: flex; gap: var(--v-espaco-2); flex-wrap: wrap; }
.filtro { padding: var(--v-espaco-1) var(--v-espaco-3); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-total, 999px); color: var(--v-texto-suave); text-decoration: none; font-size: var(--v-fs-legenda); }
.filtro--ativo { color: var(--v-texto); border-color: var(--v-acento); background: var(--v-acento-suave); }
.pedidos, .notas { display: flex; flex-direction: column; border-block-start: var(--v-traco-fino) solid var(--v-borda); }
.pedido, .nota-item { list-style: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--v-espaco-1) var(--v-espaco-3); padding-block: var(--v-espaco-3); border-block-end: var(--v-traco-fino) solid var(--v-borda); }
.pedido__titulo, .nota-item__titulo { font-weight: var(--v-peso-medium); color: var(--v-texto); flex: 1 1 100%; }
.pedido--vencido { box-shadow: inset 3px 0 0 var(--v-critico); padding-inline-start: var(--v-espaco-3); }
.nota-item p { flex: 1 1 100%; }
mark { background: var(--v-acento-suave); color: var(--v-texto); border-radius: 2px; padding: 0 .1em; }
.linha-tempo { display: flex; flex-direction: column; gap: var(--v-espaco-3); padding-inline-start: var(--v-espaco-4); border-inline-start: 2px solid var(--v-borda); }
.linha-tempo li { list-style: none; }
.busca { display: grid; grid-template-columns: 1fr minmax(10rem, 14rem) auto; gap: var(--v-espaco-3); }

/* Leitura: nota, pleito, ficha. */
.nota { display: flex; flex-direction: column; gap: var(--v-espaco-3); max-inline-size: 70ch; line-height: 1.6; }
.nota h2, .nota h3, .nota h4 { font-family: var(--v-fonte-display); margin-block-start: var(--v-espaco-3); }
.nota ul { padding-inline-start: 1.2em; }
.link-orfao { border-block-end: 1px dashed var(--v-borda-forte); color: var(--v-texto-suave); }
.texto-pleito, .texto-livre { white-space: pre-wrap; font-family: inherit; line-height: 1.6; max-inline-size: 75ch; }
.texto-pleito { background: var(--v-canvas-rebaixado, transparent); padding: var(--v-espaco-5); border-radius: var(--v-raio-md); border: var(--v-traco-fino) solid var(--v-borda); }
.ficha { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: var(--v-espaco-4); }
.ficha dt { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); }
.ficha dd { margin: 0; }
.tabela--matriz td.centro, .centro { text-align: center; }
.tabela--matriz th { white-space: nowrap; }
.linha--apagada td { color: var(--v-texto-sutil); }
.acoes-linha { white-space: nowrap; }
.acoes-linha .v-btn { margin-block: 2px; }

@media (max-width: 900px) {
  .linha-item--servico { grid-template-columns: 1fr 1fr; }
  .linha-item--servico [data-c="tarefa"], .linha-item--servico [data-c="descricao"] { grid-column: 1 / -1; }
  .linha-item--ocorrencia { grid-template-columns: 1fr 1fr; }
  .linha-item--ocorrencia [data-c="descricao"] { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .menu { padding-inline: var(--v-espaco-4); }
  .busca { grid-template-columns: 1fr; }
  .topo__quem .selo { display: none; }
  .acoes-linha { white-space: normal; }
}

/* ------------------------------------------------------------ levantamento e cadastro */
.conf--documento { border-color: var(--v-sucesso); }
.conf--inferido_ficha { border-color: var(--v-atencao); background: var(--v-atencao-suave); color: var(--v-texto); }
.conf--inferido_pasta { border-style: dashed; color: var(--v-texto-suave); }
.progresso { display: flex; flex-direction: column; gap: var(--v-espaco-2); }
.progresso__trilho { block-size: .5rem; border-radius: 999px; background: var(--v-superficie-alta, var(--v-borda)); overflow: hidden; }
.progresso__barra { block-size: 100%; background: var(--v-acento); border-radius: inherit; }
.progresso__texto { font-size: var(--v-fs-legenda); color: var(--v-texto-suave); }
.duvida { color: var(--v-texto); font-size: var(--v-fs-legenda); max-inline-size: 46ch; white-space: normal; }
.tabela td.quebra, .tabela th.quebra { white-space: normal; }
.tabela tr[data-href] { cursor: pointer; }
.tabela tr[data-href]:hover td { background: var(--v-superficie); }
.grade-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: var(--v-espaco-5); align-items: start; }
.ficha { display: grid; grid-template-columns: minmax(9rem, auto) 1fr; gap: var(--v-espaco-2) var(--v-espaco-4); }
.ficha dt { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); }
.ficha dd { min-inline-size: 0; overflow-wrap: anywhere; }
.form-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--v-espaco-4); }
.form-grade .campo--largo { grid-column: 1 / -1; }
.cadeia { list-style: none; display: flex; flex-direction: column; gap: 0; counter-reset: elo; }
.cadeia__elo { position: relative; display: grid; grid-template-columns: 2.25rem 1fr; gap: var(--v-espaco-3); padding-block: var(--v-espaco-3); border-block-end: var(--v-traco-fino) solid var(--v-borda); }
.cadeia__num { inline-size: 1.75rem; block-size: 1.75rem; border-radius: 50%; border: var(--v-traco-fino) solid var(--v-borda); display: grid; place-items: center; font-size: var(--v-fs-legenda); font-variant-numeric: tabular-nums; }
.cadeia__elo--lacuna .cadeia__num { border-style: dashed; color: var(--v-texto-sutil); }
.cadeia__elo--redigita .cadeia__num, .cadeia__elo--refaz .cadeia__num { border-color: var(--v-atencao); background: var(--v-atencao-suave); }
.cadeia__elo--espera .cadeia__num { border-color: var(--v-critico); color: var(--v-critico); }
.cadeia__titulo { font-weight: var(--v-peso-semibold); display: flex; gap: var(--v-espaco-2); align-items: center; flex-wrap: wrap; }
.legenda-gargalo { display: flex; gap: var(--v-espaco-4); flex-wrap: wrap; font-size: var(--v-fs-legenda); color: var(--v-texto-suave); }
.hub { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: var(--v-espaco-4); }
.check { display: grid; grid-template-columns: 1fr auto; gap: var(--v-espaco-3); align-items: center; padding-block: var(--v-espaco-3); border-block-end: var(--v-traco-fino) solid var(--v-borda); }
.check__acoes { display: flex; gap: var(--v-espaco-2); align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.check--ok .check__item { color: var(--v-texto-suave); text-decoration: line-through; text-decoration-color: var(--v-sucesso); }
.check--nao_se_aplica .check__item { color: var(--v-texto-sutil); }
.check__item { overflow-wrap: anywhere; }
.pergunta { display: flex; flex-direction: column; gap: var(--v-espaco-2); padding: var(--v-espaco-4) var(--v-espaco-5); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); background: var(--v-superficie); }
.pergunta--alta { box-shadow: inset 3px 0 0 var(--v-critico); }
.pergunta--respondida { opacity: .85; box-shadow: inset 3px 0 0 var(--v-sucesso); }
.pergunta__topo { display: flex; gap: var(--v-espaco-2); flex-wrap: wrap; align-items: center; }
.pergunta__texto { font-weight: var(--v-peso-semibold); }
.pergunta form { display: flex; flex-direction: column; gap: var(--v-espaco-3); }
.v-textarea, textarea.v-input { min-block-size: 4.5rem; resize: vertical; }
.kanban { display: grid; grid-template-columns: repeat(5, minmax(12rem, 1fr)); gap: var(--v-espaco-3); overflow-x: auto; }
.kanban__col { display: flex; flex-direction: column; gap: var(--v-espaco-3); min-inline-size: 12rem; }
.kanban__titulo { font-size: var(--v-fs-legenda); color: var(--v-texto-sutil); text-transform: uppercase; letter-spacing: .04em; }
.kanban__card { padding: var(--v-espaco-3) var(--v-espaco-4); border: var(--v-traco-fino) solid var(--v-borda); border-radius: var(--v-raio-md); background: var(--v-superficie); display: flex; flex-direction: column; gap: var(--v-espaco-2); }
@media (max-width: 900px) { .kanban { grid-template-columns: repeat(5, 14rem); } }

.principal:has(.tabela--larga) { max-inline-size: 96rem; }
.tabela--larga .col-obra { inline-size: 24rem; min-inline-size: 24rem; }
.tabela--larga .col-media { inline-size: 13rem; min-inline-size: 13rem; }
.kanban__card { font-size: var(--v-fs-legenda); }
.kanban__card strong { font-size: var(--v-fs-corpo); }