/* Identidade Shark Thinking: mesmos tokens dos decks da proposta (projeto/proposta/deck.html). */
@font-face { font-family: "DM Sans"; src: url("/fontes/DMSans-Variable.ttf") format("truetype"); font-weight: 100 1000; font-style: normal; font-display: swap; }

:root {
  --bg: #01010a;
  --bg-2: #07070d;
  --painel: #0d0d13;
  --painel-2: #14141b;
  --painel-3: #1b1b23;
  --linha: #23232b;
  --linha-2: #30303a;
  --txt: #fffbf9;
  --txt-2: #c9c4c0;
  --txt-3: #8b8790;
  --laranja: #ff8812;
  --laranja-2: #c96a0c;
  --laranja-suave: rgba(255, 136, 18, .12);
  --laranja-borda: rgba(255, 136, 18, .38);
  --ok: #3ccf8e;
  --ok-suave: rgba(60, 207, 142, .12);
  --info: #7aa7ff;
  --info-suave: rgba(122, 167, 255, .12);
  --roxo: #b79bff;
  --roxo-suave: rgba(183, 155, 255, .12);
  --perigo: #ff6b5b;
  --perigo-suave: rgba(255, 107, 91, .12);
  --raio: 12px;
  --raio-p: 8px;
  --sombra: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 12px 32px -12px rgba(0, 0, 0, .6);
  --fonte: "DM Sans", system-ui, sans-serif;
  --mono: "Cascadia Mono", Consolas, ui-monospace, monospace;
  /* camadas: conteúdo, cabeçalho fixo, gaveta de detalhe */
  --camada-grafico: 1;
  --camada-cabecalho: 10;
  --camada-gaveta: 20;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font: 14px/1.5 var(--fonte);
  font-feature-settings: "tnum" 1;
  color: var(--txt);
  background: radial-gradient(90% 60% at 100% -10%, #2a1606 0%, rgba(42, 22, 6, 0) 60%), var(--bg);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}
h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -.015em; }
button { font: inherit; cursor: pointer; color: inherit; }
:focus-visible { outline: 2px solid var(--laranja); outline-offset: 2px; border-radius: 6px; }
::selection { background: var(--laranja); color: var(--bg); }

/* Entrar */
.tela-entrar { display: grid; place-items: center; padding: 16px; }
.entrar { position: relative; width: 100%; max-width: 400px; background: var(--painel); border: 1px solid var(--linha); border-radius: 16px; padding: 40px 36px 36px; box-shadow: var(--sombra); }
.entrar::before, .entrar::after { content: ""; position: absolute; width: 28px; height: 28px; border-color: var(--laranja); border-style: solid; }
.entrar::before { top: -1px; left: -1px; border-width: 2px 0 0 2px; border-top-left-radius: 16px; }
.entrar::after { bottom: -1px; right: -1px; border-width: 0 2px 2px 0; border-bottom-right-radius: 16px; }
.entrar .logo { height: 30px; width: auto; display: block; }
.entrar h1 { font-size: 22px; margin-top: 28px; }
.entrar .sub { color: var(--txt-3); margin: 4px 0 28px; }
.entrar label { display: block; font-weight: 500; font-size: 13px; color: var(--txt-2); margin: 16px 0 6px; }
.entrar input { width: 100%; padding: 11px 13px; border: 1px solid var(--linha-2); border-radius: var(--raio-p); background: var(--bg-2); color: var(--txt); font: inherit; transition: border-color .15s; }
.entrar input:focus { border-color: var(--laranja); outline: none; box-shadow: 0 0 0 3px var(--laranja-suave); }
.entrar button { width: 100%; margin-top: 24px; padding: 12px; border: 0; border-radius: var(--raio-p); background: var(--laranja); color: var(--bg); font-weight: 600; transition: background .15s; }
.entrar button:hover { background: #ff9a3a; }
.erro { color: var(--perigo); min-height: 20px; margin: 12px 0 0; font-size: 13px; }

/* Estrutura */
.app { display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }
.lateral { background: rgba(7, 7, 13, .72); backdrop-filter: blur(12px); border-right: 1px solid var(--linha); padding: 24px 16px; display: flex; flex-direction: column; gap: 4px; position: sticky; top: 0; height: 100vh; }
.lateral .logo { height: 24px; width: auto; margin: 0 8px; }
.lateral .projeto { padding: 22px 8px 20px; margin-bottom: 8px; border-bottom: 1px solid var(--linha); }
.lateral .projeto strong { display: block; font-size: 14px; font-weight: 600; }
.lateral .projeto span { color: var(--txt-3); font-size: 12px; }
.lateral nav { display: flex; flex-direction: column; gap: 2px; }
.lateral nav button { position: relative; display: flex; align-items: center; gap: 10px; text-align: left; border: 0; background: none; color: var(--txt-2); padding: 9px 10px; border-radius: var(--raio-p); font-weight: 500; transition: background .15s, color .15s; }
.lateral nav button svg { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
.lateral nav button:hover { background: var(--painel-2); color: var(--txt); }
.lateral nav button[aria-current="page"], .lateral nav button[aria-current="location"] { background: var(--painel-2); color: var(--txt); }
.lateral nav button[aria-current="page"]::before, .lateral nav button[aria-current="location"]::before { content: ""; position: absolute; left: -16px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--laranja); }
.lateral nav button[aria-current="page"] svg { color: var(--laranja); opacity: 1; }
.lateral nav .contador { margin-left: auto; }
.lateral .rodape { margin-top: auto; display: flex; flex-direction: column; gap: 10px; padding: 16px 8px 0; border-top: 1px solid var(--linha); }
.ao-vivo { display: flex; gap: 8px; align-items: center; color: var(--txt-3); font-size: 12px; }
.ao-vivo i { width: 7px; height: 7px; border-radius: 50%; background: var(--txt-3); }
.ao-vivo.ligado { color: var(--txt-2); }
.ao-vivo.ligado i { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-suave); animation: pulso 2s ease-in-out infinite; }
@keyframes pulso { 50% { box-shadow: 0 0 0 6px rgba(60, 207, 142, 0); } }
.sair { border: 1px solid var(--linha-2); background: none; color: var(--txt-2); border-radius: var(--raio-p); padding: 7px 10px; text-align: left; transition: border-color .15s, color .15s; }
.sair:hover { border-color: var(--txt-3); color: var(--txt); }
.contador { min-width: 20px; padding: 1px 7px; border-radius: 10px; background: var(--laranja); color: var(--bg); font-size: 11px; font-weight: 700; text-align: center; }

main.conteudo { padding: 36px 40px 64px; min-width: 0; max-width: 1600px; }
main.conteudo:focus { outline: none; }
.cabeca { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 28px; flex-wrap: wrap; }
.cabeca h2 { font-size: 28px; font-weight: 600; letter-spacing: -.025em; }
.cabeca p { margin: 6px 0 0; color: var(--txt-3); max-width: 720px; }

/* Cartões e números */
.grade { display: grid; gap: 16px; }
.grade.n4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grade.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.espaco { margin-top: 16px; }
.espaco-baixo { margin-bottom: 16px; }
.cartao { background: linear-gradient(180deg, var(--painel-2), var(--painel)); border: 1px solid var(--linha); border-radius: var(--raio); padding: 20px; box-shadow: var(--sombra); min-width: 0; }
.cartao h3 { font-size: 13px; font-weight: 500; color: var(--txt-2); margin-bottom: 14px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.numero { font-size: 36px; font-weight: 600; letter-spacing: -.03em; line-height: 1; }
.numero small { font-size: 14px; color: var(--txt-3); font-weight: 400; margin-left: 6px; letter-spacing: 0; }
.legenda { color: var(--txt-3); font-size: 13px; margin-top: 8px; }
.barra { height: 6px; background: var(--painel-3); border-radius: 3px; overflow: hidden; margin-top: 16px; }
.barra span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--laranja-2), var(--laranja)); border-radius: 3px; transition: width .4s ease; }
.cartao.destaque { border-color: var(--laranja-borda); background: linear-gradient(180deg, rgba(255, 136, 18, .14), rgba(255, 136, 18, .04)), var(--painel); }
.cartao.destaque .numero { color: var(--laranja); }

.lista { list-style: none; padding: 0; margin: 0; }
.lista li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--linha); }
.lista li:first-child { border-top: 0; padding-top: 0; }
.lista .vazio { color: var(--txt-3); justify-content: flex-start; }
.link-tarefa { border: 0; background: none; padding: 0; text-align: left; font-weight: 500; color: var(--txt); transition: color .15s; }
.link-tarefa:hover { color: var(--laranja); }
.semana { font-size: 12px; font-weight: 500; color: var(--txt-3); margin: 18px 0 6px; }
.semana:first-of-type { margin-top: 0; }

/* Selos */
.selo { display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 500; white-space: nowrap; background: var(--painel-3); color: var(--txt-2); border: 1px solid transparent; }
.selo.ok { background: var(--ok-suave); color: var(--ok); }
.selo.alerta { background: var(--laranja-suave); color: var(--laranja); }
.selo.perigo { background: var(--perigo-suave); color: var(--perigo); }
.selo.info { background: var(--info-suave); color: var(--info); }
.selo.roxo { background: var(--roxo-suave); color: var(--roxo); }

/* Filtros */
.filtros { display: flex; gap: 8px; flex-wrap: wrap; }
.filtros select, .filtros input { padding: 8px 12px; border: 1px solid var(--linha-2); border-radius: var(--raio-p); background: var(--painel); color: var(--txt); font: inherit; min-width: 0; }
.filtros input::placeholder { color: var(--txt-3); }
.filtros select:focus, .filtros input:focus { border-color: var(--laranja); outline: none; }

/* Kanban */
.quadro { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(232px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 12px; scrollbar-color: var(--linha-2) transparent; }
.coluna { background: rgba(13, 13, 19, .6); border: 1px solid var(--linha); border-radius: var(--raio); padding: 10px; min-height: 260px; }
.coluna > header { display: flex; justify-content: space-between; align-items: center; padding: 4px 6px 12px; font-weight: 600; font-size: 13px; }
.coluna > header span { color: var(--txt-3); font-weight: 500; font-size: 12px; background: var(--painel-3); border-radius: 10px; padding: 0 8px; }
.coluna.voce { border-color: var(--laranja-borda); background: linear-gradient(180deg, rgba(255, 136, 18, .08), rgba(13, 13, 19, .6)); }
.coluna.voce > header { color: var(--laranja); }
.tarefa { display: block; width: 100%; text-align: left; background: var(--painel-2); border: 1px solid var(--linha); border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; transition: border-color .15s, transform .15s, background .15s; }
.tarefa:hover { border-color: var(--linha-2); background: var(--painel-3); transform: translateY(-1px); }
.tarefa .topo { display: flex; justify-content: space-between; gap: 8px; color: var(--txt-3); font-size: 11px; }
.tarefa .topo .id { font-family: var(--mono); }
.tarefa .topo .squad { display: inline-flex; align-items: center; gap: 6px; }
.tarefa .topo .squad i { width: 6px; height: 6px; border-radius: 50%; }
.tarefa strong { display: block; margin: 6px 0 10px; font-weight: 600; line-height: 1.35; font-size: 14px; }
.tarefa .meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; color: var(--txt-3); }
.tarefa .meta .quem { color: var(--txt-2); }
.atrasada { color: var(--perigo); font-weight: 600; }
.vazio-quadro { padding: 48px 24px; text-align: center; }

/* Cores por squad */
.sq-direcao { background: #ff8812; }
.sq-descoberta { background: #7aa7ff; }
.sq-experiencia { background: #f08bd8; }
.sq-plataforma { background: #3ccf8e; }
.sq-app { background: #5fd3e6; }
.sq-dados { background: #f5d547; }
.sq-infra { background: #a0a0ad; }
.sq-qualidade { background: #b79bff; }

/* Detalhe */
.detalhe { position: fixed; z-index: var(--camada-gaveta); inset: 0 0 0 auto; width: min(580px, 100%); background: var(--painel); border-left: 1px solid var(--linha); box-shadow: -24px 0 48px rgba(0, 0, 0, .55); padding: 28px; overflow-y: auto; }
.detalhe[hidden] { display: none; }
.detalhe .fechar { float: right; border: 1px solid var(--linha-2); background: none; color: var(--txt-2); border-radius: var(--raio-p); padding: 5px 12px; }
.detalhe .fechar:hover { color: var(--txt); border-color: var(--txt-3); }
.detalhe h3 { font-size: 20px; margin: 10px 0 8px; letter-spacing: -.02em; }
.detalhe h4 { font-size: 12px; font-weight: 600; margin: 24px 0 8px; color: var(--txt-3); }
.detalhe p { margin: 0; color: var(--txt-2); }
.detalhe ul { margin: 0; padding-left: 18px; color: var(--txt-2); }
.detalhe li { margin: 3px 0; }
.detalhe pre { white-space: pre-wrap; word-break: break-word; font-family: var(--mono); font-size: 12px; background: var(--bg-2); border: 1px solid var(--linha); padding: 10px; border-radius: var(--raio-p); margin: 6px 0 0; }
.acoes { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; padding: 16px; border: 1px solid var(--laranja-borda); border-radius: var(--raio); background: var(--laranja-suave); }
.acoes strong { color: var(--laranja); }
.acoes textarea { width: 100%; min-height: 72px; border: 1px solid var(--linha-2); border-radius: var(--raio-p); padding: 10px; font: inherit; background: var(--bg-2); color: var(--txt); resize: vertical; }
.acoes .botoes { display: flex; gap: 8px; }
.btn { border: 1px solid var(--linha-2); background: var(--painel-2); border-radius: var(--raio-p); padding: 9px 16px; font-weight: 600; transition: background .15s, border-color .15s; }
.btn.primario { background: var(--laranja); border-color: var(--laranja); color: var(--bg); }
.btn.primario:hover { background: #ff9a3a; }
.btn.perigo { color: var(--perigo); }
.btn.perigo:hover { border-color: var(--perigo); }
.historico { padding: 0; }
.historico li { font-size: 13px; padding: 8px 0; border-top: 1px solid var(--linha); list-style: none; color: var(--txt-2); }
.historico li:first-child { border-top: 0; }

/* Tabela */
.rolagem { overflow-x: auto; border: 1px solid var(--linha); border-radius: var(--raio); }
.tabela { width: 100%; border-collapse: collapse; background: var(--painel); }
.tabela th, .tabela td { text-align: left; padding: 12px 14px; border-top: 1px solid var(--linha); vertical-align: top; }
.tabela th { font-size: 12px; color: var(--txt-3); font-weight: 500; background: var(--painel-2); border-top: 0; }
.tabela tbody tr:hover { background: var(--painel-2); }
.tabela td.id { font-family: var(--mono); font-size: 12px; color: var(--txt-3); white-space: nowrap; }
.tabela .trecho { color: var(--txt-3); font-size: 12px; margin-top: 4px; }
.cartao .rolagem { border: 0; }

/* Cronograma */
.marcos { list-style: none; padding: 0; margin: 0; }
.marcos li { position: relative; display: grid; grid-template-columns: 96px 16px 1fr; gap: 14px; align-items: start; padding: 12px 0; }
.marcos li:not(:last-child)::before { content: ""; position: absolute; left: 117px; top: 30px; bottom: -8px; width: 1px; background: var(--linha-2); }
.marcos .data { font-size: 13px; color: var(--txt-2); font-weight: 500; padding-top: 1px; }
.marcos .ponto { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--linha-2); margin-top: 4px; background: var(--painel); position: relative; }
.marcos li.passou .ponto { background: var(--txt-3); border-color: var(--txt-3); }
.marcos li.proximo .ponto { border-color: var(--laranja); background: var(--laranja); box-shadow: 0 0 0 4px var(--laranja-suave); }
.marcos li.proximo .nome { color: var(--laranja); }
.marcos .nome { font-weight: 600; }
.marcos .fonte { color: var(--txt-3); font-size: 12px; }

/* Equipe */
.squads { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.squads .cartao h3 { color: var(--txt); font-weight: 600; font-size: 14px; justify-content: flex-start; align-items: center; gap: 8px; }
.squads .cartao h3 i { width: 8px; height: 8px; border-radius: 50%; }
.squads .cartao h3 .legenda { margin: 0 0 0 auto; font-weight: 400; font-size: 12px; }
.agente { display: grid; grid-template-columns: 10px 1fr auto; gap: 12px; align-items: center; padding: 9px 0; border-top: 1px solid var(--linha); }
.agente:first-of-type { border-top: 0; }
.agente > i { width: 7px; height: 7px; border-radius: 50%; background: var(--linha-2); }
.agente.ativo > i { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-suave); animation: pulso 2s ease-in-out infinite; }
.agente.dormente { opacity: .45; }
.agente > span { min-width: 0; }
.agente .papel { font-weight: 500; }
.agente .faz { display: block; color: var(--txt-3); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agente .quando { color: var(--txt-3); font-size: 12px; white-space: nowrap; }
.feed { list-style: none; padding: 0; margin: 0; max-height: 640px; overflow-y: auto; }
.feed li { display: grid; grid-template-columns: 56px 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--linha); font-size: 13px; color: var(--txt-2); }
.feed li:first-child { border-top: 0; }
.feed strong { color: var(--txt); font-weight: 600; }
.feed time { color: var(--txt-3); font-size: 12px; padding-top: 1px; }
.feed .alvo { color: var(--txt-3); font-family: var(--mono); font-size: 12px; word-break: break-all; margin-top: 2px; }

/* Sala de operação */
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--linha-2); border-radius: 999px; font-size: 12px; color: var(--txt-2); background: var(--painel); font-family: var(--mono); }
.chip i { width: 7px; height: 7px; border-radius: 50%; background: var(--txt-3); }
.chip.vivo { border-color: rgba(60, 207, 142, .4); color: var(--txt); }
.botao-chip { cursor: pointer; color: var(--laranja); border-color: var(--laranja-borda); }
.botao-chip:hover { background: var(--laranja-suave); }
.chip.vivo i { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-suave); animation: pulso 2s ease-in-out infinite; }
.sala { display: grid; grid-template-columns: 230px minmax(0, 1fr) 290px; gap: 16px; align-items: start; }
.sala-lado { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 10px; }
.rotulo-lado { font-size: 12px; font-weight: 600; color: var(--txt-3); }
.fases { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.fases li { display: grid; grid-template-columns: auto 1fr auto; gap: 4px 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--linha); border-radius: 10px; background: var(--painel); }
.fases li.viva { border-color: var(--laranja-borda); }
.fases .barra { grid-column: 1 / -1; margin-top: 4px; height: 4px; }
.fase-id { font-family: var(--mono); font-size: 11px; font-weight: 600; color: var(--laranja); }
.fase-nome { font-size: 13px; font-weight: 500; line-height: 1.3; min-width: 0; }
.fase-nome small { display: block; color: var(--txt-3); font-size: 11px; font-weight: 400; }
.fase-conta { font-family: var(--mono); font-size: 12px; color: var(--txt-2); }
.gate { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid var(--linha); border-radius: 10px; background: var(--painel); font-size: 13px; color: var(--txt-2); }
.gate strong { font-size: 22px; font-weight: 600; color: var(--txt); line-height: 1; }
.gate.aberto { border-color: var(--laranja-borda); background: linear-gradient(180deg, rgba(255, 136, 18, .1), rgba(255, 136, 18, .02)), var(--painel); }
.gate.aberto strong { color: var(--laranja); }
.gate.travado strong { color: var(--perigo); }
.gate .link-tarefa { font-size: 12px; font-weight: 400; color: var(--txt-2); }
.passagens { list-style: none; margin: 0; padding: 0; font-size: 12px; color: var(--txt-2); }
.passagens li { display: grid; grid-template-columns: 40px 1fr; gap: 8px; padding: 7px 0; border-top: 1px solid var(--linha); }
.passagens li:first-child { border-top: 0; }
.passagens time { color: var(--txt-3); font-family: var(--mono); }

.janelas { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 12px; align-content: start; }
.janela { display: flex; flex-direction: column; min-height: 300px; background: #07070b; border: 1px solid var(--linha); border-left: 3px solid var(--linha-2); border-radius: 10px; font-family: var(--mono); font-size: 12px; overflow: hidden; }
.janela.principal { grid-column: span 2; }
.janela.ativa { border-color: var(--linha-2); box-shadow: 0 0 0 1px rgba(255, 136, 18, .12), 0 16px 40px -20px rgba(255, 136, 18, .35); }
.janela header { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--linha); background: var(--painel); }
.janela .ponto { width: 7px; height: 7px; border-radius: 50%; background: var(--txt-3); flex: none; }
.janela.ativa .ponto { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-suave); animation: pulso 2s ease-in-out infinite; }
.janela .quem { font-family: var(--fonte); font-weight: 600; font-size: 13px; padding: 1px 8px; border: 1px solid currentColor; border-radius: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.janela .tokens { flex: none; }
.janela .modelo { display: block; color: var(--txt-3); font-size: 11px; font-weight: 400; margin-top: 2px; }
.janela .tokens { margin-left: auto; color: var(--txt-2); font-size: 11px; white-space: nowrap; padding: 1px 8px; border: 1px solid var(--linha-2); border-radius: 6px; }
.janela .missao { margin: 0; padding: 10px 12px 4px; color: var(--txt); font-weight: 600; }
.janela .fluxo { list-style: none; margin: 0; padding: 4px 12px 10px; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 3px; color: var(--txt-2); line-height: 1.45; }
.janela .fluxo li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.janela .fluxo li.cmd { color: var(--txt-3); }
.janela .fluxo li.cmd b { color: var(--ok); font-weight: 600; }
.janela .fluxo li.cmd b::before { content: "\203A  "; color: var(--txt-3); }
.janela footer { padding: 8px 12px; border-top: 1px solid var(--linha); color: var(--txt-2); background: var(--painel); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.elenco summary { cursor: pointer; color: var(--txt-2); font-weight: 500; padding: 12px 0; }
.elenco summary:hover { color: var(--txt); }

/* Gradientes da marca para barras de progresso */
:root {
  --grad-portal: linear-gradient(90deg, #c9560a 0%, #ff8812 55%, #ffb25c 100%);
  --grad-app: linear-gradient(90deg, #6d4bd8 0%, #8f6bff 55%, #c3adff 100%);
  --estado-feita: #21a86e;
  --estado-curso: #4f7cf0;
  --estado-atraso: #e5484d;
}
.barra span { background: var(--grad-portal); box-shadow: 0 0 12px rgba(255, 136, 18, .35); }
.barra.brilho span { position: relative; overflow: hidden; }
.barra.brilho span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); transform: translateX(-100%); animation: reflexo 2.6s ease-in-out infinite; }
@keyframes reflexo { 60%, 100% { transform: translateX(100%); } }

/* ===== Acompanhamento: "Rumo a Horizontina" ===== */
.hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; align-items: center; padding: 40px 44px; margin-bottom: 20px; border-radius: 20px; overflow: hidden; border: 1px solid rgba(255, 136, 18, .22);
  background: radial-gradient(70% 90% at 92% 10%, rgba(255, 136, 18, .32), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgba(109, 75, 216, .22), transparent 60%), linear-gradient(180deg, #120c08, #07070d); box-shadow: 0 30px 80px -40px rgba(255, 136, 18, .45); }
.hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(80% 80% at 70% 30%, #000, transparent); pointer-events: none; }
.hero::after { content: ""; position: absolute; top: 16px; left: 16px; width: 34px; height: 34px; border-top: 2px solid var(--laranja); border-left: 2px solid var(--laranja); border-top-left-radius: 8px; }
.hero > * { position: relative; }
.hero-status { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; background: rgba(255, 255, 255, .06); border: 1px solid var(--linha-2); }
.hero-status i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(255, 255, 255, .08); animation: pulso 2s ease-in-out infinite; }
.hero-status.ok { color: var(--ok); border-color: rgba(60, 207, 142, .4); }
.hero-status.alerta { color: var(--laranja); border-color: var(--laranja-borda); }
.hero-status.perigo { color: var(--perigo); border-color: rgba(255, 107, 91, .5); }
.hero h2 { font-size: 52px; line-height: 1.02; letter-spacing: -.035em; font-weight: 700; margin: 18px 0 8px; }
.hero-sub { color: var(--txt-2); font-size: 15px; margin: 0; max-width: 520px; }
.contagem { display: flex; align-items: flex-end; gap: 18px; margin: 28px 0 24px; }
.contagem-num { font-size: 132px; line-height: .82; font-weight: 700; letter-spacing: -.06em; background: linear-gradient(180deg, #ffd29c 0%, #ff8812 45%, #b84d06 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 10px 30px rgba(255, 136, 18, .35)); font-variant-numeric: tabular-nums; }
.contagem-rotulo { font-size: 20px; font-weight: 600; line-height: 1.25; padding-bottom: 8px; }
.contagem-rotulo small { font-size: 13px; color: var(--txt-3); font-weight: 400; }
.hero-linha { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-linha button { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); min-width: 130px; backdrop-filter: blur(6px); text-align: left; color: var(--txt); cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.hero-linha button:hover { border-color: var(--laranja-borda); background: rgba(255, 136, 18, .08); transform: translateY(-2px); }
.hero-linha strong { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.hero-linha span { font-size: 12px; color: var(--txt-2); max-width: 180px; }
.hero-lado { display: flex; flex-direction: column; gap: 22px; padding: 26px 28px; border-radius: 18px; background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)); border: 1px solid rgba(255, 255, 255, .09); backdrop-filter: blur(10px); }
.proximo-marco { display: flex; flex-direction: column; gap: 8px; padding: 0; border: 0; background: none; color: var(--txt); text-align: left; cursor: pointer; }
.proximo-marco:hover .pm-nome { color: var(--laranja); }
.pm-titulo { font-size: 14px; font-weight: 600; color: var(--laranja); }
.pm-nome { font-size: 26px; transition: color .2s; line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: var(--txt); }
.pm-data { font-size: 14px; color: var(--txt-2); }
.frentes { list-style: none; margin: 0; padding: 20px 0 0; border-top: 1px solid rgba(255, 255, 255, .08); display: flex; flex-direction: column; gap: 16px; }
.frente-cabeca { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 8px; font-size: 14px; color: var(--txt-2); }
.frente-cabeca b { color: var(--txt); font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.frente-barra { position: relative; height: 10px; border-radius: 5px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.frente-barra span { position: absolute; left: 0; top: 0; bottom: 0; width: 0; min-width: 10px; border-radius: 5px; background: var(--grad-portal); box-shadow: 0 0 14px rgba(255, 136, 18, .45); transition: width 1.4s cubic-bezier(.2, .8, .2, 1); }
.f-projeto .frente-barra span { background: linear-gradient(90deg, #b84d06, #ff8812 60%, #ffd29c); }
.f-app .frente-barra span { background: var(--grad-app); box-shadow: 0 0 14px rgba(143, 107, 255, .45); }

.secao-cabeca { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.secao-cabeca h3 { margin: 0; color: var(--txt); font-size: 20px; font-weight: 600; letter-spacing: -.015em; }
.espera { color: var(--txt-3); font-size: 13px; margin: 0; }

/* A jornada */
.jornada { margin-bottom: 20px; padding: 24px 24px 18px; }
.jornada-rolagem { overflow-x: auto; scrollbar-color: var(--linha-2) transparent; }
.jornada-mapa { position: relative; min-width: 1060px; height: 330px; margin: 0 20px; }
.meses { position: absolute; top: 0; left: 0; right: 0; height: 20px; }
.meses span { position: absolute; font-size: 11px; color: var(--txt-3); text-transform: capitalize; transform: translateX(-50%); }
.meses span::after { content: ""; position: absolute; left: 50%; top: 20px; width: 1px; height: 290px; background: rgba(255, 255, 255, .035); }
.trilha { position: absolute; left: 0; right: 0; top: 156px; height: 18px; border-radius: 9px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }
.trilha-feita { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 9px; background: linear-gradient(90deg, rgba(60, 207, 142, .0), rgba(60, 207, 142, .55)); transition: width 1.4s cubic-bezier(.2, .8, .2, 1); }
.faixa { position: absolute; top: 3px; height: 12px; width: 0; border-radius: 6px; background: var(--grad-portal); box-shadow: 0 0 16px rgba(255, 136, 18, .35); opacity: .9; transition: width 1.2s cubic-bezier(.2, .8, .2, 1), transform .15s; }
.faixa.gf-app { background: var(--grad-app); box-shadow: 0 0 16px rgba(143, 107, 255, .35); }
.faixa:hover { transform: scaleY(1.4); }
.estacao { position: absolute; top: 149px; width: 0; padding: 0; border: 0; background: none; cursor: pointer; }
.estacao i { position: absolute; left: -16px; top: 0; width: 32px; height: 32px; border-radius: 50%; background: #0d0d13; border: 3px solid rgba(255, 255, 255, .25); display: block; transition: transform .2s, border-color .2s; }
.estacao i::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: rgba(255, 255, 255, .2); }
.estacao.passou i { border-color: var(--ok); }
.estacao.passou i::after { background: var(--ok); }
.estacao.proxima i { border-color: var(--laranja); box-shadow: 0 0 0 6px rgba(255, 136, 18, .15), 0 0 24px rgba(255, 136, 18, .6); animation: farol 2.4s ease-in-out infinite; }
.estacao.proxima i::after { background: var(--laranja); }
@keyframes farol { 50% { box-shadow: 0 0 0 12px rgba(255, 136, 18, 0), 0 0 30px rgba(255, 136, 18, .8); } }
.estacao:hover i { transform: scale(1.15); border-color: var(--txt); }
.estacao-cartao { position: absolute; left: -60px; width: 120px; text-align: center; font-size: 11px; line-height: 1.3; color: var(--txt-2); }
.estacao-cartao::before { content: ""; position: absolute; left: 50%; width: 1px; background: rgba(255, 255, 255, .14); }
.estacao-cartao b { display: block; font-size: 13px; color: var(--txt); font-weight: 700; }
.estacao.cima .estacao-cartao { bottom: 24px; }
.estacao.cima2 .estacao-cartao { bottom: 84px; }
.estacao.cima2 .estacao-cartao::before { top: 100%; height: 60px; }
.estacao.baixo .estacao-cartao { top: 42px; }
.estacao.baixo2 .estacao-cartao { top: 102px; }
.estacao.baixo2 .estacao-cartao::before { bottom: 100%; height: 60px; }
.estacao.sem-rotulo .estacao-cartao { display: none; }
.estacao.na-borda .estacao-cartao { left: auto; right: -8px; text-align: right; }
.estacao.na-borda .estacao-cartao::before { left: auto; right: 15px; }
.estacao.proxima .estacao-cartao { color: var(--laranja); }
.estacao.proxima .estacao-cartao b { color: var(--laranja); font-size: 15px; }
.voce-aqui { position: absolute; top: 136px; width: 0; pointer-events: none; }
.voce-aqui i { position: absolute; left: -1px; top: 0; width: 2px; height: 58px; background: var(--ok); box-shadow: 0 0 12px rgba(60, 207, 142, .8); }
.voce-aqui b { position: absolute; left: 8px; top: -6px; font-size: 11px; font-weight: 700; color: var(--ok); white-space: nowrap; }

/* Grade das seções */
.grade-acompanhamento { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; margin-bottom: 20px; }
.grade-acompanhamento > .cartao { padding: 24px; }

/* A equipe trabalhando */
.cadeia-grande { list-style: none; margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cadeia-grande li { position: relative; display: flex; flex-direction: column; gap: 2px; }
.cadeia-grande strong { font-size: 38px; line-height: 1; font-weight: 700; letter-spacing: -.03em; color: var(--txt-3); }
.cadeia-grande li.com strong { background: linear-gradient(180deg, #ffd29c, #ff8812); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cadeia-grande li:last-child.com strong { background: linear-gradient(180deg, #a5f3cf, #21a86e); -webkit-background-clip: text; background-clip: text; }
.cadeia-grande span { font-size: 12px; color: var(--txt-2); }
.cadeia-grande .seta { position: absolute; right: 10px; top: 16px; width: 18px; height: 2px; background: var(--linha-2); }
.cadeia-grande .seta::after { content: ""; position: absolute; right: -1px; top: -3px; border: 4px solid transparent; border-left-color: var(--linha-2); }
.squads { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.squad { padding: 16px 16px 14px; border-radius: 14px; background: linear-gradient(180deg, color-mix(in srgb, var(--sqc) 9%, transparent), transparent 70%), var(--bg-2); border: 1px solid var(--linha); border-top: 2px solid var(--sqc); }
.squad h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 14px; font-weight: 600; color: var(--txt); }
.squad h4 i { width: 8px; height: 8px; border-radius: 50%; background: var(--sqc); flex: none; }
.squad h4 small { margin-left: auto; font-size: 12px; font-weight: 500; color: var(--txt-3); }
.squad ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.membro { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--txt-2); cursor: default; transition: color .3s; }
.membro i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, .16); flex: none; transition: background .3s, box-shadow .3s; }
.membro:hover { color: var(--txt); }
.membro.ativo { color: var(--txt); font-weight: 600; }
.membro.ativo i { background: var(--sqc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sqc) 25%, transparent), 0 0 12px var(--sqc); animation: pulso 2s ease-in-out infinite; }
.membro.dormente { color: var(--txt-3); opacity: .6; }
.membro.dormente i { background: none; border: 1px dashed var(--txt-3); }
.sqb-direcao { --sqc: #ff8812; } .sqb-descoberta { --sqc: #7aa7ff; } .sqb-experiencia { --sqc: #f08bd8; } .sqb-plataforma { --sqc: #3ccf8e; }
.sqb-app { --sqc: #5fd3e6; } .sqb-dados { --sqc: #f5d547; } .sqb-infra { --sqc: #a0a0ad; } .sqb-qualidade { --sqc: #b79bff; } .sqb-avulso { --sqc: #8b8790; }
.equipe-viva { padding: 24px; margin-bottom: 20px; }
.equipe-viva .secao-cabeca .legenda { margin-right: auto; }
.atividade-agora { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.feito-agora { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--txt-2); }
.feito-agora > i { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: var(--sqc); box-shadow: 0 0 10px var(--sqc); flex: none; animation: pulso 2s ease-in-out infinite; }
.feito-agora strong { color: var(--txt); font-weight: 600; }
.feito-agora small { display: block; font-family: var(--mono); font-size: 11px; color: var(--txt-3); margin-top: 2px; }

/* O que precisa da organização */
.pedidos { display: grid; gap: 10px; }
.pedido { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; text-align: left; padding: 16px 18px; border-radius: 14px; border: 1px solid var(--linha-2); background: var(--bg-2); cursor: pointer; transition: transform .15s, border-color .15s; }
.pedido:hover { transform: translateX(3px); border-color: var(--txt-3); }
.pedido strong { grid-column: 1; font-size: 15px; font-weight: 600; color: var(--txt); line-height: 1.3; }
.pedido-prazo { grid-column: 1; font-size: 12px; font-weight: 600; }
.pedido-data { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-family: var(--mono); font-size: 12px; color: var(--txt-2); }
.pedido.vencida { border-color: rgba(229, 72, 77, .55); background: linear-gradient(90deg, rgba(229, 72, 77, .14), transparent 70%), var(--bg-2); }
.pedido.vencida .pedido-prazo { color: var(--estado-atraso); }
.pedido.perto { border-color: var(--laranja-borda); background: linear-gradient(90deg, rgba(255, 136, 18, .14), transparent 70%), var(--bg-2); }
.pedido.perto .pedido-prazo { color: var(--laranja); }
.pedido.longe .pedido-prazo { color: var(--txt-3); }
.mais { margin-top: 12px; }
.mais summary { cursor: pointer; color: var(--txt-2); font-size: 13px; padding: 6px 0; }
.mais summary:hover { color: var(--laranja); }

/* Próximos 14 dias */
.agenda-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.ag-dia { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 14px; align-items: start; }
.ag-data { display: flex; flex-direction: column; align-items: center; padding: 8px 0 9px; border-radius: 12px; background: var(--bg-2); border: 1px solid var(--linha-2); line-height: 1.1; }
.ag-data span { font-size: 11px; color: var(--txt-3); }
.ag-data b { font-size: 22px; font-weight: 700; color: var(--txt); margin: 2px 0; }
.ag-dia.hoje .ag-data { border-color: var(--ok); }
.ag-dia ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ag-item { display: flex; gap: 10px; align-items: flex-start; width: 100%; padding: 7px 10px; border: 0; border-radius: 10px; background: none; text-align: left; font-size: 14px; color: var(--txt); cursor: pointer; transition: background .15s; }
.ag-item:hover { background: rgba(255, 255, 255, .04); }
.ag-item .g-ponto { position: static; margin: 4px 0 0; flex: none; }
.ag-item small { display: block; margin-top: 2px; font-size: 12px; color: var(--txt-3); }

/* Decisões */
.decisoes { padding: 24px; margin-bottom: 20px; }
.decisoes-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 28px; }
.decisoes-lista li { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.45; color: var(--txt); }
.decisoes-lista i { width: 10px; height: 10px; margin-top: 5px; border-radius: 50%; background: var(--laranja); flex: none; box-shadow: 0 0 0 3px var(--laranja-suave); }

/* Detalhe recolhido */
.detalhe-fundo { padding: 0; margin-bottom: 20px; }
.detalhe-fundo > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 22px 24px; }
.detalhe-fundo > summary::-webkit-details-marker { display: none; }
.detalhe-fundo > summary h3 { margin: 0; color: var(--txt); font-size: 18px; font-weight: 600; }
.detalhe-fundo > summary::after { content: "Abrir"; color: var(--laranja); font-size: 13px; font-weight: 600; }
.detalhe-fundo[open] > summary::after { content: "Fechar"; }
.detalhe-corpo { padding: 0 24px 24px; display: grid; gap: 24px; }

@media (max-width: 1200px) {
  .hero { grid-template-columns: minmax(0, 1fr); }
  .squads { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grade-acompanhamento { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .hero { padding: 28px 20px; border-radius: 16px; }
  .hero h2 { font-size: 34px; }
  .contagem-num { font-size: 88px; }
  .contagem-rotulo { font-size: 16px; }
  .hero-linha { gap: 8px; }
  .hero-linha button { flex: 1 1 0; min-width: 0; padding: 10px 12px; }
  .hero-linha strong { font-size: 20px; }
  .pm-nome { font-size: 21px; }
  .hero-lado { padding: 20px; }
  .squads { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .decisoes-lista { grid-template-columns: minmax(0, 1fr); }
  .cadeia-grande strong { font-size: 28px; }
  .cadeia-grande .seta { display: none; }
  .cadeia-grande { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 16px; }
}

/* Gantt */
.gantt { margin-top: 4px; }
.g-rolagem { overflow-x: auto; scrollbar-color: var(--linha-2) transparent; }
.g-quadro { min-width: 980px; }
.gantt { --g-rotulo: 230px; }
.g-cabeca, .g-linha { display: grid; grid-template-columns: var(--g-rotulo) 1fr; align-items: center; }
.g-rotulo { display: flex; gap: 10px; align-items: center; font-size: 13px; font-weight: 500; padding-right: 12px; background: var(--painel-2); min-height: 40px; }
.g-rotulo small { display: block; color: var(--txt-3); font-weight: 400; font-size: 11px; }
.g-pista { position: relative; height: 40px; }
.g-meses { height: 26px; border-bottom: 1px solid var(--linha); }
.g-meses span { position: absolute; top: 4px; font-size: 11px; color: var(--txt-3); text-transform: capitalize; transform: translateX(4px); }
.g-corpo { position: relative; }
.g-grade { position: absolute; inset: 0 0 0 var(--g-rotulo); pointer-events: none; }
.g-grade i { position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .035); }
.g-linha + .g-linha { border-top: 1px solid rgba(255, 255, 255, .03); }
.g-barra { position: absolute; top: 12px; height: 16px; border-radius: 8px; background: linear-gradient(90deg, rgba(201, 86, 10, .38), rgba(255, 136, 18, .3), rgba(255, 178, 92, .22)); border: 1px solid rgba(255, 136, 18, .45); overflow: hidden; box-shadow: 0 0 14px rgba(255, 136, 18, .12); transition: transform .15s, box-shadow .15s; }
.g-barra:hover { transform: scaleY(1.15); box-shadow: 0 0 18px rgba(255, 136, 18, .3); }
.g-barra.gf-app { background: linear-gradient(90deg, rgba(109, 75, 216, .42), rgba(143, 107, 255, .32), rgba(195, 173, 255, .22)); border-color: rgba(143, 107, 255, .5); box-shadow: 0 0 14px rgba(143, 107, 255, .14); }
.g-barra.gf-ambos { background: rgba(255, 255, 255, .06); border-color: var(--linha-2); }
.g-progresso { display: block; height: 100%; width: 0; background: var(--grad-portal); transition: width 1s cubic-bezier(.2, .8, .2, 1); }
.g-barra.gf-app .g-progresso { background: var(--grad-app); }
.g-barra.gf-ambos .g-progresso { background: linear-gradient(90deg, #5c5c68, #8b8790); }
.g-ponto { position: absolute; top: 14px; width: 12px; height: 12px; margin-left: -6px; padding: 0; border-radius: 50%; border: 2px solid var(--painel-2); cursor: pointer; transition: transform .15s; }
.g-ponto:hover, .g-ponto:focus-visible { transform: scale(1.5); }
.g-ponto.feita { background: var(--estado-feita); }
.g-ponto.curso { background: var(--estado-curso); box-shadow: 0 0 0 3px rgba(79, 124, 240, .25); }
.g-ponto.atraso { background: var(--estado-atraso); border-radius: 2px; transform: rotate(45deg); }
.g-ponto.atraso:hover { transform: rotate(45deg) scale(1.5); }
.g-ponto.aguarda { background: var(--painel-2); border-color: var(--txt-3); }
.g-marcos .g-pista { height: 34px; }
.g-marco { position: absolute; top: 10px; width: 12px; height: 12px; margin-left: -6px; background: var(--laranja); transform: rotate(45deg); border-radius: 2px; box-shadow: 0 0 10px rgba(255, 136, 18, .5); }
.g-marco.passou { background: var(--txt-3); box-shadow: none; }
.g-hoje { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: var(--g-rotulo); background: var(--ok); box-shadow: 0 0 10px rgba(60, 207, 142, .6); pointer-events: none; }
.g-hoje span { position: absolute; top: -2px; left: 6px; font-size: 10px; color: var(--ok); font-weight: 600; }
.legenda-grafico { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 14px; font-size: 12px; color: var(--txt-2); }
.legenda-grafico span { display: inline-flex; align-items: center; gap: 8px; }
.legenda-grafico .g-ponto, .legenda-grafico .g-marco { position: static; margin: 0; }
.g-barra-mini { display: inline-block; width: 22px; height: 8px; border-radius: 4px; background: var(--grad-portal); }
.g-barra-mini.gf-app { background: var(--grad-app); }
.selo-estado { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--txt-2); white-space: nowrap; }
.selo-estado .g-ponto { position: static; margin: 0; width: 10px; height: 10px; }

/* Curva de entregas */
.curva-bloco { overflow-x: auto; scrollbar-color: var(--linha-2) transparent; }
.curva svg { width: 100%; min-width: 600px; height: auto; display: block; }
.c-grade { stroke: var(--linha); stroke-width: 1; }
.c-eixo { fill: var(--txt-3); font-size: 11px; font-family: var(--fonte); }
.c-prev { fill: none; stroke: var(--txt-3); stroke-width: 2; stroke-dasharray: 5 5; }
.c-real { fill: none; stroke: #e0700a; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 6px rgba(224, 112, 10, .5)); }
.c-hoje { stroke: var(--ok); stroke-width: 1.5; }
.c-rotulo { fill: var(--txt-2); font-size: 13px; font-family: var(--fonte); }
.c-rotulo.forte { fill: var(--txt); font-weight: 600; }
.c-mira { stroke: var(--txt-2); stroke-width: 1; stroke-dasharray: 2 3; }
.legenda-grafico .l-prev { width: 22px; border-top: 2px dashed var(--txt-3); }
.legenda-grafico .l-real { width: 22px; border-top: 2.5px solid #e0700a; }

/* Dica flutuante */
.dica { position: fixed; z-index: var(--camada-gaveta); max-width: 300px; padding: 10px 12px; border-radius: 10px; background: #1f1f28; border: 1px solid var(--linha-2); box-shadow: 0 12px 32px rgba(0, 0, 0, .55); pointer-events: none; font-size: 12px; color: var(--txt-2); }
.dica strong { display: block; color: var(--txt); font-size: 13px; font-weight: 600; margin-bottom: 2px; }
.dica[hidden] { display: none; }

/* Entrada em sequência na primeira abertura da aba */
.entrando .cartao { animation: entrar .6s cubic-bezier(.2, .8, .2, 1) both; }
.entrando .cartao:nth-child(2) { animation-delay: .06s; }
.entrando .cartao:nth-child(3) { animation-delay: .12s; }
.entrando .cartao:nth-child(4) { animation-delay: .18s; }
.entrando .g-linha { animation: entrar .5s cubic-bezier(.2, .8, .2, 1) both; }
.entrando .g-linha:nth-child(3) { animation-delay: .05s; } .entrando .g-linha:nth-child(4) { animation-delay: .1s; } .entrando .g-linha:nth-child(5) { animation-delay: .15s; } .entrando .g-linha:nth-child(6) { animation-delay: .2s; } .entrando .g-linha:nth-child(7) { animation-delay: .25s; }
@keyframes entrar { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

@media (max-width: 900px) {
  .gantt { --g-rotulo: 132px; }
  .g-rotulo { position: sticky; left: 0; z-index: var(--camada-grafico); }
  .g-rotulo { font-size: 12px; gap: 6px; }
  .g-rotulo small { display: none; }
  .g-quadro { min-width: 760px; }
}

/* Equipe: função de cada agente */
.cadeia ol { margin: 10px 0 0; padding: 0; list-style-position: inside; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; color: var(--txt-2); }
.cadeia li::marker { color: var(--laranja); font-weight: 600; }
.funcoes h3 { color: var(--txt); font-weight: 600; font-size: 14px; justify-content: flex-start; align-items: center; gap: 8px; }
.funcoes h3 i { width: 8px; height: 8px; border-radius: 50%; }
.funcoes h3 .legenda { margin: 0 0 0 auto; font-weight: 400; font-size: 12px; }
.funcao { border-top: 1px solid var(--linha); }
.funcao:first-of-type { border-top: 0; }
.funcao summary { list-style: none; cursor: pointer; display: grid; gap: 4px; padding: 12px 0; }
.funcao summary::-webkit-details-marker { display: none; }
.funcao summary:hover .papel { color: var(--laranja); }
.funcao .papel { font-weight: 600; transition: color .15s; }
.funcao .o-que { color: var(--txt-2); font-size: 13px; }
.funcao .meta-agente { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.funcao p { margin: 0 0 10px; color: var(--txt-2); font-size: 13px; }
.funcao p strong { color: var(--txt); font-weight: 600; }
.funcao .arquivo { font-family: var(--mono); font-size: 11px; color: var(--txt-3); }
.funcao.dormente { opacity: .55; }

.sq-txt-direcao { color: #ff8812; } .sq-borda-direcao { border-left-color: #ff8812; }
.sq-txt-descoberta { color: #7aa7ff; } .sq-borda-descoberta { border-left-color: #7aa7ff; }
.sq-txt-experiencia { color: #f08bd8; } .sq-borda-experiencia { border-left-color: #f08bd8; }
.sq-txt-plataforma { color: #3ccf8e; } .sq-borda-plataforma { border-left-color: #3ccf8e; }
.sq-txt-app { color: #5fd3e6; } .sq-borda-app { border-left-color: #5fd3e6; }
.sq-txt-dados { color: #f5d547; } .sq-borda-dados { border-left-color: #f5d547; }
.sq-txt-infra { color: #a0a0ad; } .sq-borda-infra { border-left-color: #a0a0ad; }
.sq-txt-qualidade { color: #b79bff; } .sq-borda-qualidade { border-left-color: #b79bff; }
.sq-txt-avulso { color: var(--txt-2); } .sq-borda-avulso { border-left-color: var(--txt-3); }

@media (max-width: 1280px) {
  .sala { grid-template-columns: minmax(0, 1fr); }
  .sala-lado { position: static; }
  .fases { flex-direction: row; overflow-x: auto; }
  .fases li { min-width: 200px; }
}

/* Celular */
@media (max-width: 900px) {
  .app { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: sticky; z-index: var(--camada-cabecalho); height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px 16px 0; border-right: 0; border-bottom: 1px solid var(--linha); }
  .lateral .logo { margin: 0; height: 20px; }
  .lateral .projeto { display: none; }
  .lateral nav { flex-direction: row; overflow-x: auto; width: 100%; min-width: 0; order: 3; gap: 4px; padding-bottom: 10px; scrollbar-width: none; }
  .lateral nav button { white-space: nowrap; flex: none; padding: 8px 10px; }
  .lateral nav button[aria-current="page"]::before, .lateral nav button[aria-current="location"]::before { left: 10px; right: 10px; top: auto; bottom: -10px; width: auto; height: 2px; border-radius: 2px; }
  .lateral .rodape { margin: 0 0 0 auto; flex-direction: row; align-items: center; border-top: 0; padding: 0; }
  main.conteudo { padding: 24px 16px 48px; }
  .cabeca h2 { font-size: 24px; }
  .grade.n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grade.n2 { grid-template-columns: 1fr; }
  .numero { font-size: 30px; }
  .quadro { grid-auto-columns: minmax(84vw, 1fr); scroll-snap-type: x mandatory; }
  .coluna { scroll-snap-align: start; }
  .marcos li { grid-template-columns: 84px 14px 1fr; gap: 10px; }
  .marcos li:not(:last-child)::before { left: 100px; }
  .detalhe { padding: 20px 16px; }
  .janelas { grid-template-columns: minmax(0, 1fr); }
  .cadeia ol { grid-template-columns: minmax(0, 1fr); }
  .janela.principal { grid-column: auto; }
}
@media (max-width: 420px) {
  .grade.n4 { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation: none; transition: none; }
}

/* ===== Acompanhamento vivo ===== */
.marca-secao { width: 6px; height: 6px; border-radius: 50%; background: var(--txt-3); flex: none; transition: background .2s, box-shadow .2s; }
.lateral nav button[aria-current="location"] .marca-secao { background: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-suave); }

/* Topo: fundo que se move, contagem ao vivo e aviso de atualização */
.hero > .aurora { position: absolute; inset: -30%; pointer-events: none; filter: blur(70px); opacity: .5; }
.aurora i { position: absolute; width: 46%; height: 62%; border-radius: 50%; }
.aurora i:nth-child(1) { left: 52%; top: 4%; background: #ff8812; animation: deriva-a 19s ease-in-out infinite alternate; }
.aurora i:nth-child(2) { left: 2%; top: 46%; background: #6d4bd8; opacity: .8; animation: deriva-b 23s ease-in-out infinite alternate; }
.aurora i:nth-child(3) { left: 30%; top: 26%; background: #c9560a; opacity: .55; animation: deriva-c 29s ease-in-out infinite alternate; }
@keyframes deriva-a { to { transform: translate(-28%, 22%) scale(1.25); } }
@keyframes deriva-b { to { transform: translate(34%, -18%) scale(.85); } }
@keyframes deriva-c { to { transform: translate(-16%, -24%) scale(1.3); } }
.hero-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.atualizado { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--txt-3); }
.atualizado i { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px var(--ok-suave); animation: pulso 2s ease-in-out infinite; }
.relogio { display: flex; gap: 10px; margin: -6px 0 22px; }
.relogio span { display: flex; flex-direction: column; align-items: center; min-width: 74px; padding: 10px 8px 8px; border-radius: 12px; background: rgba(0, 0, 0, .28); border: 1px solid rgba(255, 255, 255, .08); font-size: 11px; color: var(--txt-3); }
.relogio b { font-size: 28px; line-height: 1; font-weight: 700; color: var(--txt); font-variant-numeric: tabular-nums; letter-spacing: -.02em; margin-bottom: 4px; }
.relogio span:last-child b { color: var(--laranja); }

/* Luz que segue o mouse nos cartões */
.cartao.luz { background: radial-gradient(520px circle at var(--mx, -600px) var(--my, -600px), rgba(255, 136, 18, .075), transparent 60%), linear-gradient(180deg, var(--painel-2), var(--painel)); }

/* Jornada: luz correndo na trilha, estação escolhida, painel de detalhe e etapas */
.trilha { overflow: hidden; }
.cometa { position: absolute; top: 50%; left: -120px; width: 120px; height: 4px; margin-top: -2px; border-radius: 2px; background: linear-gradient(90deg, transparent, rgba(255, 226, 190, .95)); box-shadow: 0 0 14px rgba(255, 136, 18, .9); animation: cometa 6.5s cubic-bezier(.45, .05, .55, .95) infinite; pointer-events: none; }
@keyframes cometa { 0% { left: -120px; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
.estacao[aria-pressed="true"] i { border-color: var(--txt); transform: scale(1.18); box-shadow: 0 0 0 7px rgba(255, 255, 255, .08), 0 0 26px rgba(255, 136, 18, .55); }
.estacao[aria-pressed="true"] .estacao-cartao { color: var(--txt); }
.estacao[aria-pressed="true"] .estacao-cartao b { color: var(--laranja); }

.etapas-bloco { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.etapas-linha { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 12px; align-items: stretch; }
.etapas-frente { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--txt-2); }
.etapas-frente::before { content: ""; width: 4px; align-self: stretch; border-radius: 2px; background: var(--grad-portal); }
.etapas-frente.gf-app::before { background: var(--grad-app); }
.etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.etapa button { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; gap: 6px; padding: 14px 14px 12px; border-radius: 14px; border: 1px solid var(--linha); background: var(--bg-2); color: var(--txt); text-align: left; cursor: pointer; transition: border-color .2s, transform .2s, background .2s; }
.etapa button:hover { transform: translateY(-3px); border-color: var(--linha-2); }
.etapa button[aria-pressed="true"] { border-color: var(--txt-2); background: var(--painel-3); }
.etapa-num { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-size: 12px; font-weight: 700; color: var(--txt-2); border: 2px solid var(--linha-2); }
.etapa-num svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.etapa-nome { font-size: 14px; font-weight: 600; line-height: 1.25; }
.etapa-periodo { font-size: 12px; color: var(--txt-3); font-variant-numeric: tabular-nums; }
.etapa-barra { position: relative; height: 5px; margin-top: auto; border-radius: 3px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.etapa-barra span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: var(--grad-portal); }
.etapa.gf-app .etapa-barra span { background: var(--grad-app); }
.etapa-conta { font-size: 11px; color: var(--txt-3); }
.etapa.gf-portal .etapa-num { border-color: rgba(255, 136, 18, .45); }
.etapa.gf-app .etapa-num { border-color: rgba(143, 107, 255, .5); }
.etapa.feita .etapa-num { background: var(--ok); border-color: var(--ok); color: #04130c; }
.etapa.agora button { border-color: var(--laranja-borda); background: linear-gradient(180deg, rgba(255, 136, 18, .12), transparent 70%), var(--bg-2); }
.etapa.agora .etapa-num { background: var(--laranja); border-color: var(--laranja); color: #1a0d02; animation: farol 2.4s ease-in-out infinite; }
.etapa.agora .etapa-conta { color: var(--laranja); }
.etapa.atrasada .etapa-num { border-color: var(--estado-atraso); color: var(--estado-atraso); }

.estacao-detalhe { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 14px; align-items: start; margin-top: 16px; padding: 20px; border-radius: 16px; background: linear-gradient(135deg, rgba(255, 136, 18, .08), transparent 55%), var(--bg-2); border: 1px solid var(--linha-2); }
.estacao-detalhe.troca .ed-corpo { animation: trocar .45s cubic-bezier(.2, .8, .2, 1); }
@keyframes trocar { from { opacity: 0; transform: translateX(14px); } }
.ed-passo { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--linha-2); background: var(--painel); color: var(--txt); cursor: pointer; transition: border-color .2s, background .2s; }
.ed-passo:hover:not(:disabled) { border-color: var(--laranja); background: var(--laranja-suave); }
.ed-passo:disabled { opacity: .3; cursor: default; }
.ed-passo svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ed-corpo h4 { margin: 0 0 8px; font-size: 20px; font-weight: 700; letter-spacing: -.015em; color: var(--txt); }
.ed-quando { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.ed-quando span { padding: 3px 10px; border-radius: 999px; background: rgba(255, 255, 255, .06); font-size: 12px; color: var(--txt-2); }
.ed-quando span:first-child { color: var(--txt); }
.ed-resumo { margin: 0 0 6px; font-size: 13px; color: var(--txt-3); }
.ed-entregas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 2px 12px; }

/* Pedidos à organização: placar e abas por prazo */
.placar { margin: -6px 0 16px; height: 6px; }
.abas { display: flex; gap: 6px; margin-bottom: 14px; padding: 4px; border-radius: 12px; background: var(--bg-2); border: 1px solid var(--linha); }
.abas button { flex: 1; display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 8px 10px; border: 0; border-radius: 9px; background: none; color: var(--txt-2); font-size: 13px; font-weight: 500; cursor: pointer; transition: background .2s, color .2s; }
.abas button b { min-width: 22px; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, .08); font-size: 12px; }
.abas button:hover:not(:disabled) { color: var(--txt); }
.abas button[aria-selected="true"] { background: var(--painel-3); color: var(--txt); box-shadow: inset 0 0 0 1px var(--linha-2); }
.abas button.aba-vencidos[aria-selected="true"] b { background: var(--estado-atraso); color: #fff; }
.abas button.aba-semana[aria-selected="true"] b { background: var(--laranja); color: #1a0d02; }
.abas button:disabled { opacity: .4; cursor: default; }
.pedidos { max-height: 520px; overflow-y: auto; scrollbar-color: var(--linha-2) transparent; }

/* Agenda: faixa de dias */
.faixa-dias { display: grid; grid-template-columns: 58px repeat(14, minmax(30px, 1fr)); gap: 4px; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.faixa-dias button { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 7px 0 6px; border-radius: 10px; border: 1px solid var(--linha); background: var(--bg-2); color: var(--txt-2); font-size: 10px; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.faixa-dias button b { font-size: 15px; font-weight: 700; color: var(--txt); }
.faixa-dias button i { height: 14px; font-style: normal; font-size: 10px; font-weight: 700; color: var(--laranja); }
.faixa-dias .fd-todos { font-size: 12px; font-weight: 600; color: var(--txt); }
.faixa-dias .fd-todos b { font-size: 12px; color: var(--laranja); }
.faixa-dias button.tem { border-color: rgba(255, 136, 18, .3); background: linear-gradient(180deg, rgba(255, 136, 18, .12), transparent), var(--bg-2); }
.faixa-dias button:hover:not(:disabled) { transform: translateY(-2px); border-color: var(--laranja-borda); }
.faixa-dias button[aria-selected="true"] { border-color: var(--laranja); background: var(--laranja-suave); }
.faixa-dias button.hoje { box-shadow: inset 0 -2px 0 var(--ok); }
.faixa-dias button:disabled { opacity: .35; cursor: default; }
.faixa-dias button.fds:disabled { opacity: .2; }

/* Equipe: etapas clicáveis, especialistas clicáveis, trabalhando agora e movimento recente */
.cadeia-grande button { display: flex; flex-direction: column; gap: 2px; padding: 6px 10px 8px; margin: -6px 10px 0 0; border: 1px solid transparent; border-radius: 12px; background: none; color: inherit; text-align: left; cursor: pointer; transition: background .2s, border-color .2s; }
.cadeia-grande button:hover { background: rgba(255, 255, 255, .04); }
.cadeia-grande button[aria-expanded="true"] { border-color: var(--laranja-borda); background: var(--laranja-suave); }
.cadeia-grande .seta::before { content: ""; position: absolute; top: -2px; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--laranja); box-shadow: 0 0 8px var(--laranja); animation: fluxo 2.2s linear infinite; }
@keyframes fluxo { from { transform: translateX(-4px); opacity: 0; } 30% { opacity: 1; } to { transform: translateX(18px); opacity: 0; } }
.etapa-lista { margin: -6px 0 20px; padding: 16px 18px; border-radius: 14px; background: var(--bg-2); border: 1px solid var(--laranja-borda); animation: trocar .35s cubic-bezier(.2, .8, .2, 1); }
.etapa-lista h4 { margin: 0 0 8px; font-size: 14px; font-weight: 600; }
.etapa-lista .ed-entregas { max-height: 340px; overflow-y: auto; scrollbar-color: var(--linha-2) transparent; }
.membro { width: 100%; padding: 2px 0; border: 0; background: none; text-align: left; cursor: pointer; }
.membro small { margin-left: auto; padding: 0 7px; border-radius: 999px; background: rgba(255, 255, 255, .06); font-size: 11px; color: var(--txt-3); }
.squad { transition: transform .25s, box-shadow .25s; }
.squad:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -24px var(--sqc); }
.equipe-rodape { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--linha); }
.equipe-rodape h4 { margin: 0 0 10px; font-size: 14px; font-weight: 600; color: var(--txt); }
.equipe-rodape .atividade-agora { margin-top: 0; }
.movimentos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--txt-2); }
.movimentos li { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 10px; align-items: baseline; }
.movimentos time { font-size: 12px; color: var(--txt-3); font-variant-numeric: tabular-nums; }
.movimentos li:first-child time { color: var(--ok); }
.link-mov { display: inline; padding: 0; border: 0; background: none; color: var(--txt); font: inherit; font-weight: 500; text-align: left; cursor: pointer; }
.link-mov:hover { color: var(--laranja); }

/* Fichas na gaveta lateral */
.trilho-etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.trilho-etapas li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 0; font-size: 11px; color: var(--txt-3); text-align: center; }
.trilho-etapas li::before { content: ""; position: absolute; top: 6px; left: -50%; width: 100%; height: 2px; background: var(--linha-2); }
.trilho-etapas li:first-child::before { display: none; }
.trilho-etapas i { position: relative; width: 14px; height: 14px; border-radius: 50%; background: var(--painel); border: 2px solid var(--linha-2); }
.trilho-etapas li.feita { color: var(--txt-2); }
.trilho-etapas li.feita::before, .trilho-etapas li.atual::before { background: var(--ok); }
.trilho-etapas li.feita i { background: var(--ok); border-color: var(--ok); }
.trilho-etapas li.atual { color: var(--txt); font-weight: 600; }
.trilho-etapas li.atual i { background: var(--laranja); border-color: var(--laranja); box-shadow: 0 0 0 4px var(--laranja-suave); animation: farol 2.4s ease-in-out infinite; }
.historico-ficha { list-style: none; margin: 0; padding: 0; }
.historico-ficha li { display: grid; grid-template-columns: 54px 1fr; gap: 8px; margin: 0; padding: 6px 0; border-bottom: 1px solid var(--linha); font-size: 13px; color: var(--txt-2); }
.historico-ficha time { color: var(--txt-3); font-variant-numeric: tabular-nums; }
.detalhe p.aviso-parada { margin-top: 12px; color: var(--estado-atraso); }
.ponto-equipe { width: 9px; height: 9px; border-radius: 50%; background: var(--sqc); }
.detalhe .ed-entregas { grid-template-columns: minmax(0, 1fr); padding: 0; }

/* Cada seção entra ao aparecer na tela, uma vez só */
@media (prefers-reduced-motion: no-preference) {
  .a-revelar { opacity: 0; transform: translateY(18px); }
  .revela { animation: entrar .8s cubic-bezier(.2, .8, .2, 1) backwards; }
  .revela .faixa, .revela .frente-barra span, .revela .etapa-barra span { animation: crescer 1.3s .25s cubic-bezier(.2, .8, .2, 1) backwards; transform-origin: left; }
  .revela .etapa, .revela .squad, .revela .pedido, .revela .decisoes-lista li, .revela .ag-dia { animation: entrar .6s cubic-bezier(.2, .8, .2, 1) backwards; }
  .revela :is(.etapa, .squad, .pedido, .decisoes-lista li, .ag-dia):nth-child(2) { animation-delay: .06s; }
  .revela :is(.etapa, .squad, .pedido, .decisoes-lista li, .ag-dia):nth-child(3) { animation-delay: .12s; }
  .revela :is(.etapa, .squad, .pedido, .decisoes-lista li, .ag-dia):nth-child(4) { animation-delay: .18s; }
  .revela :is(.etapa, .squad, .pedido, .decisoes-lista li, .ag-dia):nth-child(5) { animation-delay: .24s; }
  .revela :is(.etapa, .squad, .pedido, .decisoes-lista li, .ag-dia):nth-child(n + 6) { animation-delay: .3s; }
}
@keyframes crescer { from { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) {
  .aurora i, .cometa, .cadeia-grande .seta::before, .atualizado i, .etapa.agora .etapa-num, .trilho-etapas li.atual i { animation: none; }
  .cometa { display: none; }
}

@media (max-width: 900px) {
  .relogio span { min-width: 0; flex: 1; }
  .relogio b { font-size: 22px; }
  .estacao-detalhe { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  .estacao-detalhe .ed-passo { display: none; }
  .ed-entregas { grid-template-columns: minmax(0, 1fr); }
  .equipe-rodape { grid-template-columns: minmax(0, 1fr); }
  .abas button { padding: 8px 4px; font-size: 12px; }
  .faixa-dias { grid-template-columns: 54px repeat(14, 34px); }
  .etapas-linha { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .etapas { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 168px; overflow-x: auto; padding-bottom: 6px; scrollbar-color: var(--linha-2) transparent; }
}