/* Planejador: edição, dias, DJs por dia e grade por palco. As quatro etapas ocupam a mesma faixa (a largura do
   conteúdo da página); o que muda entre elas é o arranjo interno, nunca a medida. */
.fas-tt__progresso { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--esp-1); padding: 0; margin: 0; border: 0; list-style: none; }
.fas-tt__progresso li { display: flex; align-items: center; gap: var(--esp-1); min-width: 0; color: var(--cor-texto-suave); font-size: var(--texto-legenda); }
.fas-tt__progresso-rotulo { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fas-tt__progresso li > span[aria-hidden] { display: grid; place-items: center; flex: 0 0 1.25rem; height: 1.25rem; border: 1px solid var(--cor-borda); border-radius: 50%; font-size: var(--texto-rotulo); }
.fas-tt__progresso [aria-current='step'] { color: var(--cor-acento); font-weight: var(--peso-forte); }
.fas-tt__progresso [aria-current='step'] > span[aria-hidden] { border-color: var(--cor-acento); background: rgb(121 226 255 / .12); }
.fas-tt__pergunta, .fas-tt__etapa { display: grid; gap: var(--esp-3); min-width: 0; }
.fas-tt__pergunta { gap: var(--esp-1); }
.fas-tt__pergunta h2 { scroll-margin-top: calc(var(--altura-header) + var(--altura-topbar) + var(--esp-4)); }
.fas-tt__pergunta h2:focus { outline: none; }
.fas-tt__etapa [data-tt-edicoes] { justify-self: stretch; justify-content: start; }
.fas-tt__opcao-todos { width: 100%; min-height: var(--alvo-toque); border: 1px solid var(--cor-borda); border-radius: var(--raio-1); padding: var(--esp-3); background: transparent; color: var(--cor-texto); font: inherit; font-size: var(--texto-controle); font-weight: var(--peso-forte); cursor: pointer; }
.fas-tt__opcao-todos[aria-pressed='true'] { color: var(--cor-acento); border-color: var(--cor-acento); background: rgb(121 226 255 / .08); }
/* auto-fit: dois, três ou cinco dias preenchem a faixa sem deixar trilho vazio. */
.fas-tt__opcoes-dias { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr)); gap: var(--esp-2); }
.fas-tt__opcao-dia { display: flex; align-items: center; gap: var(--esp-3); min-height: var(--alvo-toque); padding: var(--esp-3); border: 1px solid var(--cor-borda); border-radius: var(--raio-1); cursor: pointer; }
.fas-tt__opcao-dia:has(input:checked) { border-color: var(--cor-borda-ativa); background: rgb(121 226 255 / .05); }
.fas-tt__opcao-dia input { width: 1.125rem; height: 1.125rem; margin: 0; flex-shrink: 0; accent-color: var(--cor-acento); }
.fas-tt__opcao-dia > span { display: grid; min-width: 0; }
.fas-tt__opcao-dia strong { font-size: var(--texto-controle); }
.fas-tt__opcao-dia small { color: var(--cor-texto-suave); font-size: var(--texto-mini); }
.fas-tt__opcao-todos:focus-visible, .fas-tt__navegacao button:focus-visible { outline: 2px solid var(--cor-acento); outline-offset: 2px; }
.fas-tt__navegacao { display: flex; align-items: center; justify-content: flex-end; gap: var(--esp-2); padding-top: var(--esp-4); border: 0; border-top: 1px solid var(--cor-borda); }
.fas-tt__navegacao > [data-tt-voltar] { margin-right: auto; padding-inline: var(--esp-2); }
.fas-tt__navegacao .botao { min-height: var(--alvo-toque); padding-inline: var(--esp-4); }
.fas-tt__navegacao button:disabled { opacity: .5; cursor: not-allowed; }
.fas-tt__andamento { display: grid; min-width: 0; margin-right: auto; color: var(--cor-acento); font-size: var(--texto-legenda); }
.fas-tt__andamento > span { color: var(--cor-texto-suave); font-size: var(--texto-rotulo); }
.fas-tt--planner [data-tt-etapa='1'] .fas-lab__alternar { justify-self: start; }
@media (max-width: 59.99rem) {
  .fas-tt--planner { padding-bottom: var(--recuo-painel); }
  .fas-tt--planner[data-tt-etapa-atual='3'], .fas-tt--planner[data-tt-etapa-atual='4'] { padding-bottom: 5rem; }
  .fas-tt--planner:is([data-tt-etapa-atual='3'], [data-tt-etapa-atual='4']) .fas-tt__navegacao { position: fixed; inset: auto 0 0; z-index: 19; border-top: 0; padding: var(--esp-2) var(--gutter); padding-bottom: max(var(--esp-2), env(safe-area-inset-bottom)); background: var(--fas-abismo); }
}

.fas-tt--planner { scroll-margin-top: calc(var(--altura-header) + var(--altura-topbar) + var(--esp-3)); }

.fas-tt--planner { width: 100%; min-width: 0; gap: var(--esp-5); }
.fas-tt--planner .fas-tt__progresso { border: 0; border-bottom: 1px solid var(--cor-borda); padding: 0 0 var(--esp-3); gap: var(--esp-2); }
.fas-tt__pergunta h2 { font-size: var(--texto-titulo-2); line-height: var(--altura-apertada); }
.fas-tt__pergunta [data-tt-etapa-rotulo] { font-size: var(--texto-legenda); color: var(--cor-acento); }
/* auto-fill (e não auto-fit): com uma edição só o cartão fica do tamanho de um trilho, sem esticar pela faixa inteira. */
.fas-tt__edicoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(26rem, 100%), 1fr)); gap: var(--esp-3); width: 100%; }
.fas-tt__edicao { display: flex; align-items: center; gap: var(--esp-3); padding: var(--esp-3); width: 100%; min-width: 0; border: 1px solid var(--cor-borda); border-radius: var(--raio-1); background: var(--cor-superficie); color: var(--cor-texto); text-align: left; font: inherit; cursor: pointer; }
.fas-tt__edicao > span:not(.fas-tt__edicao-check) { display: grid; gap: .2rem; min-width: 0; }
.fas-tt__edicao strong { font-size: var(--texto-pequeno); }
.fas-tt__edicao small { font-size: var(--texto-legenda); color: var(--cor-texto-suave); }
.fas-tt__edicao-check { margin-left: auto; flex-shrink: 0; color: var(--cor-acento); opacity: 0; }
.fas-tt__edicao[aria-pressed='true'] { border-color: var(--cor-acento); background: rgb(121 226 255 / .05); }
.fas-tt__edicao[aria-pressed='true'] .fas-tt__edicao-check { opacity: 1; }
.fas-tt__edicao:focus-visible, .fas-tt__grade-scroll:focus-visible { outline: 2px solid var(--cor-acento); outline-offset: 3px; }
/* Edição sem horários: entra na lista para o fã saber que existe, mas trancada. Encerrada leva o selo. */
.fas-tt__edicao:disabled { cursor: not-allowed; color: var(--cor-texto-suave); background: rgb(26 11 61 / .45); }
.fas-tt__edicao-cadeado { display: grid; place-items: center; margin-left: auto; flex-shrink: 0; color: var(--cor-texto-suave); }
.fas-tt__edicao-selo { display: inline-block; vertical-align: middle; margin-left: var(--esp-1); padding: 1px var(--esp-2); border-radius: var(--raio-pill); background: rgb(201 184 240 / .15); color: var(--cor-texto-suave); font-size: var(--texto-rotulo); font-weight: var(--peso-display); letter-spacing: var(--tracking-rotulo); text-transform: uppercase; }
.fas-tt--planner [data-tt-edicao-nome] { display: none; }
.fas-tt__opcao-todos { text-align: left; padding: var(--esp-3) var(--esp-4); }
.fas-tt__opcao-todos::after { content: ''; float: right; }
.fas-tt__opcao-todos[aria-pressed='true']::after { content: '✓'; }
.fas-tt__opcao-dia { padding: var(--esp-3) var(--esp-4); background: var(--cor-superficie); }
.fas-tt__opcao-dia:has(input:checked) { border-color: rgb(121 226 255 / .45); }
.fas-tt--planner .fas-tt__corpo { display: grid; grid-template-columns: minmax(0, 1fr); }
/* Contagem e "Limpar o dia" dividem a linha de utilidades (.fas-lab__linha, compartilhada com Preços e Checklist). */
.fas-tt__contagem > button { padding-inline: 0; }
/* Exportar direto da etapa 4: um botão por proporção, com o retângulo da proporção como ícone. */
.fas-tt__exportar { display: flex; align-items: center; gap: var(--esp-2); }
.fas-tt__exportar > span { margin-right: var(--esp-1); }
/* Etapa 4: um acordeão por dia, empilhados; dentro, insights e a linha de ações (exportar à esquerda, editar à direita). */
.fas-tt__resumos { display: grid; gap: var(--esp-3); }
/* Na etapa 4 a linha de contagem e a lista da grade não existem: sem elas reservando altura acima dos cartões. */
.fas-tt--planner[data-tt-etapa-atual='4'] .fas-tt__contagem, .fas-tt--planner[data-tt-etapa-atual='4'] .fas-tt__lista { display: none; }
.fas-tt--planner .fas-tt__resumo { position: static; }
.fas-tt__resumo-acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-2) var(--esp-3); }
.fas-tt__resumo-acoes > .fas-lab__alternar { margin-left: auto; }
.fas-tt__formato { display: inline-flex; align-items: center; gap: var(--esp-1); min-height: var(--alvo-toque); padding: 0 var(--esp-3); border: 1px solid var(--cor-borda); border-radius: var(--raio-1); background: transparent; color: var(--cor-texto); font: inherit; font-size: var(--texto-controle); font-weight: var(--peso-forte); cursor: pointer; }
.fas-tt__formato:hover { border-color: var(--cor-acento); color: var(--cor-acento); }
.fas-tt__formato:focus-visible { outline: 2px solid var(--cor-acento); outline-offset: 2px; }
.fas-tt__formato:disabled { opacity: .5; cursor: not-allowed; }
.fas-tt--planner .fas-tt__set { padding: .65rem .75rem; border-radius: .5rem; }
.fas-tt--planner .fas-tt__set--marcado { background: rgb(121 226 255 / .08); border-color: rgb(121 226 255 / .5); border-left-color: var(--palco-cor); }
.fas-tt--planner .fas-tt__meta { gap: .2rem .5rem; }
.fas-tt--planner .fas-tt__lista { min-width: 0; }
.fas-tt--planner [data-tt-fuso] { margin: 0; font-size: var(--texto-legenda); }
.fas-tt--planner { --tt-eixo: 3rem; --tt-faixa: 9.75rem; }
.fas-tt__grade-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--cor-borda); border-radius: .5rem; overscroll-behavior-x: contain; }
.fas-tt__grade { display: grid; align-items: start; background: var(--fas-abismo); }
.fas-tt__grade-eixo { position: sticky; left: 0; z-index: 2; background: var(--fas-abismo); border-right: 1px solid var(--cor-borda); }
.fas-tt__grade-cab { background: var(--fas-abismo); display: flex; align-items: center; justify-content: center; text-align: center; min-height: 48px; height: 48px; padding: .5rem; margin: 0; font-size: var(--texto-legenda); font-weight: var(--peso-forte); line-height: var(--altura-apertada); border-bottom: 2px solid var(--palco-cor, var(--cor-borda)); overflow: hidden; }
.fas-tt__grade-coluna { min-width: 0; border-right: 1px solid rgb(126 74 255 / .14); }
/* Borda transparente, e não padding: filhos em position:absolute medem a partir da borda, então o primeiro set (e a
   primeira linha de hora) descem juntos e não colam no cabeçalho do palco. */
.fas-tt__grade-horas, .fas-tt__grade-horarios { position: relative; box-sizing: content-box; border-top: var(--esp-3) solid transparent; border-bottom: var(--esp-3) solid transparent; }
/* content-box: a altura inline (minutos × escala) é a do relógio; as bordas somam a ela em vez de comê-la — com o
   border-box do reset, os sets que terminam na última hora passavam 8px do fundo e abriam uma barra vertical. */
.fas-tt__grade-horas time { position: absolute; left: 0; right: 0; padding-top: 4px; color: var(--cor-texto-suave); font-size: var(--texto-rotulo); font-variant-numeric: tabular-nums; text-align: center; }
/* O cartão da grade é o controle de escolha: horário e nome centrados no seu retângulo, sem a cor do palco (ela fica
   no cabeçalho da coluna). Apagado enquanto não é seu; aceso, com a cor de acento, quando é. */
.fas-tt__grade-set { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: safe center; gap: .2rem; padding: .35rem .45rem; border: 1px solid rgb(126 74 255 / .22); border-radius: .5rem; background: rgb(26 11 61 / .5); color: var(--cor-texto-suave); font: inherit; text-align: center; overflow: hidden; cursor: pointer; transition: background var(--dur-rapida) var(--ease-padrao), border-color var(--dur-rapida) var(--ease-padrao), opacity var(--dur-rapida) var(--ease-padrao); }
.fas-tt__grade-set:hover { border-color: rgb(121 226 255 / .5); background: rgb(26 11 61 / .85); }
.fas-tt__grade-set:focus-visible { outline: 2px solid var(--cor-acento); outline-offset: 1px; }
.fas-tt__grade-set time { font-size: var(--texto-rotulo); font-variant-numeric: tabular-nums; white-space: nowrap; color: currentcolor; opacity: .85; }
.fas-tt__grade-set strong { font-size: var(--texto-mini); line-height: var(--altura-apertada); font-weight: var(--peso-forte); overflow-wrap: anywhere; text-wrap: balance; }
/* Nome longo desce um degrau da escala para caber no cartão; no celular, onde a coluna é mais estreita, desce mais cedo. */
.fas-tt__grade-set--medio strong { font-size: var(--texto-legenda); }
.fas-tt__grade-set--longo strong { font-size: var(--texto-rotulo); }
.fas-tt__grade-set--marcado { border-color: var(--cor-acento); background: rgb(121 226 255 / .13); color: var(--cor-texto); }
.fas-tt__grade-set--marcado time { color: var(--cor-acento); opacity: 1; }
.fas-tt__grade-set--conflito { border-color: #ff80ce; background: rgb(255 64 208 / .12); }
.fas-tt__grade-conflito { font-size: var(--texto-rotulo); color: #ff9cda; }
.fas-tt__grade-check { position: absolute; top: .3rem; right: .3rem; width: .9rem; height: .9rem; display: grid; place-items: center; border: 1px solid rgb(126 74 255 / .4); border-radius: 50%; background: rgb(10 3 26 / .5); }
.fas-tt__grade-check::after { content: ''; width: .25rem; height: .5rem; margin-top: -.1rem; border: solid var(--fas-abismo); border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform var(--dur-rapida) var(--ease-padrao); }
.fas-tt__grade-set--marcado .fas-tt__grade-check { border-color: var(--cor-acento); background: var(--cor-acento); }
.fas-tt__grade-set--marcado .fas-tt__grade-check::after { transform: rotate(45deg) scale(1); }
.fas-tt--planner .fas-tt__navegacao .botao { padding-inline: 1rem; font-size: var(--texto-mini); }
/* No resumo só ficam os insights; a partir do tablet eles se dividem em duas colunas. */
@media (min-width: 48rem) {
  .fas-tt__resumo .fas-tt__fatos { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--esp-8); }
}
@media (max-width: 39.99rem) {
  .fas-tt--planner { gap: var(--esp-4); --tt-faixa: 8.5rem; }
  .fas-tt__progresso li { font-size: var(--texto-rotulo); }
  .fas-tt__grade-set--medio strong { font-size: var(--texto-rotulo); }
  .fas-tt__grade-set--curto strong { font-size: var(--texto-legenda); }
  .fas-tt--planner .fas-tt__etapa { gap: var(--esp-3); }
  .fas-tt--planner .fas-tt__resumo > summary { padding: .75rem; }
}