/* MyBody 2.0 — base estrutural. Cores/efeitos vivem SÓ em aurum.css. */
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
body {
  background: var(--au-bg);
  color: var(--au-text);
  font-family: "Sora", system-ui, sans-serif;
  font-weight: 300;
}
.hidden { display: none !important; }

.screen {
  min-height: 100dvh;
  max-width: 460px;
  margin: 0 auto;
  /* o fim reserva a tab bar (--au-h-nav) + 36px de respiro */
  padding: calc(env(safe-area-inset-top, 0px) + 18px) 26px calc(var(--au-h-nav) + 36px + env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
}
/* [fix 2026-08-11] treino minimizado: a barra do treino (fixa, ~46px acima
   da nav) cobria os CTAs de pé de tela — com ela viva, o fim do scroll
   desce o equivalente. */
/* O lado do COACH tem barra própria (#coachNav, menor e no visual pré-v2):
   fica no reserva de antes, senão a barra maior do atleta abriria um vão
   morto no pé das telas dele. */
#coachTodayView, #coachAthletesView, #editorView, #libraryView, #coachChatView {
  padding-bottom: calc(104px + env(safe-area-inset-bottom));
}
/* [dono 07/10] A CAIXA DE MENSAGENS DO COACH É TELA: a altura é a da janela
   (não cresce com a conversa) e quem rola é a lista/as bolhas, com o campo
   de escrever sempre à vista no pé. */
#coachChatView { height: 100dvh; min-height: 0; box-sizing: border-box; }
#coachChatView .coach-chat-tela { flex: 1; min-height: 0; display: flex; flex-direction: column; width: 100%; max-width: 760px; margin: 0 auto; }
/* [07/10 · "the app keeps jamming", lote 3] O CHAT DO ATLETA TAMBÉM: sem
   altura, a página crescia com a conversa (40 mensagens = 5123px), a lista
   nunca rolava sozinha e a aba abria na mensagem MAIS ANTIGA — a última e
   o campo de escrever ficavam 4000px abaixo. Agora a tela tem a altura da
   janela (o padding já reserva a barra de abas) e quem rola são as bolhas,
   que abrem no fim. */
#chatView { height: 100dvh; min-height: 0; box-sizing: border-box; }
#chatView #chatScroll { min-height: 0; }
body.fs-docked .screen {
  padding-bottom: calc(var(--au-h-nav) + 90px + env(safe-area-inset-bottom));
}
/* ── [dono 2026-08-14] A RESERVA ALCANÇAVA SÓ `.screen` ───────────────────
   A regra acima nasceu em 11/08 e resolvia a Home. Mas metade do app não é
   `.screen`: as telas EMPURRADAS (Peso, Capacidades, foco muscular, Goal)
   são `.pushed-screen` — sobreposições `position:fixed` — e a Conta é
   camada. Nelas o CTA nascia debaixo da barra do treino minimizado, e o
   sintoma era o pior possível: o botão APARECE e o toque não funciona.

   Medido com a barra em 710→760: "Registrar peso" 689–744 (clique morto) ·
   "Rodar bateria de teste" 690–744 (clique morto) · "Trocar senha" 715–767
   (clique morto). Home, Histórico, Agenda, Goal, Mobilidade, Fotos, recibo
   e prévia estavam sãos.

   O `!important` é necessário e não é preguiça: as telas empurradas
   declaram o padding INLINE (elas calculam o próprio recuo a partir do
   token da nav), e estilo inline vence folha. É o mesmo motivo do
   `.pushed-screen[style*="padding"]` logo acima nesta folha.

   A conta é a mesma de sempre: altura da nav + a barra (51) + respiro. */
body.fs-docked .pushed-screen,
body.fs-docked .pushed-screen[style*="padding"] {
  padding-bottom: calc(var(--au-h-nav) + 90px + env(safe-area-inset-bottom)) !important;
}
/* CAMADAS (a Conta e quem vier depois): elas não são `.screen` nem
   `.pushed-screen` — abrem em `#modalRoot`, num container sem classe
   nenhuma. Em vez de um seletor frágil por posição no DOM, a camada que
   precisa reservar a faixa da barra se declara com `.au-reserva-dock`.
   Medido antes: "Trocar senha" nascia em 715–767, com a barra em 710–760 —
   visível e com o clique morto. */
body.fs-docked .au-reserva-dock {
  padding-bottom: calc(var(--au-h-nav) + 90px + env(safe-area-inset-bottom)) !important;
}

/* ── [1a Barra mono · aprovada 2026-08-10] tab bar do ATLETA: sólida
   (superfície + linha), itens de TEXTO por luminância, ativo = traço 1px
   rente ao topo do próprio item (sobrepõe a linha da barra). Trocar de
   território NÃO anima (100+×/dia) — único feedback é o press. Ouro nunca
   aparece aqui. A nav do coach (#coachNav) segue no visual pré-v2. ── */
#bottomNav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  display: flex;
  align-items: stretch;
  /* [dono 2026-08-12] barra maior de novo (variante B do mockup
     mockups/menu-2x.html): 68 → 104px e rótulo 12 → 20px. O 2× literal do
     RÓTULO (24px) não cabe — "AGENDA" mediria 104px numa aba de 86px.
     [dono 2026-08-14 · opção A do mockup tres-ajustes] 104 → 84px e o
     rótulo 20 → 15px: ficou grande demais (12% da tela). Não é volta ao
     original — 84/15 segue acima do iOS (~49pt/~10pt). A altura mora no
     token --au-h-nav (aurum.css), pra nenhuma tela ficar pra trás. */
  height: calc(var(--au-h-nav) + env(safe-area-inset-bottom, 0px));
  padding: 0 0 env(safe-area-inset-bottom, 0px);
  background: var(--au-surface);
  border-top: 1px solid var(--au-line);
  /* acima das telas empurradas (.pushed-screen 210) — antes a aba GOAL
     cobria a propria barra de abas; abaixo de qualquer folha (300+). */
  z-index: 220;
}
.nav-btn {
  background: none; border: none; cursor: pointer;
  font: 400 .75rem "Space Mono", monospace;
  letter-spacing: .22em;
  color: var(--au-muted);
  padding: 10px 8px;
  min-height: 44px;
}
.nav-btn.active { color: var(--au-text); }
/* [2026-08-14] A caixa alta da barra do COACH era o texto LITERAL do
   index.html ("HOJE"). Quando os rótulos passaram a vir do i18n (que guarda
   "Hoje"/"Today", como todas as outras chaves do app), a barra ficaria em
   caixa mista. Sobe pro CSS — que já é onde a barra do atleta faz isso.
   Em português o resultado é byte a byte o mesmo de antes. */
#coachNav .nav-btn { text-transform: uppercase; }
/* [17/10] o tablist das quatro abas não é caixa: as abas continuam filhas do layout da <nav> */
#coachNav .coach-side-abas { display: contents; }
#bottomNav .nav-btn {
  flex: 1;
  min-width: 0;
  font-size: var(--au-fs-m); /* 15 — foi 12, depois 20 */
  /* espaçamento cai de .12 pra .06em: é o que faz "AGENDA" caber nas 4 abas
     em 375px sem virar rolagem horizontal. */
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 0 4px;
  border-top: 1px solid transparent;
  margin-top: -1px;
}
#bottomNav .nav-btn.active { border-top-color: var(--au-text); }
/* [dono 07/10] recado do coach não lido: ponto ouro na aba CHAT (era o
   ponto da faixa do coach na Home, que saiu). Só pintura — o aria-label diz. */
#bottomNav .nav-btn.tem-nao-lida { position: relative; }
#bottomNav .nav-btn.tem-nao-lida::after {
  content: ""; position: absolute; top: 10px; right: calc(50% - 30px);
  width: 7px; height: 7px; border-radius: 50%; background: var(--au-gold);
}
/* telas estreitas (Android de 360, e o teste de 320px): desce um degrau da
   escala. Nunca sai da régua Sora/Space Mono.
   [dono 2026-08-14] Com o rótulo em 15px esta regra tinha se INVERTIDO —
   mandava 17px, ou seja AUMENTAVA a fonte justamente onde falta espaço.
   Passou pra 13, o degrau abaixo do novo padrão. */
@media (max-width: 374px) {
  #bottomNav .nav-btn { font-size: var(--au-fs-xs); /* 13 */ }
}
/* press e reduced-motion vivem na regra global de aurum.css */

/* ── Modal (recibo e folhas) — estrutura App2; cores via aurum ─────────
   [apple-design · §7 caminho simétrico] A folha ENTRA subindo e SAI pelo
   MESMO caminho. Antes ela aparecia e sumia por troca de innerHTML (0ms,
   sem caminho nenhum) — num app cuja identidade é luz e halo, isso lia
   como erro de render. Curva de gaveta do projeto, 320ms na entrada e
   280ms na saída (a saída é resposta do sistema: snap). ── */
@keyframes auSheetIn { from { transform: translateY(100%) } to { transform: translateY(0) } }
@keyframes auSheetOut { from { transform: translateY(0) } to { transform: translateY(100%) } }
@keyframes auFadeIn { from { opacity: 0 } to { opacity: 1 } }
@keyframes auFadeOut { from { opacity: 1 } to { opacity: 0 } }

.modal-backdrop {
  /* acima da tab bar (220): folha sempre cobre a navegacao */
  position: fixed; inset: 0; z-index: 300;
  background: rgba(5, 5, 4, .72);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: flex-end; justify-content: center;
  animation: auFadeIn 200ms linear both;
}
.modal {
  background: var(--au-surface);
  border: 1px solid var(--au-line);
  border-radius: 22px 22px 0 0;
  width: 100%; max-width: 460px;
  max-height: 94dvh;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 16px 22px calc(28px + env(safe-area-inset-bottom));
  box-sizing: border-box;
  animation: auSheetIn var(--au-dur-sheet) var(--au-ease-sheet) both;
  will-change: transform;
}
.modal-backdrop.closing { animation: auFadeOut 200ms linear both }
/* [01/10] A JANELA DO VÍDEO DA BIBLIOTECA não sobe de baixo: ela cresce do
   quadro do painel e volta pra ele (js/core/video-transicao.js, a mesma do
   executor e do montador). Sem isto a folha subia de novo a cada repintura. */
.video-backdrop, .video-backdrop .modal { animation: none }
.modal-backdrop.closing .modal { animation: auSheetOut 280ms var(--au-ease-sheet) both }
@media (prefers-reduced-motion: reduce) {
  .modal-backdrop.closing, .modal-backdrop.closing .modal {
    animation: auFadeOut 160ms linear both !important;
  }
}

/* ── [P9/P10] Camadas do PLAYER: a prévia, o mapa da sessão e a barra
   minimizada apareciam e sumiam por corte seco, enquanto o overlay de
   vídeo — irmão deles, no mesmo arquivo — já entrava e saía animado.
   Mesma régua das folhas: entra e sai pelo MESMO caminho.
   · camada de conteúdo (prévia/mapa): opacidade, 240ms;
   · player cheio ⇄ barra acoplada: deslize vertical, 320ms de gaveta.

   [SEM ZOOM · dono 2026-08-18] A camada nascia em `scale(.96)` e crescia.
   O dono mandou tirar todo efeito de zoom, principalmente nos caminhos que
   se abrem de DENTRO de uma tela — que é exatamente o que esta classe
   anima. Ficou o fade: entra e sai pelo mesmo caminho, sem escala.
   `auLayerIn`/`auLayerOut` MORRERAM (regra 1) — sem a escala eles eram
   `auFadeIn`/`auFadeOut` com outro nome, e nome duplicado é o começo de
   duas verdades. As linhas de reduced-motion da camada saíram junto: elas
   existiam pra CORTAR o deslocamento, e não há mais deslocamento pra
   cortar. As da `.au-sheet-up` ficam — a folha ainda desliza. ── */
.au-layer { animation: auFadeIn 240ms var(--au-ease) both }
.au-layer.closing { animation: auFadeOut 200ms var(--au-ease) both }
.au-sheet-up { animation: auSheetIn var(--au-dur-sheet) var(--au-ease-sheet) both }
.au-sheet-up.closing { animation: auSheetOut 280ms var(--au-ease-sheet) both }
@media (prefers-reduced-motion: reduce) {
  .au-sheet-up { animation: auFadeIn 200ms linear both }
  .au-sheet-up.closing { animation: auFadeOut 160ms linear both }
}
.modal-close-x {
  min-width: 44px; min-height: 44px;
  background: none; border: none; cursor: pointer;
  color: var(--au-muted); font-size: 15px;
  float: right;
}
.modal-actions { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.workout-receipt-danger-btn, .workout-receipt-link-btn, .workout-edit-toggle-btn, .btn-secondary {
  background: none; border: 1px solid rgba(255, 255, 255, .14);
  color: var(--au-text); border-radius: 100px;
  padding: 11px 16px; min-height: 44px;
  font: 400 .875rem "Sora"; cursor: pointer;
}
.workout-receipt-danger-btn { color: var(--au-orange); border-color: rgba(217, 154, 108, .45); }
.workout-edited-badge {
  font: 400 .625rem "Space Mono", monospace; letter-spacing: .14em;
  color: var(--au-gold-dim); text-transform: uppercase;
}
.workout-receipt-meta-row { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.badge.zone { font: 400 .6875rem "Space Mono", monospace; color: var(--au-muted); }
.workout-blocks { list-style: none; font: 400 .9375rem/1.8 "Sora"; color: var(--au-text-soft); }
.workout-section-title { font: 400 .6875rem "Space Mono", monospace; letter-spacing: .18em; color: var(--au-gold-dim); text-transform: uppercase; }
.empty-day { color: var(--au-muted); font: 400 .875rem "Sora"; }

.icon-btn { background: none; border: 1px solid rgba(255, 255, 255, .14); border-radius: 50%; min-width: 44px; min-height: 44px; color: var(--au-text); cursor: pointer; }

/* ── [quebra·acessibilidade] Alvos de toque ≥44pt (regra 12) nos controles
   transplantados do manequim/hub que vinham menores do App 1. Só sizing —
   cor/efeito seguem no manikin.css/aurum.css. */
.hub-mode-seg button { min-height: 44px; }
.hub-seg-pill { min-height: 44px; }
.hub-flip-btn { min-height: 44px; }
.attn-tab { min-height: 44px; }

/* [auditoria] Os botoes PT/EN da Conta so tinham min-height e NENHUMA outra
   regra em todo o css/. [dono 19/10] Viraram UM seletor: uma pilula com as
   duas opcoes dentro (eram dois circulos enormes, em mono espacado). O ativo
   ganha um veu claro (translucido, nao e o fill solido da tela). Alvo 44px
   mantido em cada opcao. */
.account-lang-toggle {
  display: flex; flex: none; margin-left: auto; padding: 2px;
  border: 1px solid rgba(255, 255, 255, .14); border-radius: 100px;
}
.account-lang-btn {
  min-height: 44px; min-width: 54px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 14px; border: none; border-radius: 100px;
  background: none; color: var(--au-muted);
  font: 400 var(--au-fs-m) "Sora", sans-serif;
  cursor: pointer;
  transition: transform var(--au-dur-press) var(--au-ease), color var(--au-dur) var(--au-ease);
}
.account-lang-btn:active { transform: scale(.97); }
.account-lang-btn.active { background: rgba(255, 255, 255, .1); color: var(--au-text); }

/* ── [quebra·agenda coach] A agenda transplantada traz seu PRÓPRIO
   .agenda-wrap (padding 18px + max-width:640px). Dentro do .screen (que
   já tem padding 26px), isso dobrava o padding e o wrap estourava os
   375px do celular — empurrando a barra de abas do coach pra fora da
   tela. Fix: na agenda, o .screen não re-aplica padding horizontal (o
   wrap cuida disso) e o wrap fica capado em 100%. */
#agendaView { padding-left: 0; padding-right: 0; }
.agenda-wrap { max-width: 100%; width: 100%; box-sizing: border-box; } /* [19/10] com `margin:0 auto` (ported.css) o item do flex encolhe ao conteúdo; a fita de 14 dias do atleta rola por dentro e o empurrava a 460px num iPhone de 390 */

/* ── [FICHA DO ALUNO · F1] ────────────────────────────────────────────
   Mockup aprovado: mockups/ficha-do-aluno.html.

   Vive aqui e NÃO em estilo inline: o DESIGN-CONTRATO proíbe declarar
   fonte ou altura de botão dentro de uma tela, e o coach-athletes.js é um
   transplante cheio desse vício antigo — o markup NOVO não pode piorá-lo.
   Tamanhos saem dos tokens de escala; nenhuma cor crua. */
.ficha-bloco { margin-top: 18px; }
.ficha-bloco .au-k2 { margin-bottom: 4px; }

.ficha-linha {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; padding: 9px 0;
  border-bottom: 1px solid var(--au-line);
}
.ficha-rot {
  flex: none;
  font-size: var(--au-fs-xs); font-weight: 300;
  color: var(--au-muted);
}
/* O VALOR é o dado — fica na cor cheia do texto e pode quebrar em duas
   linhas (lista de músculos pedidos é longa); o rótulo nunca encolhe. */
.ficha-val {
  flex: 1; min-width: 0; text-align: right;
  font-size: var(--au-fs-m); font-weight: 300;
  color: var(--au-text); overflow-wrap: anywhere;
}
/* [dono 15/10] O DETALHE DE CADA "SIM" DO PAR-Q, logo abaixo da linha do
   sim (que perde a borda: os dois são UMA resposta). Texto da pessoa, na cor
   cheia; sem detalhe, o aviso "pergunte" sai em cobre — atenção, régua AURUM. */
.ficha-linha-sim { border-bottom: none; padding-bottom: 2px; }
.ficha-parq-det {
  padding: 0 0 10px; border-bottom: 1px solid var(--au-line);
  font-size: var(--au-fs-s); font-weight: 300; line-height: 1.5;
  color: var(--au-text); overflow-wrap: anywhere;
}
.ficha-parq-falta { color: var(--au-orange); }
.ficha-vazia {
  font-size: var(--au-fs-xs); font-weight: 300;
  color: var(--au-faint); line-height: 1.5;
}

/* ── [dono 2026-08-20] AS SESSÕES PRESENCIAIS NA FICHA ────────────────
   Uma linha = UM botão (nada aninhado) que leva pra aba AGENDA no dia
   certo — o mesmo gesto que o bloco do HOJE já faz. Alvo de 44 pela
   regra 7; nenhuma cor crua, nenhum tamanho fora da escala. */
.ficha-sess {
  display: flex; align-items: center; gap: 10px; width: 100%;
  min-height: 44px; padding: 4px 2px; text-align: left;
  background: none; border: none; border-bottom: 1px solid var(--au-line);
  cursor: pointer;
}
.ficha-sess .fs-hora {
  flex: none; font-family: 'Space Mono', monospace; font-size: var(--au-fs-m);
  color: var(--au-text); font-variant-numeric: tabular-nums;
}
.ficha-sess .fs-dia {
  flex: 1; min-width: 0; font-size: var(--au-fs-xs); font-weight: 300;
  color: var(--au-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ficha-sess .fs-arw { flex: none; color: var(--au-gold); font-size: var(--au-fs-m); }

/* ── [FICHA · F2] O CADERNO DO COACH ──────────────────────────────────
   Anotação privada sobre o aluno. Moldura TRACEJADA + cadeado + a frase
   "só você vê" — a MESMA linguagem que as fotos de progresso já usam do
   lado do atleta (photos.js), em vez de inventar texto novo pro mesmo
   conceito.

   O tracejado usa `--au-seal-dashed`, o MESMO token do selo do método.
   Cheguei a escrever o valor à mão (o mockup pede .45 contra os .5 do
   token) e o `tests/selo-usa-o-token.js` reprovou — com razão: 0,05 de
   opacidade ninguém enxerga, e mais um tracejado dourado solto no CSS é
   como a marca do método passou a pesar diferente em 9 lugares antes.
   Abrir exceção no guarda pra uma diferença invisível apodrece o guarda.
   Aqui o papel é outro (moldura de bloco, não assinatura), mas a
   gramática visual é a mesma: "isto não é o normal da tela". */
.coach-nota {
  margin-top: 14px; padding: 12px 13px;
  border: var(--au-seal-dashed); border-radius: 12px;
  background: rgba(201, 162, 74, .04);
}
/* [dono 18/10] as notas das sessões presenciais na porta CADERNO
   (coach-hub-caderno.js): leitura, sem alvo; a dor em cobre. */
.caderno-sessoes{ margin-top:28px }
.caderno-sessoes-dia{ margin-top:14px }
.caderno-sessoes-data{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-text-soft); padding-bottom:6px; border-bottom:1px solid var(--au-line-soft) }
.caderno-sessoes-item{ display:flex; gap:12px; padding:9px 0; border-bottom:1px solid var(--au-line-soft) }
.caderno-sessoes-tipo{ flex:none; width:84px; padding-top:2px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--au-muted) }
.caderno-sessoes-item.dor .caderno-sessoes-tipo{ color:var(--au-orange) }
.caderno-sessoes-txt{ flex:1; min-width:0; font:300 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-text); overflow-wrap:anywhere }
.caderno-sessoes-txt b{ font-weight:400; color:var(--au-text-soft); margin-right:4px }
.caderno-sessoes-resolvida{ font-style:normal; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.1em; color:var(--au-muted); white-space:nowrap }
/* [dono 18/10, fatia 5] a dor das sessões no topo do HUB, em qualquer porta:
   moldura cobre (atenção/lesão), sem fill; um "Resolved" de 44px por dor. */
.hub-dor-sessao{ margin:14px 0 4px; padding:10px 14px 4px; border:1px solid rgba(217,154,108,.45); border-radius:14px }
.hub-dor-sessao-k{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--au-orange) }
.hub-dor-sessao-item{ display:flex; align-items:center; gap:10px; padding:4px 0; border-top:1px solid var(--au-line-soft); margin-top:6px }
.hub-dor-sessao-item:first-of-type{ border-top:none }
.hub-dor-sessao-txt{ flex:1; min-width:0; font:300 var(--au-fs-s)/1.45 'Sora',sans-serif; color:var(--au-text); overflow-wrap:anywhere }
.hub-dor-sessao-txt b{ font-weight:400; color:var(--au-text-soft) }
.hub-dor-resolver{ flex:none; min-height:44px }
.coach-nota-selo {
  display: flex; align-items: center; gap: 6px;
  font: 400 var(--au-fs-mono-xs) "Space Mono", monospace;
  letter-spacing: .16em; text-transform: uppercase; color: var(--au-gold);
}
.coach-nota-texto {
  margin: 8px 0 0;
  font-size: var(--au-fs-xs); font-weight: 400; line-height: 1.5;
  color: var(--au-text-soft); white-space: pre-wrap; overflow-wrap: anywhere;
}
.coach-nota-vazia { color: var(--au-faint); font-style: italic; }
.coach-nota-campo {
  width: 100%; margin: 8px 0 0; background: none; border: none; resize: none;
  color: var(--au-text-soft); outline: none;
  font-size: var(--au-fs-xl); font-weight: 400; line-height: 1.5;
  font-family: "Sora", sans-serif;
}

/* ── DESLIZAR PRA REMOVER O ROUND [dono 2026-09-06] ────────────────────
   O "Remover" fica ATRÁS do cartão, e o cartão desliza por cima dele. Só
   `transform` anima (régua do AURUM), e a moldura recorta — sem isso o
   botão apareceria pela lateral antes de o dedo chegar nele.

   COBRE, e não vermelho: é a cor de ATENÇÃO desta casa (`--au-orange`), a
   mesma do "Cancelar esta sessão" e do aviso de round pulado. Vermelho
   seria uma cor nova pra um gesto que apaga um round em branco. */
.fs-swipe{ position:relative; overflow:hidden; border-radius:12px }
.fs-swipe-card{
  position:relative; z-index:1;
  transform:translateX(0);
  transition:transform 220ms var(--au-ease-sheet);
  touch-action:pan-y;   /* a rolagem vertical continua da tela */
}
.fs-swipe-card.aberto{ transform:translateX(calc(var(--fs-swipe-w) * -1)) }
.fs-swipe-card.arrastando{ transition:none }

/* ── [dono 2026-09-08] A FAIXA CRESCE COM O DEDO ──────────────────────
   Ele viu no iPhone: "quando deslizado para a esquerda, surge um botão de
   apagar série, mas esse surgimento deve ser melhor do que tem hoje, pois
   o botão já fica todo preenchido, vazando e dando aparência pouco
   profisional".

   Estava: um retângulo de largura FIXA (104px) com borda e raio PRÓPRIOS,
   ligado e desligado de uma vez por `visibility` no primeiro milímetro de
   arrasto. Medido no mockup: com o dedo a 12px o botão já estava inteiro
   na tela, e o canto arredondado dele aparecia por cima do canto da linha
   — o "vazando".

   Agora a tinta ocupa EXATAMENTE o que foi revelado (o JS escreve a
   largura a cada `pointermove`), sem raio próprio: quem arredonda é a
   moldura `.fs-swipe`, que já recorta. Não há como vazar, porque não há
   nada além da faixa. O conteúdo (lixeira + palavra) entra por opacidade
   a partir de ~45% do gesto — ver `fsLigarDeslizeDoRound`.

   O ESTADO ASSENTADO VEM DAQUI, não de uma animação no nó do gesto: o
   `fim()` do arrasto re-renderiza, e o nó em que o gesto escrevia é
   jogado fora. A faixa aberta NASCE com a largura cheia, como o cartão já
   nascia com o `translateX` do `.aberto`. */
.fs-swipe{ --fs-swipe-w:104px }
/* [dono 2026-10-03] A barra do topo do executor (relógio · Terminar) fica
   presa enquanto a lista rola — senão, rolado, o vídeo aberto nasce sem
   relógio na tela. O deslocamento negativo anula o padding de cima da
   coluna (safe-area + 26px), pra ela grudar na borda e não deixar a lista
   aparecendo por cima dela; o padding devolve o respiro. */
.fs-topo-preso{
  position:sticky;
  top:calc(-1 * (env(safe-area-inset-top, 0px) + 26px));
  z-index:3;
  margin:calc(-1 * (env(safe-area-inset-top, 0px) + 26px)) -28px 0;
  padding:calc(env(safe-area-inset-top, 0px) + 26px) 28px 8px;
  background:var(--au-surface);
  display:flex; align-items:flex-start; justify-content:space-between; gap:8px; white-space:nowrap;
}
/* [17/10] A BARRA NÃO APERTA: em 320 o relógio passava por cima da pausa e,
   em 390 com o app em PT, o "Terminar" (mais largo que o "Finish") cortava o
   contador ("R2 /…"). A esquerda (← · relógio) nunca encolhe; quem cede é o
   grupo da direita, e cedendo ele QUEBRA A LINHA: o "Terminar" desce pra uma
   2ª linha, alinhado à direita embaixo dos ícones. Em 390 tudo cabe numa
   linha (EN e PT, correndo e pausado); em 320 o "Terminar" desce. Nenhum
   alvo encolhe. Guarda: tests/executor-topo-nao-aperta.js. */
.fs-topo-esq{ display:inline-flex; align-items:center; gap:6px; flex:none; }
.fs-topo-acoes{ display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; row-gap:4px; flex:0 1 auto; min-width:0; }
.fs-topo-preso #fsCtlFinish{ margin-left:6px; width:auto; min-height:44px; padding:0 14px; font-size:var(--au-fs-m); }

/* [dono 16/10] o relógio e o "ROUND 4 / 15" empilhados, na altura de toque
   da barra (44) — a barra não fica mais larga */
.fs-relogio-pilha{ display:inline-flex; flex-direction:column; justify-content:center; min-height:44px; line-height:1.25; }
/* a seta de voltar NUNCA cede largura (o fiscal pegou 20×44 em 16/10 quando o
   contador entrou); desde 17/10 a pilha do relógio também não cede —
   quem cede é o grupo da direita, quebrando a linha */
.fs-topo-preso #fsCtlMin{ flex:none; }
.fs-round-conta{ overflow:hidden; text-overflow:ellipsis; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.08em; color:var(--au-muted); font-variant-numeric:tabular-nums; }
.fs-round-conta:empty{ display:none; }

.fs-swipe-del{
  position:absolute; right:0; top:0; bottom:0; width:0;
  display:flex; align-items:center; justify-content:center;
  border:none; border-radius:0;
  /* a linha que separa a faixa do cartão é SOMBRA INTERNA, não `border`:
     com `width:0` uma borda de 1px ainda ocuparia 1px de caixa, e "fechada
     não tem um pixel" é a régua que substituiu o `visibility` (08/09). */
  box-shadow:inset 1px 0 0 rgba(217,154,108,.28);
  background:rgba(217,154,108,.16); color:var(--au-orange);
  font:400 var(--au-fs-xs) 'Sora',sans-serif; cursor:pointer; padding:0;
  overflow:hidden; white-space:nowrap;
}
.fs-swipe:has(.fs-swipe-card.aberto) .fs-swipe-del{ width:var(--fs-swipe-w) }
.fs-swipe-del-in{
  display:flex; align-items:center; gap:7px;
  opacity:0; transform:scale(.86);
  transition:opacity 90ms linear, transform 160ms var(--au-ease);
}
.fs-swipe:has(.fs-swipe-card.aberto) .fs-swipe-del-in{ opacity:1; transform:none }
.fs-swipe-del:active .fs-swipe-del-in{ transform:scale(.97) }
/* [06/09, achado na FOTO da alternativa E] O "REMOVER" VAZAVA ATRAVÉS DO
   CARTÃO FECHADO — o cartão tem 3% de branco de fundo (translúcido) e o
   botão cobre morava atrás dele, a 104px de largura, lido por cima dos
   números sem ninguém ter deslizado nada.
   [08/09] QUEM GARANTE ISSO AGORA É A LARGURA ZERO: fechada, a faixa não
   tem um pixel. Foi o que liberou a linha a perder o fundo opaco na peça
   das caixas — sem a faixa nova, o "Remover" voltaria a vazar. */
/* ── [dono 2026-10-06] DIREITA ACRESCENTA: a faixa "+ Round" ───────────
   O espelho do "Remover", do lado esquerdo e com a mesma régua de 08/09:
   largura ZERO fechada (o JS escreve a largura a cada movimento) e a linha
   de separação é sombra interna, nunca borda. Neutra e não cobre — é o
   gesto de ACRESCENTAR, o mesmo tom do botão tracejado "+ round". Acende
   (`.pronta`) quando soltar já acrescenta. */
.fs-swipe-add{
  position:absolute; left:0; top:0; bottom:0; width:0;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; white-space:nowrap; pointer-events:none;
  background:rgba(255,255,255,.05); box-shadow:inset -1px 0 0 rgba(255,255,255,.18);
  color:var(--au-text-soft); font:400 var(--au-fs-xs) 'Sora',sans-serif;
}
.fs-swipe-add.pronta{ background:rgba(255,255,255,.12); color:var(--au-text) }
.fs-swipe-add-in{ opacity:0 }
/* segurar a linha não pode abrir a lupa nem o menu do iOS: o toque longo
   é nosso (régua nas caixas, menu do round fora delas) */
.fs-swipe-card{ -webkit-touch-callout:none }

/* ── [dono 2026-10-06] A RÉGUA: segurar a caixa e arrastar ──────────────
   A caixa cresce de leve ao armar (a única resposta que a web dá no
   iPhone, que não vibra) e a fita aparece por cima dela. A fita é OPACA —
   no mockup, translúcida, deixava os números da linha de baixo aparecerem
   por trás — e só a janela interna esmaece nas pontas. */
.fs-cx.fs-regua-armada{
  transform:scale(1.06);
  background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.35);
}
.fs-regua{
  /* acima do executor, que é uma camada fixa em z-index 4000 — a 1ª foto
     pegou a fita POR BAIXO dele, invisível, com a caixa já mudando */
  position:fixed; z-index:4050; pointer-events:none; overflow:hidden;
  border-radius:12px; background:var(--au-surface-2);
  border:1px solid rgba(255,255,255,.28); box-shadow:0 18px 40px -10px rgba(0,0,0,.8);
  animation:fsReguaEntra 200ms var(--au-ease);
}
@keyframes fsReguaEntra{ from{ opacity:0; transform:scale(.95) } to{ opacity:1; transform:none } }
.fs-regua-janela{
  position:absolute; inset:0; overflow:hidden;
  -webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);
  mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);
}
.fs-regua-fita{ will-change:transform }
.fs-regua-v{
  height:36px; display:grid; place-items:center;
  font:300 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-faint);
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.fs-regua-v.c{ font-size:var(--au-fs-t-s); color:var(--au-text) }
.fs-regua-marca{
  position:absolute; left:6px; right:6px; top:50%; height:36px; transform:translateY(-50%);
  border-top:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14);
}

/* ── [dono 2026-10-06] O MENU DO ROUND (segurar o R) ────────────────────
   Os dois gestos da linha em botões de 44px, pra quem não arrasta (regra
   7). Ancorado na linha (`data-fs-rest-anc`), logo abaixo dela. */
.fs-round-menu{
  position:absolute; left:0; top:calc(100% + 4px); z-index:6;
  display:flex; gap:6px; padding:6px; border-radius:14px;
  background:var(--au-surface-2); border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 40px -10px rgba(0,0,0,.8);
  animation:fsReguaEntra 200ms var(--au-ease);
}
.fs-round-menu .au-chip{ font-size:var(--au-fs-s) }
.fs-round-menu .au-chip:active{ transform:scale(.97) }
.fs-round-menu-del{ color:var(--au-orange); border-color:rgba(217,154,108,.4) }

/* ── [dono 2026-10-07] O BRILHO DOS GESTOS ─────────────────────────────
   "Adicione um glow em todos os gestos, para dar uma diferenciada." Só
   enquanto o dedo age; a lista parada não muda. A linha (`.fs-swipe`) corta
   o cartão que desliza — sem o corte os números vazariam pro lado. Com uma
   faixa acesa, o corte troca de `overflow` por `clip-path`: corta SÓ o lado
   pra onde o cartão vai e deixa o brilho respirar em volta da faixa. */
.fs-swipe:has(.fs-swipe-add.pronta){ overflow:visible; clip-path:inset(-24px 0 -24px -24px round 12px) }
.fs-swipe:has(.fs-swipe-card.aberto){ overflow:visible; clip-path:inset(-24px -24px -24px 0 round 12px) }
.fs-swipe-add.pronta{ box-shadow:var(--au-glow-gesto); border-radius:12px }
.fs-swipe:has(.fs-swipe-card.aberto) .fs-swipe-del{ box-shadow:var(--au-glow-gesto-cobre); border-radius:12px }
.fs-cx.fs-regua-armada{ box-shadow:var(--au-glow-gesto) }
.fs-regua{ box-shadow:var(--au-glow-gesto), 0 18px 40px -10px rgba(0,0,0,.8) }
.fs-round-menu{ box-shadow:var(--au-glow-gesto), 0 18px 40px -10px rgba(0,0,0,.8) }
.fs-round-menu .fs-round-menu-del{ box-shadow:var(--au-glow-copper) }
[data-fs-rest-anc]:has(.fs-round-menu) .fs-rn{ box-shadow:var(--au-glow-gesto); background:rgba(255,255,255,.1); color:var(--au-text) }

/* ── [dono 2026-10-07] O TUTORIAL DE GESTOS (player-tutorial.js) ───────
   Acima do executor (4000) e da régua (4050). O véu é o anel de sombra do
   foco; a linha acesa é uma CÓPIA da de verdade, com as classes do app. */
#fsTutorialRoot{ position:fixed; inset:0; z-index:4100; -webkit-user-select:none; user-select:none }
#fsTutorialRoot .fst-veu{ position:absolute; inset:0 }
#fsTutorialRoot .fst-foco{
  position:absolute; border-radius:14px; pointer-events:none;
  box-shadow:0 0 0 1px rgba(245,243,238,.28), 0 0 0 4000px rgba(0,0,0,.78);
}
/* opaca: a linha do app é transparente, e a de verdade apareceria por trás
   da cópia quando ela desliza (a 1ª foto pegou os números em dobro) */
#fsTutorialRoot .fst-demo{ position:absolute; pointer-events:none; background:var(--au-surface); border-radius:12px }
#fsTutorialRoot .fst-demo .fs-swipe-card{ transition:transform 420ms var(--au-ease-sheet) }
#fsTutorialRoot .fst-demo .fs-swipe-add{ transition:width 420ms var(--au-ease-sheet) }
#fsTutorialRoot .fst-demo .fs-swipe-add-in{ opacity:1 }
#fsTutorialRoot .fst-regua{ position:absolute; opacity:0; animation:none; transition:opacity 200ms var(--au-ease) }
#fsTutorialRoot .fst-regua .fs-regua-fita{ transition:transform 360ms var(--au-ease) }
#fsTutorialRoot .fst-menu{ pointer-events:none }
#fsTutorialRoot .fst-dedo{
  position:absolute; left:0; top:0; width:44px; height:44px; margin:-22px 0 0 -22px;
  border-radius:50%; pointer-events:none; opacity:0;
  background:rgba(245,243,238,.22); border:1.5px solid rgba(245,243,238,.85);
  box-shadow:0 0 0 6px rgba(245,243,238,.08);
  transition:transform 420ms var(--au-ease-sheet), opacity 200ms linear;
}
#fsTutorialRoot .fst-folha{
  position:absolute; left:12px; right:12px; bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  max-width:440px; margin:0 auto; padding:18px 18px 12px; border-radius:24px;
  background:var(--au-surface-2); border:1px solid rgba(255,255,255,.1);
  box-shadow:0 -10px 40px -10px rgba(0,0,0,.9);
}
#fsTutorialRoot .fst-corpo{ animation:fsReguaEntra 320ms var(--au-ease) }
#fsTutorialRoot .fst-tit{ font:300 var(--au-fs-t-s)/1.25 'Sora',sans-serif; color:var(--au-text); margin:6px 0 4px; text-wrap:balance }
#fsTutorialRoot .fst-txt{ font:300 var(--au-fs-s)/1.55 'Sora',sans-serif; color:var(--au-muted); margin:0; min-height:44px }
#fsTutorialRoot .fst-txt b{ font-weight:400; color:var(--au-text-soft) }
#fsTutorialRoot .fst-pe{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px }
#fsTutorialRoot .fst-pontos{ display:flex; gap:6px }
#fsTutorialRoot .fst-pontos i{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.2) }
#fsTutorialRoot .fst-pontos i.on{ background:var(--au-text); transform:scale(1.3) }
#fsTutorialRoot .fst-seguir{ width:auto; padding:0 28px }
#fsTutorialRoot .au-link-mono:active, #fsTutorialRoot .fst-seguir:active{ transform:scale(.97) }

@media (prefers-reduced-motion: reduce){
  #fsTutorialRoot .fst-demo .fs-swipe-card, #fsTutorialRoot .fst-demo .fs-swipe-add,
  #fsTutorialRoot .fst-dedo, #fsTutorialRoot .fst-regua, #fsTutorialRoot .fst-regua .fs-regua-fita{ transition:none }
  #fsTutorialRoot .fst-corpo{ animation:none }
  .fs-swipe-card{ transition:none }
  .fs-swipe-del-in{ transition:none }
  .fs-cx.fs-regua-armada{ transform:none }
  .fs-regua, .fs-round-menu{ animation:none }
}

/* ── [dono 2026-09-08] A LINHA DO ROUND: CAIXA POR VALOR ───────────────
   Ele mandou o print do Strong: "separa as linhas da mesma forma que esse
   app, mas em vez de ter o 'ultimo', mantenha % body weight". No Strong
   cada valor editável é uma CAIXA; aqui o que dizia "isto se toca" era um
   pontilhado de 1px embaixo do número — pista fina demais para o dedo.

   A linha deixou de ser um cartão fechado: o `.fs-swipe-card` continua
   sendo o nó (é ele que desliza e que carrega o `data-fs-jump`), mas sem
   fundo e sem borda. Quem se destaca são as caixas.

   O "AGORA" NÃO GANHOU RÉGUA. Ela continua no cabeçalho do exercício
   (`.fs-bloco-agora`, decisão de 07/09) — o mockup aprovado desenha assim,
   e "um sinal de ouro por tela" é a régua do dono de 06/09. O round da vez
   se destaca por LUZ: as caixas dele são mais claras. */
/* as colunas da linha e do cabeçalho — UMA fonte pros dois (era uma const
   inline no JS, e inline não pode ser ajustado por media query). A coluna
   do valor é a maior: é ela que carrega "137,5" dentro de uma caixa. */
/* [dono 17/10] A 5ª COLUNA (o descanso, de 04/10) SAIU DA LINHA: o descanso
   mora ENTRE as linhas (`.fs-entre`, abaixo). Quatro colunas: o S · o % · a
   carga · as reps — a carga e as reps herdaram a largura dela. */
.fs-grid-linha{
  display:grid; grid-template-columns:26px .62fr 1.3fr .9fr;
  align-items:center; gap:6px;
}
.fs-cx{
  /* [04/10] recuo 6px (era 8): com a 5ª coluna, "PESADA" do elástico
     pedia 59px numa caixa de 57 em 375 */
  min-height:44px; min-width:44px; padding:0 6px;
  border-radius:10px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.05);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:transform 120ms var(--au-ease);
}
.fs-cx:active{ transform:scale(.97) }
/* a moldura do campo aberto (`fsCampoNoLugar`, player-edicao.js) é um span
   no lugar do botão: o botão mede a borda POR DENTRO (border-box é o padrão
   dele no navegador) e o span não — sem isto a linha descia 2px ao tocar.
   Sem a borda, o miolo fica com os 44px do campo. */
.fs-cell[data-editing="1"]{ box-sizing:border-box }
.fs-cx[data-editing="1"]{ border-width:0 }
.fs-band{ font-size:var(--au-fs-s) }
/* [19/10] a unidade dentro da caixa (linha do par com tipo diferente do cabeçalho) */
.fs-un{ font-size:var(--au-fs-mono-xs); color:var(--au-muted) }
.fs-swipe-card.cur .fs-cx{ background:rgba(255,255,255,.085); border-color:rgba(255,255,255,.12) }
/* telas muito estreitas (iPhone SE de 320): o número do round da vez desce
   pro corpo de 17px como os outros — em 320 a caixa tem 59px e "137,5" a
   20px pede 68. A distinção do "agora" continua sendo o FUNDO da caixa, que
   é o que o mockup aprovado usa. O `!important` é necessário e não é
   preguiça: a fonte da célula é declarada INLINE (a escala vem do JS), e
   inline vence folha — mesmo motivo do `.pushed-screen[style*="padding"]`. */
@media (max-width: 359px){
  .fs-swipe-card.cur .fs-cx{ font-size:var(--au-fs-xl) !important }
  /* e a caixa aperta o recuo: em 320 ela tem ~59px, e 16px de padding
     deixavam 43 úteis pra "137,5". Medido nos quatro casos (carga longa,
     por tempo, inglês e o rótulo do elástico, que é o texto mais largo). */
  .fs-cx{ padding:0 2px }
  .fs-cx span{ font-size:var(--au-fs-xs) }
  /* [04/10] em 320 o % fica com o resto (~30px), com o número a 10px.
     [17/10] sem a 5ª coluna, as reps passam do mínimo de toque pra 52px. */
  .fs-grid-linha{ grid-template-columns:22px 30px minmax(0,1fr) 52px; gap:4px }
  .fs-pc{ font-size:var(--au-fs-mono-xs) !important }
  /* "PESADA" desce pra 10px e a caixa recua 2px (era 4) — medido sem corte em 320. */
  .fs-cx .fs-band{ font-size:var(--au-fs-mono-xs) }
}
/* o número do round: caixinha discreta na coluna de 26px que o grid já
   reserva — é rótulo, não alvo (quem recebe o toque é a linha inteira).
   [07/10] --au-muted, não --au-faint: o faint é calibrado contra o fundo
   PRETO, e dentro da caixinha de 5% e do cartão do exercício caía pra
   4,46:1 em 11px — abaixo do AA (régua `contraste-legivel`). Muted dá ~6:1
   e continua apagado diante do valor da linha. Vale pro descanso abaixo. */
.fs-rn{
  width:26px; height:26px; border-radius:7px;
  display:grid; place-items:center;
  background:rgba(255,255,255,.05);
  font:600 var(--au-fs-mono) 'Space Mono',monospace; color:var(--au-muted);
}
/* [dono 16/10] o round filho (drop set · rest-pause): a técnica no lugar do
   número, em texto mais claro — é a parte do round que pede atenção, sem cor
   nova (tecnicas-de-serie.js) */
.fs-rn-tec{ color:var(--au-text-soft); letter-spacing:-.02em }
/* [dono 17/10] na supersérie intercalada a caixinha diz o LADO e o set:
   "A1" em cima, "S2" embaixo, menor */
.fs-rn-ss{ height:36px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; line-height:1 }
.fs-rn-ss i{ font-style:normal; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; color:var(--au-muted) }
.fs-rn-ss b{ font-weight:600; color:var(--au-text-soft) }
/* [dono 16/10] a legenda do D / RP embaixo dos rounds: leitura, apagada,
   alinhada com a coluna do R (a letra em mono, como na caixinha) */
.fs-tec-leg{ margin:10px 6px 2px; }
.fs-tec-leg p{ margin:4px 0 0; font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted) }
.fs-tec-leg b{ font:600 var(--au-fs-mono) 'Space Mono',monospace; color:var(--au-text-soft); margin-right:4px }
/* [dono 18/10] O RIR com o coach conduzindo (player-presencial.js): a fileira
   abre embaixo do set que acabou de levar ✓, recuada até a coluna das caixas
   (32px = a do S). Em P&B: o valor marcado é o .au-chip.on de sempre. O
   "i" abre o significado da sigla (regra do dono). O "RIR 2" do set feito é
   leitura, sem alvo. */
.fs-rir{ margin:8px 0 2px 32px }
.fs-rir-fila{ display:flex; align-items:center; gap:6px }
.fs-rir-k{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; color:var(--au-muted) }
.fs-rir-i{ flex:none; width:44px; height:44px; margin:0 -6px 0 -8px; border:none; background:none; padding:0; cursor:pointer;
  display:grid; place-items:center; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; color:var(--au-muted) }
.fs-rir-i::before{ content:""; position:absolute; width:20px; height:20px; border:1px solid rgba(255,255,255,.22); border-radius:50% }
.fs-rir-i{ position:relative }
.fs-rir-op{ flex:1; min-width:44px; max-width:64px; padding:0 4px; font-size:var(--au-fs-m) }
.fs-rir-op:active, .fs-rir-i:active{ transform:scale(.97) }
.fs-rir-explica{ margin:8px 0 0; font:400 var(--au-fs-xs)/1.45 'Sora',sans-serif; color:var(--au-muted) }
.fs-rir-feito{ margin:3px 0 0 38px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.14em; color:var(--au-muted) }
@media (prefers-reduced-motion: reduce){ .fs-rir-op:active, .fs-rir-i:active{ transform:none } }
/* [dono 18/10] A NOTA RÁPIDA (player-presencial.js, fatia 2). As etiquetas
   embaixo do cabeçalho do exercício: tocáveis (reabrem a nota), em P&B; a de
   DOR leva o cobre (atenção/lesão). A folha veste a roupa da prontidão
   (.modal + .prontidao-cab/-titulo/-nota), na mesma altura (z 4600). */
.fs-nota-lapis{ margin-left:-4px }
.fs-nota-tags{ display:flex; flex-direction:column; gap:6px; margin:10px 0 0 2px }
.fs-nota-tag{ display:flex; align-items:baseline; gap:8px; width:100%; min-height:44px; box-sizing:border-box; padding:10px 12px;
  border:1px solid var(--au-line); border-radius:12px; background:none; text-align:left; cursor:pointer;
  font:300 var(--au-fs-s)/1.4 'Sora',sans-serif; color:var(--au-text-soft); transition:transform 120ms var(--au-ease) }
.fs-nota-tag b{ flex:none; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-muted) }
.fs-nota-tag span{ min-width:0; overflow-wrap:anywhere }
.fs-nota-tag.dor{ border-color:rgba(217,154,108,.45) }
.fs-nota-tag.dor b{ color:var(--au-orange) }
.fs-nota-tag:active{ transform:scale(.97) }
#fsNotaRoot .modal-backdrop{ z-index:4600 }
.fs-nota-folha{ transition:transform 200ms cubic-bezier(.32,.72,0,1) }
.fs-nota-tipos{ display:flex; gap:8px; margin:14px 0 4px }
.fs-nota-tipo{ flex:1; padding:0 8px; font-size:var(--au-fs-m) }
.fs-nota-tipo.dor.on{ border-color:var(--au-orange); color:var(--au-orange) }
.fs-nota-rapida{ min-height:96px; font-size:var(--au-fs-l) }
.fs-nota-folha .au-btn{ margin-top:14px }
.fs-nota-apagar{ display:block; margin:8px auto 0 }
.fs-nota-erro{ margin:10px 0 0; font:400 var(--au-fs-s)/1.45 'Sora',sans-serif; color:var(--au-orange) }
@media (prefers-reduced-motion: reduce){ .fs-nota-tag, .fs-nota-folha{ transition:none } .fs-nota-tag:active{ transform:none } }
/* [dono 18/10] A BUSCA DE EXERCÍCIO da sessão presencial (presencial-busca.js,
   fatia 3): a roupa da prontidão, alta (a lista rola dentro), o campo de 16px
   e uma linha de 56px por exercício com a última vez dela embaixo. O "+ Add
   exercise" do executor é o .au-btn-quiet (o secundário NEUTRO — o .au-ghost
   é dourado, e o ouro desta tela já é o "agora"). */
#presBuscaRoot .modal-backdrop{ z-index:4700 }
.pres-busca-folha{ max-height:86dvh; display:flex; flex-direction:column }
.pres-busca-campo{ display:block; width:100%; box-sizing:border-box; min-height:48px; margin:14px 0 8px; padding:0 14px;
  border:1px solid var(--au-line); border-radius:14px; background:none; outline:none;
  font:300 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text) }
.pres-busca-campo:focus{ border-color:var(--au-text-soft) }
.pres-busca-campo::placeholder{ color:var(--au-faint) }
.pres-busca-lista{ flex:1; min-height:120px; overflow-y:auto; -webkit-overflow-scrolling:touch; margin:0 -4px; padding:0 4px }
.pres-busca-op{ display:block; width:100%; min-height:56px; box-sizing:border-box; padding:9px 2px; text-align:left;
  background:none; border:none; border-top:1px solid var(--au-line-soft); cursor:pointer; transition:transform 120ms var(--au-ease) }
.pres-busca-op:active{ transform:scale(.97) }
.pres-busca-n{ display:block; font:300 var(--au-fs-m)/1.3 'Sora',sans-serif; color:var(--au-text) }
.pres-busca-s{ display:block; margin-top:3px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--au-muted) }
.pres-busca-vazio{ margin:14px 2px; font:300 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fs-add-ex{ width:100%; margin-top:22px }
@media (prefers-reduced-motion: reduce){ .pres-busca-op{ transition:none } .pres-busca-op:active{ transform:none } }
/* [dono 18/10] "FOR NEXT SESSION" (player-presencial.js, fatia 4): tela
   inteira depois do esforço, a mesma superfície do executor (z 4000). Lista
   rola; o "Done" fica no pé. Dor em cobre; o resto P&B; o × de cada nota
   com 44×44. */
.fs-resumo{ position:fixed; inset:0; z-index:4000; background:var(--au-surface); display:flex; flex-direction:column; font-family:'Sora',sans-serif; animation:auFadeIn 200ms linear both }
.fs-resumo-rolo{ flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; width:100%; max-width:460px; margin:0 auto; box-sizing:border-box;
  padding:calc(env(safe-area-inset-top, 0px) + 26px) 26px 16px }
.fs-resumo-titulo{ margin:8px 0 4px; font:200 var(--au-fs-t-m)/1.15 'Sora',sans-serif; color:var(--au-text) }
.fs-resumo-sub{ margin:0 0 6px; font:300 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fs-resumo-grupo{ margin-top:22px }
.fs-resumo-dor{ color:var(--au-orange) }
.fs-resumo-item{ display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-top:1px solid var(--au-line-soft); margin-top:8px }
.fs-resumo-q{ flex:none; width:96px; padding-top:3px; font:400 var(--au-fs-mono-xs)/1.4 'Space Mono',monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--au-muted); overflow-wrap:anywhere }
.fs-resumo-t{ flex:1; min-width:0; font:300 var(--au-fs-m)/1.45 'Sora',sans-serif; color:var(--au-text); overflow-wrap:anywhere }
.fs-resumo-v{ flex:1; min-width:0; font:300 var(--au-fs-m)/1.45 'Sora',sans-serif; color:var(--au-text) }
.fs-resumo-v small{ display:block; margin-top:2px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.12em; color:var(--au-muted) }
.fs-resumo-x{ flex:none; width:44px; height:44px; margin:-10px -10px -10px 0; border:none; background:none; color:var(--au-muted); font:300 var(--au-fs-xl) 'Sora',sans-serif; cursor:pointer; transition:transform 120ms var(--au-ease) }
.fs-resumo-x:active{ transform:scale(.97) }
.fs-resumo-x:disabled{ opacity:.35 }
.fs-resumo-aviso{ margin:14px 0 0; font:300 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fs-resumo-pe{ width:100%; max-width:460px; margin:0 auto; box-sizing:border-box; padding:12px 26px calc(env(safe-area-inset-bottom, 0px) + 22px) }
.fs-resumo-so{ margin:10px 0 0; text-align:center; font:300 var(--au-fs-xs)/1.5 'Sora',sans-serif; color:var(--au-muted) }
@media (prefers-reduced-motion: reduce){ .fs-resumo{ animation:none } .fs-resumo-x{ transition:none } .fs-resumo-x:active{ transform:none } }

/* ── [dono 17/10] O DESCANSO MORA ENTRE AS LINHAS ─────────────────────
   "Sempre que completo uma série, o descanso é mostrado na série seguinte"
   → mockup `mockups/executor-descanso-entre-linhas.html`. O tempo dentro de
   uma linha (a 5ª caixa de 04/10) obrigava a escolher de QUAL linha ele era,
   e as duas escolhas mentiam pela metade. Agora ele fica ENTRE o set que
   acabou e o próximo, e a posição diz de quem é.

   · PARADO (`.fs-entre`): um traço de 24px com o tempo no meio. Não é
     tocável (dono 17/10) — com 44px de toque ele voltaria aos 96px por set
     que mataram o divisor do Strong em 04/10. Recua 6px à esquerda (o S) e
     53 à direita (o ✓ + o vão), pra o traço morar sobre os números.
   · CORRENDO (`.fs-rest-bloco`): o mesmo lugar se abre — o tempo grande em
     ouro (o "agora"), −30 · +30 · Skip (44px) e a barra de 3px que drena.
   · ACABOU sozinho: o bloco FICA, apagado e sem botões, até o próximo ✓ —
     encolher no bip moveria o ✓ do próximo set debaixo do dedo. */
.fs-entre{ display:flex; align-items:center; gap:10px; height:24px; margin:0 53px 0 38px }
.fs-entre::before, .fs-entre::after{ content:""; flex:1; min-width:12px; height:1px; background:var(--au-line) }
.fs-entre-t{
  flex:none; max-width:78%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.14em;
  text-transform:uppercase; color:var(--au-muted);
}
.fs-entre.feito .fs-entre-t{ opacity:.6 }
.fs-rest-bloco{
  margin:6px 0 6px 38px; padding:8px 0 10px;
  border-top:1px solid rgba(201,162,74,.28); border-bottom:1px solid rgba(201,162,74,.28);
}
/* entre dois exercícios ele não tem a coluna do S ao lado: vai de borda a borda */
.fs-rest-bloco.fim{ margin-left:0 }
/* min-height = os botões de 44px: sem ela o bloco "acabou" (sem botões)
   encolhia 1,5px e o ✓ do próximo set andava no bip — medido */
.fs-rest-bloco-l{ display:flex; align-items:center; gap:6px; min-height:var(--au-h-tap) }
.fs-rest-bloco-t{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.fs-rest-bloco-k{
  font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.18em;
  text-transform:uppercase; color:var(--au-gold-kicker);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.fs-rest-bloco-v{ font:300 var(--au-fs-t-m)/1 'Sora',sans-serif; color:var(--au-gold); font-variant-numeric:tabular-nums; white-space:nowrap }
.fs-rest-bloco-v small{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.1em; color:var(--au-muted); margin-left:6px }
.fs-rest-bloco.acabou .fs-rest-bloco-v{ color:var(--au-muted) }
.fs-rest-bloco.acabou .fs-rest-bloco-k{ color:var(--au-muted) }
.fs-rest-barra{
  position:relative; height:3px; margin-top:10px; border-radius:2px;
  background:rgba(201,162,74,.20); overflow:hidden;
}
.fs-rest-fill{ position:absolute; inset:0 auto 0 0; background:var(--au-gold); border-radius:2px }
/* −30 · +30 · Skip: botões irmãos de 44px (alvo Apple); sem fill — o único
   fill sólido da tela é o "Terminar". Só transform no toque. */
.fs-rest-acoes{ display:flex; align-items:center; gap:6px; flex:none }
.fs-rest-acoes button{
  min-width:var(--au-h-tap); min-height:var(--au-h-tap); padding:0 12px;
  border:1px solid var(--au-line); border-radius:100px; background:none; cursor:pointer;
  font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text-soft); white-space:nowrap;
  box-shadow:none; transition:transform 120ms cubic-bezier(.22,1,.36,1);
}
.fs-rest-acoes button:active{ transform:scale(.97) }
/* em 320 o tempo, o "/ total" e os três botões não cabem lado a lado
   (medido: "19s / 20s" entrava embaixo do −30): o tempo desce um degrau e
   o total sai — o que importa no meio da série é quanto falta */
@media (max-width: 359px){
  .fs-rest-bloco-v{ font-size:var(--au-fs-t-s) }
  .fs-rest-bloco-v small{ display:none }
  /* "DESCANSO" (PT) cortava em "DESCA…" com o espaçamento de .18em */
  .fs-rest-bloco-k{ letter-spacing:.06em }
  .fs-rest-acoes button{ padding:0 7px }
}

/* [dono 07/10] o bloco FEITO aberto pra corrigir: "✓ Feito" em verde (verde
   = concluído) e o "Fechar" do lado — botão irmão, 44px (.au-link-mono) */
.fs-bloco-feito{ display:flex; justify-content:space-between; align-items:center; margin:-10px 0 2px 2px }
.fs-bloco-feito-k{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.18em; text-transform:uppercase; color:var(--au-green) }
.fs-bloco-fechar{ color:var(--au-text-soft); transition:transform 120ms cubic-bezier(.22,1,.36,1) }
.fs-bloco-fechar:active{ transform:scale(.97) }

/* [dono 07/10] A ESCALA DO ESFORÇO numa RAMPA que sobe (0–10) — o desenho é
   nosso. Um controle só (`role=slider`, 96px de altura, a largura da
   coluna): toca ou arrasta. Os degraus acendem em luminância até o valor; o
   escolhido é o branco. [10/10] as palavras são as da CR-10 de Foster e a
   rampa é de DUAS telas (o fim do treino e o recibo do treino sem esforço —
   esforco.js, no core): as classes deixaram o prefixo `fs-` do executor. */
.esforco-num{ font:100 var(--au-fs-hero-xl)/1 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.esforco-lbl{ font:400 var(--au-fs-xl) 'Sora',sans-serif; color:var(--au-text-soft); margin-top:8px; min-height:1.4em }
.esforco{
  display:flex; align-items:flex-end; gap:5px; height:96px; margin-top:26px; padding:0 2px;
  cursor:pointer; touch-action:none; outline:none; border-radius:8px;
}
.esforco:focus-visible{ box-shadow:0 0 0 2px var(--au-text-soft) }
.esforco-degrau{ flex:1; border-radius:4px 4px 2px 2px; background:rgba(255,255,255,.10) }
.esforco-degrau.ate{ background:rgba(245,243,238,.42) }
.esforco-degrau.sel{ background:var(--au-text) }
.esforco-n{ display:flex; gap:5px; padding:0 2px; margin-top:6px }
.esforco-n span{ flex:1; text-align:center; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; color:var(--au-faint) }
.esforco-pontas{ display:flex; justify-content:space-between; margin-top:6px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--au-faint) }
/* [dono 15/10] A PRONTIDÃO: "How are you feeling today?" ao tocar em Start
   (js/core/prontidao.js; mockup prontidao-antes-do-treino.html). A roupa é a
   das folhas (.modal-backdrop/.modal); a camada sobe acima da prévia e do
   executor (z 4000). Cinco linhas de 60px, toda em P&B: o toque afunda a
   linha e acende o número — a resposta é o retorno, não um botão a mais. */
#prontidaoRoot .modal-backdrop{ z-index:4600 }
.prontidao-cab{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px }
.prontidao-cab .au-iconbtn{ margin:-6px -12px 0 0; flex:none }
.prontidao-titulo{ font:300 var(--au-fs-xl)/1.25 'Sora',sans-serif; color:var(--au-text); margin:6px 0 4px }
.prontidao-sub{ font:300 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted); margin:0 0 12px }
.prontidao-op{
  width:100%; display:flex; align-items:center; gap:14px; min-height:60px; padding:0 4px; box-sizing:border-box;
  background:none; border:none; border-top:1px solid var(--au-line-soft); border-radius:0; color:var(--au-text);
  text-align:left; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease);
}
.prontidao-op:last-child{ border-bottom:1px solid var(--au-line-soft) }
.prontidao-op:active{ transform:scale(.97); background:rgba(255,255,255,.06); border-radius:12px }
.prontidao-op:active .prontidao-n{ background:var(--au-text); color:var(--au-on-light); border-color:var(--au-text) }
.prontidao-op:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:-2px; border-radius:12px }
.prontidao-n{ width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,.16); display:grid; place-items:center; flex:none; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; color:var(--au-muted) }
.prontidao-txt{ flex:1; min-width:0 }
.prontidao-t{ display:block; font:300 var(--au-fs-l) 'Sora',sans-serif }
.prontidao-s{ display:block; font:300 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted); margin-top:1px }
.prontidao-go{ flex:none; font:300 1.25rem 'Sora',sans-serif; color:var(--au-faint) }
.prontidao-nota{ font:300 var(--au-fs-xs)/1.5 'Sora',sans-serif; color:var(--au-faint); margin-top:12px; text-align:center }
@media (prefers-reduced-motion: reduce){ .prontidao-op:active{ transform:none } }
/* a linha "Before" do recibo (receipt-esforco.js, os dois recibos) */
.rc-prontidao{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; margin-top:4px }
.rc-prontidao-v{ font:300 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text) }
.rc-prontidao-v.nao{ color:var(--au-faint) }

/* a nota pro coach: as capas (as MESMAS do executor, `fsCapaBotaoHTML`) e o campo */
.fs-nota-k{ display:block; margin-top:30px }
.fs-nota-capas{ display:flex; gap:8px; margin-top:10px; overflow-x:auto; padding:2px; -webkit-overflow-scrolling:touch }
.fs-nota-capas [aria-pressed="true"]{ border:1.5px solid var(--au-text) !important }
.fs-nota-capas button:active{ transform:scale(.97) }
.fs-nota-sobre{ font:300 var(--au-fs-xs)/1.45 'Sora',sans-serif; color:var(--au-faint); margin-top:8px }
.fs-nota-sobre b{ font-weight:400; color:var(--au-text-soft) }
.fs-nota-campo{
  display:block; width:100%; box-sizing:border-box; margin-top:8px; min-height:72px; resize:none;
  padding:12px 14px; border:1px solid var(--au-line); border-radius:14px; background:none;
  font:300 var(--au-fs-xl)/1.45 'Sora',sans-serif; color:var(--au-text); outline:none;
}
.fs-nota-campo:focus{ border-color:var(--au-text-soft) }
.fs-nota-campo::placeholder{ color:var(--au-faint) }
.au-btn.fs-salvar-off{ opacity:.35; box-shadow:none; cursor:not-allowed }

/* [dono 07/10] REORDENAR (player-reordenar.js): o link no começo da lista e
   a folha com os cartões de uma linha. A supersérie é UM cartão; o feito e o
   começado ficam apagados e sem controles. Erguido = o cartão no dedo. */
/* [dono 16/10 · lições do STNDRD] o Swap (player-troca.js): a pílula no
   cabeçalho do exercício e a folha das variações (a moldura é a do reordenar) */
/* [dono 18/10] o lápis da nota (player-presencial.js) veste a mesma roupa do Swap */
.fs-troca-abrir, .fs-nota-lapis{ flex:none; width:44px; height:44px; padding:0; justify-content:center; border-radius:22px; border:1px solid var(--au-line); background:transparent; color:var(--au-text-soft); font:300 var(--au-fs-s) 'Sora',sans-serif; display:inline-flex; align-items:center; gap:6px; cursor:pointer; box-shadow:none; transition:transform 120ms cubic-bezier(.22,1,.36,1) }
.fs-troca-abrir:active, .fs-nota-lapis:active{ transform:scale(.97) }
.fs-troca-sub{ margin:0 0 14px }
.fs-troca-lista{ list-style:none; margin:0; padding:0 }
.fs-troca-op{ width:100%; min-height:60px; display:flex; align-items:center; gap:12px; padding:8px 2px; background:none; border:none; border-bottom:1px solid var(--au-line-soft); color:var(--au-text-soft); text-align:left; cursor:pointer; transition:transform 120ms cubic-bezier(.22,1,.36,1) }
.fs-troca-op:active{ transform:scale(.97) }
.fs-troca-op.agora{ cursor:default }
.fs-troca-txt{ flex:1; min-width:0; display:grid }
/* o nome quebra em duas linhas em vez de virar "Chest-Supported Seated C…" (fiscal, 16/10): é a escolha que ele está fazendo */
.fs-troca-nome{ font:300 var(--au-fs-l)/1.3 'Sora',sans-serif; color:var(--au-text); overflow-wrap:anywhere }
.fs-troca-det{ font:300 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.fs-troca-agora{ flex:none; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; color:var(--au-gold) }
.fs-troca-k{ flex:none; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.1em; color:var(--au-muted) }
@media (prefers-reduced-motion: reduce){ .fs-troca-abrir, .fs-nota-lapis, .fs-troca-op{ transition:none } }
.fs-ro-link{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin:14px 0 -12px }
.fs-ro-abrir{ color:var(--au-text-soft); transition:transform 120ms cubic-bezier(.22,1,.36,1) }
.fs-ro-abrir:active{ transform:scale(.97) }
.fs-ro{ position:fixed; inset:0; z-index:4300; background:var(--au-surface); font-family:'Sora',system-ui,sans-serif; overflow-y:auto; -webkit-overflow-scrolling:touch }
.fs-ro-col{ max-width:460px; min-height:100%; margin:0 auto; box-sizing:border-box; display:flex; flex-direction:column; padding:calc(env(safe-area-inset-top, 0px) + 18px) 24px 34px }
.fs-ro-tit{ margin:12px 0 4px; font:400 var(--au-fs-t) 'Sora',sans-serif; color:var(--au-text) }
.fs-ro-sub{ margin:0 0 14px }
.fs-ro-lista{ list-style:none; margin:0; padding:0 }
.fs-ro-cartao{
  display:flex; align-items:center; gap:4px; min-height:64px; margin:8px 0; padding:6px 6px 6px 14px;
  border:1px solid var(--au-line); border-radius:14px; background:var(--au-surface-2);
  transition:transform 160ms cubic-bezier(.22,1,.36,1);
}
.fs-ro-cartao.trava{ background:none; border-color:var(--au-line-soft) }
.fs-ro-cartao.trava .fs-ro-nome{ color:var(--au-muted) }
.fs-ro-cartao.erguido{ transform:scale(1.02); box-shadow:0 18px 40px -14px rgba(0,0,0,.9), 0 0 0 1px var(--au-text-soft); position:relative; z-index:2 }
.fs-ro-txt{ flex:1; min-width:0; padding:6px 0 }
.fs-ro-nome{ display:block; font:300 var(--au-fs-l)/1.35 'Sora',sans-serif; color:var(--au-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.fs-ro-nome em{ font-style:normal; font:400 var(--au-fs-mono) 'Space Mono',monospace; color:var(--au-muted); margin-right:6px }
.fs-ro-k{ display:block; margin-top:3px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--au-faint) }
.fs-ro-k.fs-ro-feito{ color:var(--au-green) }
.fs-ro-bt{
  flex:none; width:var(--au-h-tap); height:var(--au-h-tap); display:grid; place-items:center;
  border:none; background:none; border-radius:10px; cursor:pointer; padding:0;
  font:400 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text-soft); box-shadow:none;
  transition:transform 120ms cubic-bezier(.22,1,.36,1);
}
.fs-ro-bt:active{ transform:scale(.97) }
.fs-ro-bt:disabled{ opacity:.25; cursor:default }
.fs-ro-alca{ touch-action:none; color:var(--au-muted); letter-spacing:-2px; cursor:grab }
.fs-ro-nota{ margin:14px 0 0; font:300 var(--au-fs-xs)/1.5 'Sora',sans-serif; color:var(--au-faint) }
@media (prefers-reduced-motion: reduce){ .fs-ro-cartao{ transition:none } .fs-ro-cartao.erguido{ transform:none } }

/* [dono 08/10] o cartão "Phone calendar" no pé da agenda do coach
   (agenda-calendario.js): separado da lista por uma linha, como seção */
.ag-cal{ margin-top:28px; padding-top:18px; border-top:1px solid var(--au-line-soft); max-width:520px }
/* [08/10] "Block my busy times": o campo do link (17px — o iPhone não dá
   zoom) e o estado com o ponto (verde = lendo; cobre = falhou) */
.ag-cal-campo{
  display:block; width:100%; box-sizing:border-box; min-height:48px; padding:0 14px;
  border:1px solid var(--au-line); border-radius:12px; background:none; outline:none;
  font:300 var(--au-fs-xl) 'Sora',sans-serif; color:var(--au-text);
}
.ag-cal-campo:focus{ border-color:var(--au-text-soft) }
.ag-cal-campo::placeholder{ color:var(--au-faint) }
.ag-cal-estado{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border:1px solid var(--au-line); border-radius:14px }
.ag-cal-ponto{ flex:none; width:8px; height:8px; border-radius:50%; background:var(--au-green); margin-top:7px }
.ag-cal-ponto.cobre{ background:var(--au-orange) }
.ag-cal-t{ font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text) }
.ag-cal a.au-ghost{ display:flex; align-items:center; justify-content:center; text-decoration:none; box-sizing:border-box }

/* ── [dono 19/10, "Vamos de 3, implemente" — mockups/agenda-cinco-caras.html (A)
   + mockups/agenda-sessoes-juntas.html (3)] A AGENDA DO ATLETA
   (agenda-atleta.js): o cabeçalho da Home/My Body, "Your sessions" em linhas
   como o Calendário do iPhone e o "Book" com a fita sempre aberta. Ouro só
   no "agora" (a barra e o "Next" da próxima) e nos pontos dos dias com
   sessão sua; cobre só na que espera pagamento; o único sólido possível é
   o "Pay now" (só nesse estado). ── */
.ags-cab{ display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin-top:4px }
.ags-titulo{ margin:8px 0 0; font:200 var(--au-fs-t) 'Sora',sans-serif; line-height:1.2; color:var(--au-text) }
.ags-cred{ flex:0 1 auto; min-width:0 }
.ags-cred .cred-kicker{ flex-direction:column; align-items:flex-end; justify-content:flex-end; gap:0; min-height:0 }
.ags-cred .cred-kicker .au-k2{ justify-content:flex-end }
.ags-cred .au-link-mono{ min-height:var(--au-h-tap) }
.ags-k{ margin:22px 0 4px }
.ags-vazio{ margin:8px 0 0; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.ags-nota{ margin:10px 0 0; font:400 var(--au-fs-xs)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.ags-ouro{ color:var(--au-gold) }
/* uma sessão = uma linha (o dia num bloco, a barra, o horário) */
.ags-ses{ display:flex; align-items:center; gap:14px; width:100%; min-height:64px; padding:0; margin:0; background:none; border:0; border-bottom:1px solid var(--au-line-soft); border-radius:0; color:inherit; font:inherit; text-align:left; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:transform var(--au-dur-press) var(--au-ease) }
.ags-ses:active{ transform:scale(.97) }
.ags-ses:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:2px }
.ags-dia{ flex:none; width:48px; text-align:center }
.ags-dia b{ display:block; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.1em; color:var(--au-muted) }
.ags-dia em{ display:block; font:200 var(--au-fs-t-m)/1.1 'Sora',sans-serif; font-style:normal; color:var(--au-text); font-variant-numeric:tabular-nums }
.ags-barra{ flex:none; width:2px; align-self:stretch; margin:12px 0; border-radius:1px; background:var(--au-line) }
.ags-ses.is-prox .ags-barra{ background:var(--au-gold) }
.ags-ses.is-espera .ags-barra{ background:var(--au-orange) }
.ags-tx{ flex:1; min-width:0; padding:10px 0 }
.ags-q{ display:block; font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.ags-s{ display:block; margin-top:2px; font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted) }
.ags-seta{ flex:none; width:24px; text-align:center; font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-muted) }
.ags-pagar{ margin-top:12px }
.ags-mais{ display:inline-flex; align-items:center; min-height:var(--au-h-tap); margin-top:4px; padding:0 }
/* a troca em andamento */
.ags-troca{ display:flex; align-items:center; gap:10px; margin-top:16px; padding:12px 14px; border:1px solid var(--au-line); border-left:2px solid var(--au-orange); border-radius:14px }
.ags-troca-t{ margin-top:3px; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text-soft) }
.ags-troca-b{ flex:none; min-height:var(--au-h-tap); min-width:var(--au-h-tap) }
/* a fita: 14 dias, 7 por vez, desliza pra semana seguinte */
.ags-fita{ display:flex; gap:4px; margin-top:10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch }
.ags-fita::-webkit-scrollbar{ display:none }
.ags-chipdia{ flex:0 0 calc((100% - 24px) / 7); min-width:var(--au-h-tap); min-height:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:8px 0; margin:0; background:none; border:1px solid transparent; border-radius:14px; box-sizing:border-box; cursor:pointer; color:inherit; font:inherit; transition:transform var(--au-dur-press) var(--au-ease) }
.ags-chipdia.is-semana{ scroll-snap-align:start }
.ags-chipdia:active{ transform:scale(.97) }
.ags-chipdia:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:-2px }
.ags-chipdia b{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.1em; color:var(--au-muted) }
.ags-chipdia em{ font:300 var(--au-fs-t-s) 'Sora',sans-serif; font-style:normal; color:var(--au-text-soft); font-variant-numeric:tabular-nums }
.ags-chipdia i{ width:5px; height:5px; border-radius:50% }
.ags-chipdia i.is-livre{ background:var(--au-faint) }
.ags-chipdia i.is-tua{ background:var(--au-gold) }
.ags-chipdia.is-on{ border-color:var(--au-text-soft); background:var(--au-surface-2) }
.ags-chipdia.is-on em{ color:var(--au-text) }
/* os horários do dia, 3 por linha */
.ags-horas{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px }
.ags-hora{ min-height:48px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:4px; margin:0; background:none; border:1px solid var(--au-line); border-radius:14px; color:var(--au-text); font:300 var(--au-fs-xl) 'Sora',sans-serif; font-variant-numeric:tabular-nums; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.ags-hora:active{ transform:scale(.97) }
.ags-hora:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:2px }
.ags-hora.is-tua{ border-color:var(--au-text-soft); background:var(--au-surface-2) }
.ags-hora small{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-gold-kicker) }
@media (hover:hover) and (pointer:fine){
  .ags-ses:hover .ags-seta{ color:var(--au-text) }
  .ags-hora:hover, .ags-chipdia:hover{ border-color:var(--au-text-soft) }
}
/* a folha da sessão */
.ags-folha{ text-align:center }
.ags-folha-t{ margin:8px 0 0; font:200 var(--au-fs-t-l) 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.ags-folha-s{ margin-top:4px; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-muted) }
.ags-folha-e{ margin-top:10px }
.ags-folha-acoes{ display:flex; flex-direction:column; gap:10px; margin-top:24px }
.ags-folha-cancelar{ display:flex; align-items:center; justify-content:center; min-height:var(--au-h-tap); color:var(--au-orange) }
.ags-folha-fechar{ display:inline-flex; align-items:center; justify-content:center; min-height:var(--au-h-tap); margin-top:4px; padding:0 16px }

/* [dono 07/10] com o executor aberto o fundo não rola (`fsTravarFundo`) */
html.fs-fundo-travado, html.fs-fundo-travado body{ overflow:hidden; overscroll-behavior:none }


/* ── A RÉGUA DE OURO: "VOCÊ ESTÁ AQUI" [dono 2026-09-06, alternativa E] ──
   O ouro deixou de ser MOLDURA no executor. Antes havia cinco usos na mesma
   tela (relógio, cartão do exercício, linha do round, número do mapa e o
   avatar) e nenhum dizia sozinho "é aqui que você está" — o dono viu no
   iPhone: "as duas seleções em amarelo estão chamando atenção".
   Agora o "agora" é UM sinal, repetido onde ele vale: uma régua vertical de
   3px à esquerda — a mesma linguagem da barra de descanso, que já era 3px
   em ouro. Ela marca o round da vez, a linha do exercício em cena no mapa e
   o chip aceso da supersérie. O resto se destaca por LUZ (fundo mais claro,
   texto branco), nunca por cor.
   `--fs-agora-x` é onde a régua encosta: 0 dentro de um cartão (a moldura
   do deslize recorta), negativo numa linha sem cartão (o mapa). */
.fs-agora{ position:relative }
.fs-agora::before{
  content:""; position:absolute; left:var(--fs-agora-x, 0); top:8px; bottom:8px;
  width:3px; border-radius:3px; background:var(--au-gold); pointer-events:none;
}

/* [dono 2026-09-07 · a lista do treino] A RÉGUA SUBIU PRO BLOCO. Com todos
   os exercícios na tela, o "agora" que importa primeiro é QUAL EXERCÍCIO —
   a régua do bloco responde isso de uma olhada, e a linha da vez continua
   se destacando por LUZ (fundo mais claro e o cartão com borda), sem uma
   segunda régua ao lado da primeira. Ela recua 14px pra fora do texto, no
   vão do padding de 28px da coluna do player. */
.fs-bloco-agora{ position:relative }
.fs-bloco-agora::before{
  /* [foto, 07/09] Ela marca o CABEÇALHO do bloco, não o bloco inteiro: em
     390px um exercício de 4 rounds tem ~900px de altura, e uma régua dessa
     altura vira uma faixa de ouro no lado da tela — o oposto de "~3 usos
     por tela". Do topo do nome ao pé da capa é o que aponta o exercício. */
  content:""; position:absolute; left:-14px; top:16px; height:52px;
  width:3px; border-radius:3px; background:var(--au-gold); pointer-events:none;
}

/* ── O VÍDEO DO EXERCÍCIO NO EXECUTOR [dono 2026-09-06] ────────────────
   "Sem aparecer o botão de play e voltar ou avançar 10 segundos, pois
   esses botões deixam a tela mais escura e fica difícil de ver."

   O `controls` nativo saiu; o que sobra por cima da imagem é UMA camada
   invisível que ouve o toque, um sinal que aparece e some, e uma barra de
   3px. [junção 06/09] A CAIXA COM PROPORÇÃO MORREU junto com ela: a camada
   virou TELA CHEIA (`object-fit:cover`; desde 01/10 o vídeo é um QUADRO inteiro
   com respiro dentro dela, ver `fsQuadroStyle`), decisão posterior do dono na outra
   worktree — sem caixa não há proporção a reservar, e o pulo deitado→
   vertical deixou de existir por construção.

   O ALVO DA BARRA TEM 44px de altura — os 3px são só o que se VÊ. É a
   mesma solução do ± do executor, que ganhou 44 com o quadrado menor
   dentro; a régua do contrato é sobre o DEDO, não sobre a tinta. */
.fsv-toque{ position:absolute; inset:0; cursor:pointer; background:none; border:none }
.fsv-sinal{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.94);
  min-width:76px; height:76px; padding:0 18px; border-radius:38px;
  background:rgba(11,10,9,.55); color:var(--au-text);
  display:grid; place-items:center; font:400 var(--au-fs-l) 'Sora',sans-serif;
  opacity:0; pointer-events:none;
  transition:opacity 180ms var(--au-ease), transform 180ms var(--au-ease);
}
.fsv-sinal.on{ opacity:1; transform:translate(-50%,-50%) scale(1) }
/* [dono 2026-10-02, opção A de mockups/executor-video-ficha.html] A CAMADA
   É UMA TELA QUE ROLA: o vídeo de borda a borda no topo, a ficha embaixo.
   A linha de progresso (e a barra de procurar que ela era) morreu a pedido
   do dono. A coluna para em 480px no Mac; no iPhone é a tela inteira. */
.fsv-rolo{ position:absolute; inset:0; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; overscroll-behavior:contain }
.fsv-col{ position:relative; max-width:480px; margin:0 auto; padding-bottom:calc(env(safe-area-inset-bottom,0px) + 40px) }
.fsv-topo{ position:relative; width:100%; max-height:calc(100vh - 150px); max-height:calc(100dvh - 150px); overflow:hidden; background:var(--au-surface) }
.fsv-fade-t{ position:absolute; left:0; right:0; top:0; height:130px; background:linear-gradient(rgba(11,10,9,.55),transparent); pointer-events:none }
.fsv-fade-b{ position:absolute; left:0; right:0; bottom:-1px; height:240px; background:linear-gradient(transparent,var(--au-bg) 78%); pointer-events:none }
.fsv-ficha{ position:relative; margin-top:-84px; padding:0 20px }
.fsv-tit{ display:flex; align-items:center; justify-content:space-between; gap:12px }
.fsv-nome{ margin:0; font:500 var(--au-fs-t) 'Sora',sans-serif; line-height:1.15; color:var(--au-text); min-width:0; overflow-wrap:anywhere }
.fsv-hist-link{ flex:none; color:var(--au-muted) }
.fsv-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px }
.fsv-hoje{ display:flex; align-items:center; gap:12px; margin-top:16px; padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.035) }
.fsv-hoje-k{ font:400 var(--au-fs-mono-m) 'Space Mono',monospace; letter-spacing:.22em; text-transform:uppercase; color:var(--au-gold) }
.fsv-hoje b{ font:500 var(--au-fs-xl) 'Sora',sans-serif; color:var(--au-text) }
.fsv-hoje-r{ margin-left:auto; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted); white-space:nowrap }
.fsv-sec{ margin-top:24px }
.fsv-sec > .au-kicker{ margin-bottom:12px }
.fsv-equip{ display:flex; align-items:center; gap:14px }
.fsv-equip-ic{ width:72px; height:72px; flex:none; border-radius:16px; background:rgba(255,255,255,.05); display:grid; place-items:center; color:var(--au-text-soft) }
.fsv-equip-l{ font:500 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text) }
.fsv-equip-s{ font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted); margin-top:2px }
/* [16/10] a prévia: o equipamento do treino inteiro (player-previa.js ·
   previaEquipamentoHTML). Só leitura, P&B, sem fill — o fill sólido da tela
   é o "Iniciar treino". */
.previa-equip{ margin-top:22px }
.previa-equip-lista{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px }
.previa-equip-item{ display:flex; align-items:center; gap:8px; min-height:44px; padding:0 14px 0 8px; border:1px solid var(--au-line); border-radius:100px }
.previa-equip-ic{ width:30px; height:30px; flex:none; display:grid; place-items:center; color:var(--au-text-soft) }
.previa-equip-l{ font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text) }
.previa-equip-so{ display:flex; align-items:center; gap:10px; min-height:44px; margin-top:6px; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text-soft) }
.fsv-alvos{ display:flex; flex-wrap:wrap; gap:12px }
.fsv-alvo{ width:96px }
.fsv-alvo-ic{ width:96px; height:108px; border-radius:16px; background:rgba(255,255,255,.04); display:grid; place-items:center; overflow:hidden }
.fsv-alvo-ic svg{ width:78px; height:92px; overflow:hidden }
.fsv-alvo-corpo{ fill:rgba(255,255,255,.07) }
.fsv-alvo--p .fsv-alvo-musc{ fill:var(--au-gold) }
.fsv-alvo--s .fsv-alvo-musc{ fill:rgba(201,162,74,.5) }
.fsv-alvo-l{ font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-text); margin-top:8px }
.fsv-alvo-s{ font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.fsv-recado > div{ margin-top:0 }
.fsv-hist-l{ display:flex; justify-content:space-between; gap:12px; padding:12px 0; border-top:1px solid var(--au-line); font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text-soft) }
.fsv-vazio{ margin:0; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-muted) }
.fsv-angulos{ position:absolute; right:max(12px, calc(50% - 228px)); top:calc(env(safe-area-inset-top,0px) + 12px); transition:opacity 160ms var(--au-ease) }
.fsv-angulos.fsv-sumir{ opacity:0; pointer-events:none !important }
/* a barra que acende quando o vídeo sai de vista: nome + prescrição;
   tocar volta ao vídeo. Opacidade só — não desliza (frequência alta). */
.fsv-compacto{
  position:absolute; left:0; right:0; top:0; z-index:1; border:0; cursor:pointer; text-align:left;
  padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 12px max(72px, calc(50% - 168px));
  min-height:calc(env(safe-area-inset-top,0px) + 68px);
  background:var(--au-bg); border-bottom:1px solid var(--au-line);
  display:flex; flex-direction:column; justify-content:center; gap:4px;
  opacity:0; pointer-events:none;
  /* [dono 2026-10-04] SOME NA HORA, ACENDE COM FADE. Num peteleco rápido pra
     cima o vídeo já tinha voltado e a barra ainda levava 160ms apagando por
     cima do topo dele. A transição mora só no estado `.on`: o CSS usa a
     transição do estado DE CHEGADA, então acender anima e apagar é imediato. */
  transition:none;
}
.fsv-compacto.on{ opacity:1; pointer-events:auto; transition:opacity 160ms var(--au-ease) }
.fsv-compacto-n{ font:500 var(--au-fs-xl) 'Sora',sans-serif; color:var(--au-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fsv-compacto-h{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-muted) }
/* [dono 2026-10-03, o "1" de mockups/executor-video-cartao.html] O VÍDEO É
   UM CARTÃO, não a tela toda. O véu é o treino escurecido (tocar nele
   fecha); o cartão vai de logo abaixo da barra do treino (o `top` vem do JS,
   medido no "Terminar") até o pé, com 8px de folga e cantos de 30px. No Mac
   ele para em 480px, centralizado. A seta de voltar morreu: a saída visível
   é o puxador (44 de alvo, o traço de 38×5 dentro). O véu é o mesmo preto
   quente das outras folhas do app. */
.fsv-veu{ position:absolute; inset:0; background:rgba(5,5,4,.62) }
.fsv-cartao{
  position:absolute; left:8px; right:8px; bottom:calc(env(safe-area-inset-bottom,0px) + 8px);
  top:calc(env(safe-area-inset-top,0px) + 16px);   /* sem a barra do treino por cima (a prévia); com ela, o JS mede */
  border-radius:30px; overflow:hidden; background:var(--au-surface);
  box-shadow:0 0 0 1px var(--au-line), 0 -12px 50px rgba(0,0,0,.6);
}
@media (min-width:520px){
  .fsv-cartao{ left:50%; right:auto; width:480px; margin-left:-240px }
}
.fsv-cartao .fsv-col{ max-width:none; padding-bottom:28px }
/* a barra de rolagem clássica (Mac com "mostrar sempre", Chrome no Windows)
   comia 15px do cartão e o vídeo deixava de ir de borda a borda — medido em
   1440px: vídeo de 465 num cartão de 480. Rola igual, sem a barra. */
/* [dono 2026-10-04] SEM O ELÁSTICO DO iOS DENTRO DO CARTÃO. "Quando eu dou
   um scroll muito rápido para cima, o topo do vídeo fica com uma faixa
   cinza, enquanto o botão de deslizar permanece lá." Medido no Safari do
   Simulador: a rolagem passava do topo (scrollTop −105) e o conteúdo descia,
   mostrando o fundo do cartão acima do vídeo — o tracinho fica, porque mora
   fora da rolagem. `contain` só impede o encadeamento; `none` tira o quique.
   Puxar o cartão pra baixo no topo não depende dele (são os Touch Events de
   `player-video-cartao.js`). */
.fsv-cartao .fsv-rolo{ overscroll-behavior-y:none }
/* [dono 2026-10-05] A ROLAGEM DO CARTÃO É NOSSA (fsVideoLigarRolagem,
   player-video-cartao.js): o Safari não rola nada por conta própria aqui,
   então não há disputa entre a rolagem dele e o puxar pra fechar. A roda
   do Mac não é afetada por `touch-action`. */
.fsv-cartao, .fsv-veu{ touch-action:none }
.fsv-cartao .fsv-rolo{ scrollbar-width:none }
.fsv-cartao .fsv-rolo::-webkit-scrollbar{ display:none }
.fsv-cartao .fsv-topo{ max-height:64vh; max-height:64dvh }
.fsv-cartao .fsv-fade-b{ background:linear-gradient(transparent,var(--au-surface) 78%) }
/* [03/10, medido no Safari do Simulador] A faixa de cima do cartão (0–44px)
   é do PUXADOR, e só dele: com 4 ângulos, dois botões de ângulo caíam
   embaixo do tracinho e o toque neles FECHAVA o vídeo; e a barra compacta
   escrevia o nome por baixo dele. Os dois desceram pra baixo da faixa. */
.fsv-cartao .fsv-compacto{ padding:44px 20px 12px; min-height:96px; background:var(--au-surface) }
.fsv-cartao .fsv-angulos{ right:12px; top:44px }
/* centralizado por MARGEM, nunca por transform: a regra global
   `button:active{transform:scale(.97)}` (aurum.css) trocava o
   `translateX(-50%)` e o tracinho pulava 60px pra direita debaixo do dedo. */
.fsv-puxa{
  pointer-events:auto; position:absolute; top:0; left:50%; margin-left:-60px; z-index:2;
  width:120px; height:44px; border:0; padding:9px 0 0; background:none; cursor:grab;
  display:flex; justify-content:center; touch-action:none;
}
/* `.fsv-cartao` na frente pra VENCER `button:active:not(:disabled)` do
   aurum.css (0,2,1): sem isso o tracinho ainda encolhia 3% no Simulador */
.fsv-cartao .fsv-puxa:active{ transform:none }
/* toque longo no tracinho, no vídeo ou nos ângulos abria a LUPA de seleção
   de texto do iOS (visto segurando o tracinho por 3 s no Simulador) */
.fsv-puxa, .fsv-topo, .fsv-angulos, .fsv-compacto{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none }
.fsv-puxa i{ display:block; width:38px; height:5px; border-radius:3px; background:rgba(245,243,238,.5); transition:background-color 120ms var(--au-ease), transform 120ms var(--au-ease) }
/* o retorno do toque é no PRÓPRIO tracinho: acende e alarga — no dedo
   descendo (pointer-down) e enquanto o cartão é arrastado, venha o arraste
   do tracinho ou do conteúdo */
.fsv-puxa:active i, .fsv-cartao.arrastando .fsv-puxa i{ background:rgba(245,243,238,.9); transform:scaleX(1.2) }
.fsv-cartao.arrastando .fsv-puxa{ cursor:grabbing }
.fsv-puxa:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:-4px; border-radius:12px }
/* a camada de gestos do vídeo é role=button: o `:active` global a
   encolhia a cada toque (invisível, mas mexia no alvo do dedo) */
.fsv-topo .fsv-toque:active{ transform:none }
@media (prefers-reduced-motion: reduce){
  .fsv-puxa i{ transition:background-color 120ms linear }
  .fsv-puxa:active i, .fsv-cartao.arrastando .fsv-puxa i{ transform:none }
}
@media (prefers-reduced-motion: reduce){
  .fsv-sinal{ transition:opacity 120ms linear; transform:translate(-50%,-50%) }
  .fsv-sinal.on{ transform:translate(-50%,-50%) }
}

/* ── A TELA DE PAGAMENTO (19/08/2026 · tela cheia desde 03/09/2026) ────
   Estrutura só; cor e movimento vêm dos tokens do aurum.css, e a entrada
   sobe como as folhas do app de propósito — pagamento que entra diferente
   das demais superfícies parece outro app.

   NÃO HÁ CTA SÓLIDO AQUI, E AGORA NÃO HÁ BOTÃO NENHUM NOSSO. O botão de
   pagar é desenhado pelo STRIPE, dentro do iframe dele — a régua "um fill
   sólido por tela" continua valendo, e quem o gasta é ele. Desde o quadro
   D, o "Cancelar" ghost também saiu: quem fecha é a seta da barra. */
/* AS CAMADAS. A tab bar vive em 220 e os modais em 300 — com o
   `.modal-backdrop` dizendo, por escrito, "acima da tab bar: folha sempre
   cobre a navegação". A folha de pagamento nasceu em 60/61 e ficaria
   ATRÁS da barra de abas: o pagamento com a navegação desenhada por cima.
   Vai pra 320/321, acima também do modal comum — porque ela abre EM CIMA
   da folha de confirmação, que é 300. */
.pg-veu {
  position: fixed; inset: 0; z-index: 320;
  background: rgba(0, 0, 0, .58);
  animation: auFadeIn 260ms var(--au-ease) both;
}
/* ── TELA CHEIA, NÃO MAIS FOLHA (dono 03/09/2026, quadro D) ───────────
   A folha do rodapé morreu junto com o puxador, o kicker, o valor em ouro
   e o "Cancelar" ghost. Motivo medido: o valor aparecia duas vezes (o
   nosso e o do resumo do próprio Stripe), e o formulário dele é LONGO —
   numa folha de 92vh ele rolava dentro de uma tela que também rolava.
   Em tela cheia é uma rolagem só, e a superfície inteira é dele.

   Ela ENTRA subindo, como a folha entrava: é uma apresentação modal, e o
   gesto de "isto veio por cima do que eu estava fazendo" continua certo. */
.pg-tela {
  position: fixed; inset: 0; z-index: 321;
  display: flex; flex-direction: column;
  background: var(--au-bg);
  transform: translateY(100%);
  transition: transform var(--au-dur-sheet) var(--au-ease-sheet);
}
.pg-tela.on { transform: translateY(0); }

/* A BARRA É A ÚNICA CHROME NOSSA: a seta (o Stripe embutido não tem botão
   de sair) e o nome do que se paga. Mono APAGADO, nunca o kicker dourado —
   ouro aqui seria o app assinando uma tela que não é dele. */
.pg-barra {
  flex: none; display: flex; align-items: center; gap: 4px;
  padding: calc(env(safe-area-inset-top, 0px) + 8px) 20px 8px;
  border-bottom: 1px solid var(--au-line-soft);
}
.pg-barra-tit {
  font: 400 var(--au-fs-mono-s) "Space Mono", monospace;
  letter-spacing: .2em; text-transform: uppercase; color: var(--au-muted);
}
/* Uma rolagem só, e ela é a do formulário dele. */
.pg-rolo {
  flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 16px 16px calc(env(safe-area-inset-bottom, 0px) + 24px);
}
/* O que o Stripe não tem como saber: a data da sessão, a renovação do
   plano. Rola junto com o formulário, como o resumo dele faria. */
.pg-ctx { margin: 0 0 14px; font-size: var(--au-fs-xs); color: var(--au-muted); }
/* O iframe do Stripe cresce sozinho; a altura mínima evita o salto de
   layout entre a tela subir e ele terminar de se desenhar. Em tela cheia
   ela subiu de 260 pra 420: o formulário dele tem e-mail, cartão, validade,
   CVC, nome e o botão de pagar — reservar meia folha fazia a chegada dele
   empurrar a tela inteira. */
/* [23/09 · revisão jurídica] A LINHA DOS 14 DIAS, acima dos campos do
   cartão. Ela usa o interruptor canônico (`.au-switch-row`) — nenhum
   desenho novo pra um gesto que o app já tem —, e o que muda aqui é só o
   espaço em volta: a linha da Conta e a das Fotos vivem em listas, esta
   vive sozinha antes de um bloco de terceiro. */
.pg-14d { margin: 0 0 18px; }
.pg-14d .au-switch-row { margin-top: 0; }

.pg-mount { min-height: 420px; }

/* ── A ESPERA DE ~3s (dono 20/08/2026 · refeita 03/09/2026) ───────────
   Enquanto o Stripe não chega, a área reservada precisa DIZER que está
   vindo. A 1ª versão era um esqueleto dos campos — e o dono mediu com o
   dedo: "por alguns segundos não existe nenhum tipo de ação". O esqueleto
   era `--au-line` (7% de branco) pulsando entre 40% e 73% de opacidade:
   sobre a tela cheia preta, invisível. Agora: o anel canônico girando
   (`.au-anel`, aurum.css — só transform) e a frase em texto claro,
   centrados na área que o bloco do Stripe vai ocupar, no mesmo lugar e
   do mesmo tamanho — a troca não empurra nada. */
.pg-mount-esperando { display: flex; flex-direction: column; justify-content: center; }
.pg-espera {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding: 48px 12px; text-align: center;
}
.pg-espera-tit { font-size: var(--au-fs-l); color: var(--au-text); }
.pg-espera-sub { font-size: var(--au-fs-xs); color: var(--au-muted); }

@media (prefers-reduced-motion: reduce) {
  .pg-tela { transition: opacity 200ms linear; transform: none; opacity: 0; }
  .pg-tela.on { opacity: 1; }
  .pg-veu { animation: none; }
}

/* ═══ A ABA DO CICLO (atleta) — "onde eu estou" ═══════════════════════════
   [dono 2026-09-09 · forma A de mockups/goal-vira-ciclo.html]
   Classes da tela que substituiu as variantes do GOAL. Nenhuma fonte ou
   altura de botão vive inline lá (contrato visual, 11/08): tudo aqui, com os
   tokens da escala. O ouro aparece TRÊS vezes na tela e todas estão neste
   bloco: a semana atual na fita (o "agora"), o PR (mérito) e a porta
   "Trocar". O percentual da carga é NEUTRO de propósito — cobre é a cor de
   atenção/lesão nesta casa, e pintar a carga de cobre seria o app dando um
   diagnóstico que a literatura não sustenta (31/08). */

.gc-k { font: 400 var(--au-fs-mono-s) 'Space Mono', monospace; letter-spacing: .22em;
        text-transform: uppercase; color: var(--au-faint) }

/* a primeira linha: o objetivo */
.gc-obj { display: flex; align-items: flex-start; gap: 12px;
          padding-bottom: 16px; border-bottom: 1px solid var(--au-line) }
.gc-obj-col { flex: 1; min-width: 0 }
.gc-obj-n { font: 400 var(--au-fs-xl)/1.35 'Sora', sans-serif; color: var(--au-text); margin-top: 6px }
.gc-obj-ed { flex: none; color: var(--au-gold) }

/* o herói */
.gc-hero-k { margin-top: 22px }
.gc-hero { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; white-space: nowrap }
.gc-hero-n { line-height: 1 }
.gc-hero-u { font: 400 var(--au-fs-m)/1.3 'Sora', sans-serif; color: var(--au-muted) }
/* [dono 17/10] o herói em PALAVRAS ("Easy week") e a posição numa linha só */
.gc-estado { font: 300 var(--au-fs-t-xl)/1.1 'Sora', sans-serif; color: var(--au-text);
             letter-spacing: -.01em; margin-top: 8px }
.gc-estado-s { font: 400 var(--au-fs-m) 'Sora', sans-serif; color: var(--au-muted); margin-top: 6px }
.gc-estado-s b { font-weight: 400; color: var(--au-text) }

/* a FITA das semanas (02/10, forma B) — a ALTURA vem do JS (a meta da
   semana, ou o desenho do padrão sem meta), a COR diz se já passou. Semanas
   agrupadas por bloco (`.gc-fita-b`), com respiro entre os blocos; a linha de
   base ancora as barras. */
.gc-fita { display: flex; align-items: flex-end; gap: 7px; height: 44px; margin-top: 20px;
           border-bottom: 1px solid var(--au-line) }
.gc-fita-b { flex: 1; display: flex; align-items: flex-end; gap: 2px; height: 100% }
.gc-fita i { flex: 1; min-width: 2px; border-radius: 2px 2px 1px 1px; background: rgba(255,255,255,.15) }
.gc-fita i.gc-w-dl { background: rgba(255,255,255,.08) }
.gc-fita i.gc-w-done { background: rgba(255,255,255,.42) }
.gc-fita i.gc-w-dl.gc-w-done { background: rgba(255,255,255,.24) }
.gc-fita i.gc-w-now { background: var(--au-gold) }
.gc-fita-txt { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px;
               font: 400 var(--au-fs-mono-xs) 'Space Mono', monospace; letter-spacing: .16em;
               text-transform: uppercase; color: var(--au-faint) }

/* os blocos */
.gc-card { border-top: 1px solid var(--au-line); margin-top: 22px; padding-top: 16px }
.gc-l { font: 400 var(--au-fs-s)/1.55 'Sora', sans-serif; color: var(--au-muted);
        margin: 4px 0 0; max-width: 300px }
.gc-vazio { font: 400 var(--au-fs-s)/1.6 'Sora', sans-serif; color: var(--au-muted);
            margin: 10px 0 0; max-width: 300px }
.gc-nota { font: 400 var(--au-fs-xs)/1.5 'Sora', sans-serif; color: var(--au-faint); margin: 10px 0 0 }

/* [dono 17/10] os QUATRO INDICADORES da semana, em grade 2×2. Valor em Sora
   leve, rótulo em mono; o verde das bolinhas é só o "concluído" (régua da
   casa). Texto escalável: a grade quebra pra uma coluna se não couber. */
.gc-inds { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 22px 18px; margin-top: 16px }
.gc-ind-v { font: 200 var(--au-fs-t-l)/1 'Sora', sans-serif; color: var(--au-text);
            font-variant-numeric: tabular-nums; letter-spacing: -.01em }
.gc-ind-v small { font: 400 var(--au-fs-m) 'Sora', sans-serif; color: var(--au-muted); letter-spacing: 0 }
.gc-ind-v-txt { font-size: var(--au-fs-t); font-weight: 300; padding-top: 6px }
.gc-ind-l { font: 400 var(--au-fs-mono-xs) 'Space Mono', monospace; letter-spacing: .16em;
            text-transform: uppercase; color: var(--au-faint); margin-top: 8px }
.gc-ind-d { font: 400 var(--au-fs-xs) 'Sora', sans-serif; color: var(--au-muted); margin-top: 3px }
.gc-pontos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px }
.gc-pontos i { width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box;
               border: 1px solid rgba(255,255,255,.3) }
.gc-pontos i.gc-ponto-ok { background: var(--au-green); border-color: var(--au-green) }
.gc-frase { font: 400 var(--au-fs-xs)/1.5 'Sora', sans-serif; color: var(--au-muted);
            margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--au-line-soft) }
.gc-frase b { font-weight: 400; color: var(--au-text) }

/* "o que mudou" */
.gc-mud { display: flex; align-items: center; gap: 11px; min-height: var(--au-h-tap);
          font-size: var(--au-fs-s); color: var(--au-text-soft) }
.gc-mud-t { flex: none; font: 400 var(--au-fs-mono) 'Space Mono', monospace;
            letter-spacing: .14em; color: var(--au-faint) }
.gc-mud-pr { color: var(--au-gold) }
.gc-mud-f { flex: 1; min-width: 0 }
.gc-mud-q { flex: none; margin-left: auto; font-size: var(--au-fs-xs); color: var(--au-muted);
            font-variant-numeric: tabular-nums }
.gc-porta { display: block; width: 100%; text-align: center; margin-top: 6px }

/* [dono 07/10 · faixas, fatia 2] ATÉ A FALHA: a caixa das reps diz MAX. Na
   letra do número ("MAX" a 24px) não cabia — saía "M…": desce pra ~60%. */
#fsPlayerRoot .fs-max{ display:block; font-size:.6em; letter-spacing:.06em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* (é ELE quem corta, com o texto dentro: assim a régua TEXTO CORTADO do fiscal o enxerga se um dia não couber) */

/* ── [dono 17/10 · "implemente" — mockups/peso-grafico-navegavel.html v4]
   BODY › PESO: a tela só diz o peso. O gráfico se arrasta
   (body-peso-grafico.js) e "Log weight" abre a folha (body-peso-folha.js).
   Ouro nenhum: perder peso não é mérito pra todo atleta. ── */
/* `.pushed-screen.peso-tela`: o `.pushed-screen` do manikin.css carrega DEPOIS
   desta folha e trocava o recuo de baixo — o CTA nascia atrás da barra de abas */
.pushed-screen.peso-tela{ padding:calc(env(safe-area-inset-top, 0px) + 14px) 22px calc(var(--au-h-nav) + 16px + env(safe-area-inset-bottom)); background:radial-gradient(100% 55% at 20% 8%, var(--au-surface-2), var(--au-bg) 62%); display:flex; flex-direction:column; box-sizing:border-box }
/* nada encolhe: o gráfico só tem filhos absolutos (altura de conteúdo 0) e,
   numa tela mais baixa (o Safari do iPhone, com a barra), a coluna flex o
   espremia — os meses e o "Recent" subiam por cima dele. Faltou altura, rola. */
.peso-tela > *{ flex-shrink:0 }
.peso-topo{ display:flex; align-items:center; justify-content:space-between; gap:12px }
.peso-topo-t{ font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text-soft) }
.peso-topo-vao{ width:44px }
/* altura FIXA: com o dedo no gráfico a linha de baixo troca de texto, e nada pode pular */
.peso-num{ margin-top:10px; height:96px }
.peso-big{ display:flex; align-items:baseline; gap:8px }
.peso-big b{ font:200 var(--au-fs-hero-l)/1 'Sora',sans-serif; letter-spacing:-.02em; color:var(--au-text); font-variant-numeric:tabular-nums }
.peso-big span{ font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-muted) }
.peso-quando{ margin-top:10px; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text-soft); font-variant-numeric:tabular-nums; white-space:nowrap }
.peso-quando-s{ color:var(--au-muted) }
.peso-seg{ display:flex; padding:3px; border-radius:14px; background:var(--au-surface); border:1px solid var(--au-line); margin-top:14px }
.peso-seg-b{ flex:1; min-height:44px; border:0; border-radius:11px; background:none; color:var(--au-muted); font:400 var(--au-fs-s) 'Sora',sans-serif; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.peso-seg-b:active{ transform:scale(.97) }
.peso-seg-b.on{ background:var(--au-surface-2); color:var(--au-text) }
.peso-seg-b[disabled]{ color:var(--au-faint); cursor:default; opacity:.6 }
/* o gráfico: 210px de desenho + a fila dos meses embaixo */
.peso-g{ position:relative; height:210px; margin:14px 0 26px; touch-action:pan-y; user-select:none; -webkit-user-select:none; outline:none; border-radius:8px }
.peso-g:focus-visible{ box-shadow:0 0 0 2px var(--au-line) }
@media (hover:hover) and (pointer:fine){ .peso-g{ cursor:crosshair } }
.peso-g-svg{ position:absolute; left:0; top:0; width:100%; height:210px; overflow:visible }
.peso-g-mes{ stroke:rgba(255,255,255,.08); stroke-width:1; vector-effect:non-scaling-stroke }
.peso-g-linha{ fill:none; stroke:var(--au-text); stroke-width:1.8; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke }
.peso-g-pontos{ position:absolute; inset:0; pointer-events:none }
.peso-g-p{ position:absolute; width:6px; height:6px; border-radius:50%; background:var(--au-bg); border:1.4px solid var(--au-text); transform:translate(-50%,-50%); box-sizing:border-box }
.peso-g-p.ult{ width:10px; height:10px; background:var(--au-text) }
.peso-g-fio{ position:absolute; top:30px; bottom:0; width:1px; background:rgba(255,255,255,.35); pointer-events:none }
.peso-g-cur{ position:absolute; width:13px; height:13px; border-radius:50%; background:var(--au-text); border:2px solid var(--au-bg); transform:translate(-50%,-50%); pointer-events:none; box-sizing:border-box }
.peso-g-data{ position:absolute; top:2px; height:24px; line-height:22px; padding:0 10px; border-radius:12px; background:var(--au-surface-2); border:1px solid rgba(255,255,255,.18); color:var(--au-text); font:500 var(--au-fs-xs) 'Sora',sans-serif; white-space:nowrap; transform:translateX(-50%); pointer-events:none; box-sizing:border-box }
.peso-g-fio[hidden], .peso-g-cur[hidden], .peso-g-data[hidden]{ display:none }
.peso-g-meses{ position:absolute; left:0; right:0; top:100%; height:22px; pointer-events:none }
.peso-g-meses span{ position:absolute; top:6px; transform:translateX(-50%); font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted); white-space:nowrap }
.peso-lista{ border-top:1px solid var(--au-line) }
.peso-lista-k{ display:block; padding:14px 0 4px }
.peso-li{ display:flex; align-items:center; min-height:44px; border-bottom:1px solid var(--au-line-soft); font-variant-numeric:tabular-nums }
.peso-li span{ font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-muted) }
.peso-li b{ margin-left:auto; font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text) }
.peso-li.on{ background:rgba(255,255,255,.04) }
.peso-mola{ flex:1; min-height:16px }
/* o "Log weight" fica SEMPRE à vista: preso no pé da área que rola (no Safari
   do iPhone, com a barra de endereço, ele caía abaixo da dobra); a lista
   passa por baixo de um esmaecido */
.peso-pe{ position:sticky; bottom:0; z-index:1; margin:0 -22px; padding:28px 22px 0; background:linear-gradient(transparent, var(--au-bg) 34px) }
.peso-cta{ width:100% }
.peso-vazio{ margin-top:auto }
.peso-vazio-t{ font:200 var(--au-fs-hero-l)/1.1 'Sora',sans-serif; color:var(--au-text) }
.peso-vazio-s{ font:400 var(--au-fs-m)/1.6 'Sora',sans-serif; color:var(--au-muted); margin-top:12px; max-width:294px }
/* a folha de registrar */
.peso-folha{ text-align:center }
.peso-folha-alca{ width:36px; height:5px; border-radius:3px; background:rgba(255,255,255,.2); margin:0 auto 16px }
.peso-folha-t{ margin:0; font:400 var(--au-fs-xl) 'Sora',sans-serif; color:var(--au-text) }
.peso-folha-s{ margin-top:4px; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-muted) }
.peso-step{ display:flex; align-items:center; justify-content:center; gap:14px; margin:26px 0 4px }
.peso-step-b{ flex:none; width:56px; height:56px; border-radius:50%; border:1px solid rgba(255,255,255,.16); background:none; color:var(--au-text); font:300 var(--au-fs-t) 'Sora',sans-serif; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.peso-step-b:active{ transform:scale(.97) }
.peso-step-n{ display:flex; align-items:baseline; justify-content:center; gap:4px; min-width:0 }
.peso-step-n input{ width:2.4em; min-width:0; border:0; background:none; color:var(--au-text); font:200 var(--au-fs-hero-l)/1 'Sora',sans-serif; text-align:center; font-variant-numeric:tabular-nums; padding:0; outline:none; user-select:text; -webkit-user-select:text }
.peso-step-n input:focus-visible{ box-shadow:0 2px 0 var(--au-line) }
.peso-step-n span{ font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-muted) }
.peso-folha-erro{ min-height:22px; margin:6px 0 12px; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-orange) }
.peso-folha-erro:empty{ visibility:hidden }
.peso-folha .au-btn{ width:100% }
.peso-folha-cancelar{ display:inline-flex; align-items:center; justify-content:center; min-height:44px; margin-top:8px; padding:0 16px }

/* ── [dono 18/10] RACE READINESS no CYCLE do atleta (goal-prova.js) ──
   A porta embaixo do herói (só com prova) e a tela que ela abre. Sem CTA
   sólido (o CYCLE é leitura); ouro só no selo do coach e na data da decisão;
   verde só no critério pronto; cobre só na lesão ativa. */
/* [dono 18/10, print do iPhone] A moldura do GOAL/CYCLE (goalTabFrame) é uma
   coluna flexível de altura fixa que rola: com a página maior que a tela,
   os blocos encolhiam — e a porta, que declara min-height:44px, ia a 44 com
   o texto pra fora. Na coluna que rola nada encolhe. Régua FORA DO BOTÃO. */
.goal-frame > *{ flex-shrink:0 }
/* [dono 18/10, forma B de mockups/ciclo-design.html] O RESUMO DO CYCLE: quatro
   linhas que abrem (goal-resumo.js) — a porta emoldurada da prontidão morreu.
   Sem moldura e sem fill: separador fino, kicker, frase, linha pequena, o
   desenho à direita e a seta. Cobre só no dia que faltou comida. */
.gc-resumo{ margin-top:22px; border-bottom:1px solid var(--au-line) }
.gc-lin{ display:grid; grid-template-columns:minmax(0,1fr) auto 14px; align-items:center; gap:14px; width:100%; min-height:76px; padding:14px 0; border:0; border-top:1px solid var(--au-line); background:none; color:var(--au-text); text-align:left; font:inherit; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.gc-lin:active{ transform:scale(.98) }
.gc-lin-txt{ display:flex; flex-direction:column; gap:4px; min-width:0 }
.gc-lin-t{ font:400 var(--au-fs-xl)/1.3 'Sora',sans-serif; color:var(--au-text) }
.gc-lin-s{ font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted) }
.gc-lin-pr{ font:400 var(--au-fs-mono) 'Space Mono',monospace; letter-spacing:.14em; color:var(--au-gold); margin-right:4px }
.gc-lin-cobre{ color:var(--au-orange) }
.gc-lin-mini{ display:flex; align-items:center; justify-content:flex-end }
.gc-lin-mini .gc-pontos{ margin:0 }
.gc-lin-seta{ color:var(--au-faint); font-size:var(--au-fs-t-s); line-height:1 }
.gc-lin-seg{ display:flex; gap:3px; width:76px }
.gc-lin-seg i{ flex:1; height:5px; border-radius:3px; background:rgba(255,255,255,.12) }
.gc-lin-seg i.perto{ background:rgba(255,255,255,.55) }
.gc-lin-seg i.ok{ background:var(--au-green) }
.gc-lin-barras{ display:flex; align-items:flex-end; gap:3px; width:76px; height:28px }
.gc-lin-barras i{ flex:1; border-radius:1px; background:rgba(255,255,255,.4) }
.gc-lin-barras i.cobre{ background:var(--au-orange) }
.gc-lin-barras i.vz{ background:rgba(255,255,255,.08) }
/* a tela que a linha abre: a mesma moldura da prontidão */
.pushed-screen.gc-det{ padding:calc(env(safe-area-inset-top, 0px) + 14px) 22px calc(var(--au-h-nav) + 28px + env(safe-area-inset-bottom)); background:radial-gradient(100% 55% at 20% 8%, var(--au-surface-2), var(--au-bg) 62%); display:flex; flex-direction:column; box-sizing:border-box }
.gc-det > *{ flex-shrink:0 }
.gc-det-topo{ display:flex; align-items:center }
.gc-det-h{ font:300 var(--au-fs-t)/1.15 'Sora',sans-serif; letter-spacing:-.02em; margin:6px 0 0; color:var(--au-text) }
.gc-det-s{ margin:8px 0 0; font:400 var(--au-fs-sm) 'Sora',sans-serif; color:var(--au-muted) }
.pushed-screen.rp-tela{ padding:calc(env(safe-area-inset-top, 0px) + 14px) 22px calc(var(--au-h-nav) + 28px + env(safe-area-inset-bottom)); background:radial-gradient(100% 55% at 20% 8%, var(--au-surface-2), var(--au-bg) 62%); display:flex; flex-direction:column; box-sizing:border-box }
.rp-tela > *{ flex-shrink:0 }
.rp-topo{ display:flex; align-items:center }
.rp-h{ font:300 var(--au-fs-t)/1.15 'Sora',sans-serif; letter-spacing:-.02em; margin:6px 0 0; color:var(--au-text) }
.rp-dec{ display:flex; align-items:center; gap:10px; margin-top:12px; font:400 var(--au-fs-sm) 'Sora',sans-serif; color:var(--au-muted) }
.rp-dec b{ font-weight:400; color:var(--au-gold-hi) }
.rp-lista{ margin-top:14px; border-top:1px solid var(--au-line) }
.rp-cr{ display:grid; gap:8px; padding:14px 0; border-bottom:1px solid var(--au-line-soft) }
.rp-l{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; min-width:0 }
.rp-nome{ font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text-soft); min-width:0 }
.rp-v{ font:300 var(--au-fs-t)/1 'Sora',sans-serif; color:var(--au-text); white-space:nowrap }
.rp-meta{ font:400 var(--au-fs-sm) 'Sora',sans-serif; color:var(--au-muted); text-align:right }
.rp-est{ flex:none; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-muted); border:1px solid var(--au-line); border-radius:99px; padding:4px 8px }
.rp-est-pronto{ color:var(--au-green); border-color:rgba(95,168,122,.5) }
.rp-est-atencao{ color:var(--au-orange); border-color:rgba(217,154,108,.5) }
.rp-barra{ height:4px; border-radius:2px; background:rgba(255,255,255,.08); overflow:hidden }
.rp-barra i{ display:block; height:100%; border-radius:2px; background:var(--au-text-soft); transform-origin:left }
.rp-barra i.ok{ background:var(--au-green) }
.rp-barra i.at{ background:var(--au-orange) }
.rp-testes{ display:grid; gap:12px; margin-top:12px }
.rp-te{ display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; align-items:baseline; font:400 var(--au-fs-sm)/1.45 'Sora',sans-serif; color:var(--au-muted) }
.rp-te-s{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-faint) }
.rp-te-t{ color:var(--au-text-soft); min-width:0 }
.rp-te.feito .rp-te-t{ color:var(--au-green) }
.rp-vazio{ margin:12px 0 0; font:400 var(--au-fs-sm) 'Sora',sans-serif; color:var(--au-muted) }

/* ── [dono 18/10 · "implemente" — mockups/dieta-no-mw-fitness.html]
   BODY › FUEL: a dieta do dia (body-fuel.js) e as folhas (body-fuel-folhas.js).
   Ouro só na refeição DA VEZ (o "agora"); verde só na feita; nenhum fill
   sólido na tela (o CTA é o da folha da refeição). ── */
/* ── [dono 19/10, "implemente" — mockups/body-a-interativo.html] O MY BODY
   (body.js · bodyDossierHTML): o peso grande, a dieta em pílulas, o cartão do
   corpo (um par de manequins + as portas Focus/Injuries) e as fotos. Ouro só
   no ponto de hoje da linha do peso; cobre só na lesão ativa; o único sólido
   possível é o "Weigh in" (só sem pesagem de hoje). ── */
.bd-cab{ display:flex; justify-content:space-between; align-items:center; margin-top:4px }
.bd-titulo{ margin:8px 0 0; font:200 var(--au-fs-t) 'Sora',sans-serif; line-height:1.2; color:var(--au-text) }
.bd-conta{ flex:none; width:var(--au-h-tap); height:var(--au-h-tap); display:grid; place-items:center; padding:0; border:0; border-radius:50%; background:none; color:var(--au-text-soft); cursor:pointer }
.bd-peso{ all:unset; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; width:100%; margin-top:18px; padding:4px 0; box-sizing:border-box; cursor:pointer; border-radius:16px; transition:transform var(--au-dur-press) var(--au-ease) }
.bd-peso:active{ transform:scale(.97) }
.bd-peso:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:4px }
.bd-peso-tx{ display:flex; flex-direction:column; min-width:0 }
.bd-peso-n{ margin-top:8px; font:200 var(--au-fs-hero) 'Sora',sans-serif; line-height:1; letter-spacing:-.02em; color:var(--au-text); font-variant-numeric:tabular-nums }
.bd-peso-n small{ margin-left:4px; font:300 var(--au-fs-t-s) 'Sora',sans-serif; letter-spacing:0; color:var(--au-muted) }
.bd-peso-n.is-velho{ color:var(--au-text-soft) }
.bd-peso-s{ margin-top:6px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.bd-peso-linha{ flex:none; color:var(--au-muted); margin-bottom:6px }
.bd-peso-hoje{ fill:var(--au-gold) }
.bd-pesar{ margin-top:14px }
.bd-pilulas{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; margin-top:16px }
.bd-pilula{ display:flex; align-items:center; gap:12px; min-height:64px; padding:8px 10px 8px 14px; border:1px solid var(--au-line); border-radius:16px; background:none; color:inherit; font:inherit; text-align:left; box-sizing:border-box; cursor:pointer; min-width:0; transition:transform var(--au-dur-press) var(--au-ease) }
.bd-pilula:active{ transform:scale(.97) }
.bd-pilula:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:2px }
.bd-pilula-h{ flex:none; font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.bd-pilula-h.is-ok{ color:var(--au-green) }
.bd-pilula-tx{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.bd-pilula-n{ font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text); overflow-wrap:anywhere }
.bd-pilula-s{ font:400 var(--au-fs-xs) 'Sora',sans-serif; line-height:1.35; color:var(--au-muted) }
/* a da refeição quebra em vez de cortar ("Next meal · 378 / 2,353 kcal" não cabe em 111px — fiscal, 19/10) */
.bd-agua .bd-pilula-s{ white-space:nowrap }
.bd-agua{ flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; padding:8px 14px; white-space:nowrap }
.bd-agua-n{ font:300 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.bd-seta{ flex:none; color:var(--au-muted); font:300 var(--au-fs-l) 'Sora',sans-serif }
.bd-mapa{ margin-top:12px; padding:12px 14px 4px; border:1px solid var(--au-line); border-radius:22px; background:var(--au-surface) }
.bd-par{ display:flex; justify-content:center; gap:14px; margin-bottom:6px }
.bd-mapa-linha{ display:flex; align-items:center; gap:8px; width:calc(100% + 16px); min-height:var(--au-h-tap); margin:0 -8px; padding:4px 8px; border:0; border-top:1px solid var(--au-line-soft); border-radius:12px; background:none; color:var(--au-text); font:400 var(--au-fs-xs) 'Sora',sans-serif; text-align:left; box-sizing:border-box; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.bd-mapa-linha:active{ transform:scale(.97) }
.bd-mapa-linha:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:-2px }
.bd-mapa-tx{ flex:1; min-width:0; line-height:1.35; padding:4px 0; overflow-wrap:anywhere }
.bd-mapa-tx small{ margin-left:6px; font-size:var(--au-fs-xs); color:var(--au-muted) }
.bd-mapa-tx small.is-lesao{ color:var(--au-red) }
.bd-ponto{ flex:none; width:8px; height:8px; border-radius:50%; border:1.5px solid var(--au-faint); box-sizing:border-box }
.bd-ponto.is-foco{ background:var(--au-text); border-color:var(--au-text) }
.bd-ponto.is-lesao{ background:var(--au-red); border-color:var(--au-red) }
.bd-linha{ display:flex; align-items:center; gap:12px; width:100%; min-height:64px; margin-top:6px; padding:0; border:0; background:none; color:inherit; text-align:left; box-sizing:border-box; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.bd-linha:active{ transform:scale(.97) }
.bd-linha:focus-visible{ outline:2px solid var(--au-text-soft); outline-offset:2px; border-radius:12px }
.bd-linha-tx{ flex:1; min-width:0; display:flex; flex-direction:column }
.bd-linha-t{ font:400 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-text) }
.bd-linha-s{ margin-top:3px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.bd-vagas{ display:flex; gap:6px } .bd-vagas i{ width:28px; height:38px; border:1px solid var(--au-line); border-radius:8px; box-sizing:border-box }
.bd-nota{ display:flex; gap:10px; align-items:flex-start; margin-top:12px; padding:12px 14px; border:1px solid rgba(201,162,74,.3); border-radius:12px; background:rgba(201,162,74,.05) }
.bd-nota-t{ font:italic 400 var(--au-fs-s) 'Sora',sans-serif; line-height:1.55; color:var(--au-text-soft) }
.bd-aviso{ position:fixed; left:50%; bottom:calc(var(--au-h-nav) + 24px + env(safe-area-inset-bottom)); transform:translateX(-50%); display:flex; align-items:center; gap:6px; padding:4px 4px 4px 16px; border:1px solid var(--au-line); border-radius:100px; background:var(--au-surface-2); color:var(--au-text); font:400 var(--au-fs-s) 'Sora',sans-serif; white-space:nowrap; z-index:40; animation:bdAviso 200ms var(--au-ease) both }
.bd-aviso button{ min-height:var(--au-h-tap); padding:0 14px; border:0; border-radius:100px; background:none; color:var(--au-text-soft); font:400 var(--au-fs-mono) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; cursor:pointer }
@keyframes bdAviso{ from{ opacity:0; transform:translate(-50%,8px) scale(.95) } to{ opacity:1; transform:translate(-50%,0) } }
@media (prefers-reduced-motion: reduce){ .bd-aviso{ animation:none } }
.fuel-k-linha{ display:flex; justify-content:space-between; align-items:center; gap:12px }
.fuel-macros{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-top:20px }
.fuel-macro-v{ font:300 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.fuel-macro-v span{ font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.fuel-macro-l{ margin-top:4px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--au-faint) }
.fuel-sec{ margin-top:20px; padding-top:16px; border-top:1px solid var(--au-line) }
.fuel-fora-li{ display:flex; align-items:center; gap:10px; min-height:52px; border-bottom:1px solid var(--au-line-soft) }
.fuel-fora-n{ flex:1; min-width:0; font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text) }
.fuel-fora-n small{ display:block; margin-top:2px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-faint) }
.fuel-fora-add{ margin-left:-4px; color:var(--au-muted) }
.fuel-agua{ display:flex; gap:6px; margin-top:12px }
.fuel-agua i{ flex:1; height:22px; border-radius:6px; border:1px solid var(--au-line) }
.fuel-agua i.on{ background:rgba(245,243,238,.18); border-color:transparent }
.fuel-agua-bts{ display:flex; gap:10px; margin-top:12px }
.fuel-agua-bts .au-chip{ min-width:var(--au-h-tap); transition:transform var(--au-dur-press) var(--au-ease) }
.fuel-agua-bts .au-chip:active{ transform:scale(.97) }
.fuel-agua-bts .au-chip:disabled{ opacity:.35; cursor:default }
.fuel-orient{ margin:10px 0 0; padding-left:18px; font:400 var(--au-fs-s)/1.6 'Sora',sans-serif; color:var(--au-text-soft) }
.fuel-assina{ display:flex; align-items:center; gap:8px; margin-top:20px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-faint) }
.fuel-assina-i{ flex:none; width:20px; height:20px; border-radius:50%; border:1px solid rgba(255,255,255,.2); display:inline-grid; place-items:center; font:400 var(--au-fs-mono-xs) 'Sora',sans-serif; color:var(--au-muted) }
/* as folhas */
.fuel-folha-t{ margin:0; font:400 var(--au-fs-t-s) 'Sora',sans-serif; color:var(--au-text) }
.fuel-folha-s{ margin-top:6px; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fuel-itens{ margin-top:12px }
.fuel-item{ border-bottom:1px solid var(--au-line-soft) }
.fuel-item-l{ display:flex; align-items:center; gap:10px; min-height:60px; padding:6px 0 }
.fuel-item-n{ flex:1; min-width:0; font:400 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-text) }
.fuel-item-n small{ display:block; margin-top:2px; font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-faint) }
.fuel-fonte{ margin:14px 0 0; font:400 var(--au-fs-xs)/1.5 'Sora',sans-serif; color:var(--au-faint); text-align:center }
.fuel-troca-bt{ flex:none; font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--au-muted); transition:transform var(--au-dur-press) var(--au-ease) }
.fuel-troca-bt:active{ transform:scale(.97) }
.fuel-trocas{ margin:2px 0 10px; padding:4px 14px; border-radius:16px; background:var(--au-surface-2) }
.fuel-trocas:empty{ display:none }
.fuel-trocas-k{ margin:10px 0 2px }
.fuel-trocas-quem{ margin:0 0 4px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.fuel-op + .fuel-trocas-k{ margin-top:18px }
.fuel-op{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:48px; padding:8px 0; background:none; border:0; border-bottom:1px solid var(--au-line-soft); color:var(--au-text); text-align:left; cursor:pointer; font:400 var(--au-fs-m) 'Sora',sans-serif; transition:transform var(--au-dur-press) var(--au-ease) }
.fuel-op:last-child{ border-bottom:0 }
.fuel-op:active{ transform:scale(.97) }
/* [dono 19/10] o NOME manda: a medida longa do nutricionista ("4 colheres de
   sopa cheias (100 g)") quebra em até metade da linha, em vez de espremer o
   nome em três linhas ("Carne / moída / (5%)") */
.fuel-op > span{ flex:1 1 auto; min-width:0 }
.fuel-op small{ flex:0 1 auto; max-width:50%; text-align:right; font:400 var(--au-fs-xs)/1.35 'Sora',sans-serif; color:var(--au-faint) }
.fuel-op-mais{ display:block; color:var(--au-muted) }
.fuel-trocas-vazio{ margin:10px 0; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fuel-nota{ margin:14px 0 0; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted) }
.fuel-folha .au-btn{ width:100%; margin-top:18px }
.fuel-folha .peso-folha-cancelar{ display:flex; margin:8px auto 0 }
.fuel-campo{ display:block; margin-top:16px }
.fuel-campo span{ display:block; margin-bottom:6px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.fuel-campo input, .fuel-campo textarea{ display:block; width:100%; box-sizing:border-box; min-height:48px; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.16); background:var(--au-surface-2); color:var(--au-text); font:400 var(--au-fs-l) 'Sora',sans-serif; user-select:text; -webkit-user-select:text; resize:vertical }
.fuel-campo input:focus-visible, .fuel-campo textarea:focus-visible{ outline:none; border-color:rgba(255,255,255,.4) }
.fuel-fora-escolha{ margin-top:14px }
.fuel-plano-atual{ margin-top:14px; padding:12px 14px; border-radius:14px; border:1px solid var(--au-line) }
.fuel-arquivo{ position:relative; overflow:hidden }
.fuel-arquivo-in{ position:absolute; inset:0; opacity:0; cursor:pointer; font-size:var(--au-fs-l) }
.fuel-folha .au-btn-quiet{ margin-top:10px }
/* [dono 19/10] a refeição da vez na Home (home-refeicao.js): a PRIMEIRA
   PÍLULA do "Today", na largura toda da grade dos diários — a hora grande à
   esquerda, o nome e "Meal 1 of 5 · os alimentos" numa linha, o check
   canônico. (De manhã era compacta entre os diários e o baralho, forma B
   de mockups/refeicao-na-home.html; à tarde virou pílula, home-c-final.) */
.home-refeicao{ grid-column:1 / -1; display:flex; align-items:center; gap:4px; min-height:64px; padding:0 2px 0 0; border:1px solid var(--au-line); border-radius:16px; box-sizing:border-box }
.home-refeicao-abre{ flex:1; min-width:0; display:flex; align-items:center; gap:12px; min-height:62px; padding:8px 4px 8px 14px; background:none; border:0; color:inherit; text-align:left; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.home-refeicao-abre:active{ transform:scale(.97) }
.home-refeicao-h{ flex:none; font:300 var(--au-fs-t-s)/1.1 'Sora',sans-serif; color:var(--au-text); font-variant-numeric:tabular-nums }
.home-refeicao-tx{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.home-refeicao-n{ min-width:0; font:400 var(--au-fs-s) 'Sora',sans-serif; line-height:1.25; color:var(--au-text); overflow-wrap:anywhere }
.home-refeicao-s{ font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted); display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden }
/* [dono 19/10] a jornada de bike na Home (home-percurso.js): a ÚLTIMA pílula
   do "Today", na largura toda — o ícone, "Journey · Thais → Venore", os km e
   o próximo marco, e a barra fina do que já foi. Sem ouro: aparece todo dia
   (mockups/bike-jornada-thais-venore.html, tela 1). */
.home-percurso{ grid-column:1 / -1; display:flex; align-items:center; gap:12px; width:100%; min-height:64px; padding:10px 16px 10px 12px; border:1px solid var(--au-line); border-radius:16px; box-sizing:border-box; background:none; color:inherit; text-align:left; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.home-percurso:active{ transform:scale(.97) }
.home-percurso-ico{ flex:none; width:36px; height:36px; border-radius:50%; background:var(--au-surface-2); display:grid; place-items:center; color:var(--au-text-soft) }
.home-percurso-tx{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.home-percurso-n{ font:400 var(--au-fs-s) 'Sora',sans-serif; line-height:1.25; color:var(--au-text); overflow-wrap:anywhere }
.home-percurso-s{ font:400 var(--au-fs-xs)/1.4 'Sora',sans-serif; color:var(--au-muted) }
.home-percurso-barra{ display:block; height:4px; margin-top:6px; border-radius:2px; background:var(--au-line); overflow:hidden }
.home-percurso-barra i{ display:block; height:100%; background:var(--au-text-soft) }
/* a tela da jornada (home-percurso.js · hpcTelaHTML): a casca do peso. O
   mapa é desenho nosso em P&B; ouro SÓ no "você está aqui"; verde nos marcos
   vencidos; caminho feito claro, o que falta apagado (sem tracejado: é a
   marca do método). */
.hpc-k{ margin-top:14px }
.hpc-t{ font:200 var(--au-fs-t-l)/1.15 'Sora',sans-serif; color:var(--au-text); margin:6px 0 0 }
.hpc-mapa{ margin-top:16px; border:1px solid var(--au-line); border-radius:18px; overflow:hidden; background:var(--au-surface) }
.hpc-mapa-svg{ display:block; width:100%; height:auto }
.hpc-mar{ fill:var(--au-bg) }
.hpc-terra{ fill:var(--au-surface-2) }
.hpc-mata{ fill:var(--au-line) }
.hpc-traco{ fill:none; stroke:var(--au-faint); stroke-width:1.2; opacity:.55 }
.hpc-traco.hpc-fino{ stroke-width:1; opacity:.4 }
.hpc-muro{ fill:none; stroke:var(--au-muted); stroke-width:1.4 }
.hpc-casa{ fill:var(--au-muted) }
.hpc-rota{ fill:none; stroke:var(--au-faint); stroke-width:2.5; stroke-linecap:round; opacity:.5 }
.hpc-rota.hpc-feito{ stroke:var(--au-text-soft); opacity:1 }
.hpc-marco{ fill:var(--au-bg); stroke:var(--au-faint); stroke-width:1.3 }
.hpc-marco.is-ok{ fill:var(--au-green); stroke:var(--au-green) }
.hpc-agora{ fill:var(--au-gold) }
.hpc-halo{ fill:var(--au-gold); opacity:.18 }
.hpc-nome{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.1em; fill:var(--au-muted) }
.hpc-big{ display:flex; align-items:baseline; gap:8px; margin-top:16px }
.hpc-big b{ font:200 var(--au-fs-hero-l)/1 'Sora',sans-serif; letter-spacing:-.02em; color:var(--au-text); font-variant-numeric:tabular-nums }
.hpc-big span{ font:300 var(--au-fs-m) 'Sora',sans-serif; color:var(--au-muted) }
.hpc-sub{ font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-muted); margin:6px 0 0 }
.hpc-cartao{ list-style:none; margin:14px 0 0; padding:2px 16px; border:1px solid var(--au-line); border-radius:16px; background:var(--au-surface) }
.hpc-k2{ display:block; margin-top:22px }
.hpc-ln{ display:grid; grid-template-columns:22px 1fr auto; gap:10px; align-items:center; min-height:44px; border-top:1px solid var(--au-line); font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text) }
.hpc-ln:first-child, .hpc-ride:first-child{ border-top:0 }
.hpc-ln.is-depois{ color:var(--au-muted) }
.hpc-dot{ width:10px; height:10px; border-radius:50%; border:1.5px solid var(--au-faint); justify-self:center; box-sizing:border-box }
.hpc-dot.is-ok{ background:var(--au-green); border-color:var(--au-green) }
.hpc-dot.is-agora{ background:var(--au-gold); border-color:var(--au-gold); box-shadow:0 0 0 4px var(--au-gold-tint) }
.hpc-km{ font:400 var(--au-fs-mono-s) 'Space Mono',monospace; letter-spacing:.06em; color:var(--au-muted); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap }
.hpc-ride{ display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; padding:10px 0; border-top:1px solid var(--au-line); font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-text) }
.hpc-ride small{ display:block; margin-top:2px; font-size:var(--au-fs-xs); color:var(--au-muted) }
.hpc-ride .hpc-km{ color:var(--au-text-soft) }
.hpc-ride.is-resto{ color:var(--au-muted) }
/* O PESO PRONTO (dono 18/10, nutriMedidaHTML no nutricao.js): o que vai pra
   balança um tom acima, o cru apagado. Na folha da refeição e nas opções da
   troca (a carta da Home deixou de listar as medidas em 19/10). */
.nutri-pronto, .nutri-cru{ display:inline; margin:0; font-size:inherit }
.nutri-pronto{ color:var(--au-text-soft) }
.nutri-cru{ color:var(--au-faint) }
/* CYCLE › comida × treino (goal-fuel.js, dono 18/10 · corte 3): o gasto
   claro atrás, o comido sólido na frente, o dia de déficit grande em COBRE
   (atenção); P&B no resto. */
.gf-barras{ display:flex; align-items:flex-end; gap:8px; height:120px; margin-top:16px }
.gf-dia{ flex:1; height:100%; position:relative; display:flex; align-items:flex-end }
.gf-gasto{ display:block; width:100%; border-radius:3px; background:rgba(245,243,238,.10) }
.gf-comido{ position:absolute; bottom:0; left:22%; width:56%; border-radius:2px; background:rgba(245,243,238,.62) }
.gf-futuro .gf-gasto{ background:rgba(245,243,238,.04) }
.gf-alerta .gf-comido{ background:var(--au-orange) }
.gf-rotulos{ display:flex; gap:8px; margin-top:8px }
.gf-rotulos span{ flex:1; text-align:center; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.12em; color:var(--au-faint) }
.gf-rotulos span.gf-hoje{ color:var(--au-text) }
.gf-leg{ display:flex; gap:16px; margin-top:12px; font:400 var(--au-fs-xs) 'Sora',sans-serif; color:var(--au-muted) }
.gf-leg i{ display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:6px; vertical-align:-1px }
.gf-leg-gasto{ background:rgba(245,243,238,.14) }
.gf-leg-comido{ background:rgba(245,243,238,.62) }
/* [dono 18/10, forma B] a frase do dia que faltou SEM caixa: cobre só no nome do dia */
.gf-nota{ margin:14px 0 0; font:400 var(--au-fs-s)/1.5 'Sora',sans-serif; color:var(--au-text-soft) }
.gf-nota b{ font-weight:400; color:var(--au-orange) }
.gf-peso{ margin-top:16px; padding-top:12px; border-top:1px solid var(--au-line-soft) }
.gf-peso-k{ display:flex; justify-content:space-between; gap:12px }
.gf-peso-svg{ display:block; width:100%; height:auto; margin-top:6px }
.gf-peso-linha{ stroke:rgba(245,243,238,.7); stroke-width:1.5 }
.gf-peso-ponto{ fill:var(--au-text) }

/* [dono 19/10] A MOBILIDADE COM CHECK NO EXECUTOR (player-checklist.js): a
   linha .au-ck (aurum.css) com a capa à esquerda; a dose de tempo é botão
   (roda o relógio na linha); a corrida feita recolhe numa linha verde. */
.fs-ck-linha{ gap:10px; padding:4px 2px }
.fs-ck-linha .au-ck-abre{ min-height:56px }
.fs-ck-dose-b{ min-height:44px; min-width:52px; padding:0; background:none; border:0; text-align:left; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.fs-ck-dose-b:active{ transform:scale(.97) }
.fs-ck-linha.is-pronto .au-ck-dose{ color:var(--au-gold) }
.fs-ck-anel{ position:absolute; left:10px; top:10px; width:24px; height:24px }
.fs-ck-recolhida-b{ width:100%; min-height:52px; display:flex; align-items:center; gap:10px; padding:4px 2px; background:none; border:0; color:inherit; text-align:left; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.fs-ck-recolhida-b:active{ transform:scale(.98) }
.fs-ck-recolhida-t{ flex:1; min-width:0; font:300 var(--au-fs-l) 'Sora',sans-serif; color:var(--au-muted) }
.fs-ck-recolhida-t b{ font-weight:400; color:var(--au-green) }
.fs-ck-recolhida-v{ flex:none; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.16em; color:var(--au-faint) }

/* [dono 19/10] O CHECK SEMANAL DA LESÃO (js/core/lesao-semanal.js): no fim da
   liberação (lista com check) ou no recibo do próximo treino. Cobre só no
   kicker e no nome da área (cobre = atenção/lesão); a escolha "melhor" acende
   verde, "pior" cobre, "igual" o texto. Sem fill sólido. */
.lc-bloco{ margin-top:22px; padding-top:16px; border-top:1px solid var(--au-line) }
.lc-recibo .lc-bloco{ margin:4px 0 16px }
.lc-k{ font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.2em; text-transform:uppercase; color:var(--au-orange) }
.lc-q{ margin:8px 0 0; font:400 var(--au-fs-xl)/1.35 'Sora',sans-serif; color:var(--au-text) }
.lc-row{ display:flex; align-items:center; gap:10px; margin-top:12px }
.lc-j{ flex:none; width:78px; font:400 var(--au-fs-mono-xs) 'Space Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--au-orange); overflow-wrap:anywhere }
.lc-seg{ flex:1; min-width:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); border:1px solid var(--au-line); border-radius:12px; overflow:hidden }
.lc-op{ min-height:44px; padding:0 4px; border:0; border-left:1px solid var(--au-line); background:none; color:var(--au-text-soft); font:400 var(--au-fs-s) 'Sora',sans-serif; cursor:pointer; transition:transform var(--au-dur-press) var(--au-ease) }
.lc-op:first-child{ border-left:0 }
.lc-op:active{ transform:scale(.97) }
.lc-op.on{ background:rgba(255,255,255,.06); color:var(--au-text) }
.lc-op.on.lc-melhor{ color:var(--au-green); background:rgba(95,168,122,.08) }
.lc-op.on.lc-pior{ color:var(--au-orange); background:rgba(217,154,108,.08) }
.lc-resolver{ display:block; margin:4px 0 0 88px; min-height:44px; color:var(--au-green) }
.lc-pular{ display:block; width:100%; margin-top:10px; min-height:44px; text-align:center }
.lc-ok{ margin:12px 0 0; font:400 var(--au-fs-s) 'Sora',sans-serif; color:var(--au-muted) }