/*
 * DA « Estúdio à noite » (09/09/2026), component layer.
 *
 * telas.css holds the structure of the screens; this file, loaded last,
 * gives them their skin. A rule here wins over telas.css at equal specificity
 * because it comes after; when a telas.css rule is more
 * specific, its selector is repeated here with the same specificity.
 *
 * Principle: only one thing is large per screen (the time, the load, the
 * kcal). Everything else stays quiet: surfaces, hairlines, muted text.
 */

/* ------------------------------------------------------------------ */
/* Icônes inline                                                        */
/* ------------------------------------------------------------------ */

.icone,
.nav-principal__icone,
.tuila__icone,
.row__icone,
.botao__icone,
.fio-ariane__icone {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  filter: none;
}

.botao__icone {
  width: 20px;
  height: 20px;
}

.fio-ariane__icone {
  width: 16px;
  height: 16px;
  margin-right: 2px;
}

/* Line illustrations (tinta files on transparent): inverted so they
   live on dark, with the hue rotated so teal stays teal. */
.estado-vazio__ilustracao,
.magda-painel__mascote,
.magda-caixa__mascote,
.magda-apoio__mascote,
.resultado-celebracao__mascote,
.marcar-unidade__icone,
.treinador-cartao__avatar img {
  filter: invert(1) hue-rotate(180deg) brightness(1.05);
}

/* ------------------------------------------------------------------ */
/* Fil d'Ariane, liens discrets                                         */
/* ------------------------------------------------------------------ */

.fio-ariane {
  margin-bottom: var(--espaco-curto);
}

.link-discreto {
  text-decoration: none;
  color: var(--marca-texto-atenuado);
  gap: 2px;
}

.link-discreto:hover {
  color: var(--marca-texto);
}

/* ------------------------------------------------------------------ */
/* Barre Magda sous l'en-tête                                           */
/* ------------------------------------------------------------------ */

.magda-painel {
  border-bottom: 1px solid var(--marca-linha);
  background: var(--marca-fundo-pagina);
}

.magda-painel__gatilho {
  min-height: 44px;
  padding: 6px var(--espaco-medio);
  font-size: var(--tamanho-etiqueta);
  font-weight: 500;
  color: var(--marca-texto-secundario);
}

.magda-painel__mascote {
  width: 26px;
  height: 26px;
}

.magda-painel__corpo {
  padding: 0 var(--espaco-medio) var(--espaco-curto);
  color: var(--marca-texto-secundario);
  font-size: 15px;
}

.magda-painel__link {
  color: var(--marca-acento-texto);
  font-weight: 600;
}

/* ------------------------------------------------------------------ */
/* Nav du bas                                                           */
/* ------------------------------------------------------------------ */

.app-rodape-fixo {
  background: var(--marca-fundo-pagina);
  box-shadow: var(--sombra-flutuante);
}

.nav-principal {
  border-top: 1px solid var(--marca-linha);
  background: var(--marca-fundo-pagina);
  min-height: var(--altura-nav-inferior);
}

.nav-principal__item {
  gap: 4px;
  padding: 10px 2px 8px;
  font-size: 10.5px;
  letter-spacing: 0.01em;
  color: var(--marca-texto-atenuado);
  border-top: 0;
  margin-top: 0;
  position: relative;
}

.nav-principal__item::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  width: 0;
  height: 2px;
  transform: translateX(-50%);
  background: var(--marca-acento);
  border-radius: 0 0 2px 2px;
  transition: width var(--duracao-transicao) ease;
}

.nav-principal__item[aria-current="page"] {
  color: var(--marca-acento-texto);
  font-weight: 600;
  border-top-color: transparent;
}

.nav-principal__item[aria-current="page"]::before {
  width: 28px;
}

/* ------------------------------------------------------------------ */
/* Accueil                                                              */
/* ------------------------------------------------------------------ */

.inicio-cabecalho {
  padding: var(--espaco-micro) 0 var(--espaco-medio);
}

.inicio-cabecalho__data {
  font-family: var(--fonte-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--marca-texto-atenuado);
  margin-bottom: 2px;
}

.inicio-cabecalho__saudacao {
  margin-bottom: 0;
  font-size: 26px;
}

.destaque {
  border-color: var(--marca-acento-secundario);
  background: var(--marca-acento-claro);
}

.destaque__frase {
  font-family: var(--fonte-texto);
  font-weight: 500;
  margin-bottom: var(--espaco-curto);
}

/* The next session plate: a quiet surface, with no colored hairline
   on the side (removed on 09/09 at Baptiste's request). The imminent
   state reads only through the status line and the countdown
   bar, in amber. */
.plate {
  position: relative;
  padding: var(--espaco-medio);
  margin-bottom: var(--espaco-medio);
  border: 1px solid var(--marca-linha);
  border-radius: var(--raio-grande);
  background: var(--marca-superficie-cartao);
  overflow: hidden;
}

.plate-rotulo {
  font-family: var(--fonte-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--marca-texto-atenuado);
  margin-bottom: var(--espaco-micro);
}

.plate-state {
  font-family: var(--fonte-mono);
  font-size: 13px;
  color: var(--marca-disc-amarelo);
  margin-bottom: 6px;
}

.plate-state::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--marca-disc-amarelo);
}

.plate .numero-heroi {
  margin: 2px 0 0;
}

.plate .track {
  height: 3px;
  border-radius: 2px;
  margin: var(--espaco-curto) 0 var(--espaco-micro);
}

.plate .track__preenchimento {
  border-radius: 2px;
}

.plate-meta {
  font-family: var(--fonte-texto);
  font-weight: 500;
  font-size: 15px;
  color: var(--marca-texto);
  margin-top: var(--espaco-micro);
}

.plate-meta span {
  color: var(--marca-texto-atenuado);
  font-weight: 400;
}

.link-treinador {
  text-decoration: none;
  color: var(--marca-acento-texto);
}

.plate .acts {
  margin-top: var(--espaco-medio);
  flex-wrap: wrap;
}

.plate .acts .botao-primario {
  flex: 0 0 100%;
  width: 100%;
}

.plate .acts .botao-fantasma {
  flex: 1;
}

/* État vide */
.empty {
  padding: var(--espaco-medio) 0 var(--espaco-medio);
  border-bottom: 0;
}

.empty-h {
  font-size: 22px;
  letter-spacing: -0.015em;
  margin-bottom: var(--espaco-micro);
}

.empty-p {
  color: var(--marca-texto-secundario);
  font-size: 15px;
}

.empty .acts {
  justify-content: center;
}

.empty .acts .botao-primario {
  width: auto;
  flex: 1;
}

.estado-vazio__ilustracao {
  width: 72px;
  height: 72px;
  margin-bottom: var(--espaco-curto);
}

/* Grille de destinations : surfaces sombres, icône menthe, la première
   pleine largeur. */
.tuilas {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: var(--espaco-micro);
}

.tuila {
  align-items: flex-start;
  justify-content: flex-end;
  aspect-ratio: auto;
  min-height: 96px;
  gap: 10px;
  padding: var(--espaco-curto);
  border: 1px solid var(--marca-linha);
  border-radius: var(--raio-medio);
  background: var(--marca-superficie-cartao);
  color: var(--marca-texto);
  text-align: left;
  transition: border-color var(--duracao-transicao) ease, transform var(--duracao-transicao) ease;
}

.tuila:active {
  transform: scale(0.985);
}

.tuila:first-child {
  grid-column: 1 / -1;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  min-height: 72px;
  gap: var(--espaco-curto);
  border-color: var(--marca-acento-secundario);
  background: var(--marca-acento-claro);
}

.tuila:first-child .tuila__icone {
  width: 28px;
  height: 28px;
}

.tuila:first-child .tuila__rotulo {
  font-size: 16px;
}

.tuila__sub {
  display: none;
}

.tuila:first-child .tuila__sub {
  display: block;
  margin-left: auto;
  font-family: var(--fonte-mono);
  font-size: 11px;
  color: var(--marca-acento-texto);
  text-align: right;
  max-width: 40%;
}

.tuila__icone {
  color: var(--marca-acento-texto);
}

.tuila__rotulo {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.005em;
}

/* Rangées */
.rows {
  margin-top: var(--espaco-medio);
  border-top: 1px solid var(--marca-linha);
}

.row {
  gap: var(--espaco-curto);
  padding: var(--espaco-curto) 0;
  border-bottom: 1px solid var(--marca-linha);
  min-height: 56px;
}

.row__icone {
  color: var(--marca-acento-texto);
}

.row__rotulo {
  flex: 1;
  font-weight: 500;
  font-size: 15px;
}

.row__seta {
  display: inline-flex;
  color: var(--marca-texto-atenuado);
}

.row__seta .icone {
  width: 18px;
  height: 18px;
}

/* Magda en pied d'accueil */
.magda-caixa {
  border-color: var(--marca-linha);
  border-radius: var(--raio-grande);
  background: var(--marca-superficie-cartao);
  margin-top: var(--espaco-medio);
}

.magda-caixa__topo {
  display: flex;
  align-items: flex-start;
  gap: var(--espaco-curto);
  margin-bottom: var(--espaco-curto);
}

.magda-caixa__mascote {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.magda-caixa__nome {
  display: block;
  font-weight: 600;
  margin-bottom: 2px;
}

.magda-caixa__descricao {
  color: var(--marca-texto-secundario);
  font-size: 14px;
  margin: 0;
}

.magda-caixa__acoes {
  display: flex;
  gap: var(--espaco-micro);
}

.magda-caixa__acoes .botao-fantasma {
  flex: 1;
}

.nota-seguranca-inicio {
  margin-top: var(--espaco-medio);
  font-size: 12.5px;
}

.rodape-sair {
  margin-top: var(--espaco-curto);
}

/* ------------------------------------------------------------------ */
/* Formulaires                                                          */
/* ------------------------------------------------------------------ */

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: var(--espaco-curto);
}

.field > span,
.treino-exec__campo > span {
  font-family: var(--fonte-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--marca-texto-atenuado);
}

.field input,
.field textarea,
.field select,
.treino-exec__campo input,
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
textarea,
select {
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-medio);
  background: var(--marca-superficie-cartao-2);
  color: var(--marca-texto);
  font-family: var(--fonte-texto);
  font-size: 16px;
  outline: none;
  transition: border-color var(--duracao-transicao) ease;
}

textarea {
  min-height: 96px;
  resize: vertical;
}

input::placeholder,
textarea::placeholder {
  color: var(--marca-texto-atenuado);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--marca-acento);
}

input[inputmode="numeric"],
input[inputmode="decimal"] {
  font-family: var(--fonte-mono);
  font-variant-numeric: tabular-nums;
}

.cartao--branco {
  background: var(--marca-superficie-cartao);
}

.cartao--sucesso {
  border-color: var(--marca-sucesso);
}

.cartao--recusa {
  border-color: var(--marca-recusa);
}

/* The card title text reused by several screens. */
.treino-exec__nome {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0;
}

/* ------------------------------------------------------------------ */
/* Entrar                                                               */
/* ------------------------------------------------------------------ */

.entrar-capa {
  padding: var(--espaco-amplo) 0 var(--espaco-largo);
}

.entrar-capa__marca {
  font-family: var(--fonte-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--marca-acento-texto);
  margin-bottom: var(--espaco-curto);
}

.entrar-capa h1 {
  font-size: 34px;
  font-variation-settings: "wdth" 105;
  margin-bottom: var(--espaco-micro);
}

.entrar-capa p {
  color: var(--marca-texto-secundario);
  max-width: 32ch;
}

.entrar-ajuda {
  color: var(--marca-texto-atenuado);
  font-size: 14px;
  margin-top: var(--espaco-medio);
}

/* W2 (18/09) : the single sentence of the email link entry (sent, invalid
   link, session ended). Existing verified pairs only: body text, or the
   refusal text, on the page background. */
.entrar-mensagem {
  color: var(--marca-texto);
  max-width: 36ch;
  margin-bottom: var(--espaco-medio);
}

.entrar-mensagem--alerta {
  color: var(--marca-recusa-texto);
}

/* ------------------------------------------------------------------ */
/* Marcar : jours et créneaux                                           */
/* ------------------------------------------------------------------ */

.dia-opcao {
  min-width: 52px;
  border-radius: var(--raio-medio);
  border-color: var(--marca-linha);
  background: var(--marca-superficie-cartao);
}

.dia-opcao__letra {
  font-family: var(--fonte-mono);
  font-size: 11px;
  letter-spacing: 0.03em;
}

.dia-opcao__numero {
  font-family: var(--fonte-display);
  font-size: 18px;
  font-weight: 640;
}

.dia-opcao--selecionada {
  background: var(--marca-acento);
  border-color: var(--marca-acento);
  color: var(--marca-texto-invertido);
}

.dia-opcao--selecionada .dia-opcao__letra,
.dia-opcao--selecionada .dia-opcao__numero {
  color: var(--marca-texto-invertido);
}

.dia-opcao--hoje:not(.dia-opcao--selecionada) {
  border-color: var(--marca-acento-secundario);
}

.creneau {
  border-radius: var(--raio-medio);
  border-color: var(--marca-linha);
  border-left-width: 1px;
  border-left-color: var(--marca-linha);
  background: var(--marca-superficie-cartao);
}

.creneau__hora {
  font-family: var(--fonte-display);
  font-weight: 640;
  font-size: 20px;
  letter-spacing: -0.02em;
  width: 60px;
}

.creneau--marcada {
  border-color: var(--marca-acento-secundario);
  background: var(--marca-acento-claro);
}

.creneau--esgotado,
.creneau--passou {
  opacity: 0.6;
}

/* ------------------------------------------------------------------ */
/* Cartão de membro                                                     */
/* ------------------------------------------------------------------ */

.cartao-tela {
  gap: var(--espaco-medio);
}

.qr-bloco {
  padding: var(--espaco-medio);
  background: var(--marca-branco);
  border-radius: var(--raio-grande);
  width: min(100%, 300px);
  margin: 0 auto;
}

.qr-bloco svg {
  width: 100%;
  height: auto;
}

.cartao-id {
  text-align: center;
}

.cartao-id__nome {
  font-size: 22px;
  margin-bottom: 4px;
}

/* ------------------------------------------------------------------ */
/* Treino : plano                                                       */
/* ------------------------------------------------------------------ */

.treino-topo {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--espaco-curto);
  margin-bottom: var(--espaco-medio);
}

.treino-topo h1 {
  margin-bottom: 0;
}

.treino-topo__meta {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  text-align: right;
  flex-shrink: 0;
}

.treino-em-curso {
  display: flex;
  align-items: center;
  gap: var(--espaco-curto);
  padding: var(--espaco-curto) var(--espaco-medio);
  margin-bottom: var(--espaco-curto);
  border: 1px solid var(--marca-acento-secundario);
  border-radius: var(--raio-medio);
  background: var(--marca-acento-claro);
}

.treino-em-curso__texto {
  flex: 1;
  font-weight: 500;
}

.treino-em-curso__texto small {
  display: block;
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-acento-texto);
}

.treino-em-curso .botao {
  width: auto;
  min-height: 44px;
  padding: 0 var(--espaco-curto);
}

.treino-sessao {
  padding: 0;
  overflow: hidden;
}

.treino-sessao__cabecalho {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--espaco-curto);
  padding: var(--espaco-medio) var(--espaco-medio) var(--espaco-curto);
}

.treino-sessao__titulo {
  font-family: var(--fonte-display);
  font-variation-settings: "wdth" 108;
  font-size: 24px;
  margin: 0;
}

.treino-sessao__titulo small {
  font-family: var(--fonte-mono);
  font-variation-settings: normal;
  font-size: 12px;
  font-weight: 500;
  color: var(--marca-texto-atenuado);
  margin-left: 6px;
}

.treino-sessao__meta {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  margin: 0;
}

.treino-lista {
  border-top: 1px solid var(--marca-linha);
}

.treino-exercicio {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 4px var(--espaco-curto);
  padding: var(--espaco-curto) var(--espaco-medio);
  border-bottom: 1px solid var(--marca-linha);
}

.treino-exercicio__ordem {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  padding-top: 3px;
}

.treino-exercicio__nome {
  font-weight: 600;
  font-size: 15px;
  margin: 0;
}

.treino-exercicio__series {
  grid-column: 2;
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  margin: 0;
}

.treino-exercicio__dica {
  grid-column: 2;
  font-size: 13px;
  color: var(--marca-texto-secundario);
  margin: 2px 0 0;
}

.treino-exercicio__carga {
  grid-row: 1 / span 3;
  grid-column: 3;
  font-family: var(--fonte-mono);
  font-size: 13px;
  color: var(--marca-acento-texto);
  white-space: nowrap;
  align-self: start;
  padding-top: 2px;
}

.treino-sessao__pe {
  padding: var(--espaco-curto) var(--espaco-medio) var(--espaco-medio);
}

.treino-nota {
  margin-top: var(--espaco-curto);
  font-size: 13px;
}

.treino-objetivos {
  padding: var(--espaco-curto) var(--espaco-medio);
}

.treino-objetivos summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  font-weight: 600;
}

.treino-objetivos summary::-webkit-details-marker {
  display: none;
}

.treino-objetivos__grelha {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: var(--espaco-curto);
}

.treino-objetivos__grelha .field {
  margin-bottom: 0;
}

.treino-objetivos__grelha .field--largo {
  grid-column: 1 / -1;
}

.treino-objetivos__pe {
  display: flex;
  gap: var(--espaco-micro);
  margin-top: var(--espaco-curto);
}

.treino-objetivos__pe .botao {
  flex: 1;
  width: auto;
}

/* ------------------------------------------------------------------ */
/* Treino : séance en cours                                             */
/* ------------------------------------------------------------------ */

.sessao-topo {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--espaco-curto);
  margin-bottom: var(--espaco-curto);
}

.sessao-topo h1 {
  margin-bottom: 0;
}

.sessao-topo__contagem {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  text-align: right;
}

.sessao-topo__contagem strong {
  display: block;
  font-size: 20px;
  font-weight: 500;
  color: var(--marca-texto);
}

.sessao-progresso {
  height: 4px;
  border-radius: 2px;
  background: var(--marca-linha);
  overflow: hidden;
  margin-bottom: var(--espaco-medio);
}

.sessao-progresso__valor {
  display: block;
  height: 100%;
  width: var(--progresso, 0%);
  background: var(--marca-acento);
  border-radius: 2px;
  transition: width var(--duracao-transicao) ease;
}

.aviso-deload {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  padding: 10px var(--espaco-curto);
  margin-bottom: var(--espaco-curto);
  border-radius: var(--raio-medio);
  border: 1px solid var(--marca-disc-amarelo);
  color: var(--marca-disc-amarelo);
  font-size: 14px;
}

.treino-exec {
  background: var(--marca-superficie-cartao);
  padding: var(--espaco-medio);
}

.treino-exec--completo {
  border-color: var(--marca-sucesso);
}

.treino-exec__cabecalho {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--espaco-curto);
}

.treino-exec__conta {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  white-space: nowrap;
  padding-top: 3px;
}

.treino-exec__conta--completo {
  color: var(--marca-sucesso-texto);
}

/* The set dots: one per planned set, filled once done. */
.treino-exec__pontos {
  display: flex;
  gap: 6px;
  margin-top: 10px;
}

.treino-exec__ponto {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid var(--marca-linha-alta);
}

.treino-exec__ponto--feito {
  background: var(--marca-acento);
  border-color: var(--marca-acento);
}

.treino-exec__ponto--extra {
  background: var(--marca-sucesso);
  border-color: var(--marca-sucesso);
}

.treino-exec__carga {
  font-family: var(--fonte-display);
  font-variation-settings: "wdth" 110;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.03em;
  margin: 12px 0 0;
}

.treino-exec__carga small {
  font-family: var(--fonte-mono);
  font-variation-settings: normal;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--marca-texto-atenuado);
  margin-left: 4px;
}

.treino-exec__carga--indefinida {
  font-size: 20px;
  font-variation-settings: "wdth" 100;
  letter-spacing: -0.01em;
  color: var(--marca-texto-secundario);
}

.treino-exec__alvo {
  font-family: var(--fonte-mono);
  font-size: 12.5px;
  color: var(--marca-texto-atenuado);
  margin-top: 2px;
}

.treino-exec .treino-exercicio__series {
  grid-column: auto;
  margin-top: 8px;
}

.treino-exec .treino-exercicio__dica {
  grid-column: auto;
  margin-top: 6px;
  padding-left: 10px;
  border-left: 2px solid var(--marca-acento-secundario);
}

/* The set form: two steppers, then the button. The +/- buttons
   only exist with JavaScript (app.js reveals them); without it, the field
   stays editable from the keyboard. */
.treino-exec__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: var(--espaco-curto);
}

.treino-exec__form .botao-primario {
  grid-column: 1 / -1;
}

.stepper {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.stepper > span {
  font-family: var(--fonte-mono);
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--marca-texto-atenuado);
}

.stepper__caixa {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-medio);
  background: var(--marca-superficie-cartao-2);
  overflow: hidden;
}

.stepper__caixa:focus-within {
  border-color: var(--marca-acento);
}

.stepper__botao {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-height: 52px;
  border: 0;
  background: transparent;
  color: var(--marca-acento-texto);
  cursor: pointer;
  flex-shrink: 0;
}

.stepper__botao:active {
  background: var(--marca-acento-claro);
}

.stepper__botao .icone {
  width: 18px;
  height: 18px;
}

.stepper--js .stepper__botao {
  display: inline-flex;
}

.stepper__caixa input {
  flex: 1;
  min-width: 0;
  min-height: 52px;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: center;
  font-family: var(--fonte-mono);
  font-size: 20px;
  font-weight: 500;
  padding: 0 4px;
}

.stepper__caixa input:focus {
  border-color: transparent;
}

.treino-exec__feitas {
  margin-top: var(--espaco-curto);
  border-top: 1px solid var(--marca-linha);
}

.treino-exec__feitas li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 40px;
  padding: 6px 0;
  border-bottom: 1px solid var(--marca-linha);
  font-family: var(--fonte-mono);
  font-size: 13px;
}

.treino-exec__feitas li span:first-child {
  color: var(--marca-texto-atenuado);
}

.treino-exec__desfazer {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0;
  margin-top: 4px;
  border: 0;
  background: none;
  color: var(--marca-texto-atenuado);
  font-size: 13px;
  text-decoration: underline;
  cursor: pointer;
}

.sessao-terminar {
  margin-top: var(--espaco-medio);
}

/* Descanso timer: floats in the fixed rodapé, above the nav,
   only between two sets (app.js). */
.descanso {
  display: none;
  align-items: center;
  gap: var(--espaco-curto);
  padding: 10px var(--espaco-medio);
  border-top: 1px solid var(--marca-linha);
  background: var(--marca-superficie-cartao);
}

.descanso--ativo {
  display: flex;
}

.descanso__icone {
  color: var(--marca-acento-texto);
}

.descanso__texto {
  flex: 1;
  min-width: 0;
}

.descanso__rotulo {
  display: block;
  font-family: var(--fonte-mono);
  font-size: 11px;
  letter-spacing: 0.03em;
  color: var(--marca-texto-atenuado);
}

.descanso__tempo {
  display: block;
  font-family: var(--fonte-display);
  font-variation-settings: "wdth" 110;
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.descanso--pronto .descanso__tempo {
  color: var(--marca-sucesso-texto);
}

.descanso__barra {
  position: absolute;
  left: 0;
  top: 0;
  height: 2px;
  width: var(--progresso, 100%);
  background: var(--marca-acento);
  transition: width 1s linear;
}

.descanso {
  position: relative;
}

.descanso__acoes {
  display: flex;
  gap: 6px;
}

.descanso__acoes .botao-fantasma {
  min-height: 40px;
  padding: 0 12px;
  font-size: 13px;
}

/* ------------------------------------------------------------------ */
/* Nutrição                                                             */
/* ------------------------------------------------------------------ */

.nut-topo {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-medio);
  padding: var(--espaco-medio);
  margin-bottom: var(--espaco-medio);
  border: 1px solid var(--marca-linha);
  border-radius: var(--raio-grande);
  background: var(--marca-superficie-cartao);
}

.nut-anel-bloco {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.nut-anel {
  width: 168px;
  height: 168px;
}

.nut-anel__fundo {
  fill: none;
  stroke: var(--marca-linha);
  stroke-width: 9;
}

.nut-anel__valor {
  fill: none;
  stroke: var(--marca-acento);
  stroke-width: 9;
  stroke-linecap: round;
}

.nut-anel__texto {
  position: absolute;
  top: 84px;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.nut-anel__numero {
  font-family: var(--fonte-display);
  font-variation-settings: "wdth" 110;
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--marca-texto);
}

.nut-anel__unidade {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  margin-top: 4px;
}

.nut-anel__meta {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  margin-top: 4px;
}

.nut-anel__meta a {
  color: var(--marca-acento-texto);
  text-decoration: underline;
}

.nut-barra {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--marca-linha);
}

.nut-barra__parte--hidratos {
  background: var(--marca-acento);
}

.nut-barra__parte--proteina {
  background: var(--marca-disc-amarelo);
}

.nut-barra__parte--gordura {
  background: var(--marca-texto-secundario);
}

.nut-legenda {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--espaco-micro);
  margin-top: 12px;
}

.nut-legenda__nome {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--marca-texto-atenuado);
}

.nut-legenda__ponto {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.nut-legenda__valor {
  font-family: var(--fonte-mono);
  font-size: 15px;
  font-weight: 500;
  margin-top: 2px;
}

.nut-titulo {
  font-size: 15px;
  color: var(--marca-texto-atenuado);
  font-weight: 500;
  margin-bottom: var(--espaco-micro);
}

.nut-refeicao {
  padding: 0;
  overflow: hidden;
}

.nut-refeicao__cabecalho {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: var(--espaco-curto) var(--espaco-medio) 8px;
}

.nut-refeicao__nome {
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}

.nut-refeicao__kcal {
  font-family: var(--fonte-mono);
  font-size: 13px;
  color: var(--marca-texto-atenuado);
}

.nut-itens {
  border-top: 1px solid var(--marca-linha);
}

.nut-item {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  padding: 8px var(--espaco-medio) 8px;
  border-bottom: 1px solid var(--marca-linha);
}

.nut-item__texto {
  flex: 1;
  min-width: 0;
}

.nut-item__nome {
  font-size: 15px;
  font-weight: 500;
}

.nut-item__detalhe {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
}

.nut-item__origem {
  font-size: 12px;
  color: var(--marca-disc-amarelo);
}

.nut-item__apagar {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: var(--raio-pequeno);
  background: transparent;
  color: var(--marca-texto-atenuado);
  font-size: 20px;
  cursor: pointer;
}

.nut-refeicao__vazio {
  padding: 0 var(--espaco-medio) 8px;
  font-size: 14px;
  color: var(--marca-texto-atenuado);
}

.nut-juntar {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 var(--espaco-medio);
  border-top: 1px solid var(--marca-linha);
  color: var(--marca-acento-texto);
  font-weight: 600;
  font-size: 14px;
}

.nut-juntar .icone {
  width: 18px;
  height: 18px;
}

.nut-ligacoes {
  padding: 0;
  overflow: hidden;
}

.nut-ligacao {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 0 var(--espaco-medio);
  border-bottom: 1px solid var(--marca-linha);
  font-weight: 500;
}

.nut-ligacao:last-child {
  border-bottom: 0;
}

.nut-ligacao .icone {
  width: 18px;
  height: 18px;
  color: var(--marca-texto-atenuado);
}

/* Juntar: three paths, the scan first and large. */
.nut-scan-bloco {
  padding: 0;
  overflow: hidden;
}

.nut-scan-cabecalho {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  padding: var(--espaco-curto) var(--espaco-medio) 6px;
}

.nut-scan-cabecalho .icone {
  color: var(--marca-acento-texto);
}

.nut-scan-cabecalho h2 {
  margin: 0;
  font-size: 16px;
}

.nut-scan-visor {
  position: relative;
  aspect-ratio: 4 / 3;
  background: #000;
  display: none;
}

.nut-scan-visor--ativo {
  display: block;
}

.nut-scan {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nut-scan-visor::after {
  content: "";
  position: absolute;
  inset: 22% 12%;
  border: 2px solid var(--marca-acento);
  border-radius: 10px;
  box-shadow: 0 0 0 999px rgba(0, 0, 0, 0.35);
}

.nut-scan-corpo {
  padding: 6px var(--espaco-medio) var(--espaco-medio);
}

.nut-scan-corpo .rotulo {
  margin: 4px 0 12px;
}

.nut-scan-estado {
  font-family: var(--fonte-mono);
  font-size: 12.5px;
  color: var(--marca-acento-texto);
  margin: 10px 0 0;
}

.nut-scan-manual {
  display: flex;
  gap: 8px;
  margin-top: var(--espaco-curto);
}

.nut-scan-manual .field {
  flex: 1;
  margin-bottom: 0;
}

.nut-scan-manual .botao-fantasma {
  align-self: flex-end;
  min-height: 50px;
}

.nut-resultados {
  margin-top: var(--espaco-curto);
  border-top: 1px solid var(--marca-linha);
}

.nut-resultado {
  display: flex;
  align-items: center;
  gap: var(--espaco-curto);
  width: 100%;
  min-height: 56px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid var(--marca-linha);
  background: none;
  text-align: left;
  cursor: pointer;
}

.nut-resultado__texto {
  flex: 1;
  min-width: 0;
}

.nut-resultado__nome {
  font-size: 15px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nut-resultado__marca {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
}

.nut-resultado__kcal {
  font-family: var(--fonte-mono);
  font-size: 13px;
  color: var(--marca-acento-texto);
  white-space: nowrap;
}

.nut-proposta__fonte {
  font-family: var(--fonte-mono);
  font-size: 12px;
  color: var(--marca-texto-atenuado);
  margin: 4px 0 var(--espaco-curto);
}

.nut-proposta__fonte a {
  color: var(--marca-acento-texto);
  text-decoration: underline;
}

.nut-macros-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: var(--espaco-curto);
}

.nut-macros-form .treino-exec__campo input {
  font-family: var(--fonte-mono);
}

.nut-porcao {
  display: flex;
  gap: 6px;
  margin: 4px 0 var(--espaco-curto);
}

.nut-porcao__botao {
  flex: 1;
  min-height: 40px;
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-pequeno);
  background: transparent;
  color: var(--marca-texto-secundario);
  font-family: var(--fonte-mono);
  font-size: 13px;
  cursor: pointer;
}

.nut-porcao__botao:active,
.nut-porcao__botao[aria-pressed="true"] {
  border-color: var(--marca-acento);
  color: var(--marca-acento-texto);
}

/* Écran Nutrição d'entrée */
.nutricao-linha {
  border-color: var(--marca-linha);
  background: var(--marca-superficie-cartao);
  border-radius: var(--raio-medio);
}

/* ------------------------------------------------------------------ */
/* Écrans de résultat, reçus                                            */
/* ------------------------------------------------------------------ */

.receipt {
  border-radius: var(--raio-grande);
}

.resultado-celebracao__carimbo {
  color: var(--marca-acento-texto);
}

/* ------------------------------------------------------------------ */
/* Magda, conversation                                                  */
/* ------------------------------------------------------------------ */

.magda-conversa__sugestao {
  border-radius: var(--raio-medio);
  border: 1px solid var(--marca-linha-alta);
  background: var(--marca-superficie-cartao);
}

.magda-conversa__msg {
  border-radius: var(--raio-medio);
  background: var(--marca-superficie-cartao);
}

.magda-conversa__msg--membro {
  background: var(--marca-acento-claro);
}

/* ------------------------------------------------------------------ */
/* Desktop: the column stays a phone set down on the black.            */
/* ------------------------------------------------------------------ */

@media (min-width: 600px) {
  .app-coquilha {
    border-left-color: var(--marca-linha);
    border-right-color: var(--marca-linha);
  }

  .app-rodape-fixo {
    border-left: 1px solid var(--marca-linha);
    border-right: 1px solid var(--marca-linha);
  }
}

/* Juntar : saisie à la main, repliée. */
.nut-manual__gatilho {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  min-height: 44px;
  list-style: none;
  cursor: pointer;
  font-weight: 600;
}

.nut-manual__gatilho::-webkit-details-marker {
  display: none;
}

.nut-manual__gatilho .icone {
  color: var(--marca-acento-texto);
}

.nut-manual__gatilho span:nth-child(2) {
  flex: 1;
}

/* Priorités musculaires : cases à cocher en pastilles carrées. */
.treino-prioridades {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.treino-prioridade {
  position: relative;
}

.treino-prioridade input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}

.treino-prioridade span {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-pequeno);
  font-size: 14px;
  color: var(--marca-texto-secundario);
  cursor: pointer;
}

.treino-prioridade input:checked + span {
  border-color: var(--marca-acento);
  color: var(--marca-acento-texto);
  background: var(--marca-acento-claro);
}

.treino-prioridade input:focus-visible + span {
  outline: var(--foco-largura) solid var(--marca-acento);
  outline-offset: var(--foco-deslocamento);
}

.descanso__acoes .icone {
  width: 16px;
  height: 16px;
}

/* telas.css stretches every <button> in the set form to full width
   (rule .treino-exec__form button): the stepper buttons escape it,
   with the same specificity and a later declaration. */
.treino-exec__form .stepper__botao {
  grid-column: auto;
  width: 44px;
  margin-top: 0;
}

.treino-exec__form .stepper {
  grid-column: auto;
}

.fio-ariane .link-discreto::before {
  content: "";
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-left: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}

/* Nutrição, écran d'entrée : conseils en une liste compacte. */
.nut-titulo {
  text-transform: none;
  letter-spacing: 0;
}

.nutricao-aviso {
  margin-bottom: var(--espaco-medio);
}

.nutricao-lista .cartao {
  padding: var(--espaco-curto) var(--espaco-medio);
  margin-bottom: 8px;
  font-size: 15px;
  color: var(--marca-texto-secundario);
  border-left: 3px solid var(--marca-acento-secundario);
}

/* Financas (W3, directive 18/09/2026) : rows, never KPI tiles. Existing
   tokens only, no literal colour, only the palette: text on the page background,
   refusal red for a debt, success green (the « moss » of the directive)
   when nothing is owed, imminence amber (its « ochre ») for stale data.
   Figures in Azeret Mono through .dado, text in Archivo. */
.financas-secao {
  margin-top: var(--espaco-largo);
}

.financas-titulo {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: var(--espaco-micro);
  /* W4: the period links jump to the #financas-extrato heading; without
     this it landed flush against the top edge, clipped (390 and 430). */
  scroll-margin-top: var(--espaco-medio);
}

.financas-aviso,
.aviso-guardado {
  color: var(--marca-disc-amarelo);
  border-left: 3px solid var(--marca-disc-amarelo);
  padding-left: var(--espaco-micro);
  margin-top: var(--espaco-curto);
}

.financas-linha {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--espaco-medio);
  padding: var(--espaco-curto) 0;
  border-bottom: 1px solid var(--marca-linha);
}

.financas-linha__rotulo {
  color: var(--marca-texto-secundario);
}

.financas-linha__valor {
  color: var(--marca-texto);
  font-size: 20px;
}

.financas-linha--divida .financas-linha__valor {
  color: var(--marca-recusa-texto);
}

.financas-linha--em-dia .financas-linha__valor {
  color: var(--marca-sucesso-texto);
}

.financas-frescura {
  color: var(--marca-texto-atenuado);
  font-size: 13px;
  margin-top: var(--espaco-micro);
}

.financas-frescura--velha {
  color: var(--marca-disc-amarelo);
}

.financas-periodos {
  display: flex;
  gap: var(--espaco-micro);
  flex-wrap: wrap;
  margin-bottom: var(--espaco-micro);
}

.financas-periodo {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 var(--espaco-curto);
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-pequeno);
  color: var(--marca-texto-secundario);
  text-decoration: none;
}

.financas-periodo[aria-current="page"] {
  border-color: var(--marca-acento);
  color: var(--marca-texto);
}

.financas-intervalo {
  color: var(--marca-texto-atenuado);
  font-size: 13px;
}

.financas-movimentos,
.financas-dividas,
.financas-inscricoes {
  list-style: none;
  margin: 0;
  padding: 0;
}

.financas-movimento {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--espaco-micro);
  align-items: baseline;
  padding: var(--espaco-micro) 0;
  border-bottom: 1px solid var(--marca-linha);
}

.financas-movimento__data {
  color: var(--marca-texto-atenuado);
  font-size: 13px;
}

.financas-movimento__descricao {
  min-width: 0;
  overflow-wrap: anywhere;
}

.financas-movimento__valor {
  color: var(--marca-texto);
  text-align: right;
}

.financas-nivel {
  margin-top: var(--espaco-curto);
}

.financas-nivel__rotulo {
  font-size: 15px;
  font-weight: 600;
  color: var(--marca-texto-secundario);
  margin-bottom: var(--espaco-nano);
}

.financas-divida {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--espaco-nano) var(--espaco-medio);
  align-items: baseline;
  padding: var(--espaco-micro) 0;
  border-bottom: 1px solid var(--marca-linha);
}

.financas-divida__descricao {
  min-width: 0;
  overflow-wrap: anywhere;
}

.financas-divida__valor {
  text-align: right;
  color: var(--marca-recusa-texto);
}

.financas-divida__meta {
  grid-column: 1 / -1;
  color: var(--marca-texto-atenuado);
  font-size: 13px;
}

/* W4 (18/09, evening): the nested .dado span took the data size and the
   period outgrew the description; it keeps the mono face, not the size. */
.financas-divida__meta .dado {
  font-size: inherit;
  line-height: inherit;
}

/* The penalty line (multa): its own line, named, never merged with the fee. */
.financas-divida__penalidade {
  color: var(--marca-recusa-texto);
  font-weight: 600;
}

.financas-nota {
  color: var(--marca-texto-atenuado);
  font-size: 13px;
  margin-bottom: var(--espaco-nano);
}

.financas-inscricao {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--espaco-nano) var(--espaco-medio);
  padding: var(--espaco-micro) 0;
  border-bottom: 1px solid var(--marca-linha);
}

.financas-inscricao__estado {
  color: var(--marca-texto-secundario);
  text-align: right;
}

.financas-inscricao__datas {
  grid-column: 1 / -1;
  color: var(--marca-texto-atenuado);
  font-size: 13px;
}

.financas-vazio,
.financas-indisponivel {
  color: var(--marca-texto-secundario);
  padding: var(--espaco-micro) 0;
}

/* ============================================================
   W8 (21/09/2026), HOME_PROXIMA_SESSAO_ENABLED: home led by the next
   session, then today, what is due, the menu (templates inicio_proxima*).
   Existing tokens only; no card for the sections, hierarchy by size and
   space.
   ============================================================ */
.inicio-secao {
  margin-top: var(--espaco-largo);
}

.inicio-secao .rows {
  margin-top: var(--espaco-micro);
}

.inicio-secao__detalhe {
  display: block;
  color: var(--marca-texto-secundario);
  font-size: 14px;
}

.inicio-indice {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--espaco-curto);
  margin-top: var(--espaco-micro);
  border-top: 1px solid var(--marca-linha);
}

.inicio-indice__item {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  min-height: 52px;
  border-bottom: 1px solid var(--marca-linha);
  color: var(--marca-texto);
  text-decoration: none;
  font-size: 15px;
  line-height: 1.25;
}

.inicio-indice__icone {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  color: var(--marca-acento-texto);
}


/* ============================================================
   Wagon 3.8 (30/09/2026), ALUNO_UX_V2_ENABLED: the home of the plan
   (inicio_ux.html). One column at 390/430 px; from 768 px the shell
   widens and the home lays its two columns side by side (the plate and
   the quota on the left, the menu on the right). Existing tokens only,
   two surface levels, hairlines: no gradient, no glow, no shadow.
   ============================================================ */
.inicio-ux__quota {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--espaco-curto);
  padding: 10px 0;
  margin-bottom: var(--espaco-medio);
  border-bottom: 1px solid var(--marca-linha);
}

.inicio-ux .plate .empty-h {
  margin: var(--espaco-micro) 0 0;
}

.inicio-ux .plate .acts {
  margin-top: var(--espaco-medio);
}

.inicio-ux .inicio-secao {
  margin-top: var(--espaco-medio);
}

@media (min-width: 768px) {
  .app-coquilha--duas-colunas,
  .app-coquilha--duas-colunas .app-rodape-fixo {
    max-width: 880px;
  }

  .inicio-ux {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: var(--espaco-amplo);
    align-items: start;
  }

  .inicio-ux .inicio-secao {
    margin-top: 0;
    padding-top: var(--espaco-medio);
  }
}

/* Conta (wagon 3.8, /cartao under ALUNO_UX_V2_ENABLED): the card block no
   longer fills the screen; the account rows and Sair follow it in flow. */
.cartao-tela--conta {
  flex: 0 0 auto;
  margin-bottom: var(--espaco-largo);
}

.cartao-tela--conta + .cartao {
  margin-top: 0;
}

/* O meu treino without a model (wagon 3.8, treino_ux.html): the session
   rows reuse .creneau, read only; each section separated by space. */
.treino-ux__seccao {
  margin-top: var(--espaco-largo);
}

.treino-ux__seccao > .rotulo:first-child {
  margin-bottom: var(--espaco-micro);
}

.treino-ux__seccao .creneau-lista + .link-discreto {
  margin-top: var(--espaco-curto);
}

.treino-ux__checkin,
.treino-ux__marcar {
  margin-top: var(--espaco-curto);
}

/* « O que o coach registou » (consigne A39, W7b), _inicio_registo.html: the
   coach's registos under the home's plate and at the top of Treino. The
   rows reuse .creneau, read only; the body may run to several lines (the
   adjustment, the load notes), so the row aligns to its top. Existing
   tokens only: Texto and TextoSecundario on SuperficieCartao, pairs
   already checked by scripts/contrast_check.py. */
.registo-coach {
  margin-bottom: var(--espaco-medio);
}

.registo-coach > .rotulo:first-child {
  margin-bottom: var(--espaco-micro);
}

.treino-ux .registo-coach {
  margin-top: var(--espaco-largo);
}

.registo-coach__item {
  align-items: flex-start;
}

.registo-coach__ajuste {
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto);
}

.registo-coach__cargas {
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

/* The type chooser of /marcar (consigne A39, W7b): shown only when the
   day's creneaux carry more than one served type. Text links on the page
   background, never a pill: the others in TextoSecundario, the active one in
   Texto and underlined (aria-current, not only a colour). Pairs already
   checked (PAIRS_MARCA). The whole link is the target (44px). */
.marcar-tipos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: var(--espaco-medio);
}

/* Closer to the day chooser it depends on than to the creneaux. */
.dias-lista + .marcar-tipos {
  margin-top: calc(-1 * var(--espaco-curto));
}

.marcar-tipos__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--marca-texto-secundario);
  text-decoration: none;
}

.marcar-tipos__link:hover {
  color: var(--marca-texto);
}

.marcar-tipos__link[aria-current="page"] {
  color: var(--marca-texto);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.marcar-tipos__sep {
  padding: 0 var(--espaco-micro);
  color: var(--marca-texto-atenuado);
}

/* ============================================================
   Wagon 3.5 (30/09/2026), ALUNO_GAMIFICACAO_ENABLED: the member's points
   (pontos*.html). Sober lists on hairlines, every figure in Azeret Mono,
   words in the text face. Existing tokens only: Texto and TextoSecundario
   on FundoPagina, pairs already checked by scripts/contrast_check.py. No
   colour for a sign or a state (the sign and the state are written), no
   pill, no gradient, no animation.
   ============================================================ */
.pontos-saldo {
  margin-bottom: var(--espaco-medio);
}

.pontos-saldo__valor {
  font-family: var(--fonte-mono);
  font-weight: 500;
  font-size: 48px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--marca-texto);
}

.pontos-seccao {
  margin-top: var(--espaco-largo);
}

.pontos-seccao > .rotulo:first-child {
  margin-bottom: var(--espaco-micro);
}

.pontos-lista {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--marca-linha);
}

.pontos-lista__linha {
  display: flex;
  align-items: baseline;
  gap: var(--espaco-curto);
  min-height: 48px;
  padding: 12px 0;
  border-bottom: 1px solid var(--marca-linha);
}

.pontos-lista__data {
  flex: none;
  color: var(--marca-texto-secundario);
}

.pontos-lista__texto {
  flex: 1;
  min-width: 0;
  color: var(--marca-texto);
}

.pontos-lista__valor {
  flex: none;
  text-align: right;
  color: var(--marca-texto);
}

.pontos-vazio {
  color: var(--marca-texto-secundario);
}

.pontos-paginas {
  display: flex;
  justify-content: space-between;
  gap: var(--espaco-medio);
  margin-top: var(--espaco-curto);
}

/* The classification (pontos_classificacao.html): the member's own rank
   in a mono figure, the public list with its rank column, the text switch
   of the choice to appear: a full-width row on a hairline, the state
   written after the label (never a pill, never a colour alone). */
.pontos-subtitulo {
  margin-top: calc(-1 * var(--espaco-curto));
  margin-bottom: var(--espaco-medio);
}

.pontos-propria {
  display: flex;
  align-items: baseline;
  gap: var(--espaco-curto);
  margin: 0;
}

.pontos-propria__posicao {
  font-family: var(--fonte-mono);
  font-weight: 500;
  font-size: 40px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  color: var(--marca-texto);
}

/* The ordinal mark in the text face: all in mono « 2.º » read « 2 . º ». */
.pontos-propria__ordinal {
  font-family: var(--fonte-texto);
  font-size: 24px;
  font-weight: 500;
}

.pontos-propria__pontos {
  color: var(--marca-texto-secundario);
}

.pontos-nota {
  margin-top: var(--espaco-micro);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

.pontos-lista__posicao {
  flex: none;
  width: 3ch;
  color: var(--marca-texto-secundario);
}

.pontos-lista__nota {
  color: var(--marca-texto-secundario);
}

.pontos-escolha {
  margin: 0;
  border-top: 1px solid var(--marca-linha);
  border-bottom: 1px solid var(--marca-linha);
}

.pontos-interruptor {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 52px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--marca-texto);
  font: inherit;
  font-size: 15px;
  text-align: left;
  cursor: pointer;
}

.pontos-interruptor__estado {
  margin-left: 0.4ch;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

/* The rewards, the confirmation and the result (pontos_recompensas.html,
   pontos_trocar.html, pontos_troca_resultado.html): the cost in mono next
   to its word, the action a plain underlined link in AcentoTexto (pair
   checked), « Esgotada » written; the offer code large in Azeret Mono,
   selectable, never cut. */
.pontos-recompensa {
  flex-wrap: wrap;
}

.pontos-recompensa__custo {
  flex: none;
  color: var(--marca-texto-secundario);
}

.pontos-recompensa__acao,
.pontos-recompensa__estado {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.pontos-recompensa__acao {
  color: var(--marca-acento-texto);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.pontos-recompensa__estado {
  color: var(--marca-texto-secundario);
}

.pontos-pergunta {
  font-size: 18px;
  line-height: 1.4;
  color: var(--marca-texto);
}

.pontos-confirmar {
  margin-top: var(--espaco-medio);
}

.pontos-codigo__rotulo {
  margin-top: var(--espaco-medio);
}

.pontos-codigo {
  margin: var(--espaco-micro) 0;
  font-family: var(--fonte-mono);
  font-weight: 500;
  font-size: 28px;
  line-height: 1.2;
  letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums;
  color: var(--marca-texto);
  overflow-wrap: anywhere;
  user-select: all;
}

.pontos-saldo-linha {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--espaco-curto);
  margin-top: var(--espaco-medio);
  padding: 10px 0;
  border-top: 1px solid var(--marca-linha);
  border-bottom: 1px solid var(--marca-linha);
}

/* My exchanges (pontos_trocas.html): one row per exchange on a hairline,
   the name and the state written on the first line, the date, the type and
   the cost under it, the team's motive, the two actions as underlined
   links (the 44px floor of .pontos-recompensa__acao). */
.pontos-trocas {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--marca-linha);
}

.pontos-troca {
  padding: 12px 0;
  border-bottom: 1px solid var(--marca-linha);
}

.pontos-troca__linha {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--espaco-curto);
  margin: 0;
}

.pontos-troca__nome {
  min-width: 0;
  color: var(--marca-texto);
}

.pontos-troca__estado {
  flex: none;
  color: var(--marca-texto-secundario);
}

.pontos-troca__detalhe {
  margin-top: 2px;
}

.pontos-troca__motivo {
  margin-top: var(--espaco-micro);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

.pontos-troca__acoes {
  display: flex;
  flex-wrap: wrap;
  gap: var(--espaco-medio);
  margin: 0;
}

/* « Pontos: N » on the home (inicio_ux.html): the quota line's look, as a
   link to /pontos (the whole line is the target, 44px). */
.inicio-ux__pontos {
  min-height: 44px;
  color: var(--marca-texto);
  text-decoration: none;
}