/* Correções da auditoria de direção de arte (12/11): contraste de componente, identidade, desktop. */
:root { --borda-campo: #6B767D; }

/* Marca e ícones */
.marca { display: inline-flex; align-items: center; gap: var(--e2); }
.marca-simbolo { width: 24px; height: 24px; color: var(--txt); fill: none; flex-shrink: 0; }
.ic { width: 22px; height: 22px; flex-shrink: 0; }
.abas a { flex-direction: column; gap: 2px; padding-top: 2px; }
.abas a.ativo { font-weight: 700; }
.menu a { gap: var(--e3); }
.menu .ic { width: 20px; height: 20px; }

/* Campos e opção escolhida com contraste de componente (3:1) */
input, select, textarea { border-color: var(--borda-campo); }
input::placeholder, textarea::placeholder { opacity: 1; font-weight: 400; }
input[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--perigo); }
.segmento.ativo { box-shadow: inset 0 0 0 1px var(--borda-campo); font-weight: 700; }

/* Colunas iguais */
.duas-colunas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.data-rotulo { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: var(--e3); }

/* Aviso nunca intercepta o toque; em tela de formulário vai para o topo */
.aviso { pointer-events: none; }
.aviso-acao { pointer-events: auto; }
body:has(.barra-acao) .aviso { top: calc(env(safe-area-inset-top, 0px) + var(--e3)); bottom: auto; }
.aviso-acao {
  min-height: 44px; padding: 0 var(--e2); margin-right: calc(var(--e2) * -1); border: 0; background: none;
  color: var(--bg); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer;
}

/* Lima só no botão principal e no número do peso */
.treino-aula { color: var(--txt); }
.ex-nota::before { background: var(--mut); }
.progresso span.cheio { background: var(--txt); }
.btn-apagar { color: var(--perigo); }
.btn-apagar:hover { color: var(--perigo); }

/* Remover exercício e legenda da última série */
.ex-topo .btn-icone { flex-shrink: 0; }
.legenda-serie { grid-column: 2 / 4; margin-top: calc(var(--e1) * -1); }
.lista-form-series > li { display: flex; flex-direction: column; gap: var(--e1); }
.lista-form-series > li .legenda-serie { padding-left: 40px; margin: 0; }
.btn-bloco-sec { width: 100%; }

/* Dúvida por exercício */
.duvida-linha {
  display: flex; align-items: center; gap: var(--e3); width: 100%; min-height: 44px; margin-top: var(--e2);
  padding: 0; background: none; border: 0; color: var(--ambar); font-size: var(--t-s); font-weight: 600;
  text-align: left; cursor: pointer;
}
.duvida-linha .selo { flex-shrink: 0; }
.serie-n.em-duvida { color: var(--ambar); font-weight: 700; }
.duvida-serie { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: var(--e2); }
.duvida-serie.cab { font-size: var(--t-s); font-weight: 600; color: var(--mut); }
.duvida-serie input { text-align: center; font-weight: 700; }
.duvida-lista { display: flex; flex-direction: column; gap: var(--e2); margin-bottom: var(--e4); }

/* Divisória entre todas as séries */
.lista-series li + li { border-top: 1px solid var(--linha); }
.lista-series li + li .serie { border-top: 0; }

/* Estados vazios com desenho de traço */
.vazio-desenho { width: 56px; height: 56px; margin-bottom: var(--e1); color: var(--mut); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

/* Sair e legenda */
.btn-sair { align-self: flex-start; }
.legenda-grafico { margin-top: var(--e1); }

/* Sem acesso */
.sem-acesso-bloco { align-items: center; text-align: center; max-width: 420px; }
.sem-acesso-bloco .marca-grande { display: inline-flex; align-items: center; gap: var(--e2); font-weight: 700; }
.sem-acesso-bloco .marca-grande .marca-simbolo { width: 28px; height: 28px; }
.sem-acesso-bloco h1 { text-wrap: balance; }
.sem-acesso-bloco .meta { font-size: var(--t-m); }
body.sem-acesso #tela { max-width: none; margin: 0; padding-bottom: var(--e6); }

/* Computador */
@media (min-width: 900px) {
  #tela { margin-inline: auto; width: 100%; }
  .segmentos { max-width: 480px; }
  .estreita { max-width: 760px; }
  .card:has(> .vazio:only-child) { max-width: 560px; }
  .colunas.empilha { display: flex; flex-direction: column; align-items: stretch; }
  .ficha-lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--e6); }
  .ficha-item:nth-child(2) { border-top: 0; }
  .grade-ex { align-items: stretch; }
  .grade-ex > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

.sem-acesso-bloco { min-height: calc(100dvh - 48px); }
.duvida-serie .serie-n, .duvida-serie.cab span:first-child { text-align: left; }

/* Rodada 2 */
/* Aviso sempre fora de sheet e longe do botão principal */
body.trava .aviso { top: calc(env(safe-area-inset-top, 0px) + var(--e3)); bottom: auto; }
body:has(.barra-acao):not(.trava) .aviso { top: auto; bottom: calc(var(--aba) + var(--seguro) + 73px + var(--e4)); }
@media (min-width: 900px) { body:has(.barra-acao):not(.trava) .aviso { bottom: calc(73px + var(--e4)); } }
.sheet-topo h2 { text-wrap: balance; }
.sheet-topo h2:focus { outline: none; }

/* Peso na Evolução: o número nunca quebra; botão embaixo no celular, ao lado no computador */
.destaque { white-space: nowrap; }
.card-peso { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "num" "graf" "btn"; }
.card-peso .peso-num { grid-area: num; }
.card-peso .grafico-caixa { grid-area: graf; }
.card-peso > .btn { grid-area: btn; width: 100%; }
@media (min-width: 900px) {
  .card-peso { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "num btn" "graf graf"; align-items: start; }
  .card-peso > .btn { width: auto; }
}

/* Sem acesso: nunca rola */
body.sem-acesso #tela { padding-block: 0; }
.sem-acesso-bloco { min-height: 100dvh; }

/* Rodada 3 */
.marca-simbolo { width: 28px; height: 28px; }
.linha-bloco.direita .meta, .linha-bloco.direita .linha-valor { white-space: nowrap; }
.series-linha { display: flex; flex-wrap: wrap; column-gap: var(--e3); }
.serie-item { white-space: nowrap; }
.sub-aula, .sub-data { display: inline-block; }
.pagina-titulo .sub { display: flex; flex-wrap: wrap; column-gap: var(--e3); }
.item-titulo { display: flex; flex-wrap: wrap; column-gap: var(--e2); align-items: baseline; }
.item-titulo .meta { font-weight: 600; }