/* ============================================================
   MuscleGoal — folha de componentes, tema Ferro (24/10/2026)

   Todo valor de cor, tamanho, espaço, raio e sombra vem de
   assets/tokens.css. Não escreva nenhum deles direto numa regra daqui.

   Linguagem: escuro; painéis sem borda, separados por tom; contorno só
   em campo de digitação; pílula no lugar de aba; cor só no dado; uma
   sombra, só no que flutua (folha, balão, aviso); 3D só nas figuras.

   Classes de tela são prefixadas (.hj- Hoje, .cm- Comida, .tr- Treino,
   .cp- Corpo, .aj- Ajustes). Os componentes comuns não têm prefixo.
   ============================================================ */

*{box-sizing:border-box;margin:0;padding:0}
/* A página só rola na vertical: nada pode empurrar a largura para fora da tela. */
html,body{overflow-x:clip}
html{-webkit-text-size-adjust:100%;background:var(--fundo)}
body{font-family:var(--f-tela);font-size:var(--t-corpo);line-height:1.45;color:var(--tinta);
     background:var(--fundo);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}
/* Campo com menos de 16 px faz o iPhone dar zoom ao tocar, e a tela fica solta
   para os lados. Fica aqui, depois do font:inherit, para não perder para ele. */
input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:var(--t-campo)}
button{cursor:pointer}
a{color:var(--acao)}
[hidden]{display:none !important}
:focus-visible{outline:var(--traco-foco) solid var(--acao);outline-offset:var(--traco-foco)}
.num{font-family:var(--f-num);font-weight:var(--num-peso);font-stretch:var(--num-larg);letter-spacing:-.01em;
     font-variant-numeric:tabular-nums}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.r{text-align:right}
svg{flex:none}
.ico{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ico.cheio{fill:currentColor}

/* ============================================================
   Moldura: menu lateral (computador) e barra do pé (celular)
   ============================================================ */
.mol{display:grid;grid-template-columns:minmax(0,1fr);min-height:100vh}
.mol-lat{display:none}
.mol-principal{min-width:0;width:100%;max-width:var(--larg-max);margin-inline:auto;
     padding:var(--e3) var(--e4) calc(var(--alt-nav) + var(--e6))}

.mol-pe-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(5,1fr);
     min-height:var(--alt-nav);padding-bottom:env(safe-area-inset-bottom);background:var(--elevado);
     box-shadow:0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.mol-pe-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--e1);
     color:var(--tinta-2);text-decoration:none;font-size:var(--t-min);min-height:var(--alt-toque)}
.mol-pe-nav svg{width:var(--ico-nav);height:var(--ico-nav);fill:none;stroke:currentColor;stroke-width:1.8;
     stroke-linecap:round;stroke-linejoin:round}
.mol-pe-nav a[aria-current]{color:var(--acao);font-weight:600}

@media (min-width:900px){
  .mol{grid-template-columns:var(--larg-lateral) minmax(0,1fr)}
  .mol-lat{display:flex;flex-direction:column;gap:var(--e1);position:sticky;top:0;height:100vh;overflow-y:auto;
       background:var(--lateral);padding:var(--e4) var(--e3);box-shadow:inset calc(var(--fio-esp) * -1) 0 0 var(--fio)}
  .mol-marca{font-family:var(--f-logo);font-weight:800;font-size:var(--t-titulo);letter-spacing:-.03em;
       padding:0 var(--e2) var(--e4);color:var(--tinta)}
  .mol-itens{display:flex;flex-direction:column;gap:var(--e1)}
  .mol-itens a{display:flex;align-items:center;gap:var(--e3);min-height:var(--alt-toque);padding:0 var(--e3);
       border-radius:var(--r-controle);color:var(--tinta-2);text-decoration:none;font-size:var(--t-corpo);
       transition:background var(--dur),color var(--dur)}
  .mol-itens a:hover{background:var(--painel);color:var(--tinta)}
  .mol-itens a[aria-current]{background:var(--elevado);color:var(--tinta);font-weight:600}
  .mol-itens svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:1.6;
       stroke-linecap:round;stroke-linejoin:round}
  .mol-pe{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--e2);
       padding:var(--e3) var(--e2) 0;color:var(--tinta-2);font-size:var(--t-apoio)}
  .mol-pe-nav{display:none}
  .mol-principal{padding:var(--e5) var(--e6) var(--e6)}
}

/* marca MacroShape: o símbolo pequeno na cor de ação e o nome, "Macro" em 500 e "Shape" em 700
   (componentes/marca.js, gerado por marca/montar-svgs.ps1; regras em marca/LEIAME.md) */
.marca-nome{display:inline-flex;align-items:center;gap:.4em;white-space:nowrap}
.marca-simb{height:1.3em;width:auto;flex:none;color:var(--acao)}
.marca-txt{font-weight:500;letter-spacing:-.01em}
.marca-txt b{font-weight:700}

/* ============================================================
   Componentes comuns
   ============================================================ */
.painel{background:var(--painel);border-radius:var(--r-painel);padding:var(--e4);margin-bottom:var(--e3)}
.p-cab{display:flex;align-items:baseline;gap:var(--e2);margin-bottom:var(--e3);flex-wrap:wrap}
.p-cab h2{font-size:var(--t-titulo);font-weight:600;line-height:1.2}
.p-cab > span{font-size:var(--t-apoio);color:var(--tinta-2)}
.p-cab .dir{margin-left:auto}

/* botão redondo só de ícone */
.ic{width:var(--alt-ic);height:var(--alt-ic);border:0;border-radius:var(--r-pilula);background:var(--painel);
    color:var(--tinta-2);display:inline-grid;place-items:center;transition:background var(--dur),color var(--dur);position:relative}
.ic:hover{background:var(--elevado);color:var(--tinta)}
.ic svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* pílula: filtro, escolha, atalho. Escolhida = cor de ação. */
.pil,.pilula{display:inline-flex;align-items:center;gap:var(--e1);border:0;background:var(--rebaixado-2);
    border-radius:var(--r-pilula);padding:var(--e2) var(--e3);font-size:var(--t-apoio);white-space:nowrap;
    color:var(--tinta);min-height:calc(var(--alt-ic) - var(--e2));transition:background var(--dur-2),color var(--dur-2)}
.pil:hover,.pilula:hover{background:var(--elevado)}
/* a pílula é baixa para caber numa linha; a área de toque vai a 44 px por fora do desenho */
.pil,.pilula,.info{position:relative}
.pil::after,.pilula::after{content:'';position:absolute;inset:calc((var(--alt-toque) - 100%) / -2) 0}
.info::after{content:'';position:absolute;inset:calc((var(--alt-toque) - var(--e5)) / -2)}
.pil[aria-pressed=true],.pil[aria-current]{background:var(--acao);color:var(--sobre-acao);font-weight:600}

/* botões. Mapa do código antigo: .btn = secundário, .primario, .fantasma = discreto, .perigo */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--e2);min-height:var(--alt-toque);
    padding:0 var(--e4);border:0;border-radius:var(--r-controle);background:var(--rebaixado-2);color:var(--tinta);
    font-weight:600;font-size:var(--t-corpo);white-space:nowrap;transition:background var(--dur),color var(--dur)}
.btn:hover{background:var(--elevado)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.primario{background:var(--acao);color:var(--sobre-acao)}
.btn.primario:hover{background:var(--acao-hover)}
.btn.fantasma{background:none;color:var(--tinta-2)}
.btn.fantasma:hover{background:var(--rebaixado-2);color:var(--tinta)}
.btn.perigo{background:var(--erro);color:var(--sobre-acao)}
.btn.perigo-txt{color:var(--erro)}
.btn.pequeno{min-height:calc(var(--alt-ic) - var(--e1));padding:0 var(--e3);font-size:var(--t-apoio)}
.btn .ico{width:var(--ico);height:var(--ico)}
.a-esquerda{margin-right:auto}

/* selo: estado curto, sempre com texto */
.selo{display:inline-flex;align-items:center;font-size:var(--t-min);font-weight:600;border-radius:var(--r-pilula);
    padding:calc(var(--e1) / 2) var(--e2);white-space:nowrap}
.selo.ok{background:var(--ok-suave);color:var(--ok)}
.selo.atencao{background:var(--atencao-suave);color:var(--atencao)}
.selo.neutro{background:var(--rebaixado-2);color:var(--tinta-2)}
.selo.acao{background:var(--acao-suave);color:var(--acao)}

/* "i" com balão: o lugar do parágrafo de ajuda */
.info{width:var(--e5);height:var(--e5);border:0;border-radius:var(--r-pilula);background:var(--rebaixado-2);color:var(--tinta-2);
    font-size:var(--t-min);font-weight:700;position:relative;flex:none}
.info .bal{position:absolute;right:0;top:calc(100% + var(--e2));width:var(--larg-balao);max-width:80vw;background:var(--elevado);
    color:var(--tinta);box-shadow:var(--sombra);border-radius:var(--r-controle);padding:var(--e3);font-weight:400;
    font-size:var(--t-apoio);line-height:1.45;text-align:left;opacity:0;pointer-events:none;transition:opacity var(--dur);z-index:40}
.info:hover .bal,.info:focus .bal,.info:focus-within .bal{opacity:1}

/* campos: o único lugar com contorno */
.cp{display:flex;flex-direction:column;gap:var(--e1);min-width:0}
.cp > label,.cp-rot{font-size:var(--t-apoio);color:var(--tinta-2);font-weight:500}
.cp .opc{font-weight:400}
:where(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%;min-height:var(--alt-toque);padding:0 var(--e3);
    border:var(--fio-esp) solid var(--contorno);border-radius:var(--r-controle);background:var(--rebaixado);color:var(--tinta);
    font-size:var(--t-campo);transition:border-color var(--dur)}
:where(textarea){padding:var(--e3);line-height:1.35;resize:none}
input::placeholder,textarea::placeholder{color:var(--tinta-2)}
:where(input,select,textarea):focus{border-color:var(--acao)}
input[type=checkbox]{width:var(--ico);height:var(--ico);accent-color:var(--acao)}
.cp .ajuda{font-size:var(--t-min);color:var(--tinta-2)}
.cp.erro :where(input,select,textarea){border-color:var(--erro)}
.msg-erro{font-size:var(--t-apoio);color:var(--erro);font-weight:500}
.grade2,.grade4{display:grid;gap:var(--e3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:560px){ .grade4{grid-template-columns:repeat(4,minmax(0,1fr))} }
.marcar{display:inline-flex;align-items:center;gap:var(--e2);font-size:var(--t-apoio);color:var(--tinta-2);cursor:pointer}

.vazio{padding:var(--e6) var(--e4);text-align:center;color:var(--tinta-2)}
.vazio h2{font-size:var(--t-titulo);color:var(--tinta);margin-bottom:var(--e2)}
.vazio-bloco{padding:var(--e5) var(--e3);text-align:center;color:var(--tinta-2);font-size:var(--t-apoio)}

/* ============================================================
   Folha (diálogo): sobe do pé no celular, centralizada no computador
   ============================================================ */
dialog.modal{border:0;padding:0;margin:auto auto 0;width:100%;max-width:100% !important;max-height:88vh;
    background:var(--elevado);color:var(--tinta);border-radius:var(--r-folha) var(--r-folha) 0 0;box-shadow:var(--sombra);
    font-size:var(--t-corpo)}
dialog.modal[open]{display:flex;flex-direction:column}
dialog.modal::backdrop{background:var(--veu)}
dialog.modal > header{display:flex;align-items:center;gap:var(--e3);padding:var(--e4) var(--e4) var(--e2)}
dialog.modal > header h2{font-size:var(--t-titulo);font-weight:600;flex:1}
dialog.modal > header .x{width:var(--alt-ic);height:var(--alt-ic);border:0;border-radius:var(--r-pilula);
    background:var(--rebaixado-2);color:var(--tinta-2);display:grid;place-items:center}
dialog.modal > header .x svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
dialog.modal > .modal-corpo{padding:var(--e2) var(--e4) var(--e4);overflow-y:auto;display:flex;flex-direction:column;gap:var(--e3)}
dialog.modal > footer{display:flex;gap:var(--e2);justify-content:flex-end;flex-wrap:wrap;
    padding:var(--e3) var(--e4) calc(var(--e4) + env(safe-area-inset-bottom));box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
dialog.modal > footer:empty{display:none}
.texto-confirma{color:var(--tinta-2)}
@media (min-width:900px){
  dialog.modal{margin:auto;width:calc(100% - var(--e6));max-width:var(--larg-folha) !important;border-radius:var(--r-folha)}
}

/* ============================================================
   Avisos: só confirmação ("Salvo") e falha que não é de campo
   ============================================================ */
.toasts{position:fixed;left:var(--e3);right:var(--e3);bottom:calc(var(--alt-nav) + var(--e3) + env(safe-area-inset-bottom));
    z-index:60;display:flex;flex-direction:column;align-items:center;gap:var(--e2);pointer-events:none}
dialog .toasts{bottom:var(--e3)}
.toast{pointer-events:auto;display:flex;align-items:center;gap:var(--e3);max-width:var(--larg-folha);width:100%;
    background:var(--elevado);color:var(--tinta);border-radius:var(--r-controle);box-shadow:var(--sombra);
    padding:var(--e2) var(--e2) var(--e2) var(--e4);font-size:var(--t-apoio)}
.toast.erro{background:var(--erro-suave);color:var(--erro)}
.toast.alerta{background:var(--atencao-suave);color:var(--atencao)}
.toast .txt{flex:1}
.toast .acao{border:0;background:none;color:var(--acao);font-weight:600;min-height:var(--alt-toque);padding:0 var(--e2)}
.toast .x{border:0;background:none;color:inherit;width:var(--alt-toque);height:var(--alt-toque);display:grid;place-items:center}
.toast .x svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.toast.saindo{opacity:0;transition:opacity var(--dur)}
@media (min-width:900px){ .toasts{bottom:var(--e5);left:auto;right:var(--e5);align-items:flex-end} }

/* ============================================================
   Cartão de interpretação (componentes/interpretacao.js)
   ============================================================ */
.txt-bolha{align-self:flex-end;max-width:90%;margin-left:auto;background:var(--acao-suave);color:var(--tinta);
    border-radius:var(--r-controle) var(--r-controle) var(--e1) var(--r-controle);padding:var(--e2) var(--e3);font-size:var(--t-apoio)}
.txt-interp{display:flex;flex-direction:column;gap:var(--e2);margin-top:var(--e3)}
.txt-interp-cab{font-size:var(--t-apoio);color:var(--tinta-2)}
.txt-interp-cab b{color:var(--tinta);font-weight:600}
.txt-l{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:var(--e2);align-items:center;
    padding:var(--e2) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.txt-l > span:first-child{min-width:0;display:flex;flex-direction:column;gap:var(--e1)}
.txt-l small{font-size:var(--t-min);color:var(--tinta-2)}
.txt-l.pend > span:first-child::before{content:'';display:block;width:var(--e2);height:var(--e2);border-radius:var(--r-pilula);
    background:var(--atencao);position:absolute;margin:calc(var(--e1) * 1.5) 0 0 calc(var(--e3) * -1)}
.txt-l.pend{position:relative;padding-left:var(--e3)}
.txt-trocar{border:0;background:none;padding:0;text-align:left;color:var(--tinta);font-weight:500;
    text-decoration:underline;text-decoration-color:var(--contorno);text-underline-offset:var(--vao)}
.txt-trocar:hover{text-decoration-color:var(--acao)}
.aprox{font-style:normal;font-size:var(--t-min);color:var(--atencao);font-weight:600}
.memo{font-style:normal;font-size:var(--t-min);color:var(--tinta-2)}
.txt-q{display:inline-flex;align-items:center;gap:var(--e1)}
.txt-q input{width:calc(var(--alt-toque) * 1.7);text-align:right;padding:0 var(--e2)}
.txt-q em{font-style:normal;font-size:var(--t-min);color:var(--tinta-2)}
.txt-kcal{min-width:calc(var(--alt-toque) * .9)}
.txt-l .ic,.txt-cad .ic{width:var(--alt-toque);height:var(--alt-toque);background:none}
.txt-l .ic svg,.txt-cad .ic svg{width:var(--ico);height:var(--ico)}
.txt-opcoes{display:flex;flex-wrap:wrap;gap:var(--e1);margin-top:var(--e1)}
.txt-parecidos{font-size:var(--t-min);color:var(--tinta-2);align-self:center}
.txt-tot{display:flex;justify-content:space-between;gap:var(--e3);font-size:var(--t-apoio);color:var(--tinta-2);padding-top:var(--e1)}
.txt-tot .num{font-size:var(--t-num-s);color:var(--tinta)}
.txt-acoes{display:flex;gap:var(--e2);flex-wrap:wrap;align-items:center;margin-top:var(--e1)}
.txt-dica{font-size:var(--t-min);color:var(--tinta-2)}
.txt-cad{display:flex;flex-direction:column;gap:var(--e3);background:var(--rebaixado);border-radius:var(--r-item);padding:var(--e3)}
.txt-cad-topo{display:flex;gap:var(--e2);align-items:flex-start;font-size:var(--t-apoio)}
.txt-cad-topo > span{flex:1}
.txt-cad-acoes{display:flex;gap:var(--e2);flex-wrap:wrap}
.fal-ref{display:flex;flex-wrap:wrap;gap:var(--e2);align-items:center;font-size:var(--t-apoio);color:var(--tinta-2)}
.fal-ref .cp{width:calc(var(--alt-toque) * 2)}
.fal-ref select{width:auto}

/* busca na base (interpretacao.js, busca.js) e lançamento manual (adicionar.js) */
.bus{display:flex;flex-direction:column;gap:var(--e2)}
.bus-lista{display:flex;flex-direction:column;min-height:calc(var(--alt-toque) * 4)}
.bus-titulo{font-size:var(--t-min);font-weight:600;color:var(--tinta-2);padding:var(--e2) 0 var(--e1)}
.bus-item,.bus-novo{display:flex;align-items:center;gap:var(--e3);min-height:var(--alt-toque);border:0;background:none;
    text-align:left;padding:var(--e2);border-radius:var(--r-controle)}
.bus-item:hover,.bus-novo:hover{background:var(--rebaixado-2)}
.bus-nome{flex:1;min-width:0;display:flex;align-items:center;gap:var(--e2)}
.bus-nome .ico{color:var(--carb)}
.bus-info{color:var(--tinta-2)}
.bus-qtd{display:flex;flex-direction:column;gap:var(--e3)}
.bus-escolhido{font-weight:600}
.bus-linha{display:flex;gap:var(--e2);align-items:flex-end}
.bus-linha .cp{flex:1}
.bus-atalhos{display:flex;flex-wrap:wrap;gap:var(--e1)}
.bus-previa{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e2);text-align:center}
.bus-previa b{display:block;font-size:var(--t-num-s)}
.bus-previa span{font-size:var(--t-min);color:var(--tinta-2)}
.add{display:flex;flex-direction:column;gap:var(--e3)}
.add .abas{display:flex;gap:var(--e2);flex-wrap:wrap}
.add .aba{border:0;background:var(--rebaixado-2);border-radius:var(--r-pilula);padding:var(--e2) var(--e3);font-size:var(--t-apoio)}
.add .aba.on,.add .aba[aria-selected=true]{background:var(--acao);color:var(--sobre-acao);font-weight:600}
.add-refs{display:flex;flex-direction:column;gap:var(--e1)}
.add-ref{display:flex;gap:var(--e2);align-items:center;padding:var(--e2) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.add-ref-txt{flex:1;min-width:0;display:flex;flex-direction:column}
.add-ref-txt span{font-size:var(--t-min);color:var(--tinta-2)}
.add-porcoes{width:calc(var(--alt-toque) * 1.4) !important}
.add-avulso{display:flex;flex-direction:column;gap:var(--e3)}
.add-nota{font-size:var(--t-apoio);color:var(--tinta-2)}

/* ============================================================
   Entrada
   ============================================================ */
.tela-login{min-height:100vh;display:grid;place-items:center;padding:var(--e4)}
.caixa-login{width:100%;max-width:calc(var(--larg-folha) * .66);display:flex;flex-direction:column;gap:var(--e4);
    background:var(--painel);border-radius:var(--r-painel);padding:var(--e5)}
.caixa-login h1{font-family:var(--f-logo);font-weight:800;font-size:var(--t-tela);letter-spacing:-.04em;line-height:1}
.caixa-login .sub{color:var(--tinta-2);margin-top:calc(var(--e3) * -1)}
.caixa-login .btn{width:100%}

/* ============================================================
   HOJE (telas/hoje.js) — especificação: _dev/mockup-hoje-v1.html
   ============================================================ */
.hj-carregando{padding:var(--e6) 0;color:var(--tinta-2);text-align:center}
.hj{display:block;padding-bottom:calc(var(--alt-toque) * 2.4)}
.hj-cab{display:flex;align-items:center;gap:var(--e2);margin-bottom:var(--e3)}
.hj-cab h1{font-family:var(--f-num);font-stretch:var(--num-larg);font-weight:var(--num-peso);font-size:var(--t-tela);line-height:1}
.hj-data{font-size:var(--t-apoio);color:var(--tinta-2);margin-top:var(--e1)}
.hj-setas{margin-left:auto;display:flex;gap:var(--e1);align-items:center}
.hj-cal input{position:absolute;inset:0;opacity:0;width:100%;height:100%;min-height:0;padding:0;border:0;cursor:pointer}
.hj-cal:focus-within{outline:var(--traco-foco) solid var(--acao);outline-offset:var(--traco-foco)}

/* placar: o anel do dia e os três macros como anilhas */
.hj-pl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--e3);align-items:center}
.hj-anel .anel{display:block}
.hj-anel-pct{font-family:var(--f-tela);font-size:var(--t-min);font-weight:600;fill:var(--tinta-2)}
.hj-anel-rot{font-family:var(--f-tela);font-size:var(--t-min);fill:var(--tinta-2)}
.hj-resta,.hj-de{display:block;font-size:var(--t-apoio);color:var(--tinta-2)}
a.hj-de{color:var(--acao)}
.hj-grande{display:block;font-size:var(--t-placar);line-height:.95;margin:var(--e1) 0}
.hj-grande.acima{color:var(--atencao)}
.hj-grande small{font-family:var(--f-tela);font-stretch:100%;font-size:var(--t-corpo);font-weight:500;color:var(--tinta-2);margin-left:var(--e1)}
.hj-macros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e2);margin-top:var(--e3);padding-top:var(--e3);
    box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.hj-mac{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--e1);min-width:0}
.hj-mac b{display:block;font-size:var(--t-num-s);line-height:1.1;white-space:nowrap}
.hj-mac b small{font-family:var(--f-tela);font-stretch:100%;font-size:var(--t-min);font-weight:500;color:var(--tinta-2)}
.hj-mac span{display:block;font-size:var(--t-min);color:var(--tinta-2)}

/* lançar: um campo só, preso no pé no celular */
.hj-lancar{position:fixed;left:var(--e2);right:var(--e2);bottom:calc(var(--alt-nav) + var(--e2) + env(safe-area-inset-bottom));z-index:20;
    background:var(--elevado);border-radius:var(--r-folha);box-shadow:var(--sombra);padding:var(--e2)}
.hj-l1{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:var(--e2)}
.hj-l1 textarea{flex:1;width:auto;min-width:0;overflow:hidden;min-height:var(--alt-toque);height:var(--alt-toque);background:var(--painel);
    padding:calc((var(--alt-toque) - 1.35em) / 2 - var(--fio-esp)) var(--e3)}
.hj-l1 .msg-erro{order:3;flex-basis:100%;padding:0 var(--e1)}
.hj-enviar{width:var(--alt-toque);height:var(--alt-toque);border:0;border-radius:var(--r-controle);background:var(--acao);
    color:var(--sobre-acao);display:grid;place-items:center;flex:none;transition:background var(--dur)}
.hj-enviar:hover{background:var(--acao-hover)}
.hj-enviar svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hj-l2{display:flex;gap:var(--e1);margin-top:var(--e2);overflow-x:auto;scrollbar-width:none}
.hj-l2::-webkit-scrollbar{display:none}
.hj-l2 .pil{background:var(--rebaixado);flex:none}
.hj-l2 .pil:hover{background:var(--rebaixado-2)}
.hj-l2 .pil[aria-pressed=true]{background:var(--acao)}

.hj-rasc .p-cab{align-items:center}

/* refeições: sem tabela; kcal e a proporção dos macros */
.hj-ref{border-radius:var(--r-item);margin:0 calc(var(--e2) * -1)}
.hj-ref-cab{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--e1) var(--e3);align-items:center;width:100%;border:0;
    background:none;text-align:left;padding:var(--e3) var(--e2);border-radius:var(--r-item);transition:background var(--dur)}
.hj-ref-cab:hover{background:var(--rebaixado)}
.hj-ref-cab b{font-weight:600}
.hj-ref-cab small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.hj-k{font-size:var(--t-num-s);text-align:right}
.hj-mb{grid-column:1 / -1;display:flex;height:var(--barra-fina);border-radius:var(--r-pilula);overflow:hidden;gap:var(--vao);background:var(--rebaixado)}
.hj-mb i,.hj-tr i{display:block;height:100%}
.hj-mb .p{background:var(--prot)} .hj-mb .c{background:var(--carb)} .hj-mb .g{background:var(--gord)}
.hj-itens{display:none;padding:0 var(--e2) var(--e2)}
.hj-ref.aberta .hj-itens{display:block}
.hj-it,.hj-grupo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 var(--e3);align-items:center;width:100%;border:0;
    background:none;text-align:left;padding:var(--e2) 0;min-height:var(--alt-toque);font-size:var(--t-corpo);
    box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.hj-it:last-child{box-shadow:none}
.hj-it small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.hj-it .hj-k{font-size:var(--t-corpo)}
.hj-it:hover > span:first-child,.hj-grupo:hover > span{color:var(--acao)}
.hj-grupo{color:var(--tinta-2);font-size:var(--t-apoio);font-weight:600}
.hj-grupo .ico{width:var(--ico);height:var(--ico)}
.hj-nada{font-size:var(--t-apoio);color:var(--tinta-2);padding:var(--e1) 0}
.hj-vazias{display:flex;align-items:center;gap:var(--e2);flex-wrap:wrap;padding-top:var(--e3);margin-top:var(--e1);
    box-shadow:inset 0 var(--fio-esp) 0 var(--fio);font-size:var(--t-apoio);color:var(--tinta-2)}
.hj-vazias .pil{font-size:var(--t-min)}

/* água em copos */
.hj-copos{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--e1);margin:var(--e1) 0 var(--e3)}
.hj-copos svg{width:100%;height:auto;display:block}
.hj-copo{fill:var(--rebaixado)}
.hj-copo-agua{fill:var(--agua)}
.hj-copo-brilho{fill:var(--luz);opacity:.35}
.hj-copo-boca{fill:none;stroke:var(--contorno);stroke-width:1.2;stroke-linecap:round}
.hj-agua-l{display:flex;align-items:center;gap:var(--e2);flex-wrap:wrap}
.hj-agua-v{font-size:var(--t-num-m);line-height:1}
.hj-agua-l small{color:var(--tinta-2);font-size:var(--t-apoio)}
.hj-agua-l .btn{margin-left:auto;border-radius:var(--r-pilula)}

/* balanço */
.hj-bal-v{font-size:var(--t-num-l);line-height:1}
.hj-bal-v.ok{color:var(--ok)} .hj-bal-v.atencao{color:var(--atencao)}
.hj-bal-v small{font-family:var(--f-tela);font-stretch:100%;font-size:var(--t-apoio);color:var(--tinta-2);font-weight:500;margin-left:var(--e2)}
.hj-bar{display:grid;grid-template-columns:calc(var(--alt-toque) * 1.75) minmax(0,1fr) calc(var(--alt-toque) * 1.3);gap:var(--e2);
    align-items:center;font-size:var(--t-apoio);margin-top:var(--e3)}
.hj-bar > span:first-child{color:var(--tinta-2)}
.hj-bar > .num{text-align:right;font-size:var(--t-corpo)}
.hj-tr{height:var(--barra-media);border-radius:var(--r-pilula);background:var(--rebaixado);overflow:hidden;display:flex;gap:var(--vao)}
.hj-tr .consumido{background:var(--acao)}
.hj-tr .basal,.hj-leg .basal{background:var(--tinta-2)}
.hj-tr .rotina,.hj-leg .rotina{background:var(--contorno)}
.hj-tr .musc,.hj-leg .musc{background:var(--anilha-5)}
.hj-tr .cardio,.hj-leg .cardio{background:var(--agua)}
.hj-leg{display:flex;gap:var(--e3);flex-wrap:wrap;font-size:var(--t-min);color:var(--tinta-2);margin-top:var(--e2)}
.hj-leg i{display:inline-block;width:var(--e2);height:var(--e2);border-radius:var(--vao);margin-right:var(--e1)}

/* semana */
.hj-semana{display:block;width:100%}
.hj-sem-meta{stroke:var(--acao);stroke-dasharray:4 4}
.hj-sem-txt{font-family:var(--f-tela);font-size:var(--t-min);fill:var(--tinta-2)}
.hj-sem-barra{fill:var(--rebaixado-2)}
.hj-sem-barra.acima{fill:var(--atencao)}
.hj-sem-barra.atual{fill:var(--acao)}
.hj-sem-brilho{fill:var(--luz);opacity:.18;pointer-events:none}
.hj-dias{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:var(--e1)}
.hj-dia{border:0;background:none;min-height:var(--alt-toque);font-size:var(--t-min);color:var(--tinta-2);border-radius:var(--r-controle)}
.hj-dia:hover{background:var(--rebaixado)}
.hj-dia.atual{color:var(--tinta);font-weight:600}

/* folha de repetir */
.hj-rep-lista{display:flex;flex-direction:column}
.hj-rep-l{display:flex;gap:var(--e3);align-items:center;padding:var(--e2) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.hj-rep-l > span{flex:1;min-width:0;display:flex;flex-direction:column}
.hj-rep-l small{font-size:var(--t-min);color:var(--tinta-2)}
.hj-rep-tit{font-size:var(--t-min);font-weight:600;color:var(--tinta-2);padding-top:var(--e3)}
.hj-rep-mais{display:flex;gap:var(--e2);flex-wrap:wrap;padding-top:var(--e3);box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.hj-editar{display:flex;flex-direction:column;gap:var(--e3)}
.hj-editar-nome{font-weight:600}
.hj-editar-previa{color:var(--tinta-2);font-size:var(--t-apoio)}

@media (min-width:900px){
  .hj{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--e4);align-content:start;padding-bottom:0}
  .hj-cab{grid-column:1 / -1;margin-bottom:var(--e1)}
  .hj-col-a,.hj-col-b{min-width:0}
  .hj-lancar{position:static;box-shadow:none;background:var(--painel);border-radius:var(--r-painel);padding:var(--e3);margin-bottom:var(--e3)}
  .hj-anel .anel{width:var(--anel-dia-pc);height:auto}
}

/* ============================================================
   COMIDA (telas/comida.js) — especificação: _dev/prot/mockup-comida-v1.html
   ============================================================ */
.cm-cab .btn{margin-left:auto;border-radius:var(--r-pilula)}
.cm-seg{display:grid;grid-template-columns:repeat(3,1fr);background:var(--rebaixado);border-radius:var(--r-pilula);
    padding:var(--vao);margin-bottom:var(--e3);position:relative}
.cm-seg button{position:relative;z-index:1;border:0;background:none;min-height:var(--alt-toque);border-radius:var(--r-pilula);
    color:var(--tinta-2);font-weight:500;transition:color var(--dur)}
.cm-seg button[aria-pressed=true]{color:var(--tinta);font-weight:600}
.cm-seg button small{font-size:var(--t-min);color:var(--tinta-2);margin-left:var(--e1);font-weight:400}
.cm-seg-pil{position:absolute;z-index:0;top:var(--vao);bottom:var(--vao);border-radius:var(--r-pilula);background:var(--elevado);
    transition:left var(--dur-2) var(--ease),width var(--dur-2) var(--ease)}
.cm-busca{display:flex;align-items:center;gap:var(--e2);min-height:var(--alt-toque);background:var(--painel);border-radius:var(--r-controle);
    padding:0 var(--e3);margin-bottom:var(--e2);box-shadow:inset 0 0 0 var(--fio-esp) var(--contorno)}
.cm-busca:focus-within{box-shadow:inset 0 0 0 var(--traco-foco) var(--acao)}
.cm-busca input{border:0;background:none;outline:0;flex:1;min-width:0;min-height:calc(var(--alt-toque) - var(--e1));padding:0}
.cm-busca svg{width:var(--ico);height:var(--ico);color:var(--tinta-2);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.cm-filtros{display:flex;gap:var(--e1);margin-bottom:var(--e2);overflow-x:auto;scrollbar-width:none}
.cm-filtros:empty{display:none}
.cm-filtros .pil{flex:none}

.cm-mb{display:flex;height:var(--barra-fina);border-radius:var(--r-pilula);overflow:hidden;gap:var(--vao);background:var(--rebaixado);grid-column:1 / -1}
.cm-mb i{display:block;height:100%}
.cm-mb .p{background:var(--prot)} .cm-mb .c{background:var(--carb)} .cm-mb .g{background:var(--gord)}
.cm-k{font-size:var(--t-num-s);text-align:right;white-space:nowrap}
.cm-k small{font-family:var(--f-tela);font-stretch:100%;font-size:var(--t-min);font-weight:400;color:var(--tinta-2)}

.cm-ref{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--e1) var(--e3);align-items:center;padding:var(--e3) 0;
    box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.cm-ref:last-child{box-shadow:none}
.cm-ref b{font-weight:600}
.cm-ref > span:first-child small{display:block;color:var(--tinta-2);font-size:var(--t-min);margin-top:var(--vao)}
.cm-acoes{grid-column:1 / -1;display:flex;gap:var(--e2);margin-top:var(--e1)}

.cm-al{display:grid;grid-template-columns:var(--alt-toque) minmax(0,1fr);align-items:center;
    margin:0 calc(var(--e2) * -1);transition:background var(--dur)}
.cm-al + .cm-al{box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.cm-al:hover{background:var(--elevado);box-shadow:none;border-radius:var(--r-controle)}
.cm-al[aria-current=true]{background:var(--acao-suave);box-shadow:none;border-radius:var(--r-controle)}
.cm-est{width:var(--alt-toque);height:var(--alt-toque);border:0;border-radius:var(--r-pilula);background:none;color:var(--tinta-2);display:grid;place-items:center}
.cm-est svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.cm-est[aria-pressed=true]{color:var(--carb)}
.cm-est[aria-pressed=true] svg{fill:currentColor}
.cm-al-abre{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--vao) var(--e3);align-items:center;border:0;background:none;
    text-align:left;padding:var(--e2) var(--e2) var(--e2) 0;min-height:var(--alt-toque);width:100%}
.cm-al-abre b{font-weight:500;font-size:var(--t-corpo)}
.cm-al-abre > span:first-child small{display:block;color:var(--tinta-2);font-size:var(--t-min);margin-top:var(--vao)}
.cm-al-abre .cm-mb{height:calc(var(--barra-fina) - var(--vao));margin-top:var(--e1)}

.cm-vazio{text-align:center;padding:var(--e6) var(--e4)}
.cm-vazio h3{font-size:var(--t-titulo);margin-bottom:var(--e2)}
.cm-vazio p{margin:0 auto var(--e4);color:var(--tinta-2);max-width:42ch;font-size:var(--t-apoio)}
.cm-vazio-acoes{display:flex;gap:var(--e2);justify-content:center;flex-wrap:wrap}

/* detalhe do alimento */
.cm-det-corpo h2{font-size:var(--t-titulo);line-height:1.2}
.cm-org{font-size:var(--t-min);color:var(--tinta-2);margin:var(--e1) 0 var(--e3)}
.cm-por{display:flex;gap:var(--e1);margin-bottom:var(--e3);flex-wrap:wrap}
.cm-kcal{display:flex;align-items:baseline;gap:var(--e2);margin-bottom:var(--e3)}
.cm-kcal b{font-size:var(--t-placar);line-height:1}
.cm-kcal span{color:var(--tinta-2);font-size:var(--t-apoio)}
.cm-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e2);text-align:center;padding:var(--e3) 0;margin-bottom:var(--e3);
    box-shadow:inset 0 var(--fio-esp) 0 var(--fio),inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.cm-macros b{display:block;font-size:var(--t-num-s)}
.cm-macros .prot{color:var(--prot)} .cm-macros .carb{color:var(--carb)} .cm-macros .gord{color:var(--gord)}
.cm-macros span{font-size:var(--t-min);color:var(--tinta-2)}
.cm-sec{font-size:var(--t-apoio);color:var(--tinta-2);font-weight:600;margin:var(--e4) 0 var(--e1);display:flex;justify-content:space-between;align-items:center;gap:var(--e2)}
.cm-sec small{font-weight:400}
.cm-lin{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:var(--e3);align-items:center;padding:var(--e1) 0;
    box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio);font-size:var(--t-apoio)}
.cm-lin small{color:var(--tinta-2);font-size:var(--t-min)}
.cm-x{background:none;width:var(--alt-toque);height:var(--alt-toque)}
.cm-chips{display:flex;flex-wrap:wrap;gap:var(--e1);align-items:center}
.cm-chip{display:inline-flex;align-items:center;gap:var(--e1);background:var(--rebaixado-2);border:0;border-radius:var(--r-pilula);
    padding:0 0 0 var(--e3);font-size:var(--t-apoio);min-height:calc(var(--alt-ic) - var(--e2))}
.cm-chip button{border:0;background:none;color:var(--tinta-2);width:var(--alt-toque);height:calc(var(--alt-ic) - var(--e2));border-radius:var(--r-pilula);display:grid;place-items:center}
.cm-chip button:hover{color:var(--tinta)}
.cm-chip button .ico{width:var(--e4);height:var(--e4)}
.cm-chip.novo{background:none;box-shadow:inset 0 0 0 var(--fio-esp) var(--contorno);padding:0 var(--e3);color:var(--tinta)}
.cm-form{display:flex;gap:var(--e2);align-items:flex-end;flex-wrap:wrap;margin-top:var(--e2);background:var(--rebaixado);
    border-radius:var(--r-controle);padding:var(--e3)}
.cm-form .cp{flex:1 1 calc(var(--alt-toque) * 3)}
.cm-pe{display:flex;gap:var(--e2);margin-top:var(--e4)}
.cm-pe .btn.primario{flex:1}

/* editores de refeição e de plano (folha) */
.cm-editor{display:flex;flex-direction:column;gap:var(--e3)}
.cm-ed-itens{display:flex;flex-direction:column}
.cm-ed-l{display:grid;grid-template-columns:minmax(0,1fr) calc(var(--alt-toque) * 1.7) auto calc(var(--alt-toque) * .9) auto;gap:var(--e2);
    align-items:center;padding:var(--e1) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.cm-ed-l input{text-align:right}
.cm-ed-un{font-size:var(--t-min);color:var(--tinta-2)}
.cm-ed-k{text-align:right}
.cm-ed-pla{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) calc(var(--alt-toque) * 1.3) auto;gap:var(--e2);align-items:start;
    padding:var(--e1) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.cm-ed-total{display:flex;justify-content:space-between;gap:var(--e3);font-size:var(--t-apoio);color:var(--tinta-2)}
.cm-ed-total .num{font-size:var(--t-num-s);color:var(--tinta)}
.cm-editor > .btn{align-self:flex-start}
@media (max-width:560px){
  .cm-ed-pla{grid-template-columns:minmax(0,1fr) calc(var(--alt-toque) * 1.3) auto}
  .cm-ed-pla .cp:nth-child(2){grid-column:1 / -1;grid-row:2}
}

/* formulário de alimento (componentes/formAlimento.js) */
.fal{display:flex;flex-direction:column;gap:var(--e3)}
.grade3{display:grid;gap:var(--e3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:560px){ .grade3{grid-template-columns:repeat(3,minmax(0,1fr))} }
.fal-dica,.fal-un{font-size:var(--t-min);color:var(--tinta-2)}
.fal-bloco{display:flex;flex-direction:column;gap:var(--e2);padding-top:var(--e3);box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.fal-titulo{font-weight:600;font-size:var(--t-apoio)}
.fal-titulo span{display:block;font-weight:400;color:var(--tinta-2);font-size:var(--t-min)}
.fal-medidas{display:flex;flex-direction:column;gap:var(--e1)}
.fal-medida{display:grid;grid-template-columns:auto minmax(0,1fr) auto calc(var(--alt-toque) * 1.6) auto auto;gap:var(--e2);align-items:center;font-size:var(--t-apoio)}
.fal-vazio{font-size:var(--t-apoio);color:var(--tinta-2)}
.fal-apelidos{display:flex;flex-wrap:wrap;gap:var(--e1)}
.fal-apelido{display:inline-flex;align-items:center;gap:var(--e1);background:var(--rebaixado-2);border-radius:var(--r-pilula);padding:0 0 0 var(--e3);font-size:var(--t-apoio)}
.fal-apelido button{border:0;background:none;color:var(--tinta-2);width:var(--alt-toque);height:calc(var(--alt-ic) - var(--e2));display:grid;place-items:center}
.fal-medida .ic{background:none;width:var(--alt-toque);height:var(--alt-toque)}

@media (min-width:900px){
  .cm-grade{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--e4);align-items:start}
  .cm-seg{max-width:calc(var(--larg-folha) * .93)}
  .cm-grade.so{grid-template-columns:minmax(0,1fr);max-width:calc(var(--larg-folha) * 1.55)}
  .cm-det{position:sticky;top:var(--e5)}
}

/* ============================================================
   AJUSTES (telas/ajustes.js) — especificação: _dev/prot/mockup-ajustes-v1.html
   ============================================================ */
.aj-sec{display:grid;grid-template-columns:calc(var(--alt-toque) - var(--e1)) minmax(0,1fr) auto var(--e4);gap:var(--e3);align-items:center;
    padding:var(--e3) var(--e2);margin:0 calc(var(--e2) * -1);color:var(--tinta);text-decoration:none;
    min-height:var(--alt-toque);transition:background var(--dur)}
.aj-sec + .aj-sec{box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.aj-sec:hover{background:var(--elevado);box-shadow:none;border-radius:var(--r-item)}
.aj-sec[aria-current]{background:var(--acao-suave);box-shadow:none;border-radius:var(--r-item)}
.aj-ico{width:calc(var(--alt-toque) - var(--e1));height:calc(var(--alt-toque) - var(--e1));border-radius:var(--r-controle);background:var(--rebaixado-2);display:grid;place-items:center}
.aj-ico svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.aj-sec b{font-weight:600}
.aj-sec small{display:block;color:var(--tinta-2);font-size:var(--t-min);margin-top:var(--vao)}
.aj-v{font-size:var(--t-apoio);color:var(--tinta-2);text-align:right;font-weight:500}
.aj-seta{color:var(--tinta-2)}
.aj-conta{display:flex;align-items:center;gap:var(--e3);font-size:var(--t-apoio);color:var(--tinta-2);margin-top:var(--e3);padding-top:var(--e3);
    box-shadow:inset 0 var(--fio-esp) 0 var(--fio)}
.aj-conta .btn{margin-left:auto}
.aj-volta{display:inline-flex;align-items:center;gap:var(--e1);color:var(--acao);font-weight:600;text-decoration:none;min-height:var(--alt-toque);margin-bottom:var(--e1)}
.aj-form{display:flex;flex-direction:column;gap:var(--e3)}
.aj-form h2{font-size:var(--t-num-m);line-height:1.1;font-weight:600}
.aj-lead{color:var(--tinta-2);font-size:var(--t-apoio);margin-top:calc(var(--e2) * -1)}
.aj-campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e3)}
.aj-full{grid-column:1 / -1}
.aj-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e2);text-align:center}
.aj-macros > div{display:flex;flex-direction:column;align-items:center;gap:var(--e1)}
.aj-macros b{font-size:var(--t-num-s)}
.aj-macros span{font-size:var(--t-min);color:var(--tinta-2)}
.aj-soma{display:flex;align-items:center;gap:var(--e2);flex-wrap:wrap;font-size:var(--t-apoio);background:var(--rebaixado);border-radius:var(--r-controle);padding:var(--e3)}
.aj-mb{flex:1 1 calc(var(--alt-toque) * 2);display:flex;height:var(--e2);border-radius:var(--r-pilula);overflow:hidden;gap:var(--vao);background:var(--rebaixado-2)}
.aj-mb i{display:block;height:100%}
.aj-mb .p{background:var(--prot)} .aj-mb .c{background:var(--carb)} .aj-mb .g{background:var(--gord)}
.aj-calc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e2)}
.aj-calc > div{background:var(--rebaixado);border-radius:var(--r-controle);padding:var(--e3)}
.aj-calc span{display:block;font-size:var(--t-min);color:var(--tinta-2)}
.aj-calc b{font-size:var(--t-num-s)}
.aj-destaque{color:var(--acao)}
.aj-peso{font-size:var(--t-apoio);color:var(--tinta-2)}
.aj-pe{display:flex;flex-wrap:wrap;gap:var(--e2);margin-top:var(--e1)}
.aj-pe .btn{flex:1 1 auto}
.aj-hist-cab{margin:var(--e5) 0 var(--e1)}
.aj-hist-cab h3{font-size:var(--t-corpo);font-weight:600}
.aj-hist-l{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--e3);align-items:center;padding:var(--e2) 0;
    box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio);font-size:var(--t-apoio)}
.aj-hist-l:last-child{box-shadow:none}
.aj-hist-l small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.aj-hist-l b{font-size:var(--t-titulo)}
.aj-antiga{color:var(--tinta-2)}
.aj-x{background:none;width:var(--alt-toque);height:var(--alt-toque)}
.aj-rec-cab{margin:var(--e2) 0 0}
.aj-rec-cab h3{font-size:var(--t-corpo);font-weight:600}
.aj-rec{display:flex;flex-wrap:wrap;gap:var(--e1);align-items:center}
.aj-rec-i{display:inline-flex;align-items:center;background:var(--rebaixado);border-radius:var(--r-pilula)}
.aj-rec-i .aj-x{width:var(--alt-ic);height:var(--alt-ic)}
.aj-rec-i .aj-x:disabled{opacity:.35;cursor:not-allowed}

@media (min-width:900px){
  .aj-grade{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--e4);align-items:start}
  .aj-lista{position:sticky;top:var(--e5)}
  .aj-lista[hidden],.aj-det[hidden]{display:block !important}
  .aj-volta{display:none}
  .aj-pe .btn.primario{flex:none}
}

/* ============================================================
   TREINO (telas/treino.js, cardio.js, progressao.js)
   especificação: _dev/prot/mockup-treino-v1.html
   ============================================================ */
.tr-seg{display:flex;gap:var(--e1);margin-bottom:var(--e3);overflow-x:auto;scrollbar-width:none}
.tr-seg .pil{text-decoration:none;flex:none}
.tr-grade > div{min-width:0}
.tr-cab{align-items:flex-start}
.tr-dir{margin-left:auto;display:flex;align-items:center;gap:var(--e3)}
.tr-tempo{display:inline-flex;align-items:center;gap:var(--e1);font-size:var(--t-apoio);color:var(--tinta-2)}
.tr-tempo svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.tr-tempo b{font-size:var(--t-titulo);color:var(--tinta)}
.tr-dir .btn{border-radius:var(--r-pilula)}

/* trilha dos exercícios, só no celular */
.tr-trilha{display:flex;gap:var(--e1);overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--e4) * -1) var(--e3);padding:0 var(--e4)}
.tr-ch{flex:none;border:0;border-radius:var(--r-item);background:var(--painel);color:var(--tinta-2);padding:var(--e2) var(--e3);text-align:left;
    min-width:calc(var(--alt-toque) * 2.7);min-height:var(--alt-toque);transition:background var(--dur)}
.tr-ch:hover{background:var(--elevado)}
.tr-ch b{display:block;color:var(--tinta);font-size:var(--t-apoio);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(var(--alt-toque) * 3.4)}
.tr-ch small{font-size:var(--t-min)}
.tr-ch[aria-current=true]{background:var(--acao-suave);box-shadow:inset 0 0 0 var(--traco-foco) var(--acao)}
.tr-pts{display:flex;gap:calc(var(--vao) + 1px);margin-top:var(--e1)}
.tr-pts i{width:var(--e3);height:var(--e1);border-radius:var(--vao);background:var(--rebaixado-2)}
.tr-pts i.f{background:var(--ok)}

/* o exercício da vez */
.tr-ex-cab{display:flex;align-items:flex-start;gap:var(--e2)}
.tr-ex h2{font-size:var(--t-num-s);font-weight:600;line-height:1.15;flex:1}
.tr-x{background:none;width:var(--alt-toque);height:var(--alt-toque);flex:none}
.tr-ult{font-size:var(--t-apoio);color:var(--tinta-2);margin-top:var(--e1)}
.tr-ult b{color:var(--tinta);font-weight:600}
.tr-fig{margin:var(--e3) calc(var(--e2) * -1) var(--e1);border-radius:var(--r-item);padding:var(--e2) 0 0;
    background:radial-gradient(120% 90% at 50% 30%,var(--elevado),var(--painel) 70%)}
.barra-fig{display:block;width:100%;height:auto;max-width:calc(var(--larg-folha) * .62);margin:0 auto}
.tr-carga{display:flex;justify-content:center;align-items:baseline;gap:var(--e2);font-size:var(--t-apoio);color:var(--tinta-2);margin-bottom:var(--e3);flex-wrap:wrap}
.tr-carga b{font-size:var(--t-num-l);color:var(--tinta)}
.tr-primeira{background:var(--atencao-suave);color:var(--atencao);border-radius:var(--r-controle);padding:var(--e3);font-size:var(--t-apoio);margin:var(--e3) 0;
    display:flex;flex-direction:column;gap:var(--e2)}
.tr-op{display:flex;gap:var(--e1);flex-wrap:wrap}
.tr-outra{display:flex;gap:var(--e2);align-items:flex-end}
.tr-outra .cp{flex:1}
.tr-outra label{color:var(--atencao)}

.tr-series{margin-top:var(--e2)}
.tr-cabs,.tr-s{display:grid;grid-template-columns:var(--e4) minmax(0,.9fr) minmax(0,1.3fr) minmax(0,1.1fr) var(--alt-toque);gap:var(--e2);align-items:center}
.tr-cabs{font-size:var(--t-min);color:var(--tinta-2);padding:0 var(--vao) var(--e1)}
.tr-s{padding:var(--e2) var(--vao);border-radius:var(--r-item);transition:background var(--dur)}
.tr-s + .tr-s{margin-top:var(--vao)}
.tr-s.agora{background:var(--elevado)}
.tr-s.feita{opacity:.7}
.tr-n{font-weight:700;color:var(--tinta-2);text-align:center}
.tr-ant{font-size:var(--t-apoio);color:var(--tinta-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-passo{display:grid;grid-template-columns:minmax(var(--e6),1fr) auto minmax(var(--e6),1fr);align-items:center;background:var(--rebaixado);
    border-radius:var(--r-controle);min-height:var(--alt-toque)}
.tr-passo button{border:0;background:none;min-height:var(--alt-toque);color:var(--tinta-2);font-size:var(--t-titulo);border-radius:var(--r-controle);
    transition:color var(--dur),background var(--dur)}
.tr-passo button:hover{color:var(--tinta);background:var(--rebaixado-2)}
.tr-passo .num{text-align:center;font-size:var(--t-titulo);min-width:var(--e5)}
.tr-ok{width:var(--alt-toque);height:var(--alt-toque);border:0;border-radius:var(--r-controle);background:var(--rebaixado-2);color:var(--tinta-2);
    display:grid;place-items:center;transition:background var(--dur),color var(--dur)}
.tr-ok:hover{color:var(--tinta)}
.tr-ok svg{width:var(--ico);height:var(--ico);fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.tr-ok[aria-pressed=true]{background:var(--ok);color:var(--sobre-acao)}
.tr-mais{display:flex;gap:var(--e2);margin-top:var(--e2)}

/* descanso: preso no pé no celular, na coluna da direita no computador */
.tr-desc{position:fixed;left:var(--e2);right:var(--e2);bottom:calc(var(--alt-nav) + var(--e2) + env(safe-area-inset-bottom));z-index:20;
    background:var(--elevado);border-radius:var(--r-folha);box-shadow:var(--sombra);padding:var(--e2) var(--e3);display:flex;align-items:center;gap:var(--e3)}
.tr-desc .anel{width:calc(var(--alt-toque) + var(--e2));height:auto}
.tr-desc-t{flex:1}
.tr-desc-t b{display:block;font-size:var(--t-num-m);line-height:1}
.tr-desc-t small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.tr-anda{padding-bottom:calc(var(--alt-toque) * 2)}

/* resumo e lista do treino */
.tr-res{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e2);text-align:center;margin-bottom:var(--e3)}
.tr-res b{display:block;font-size:var(--t-num-m)}
.tr-res span{font-size:var(--t-min);color:var(--tinta-2)}
.tr-it{display:grid;grid-template-columns:calc(var(--alt-toque) - var(--e4)) minmax(0,1fr) auto;gap:var(--e3);align-items:center;width:100%;border:0;
    background:none;text-align:left;padding:var(--e2) 0;min-height:var(--alt-toque);box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.tr-it:last-child{box-shadow:none}
.tr-it small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.tr-bol{width:calc(var(--alt-toque) - var(--e4));height:calc(var(--alt-toque) - var(--e4));border-radius:var(--r-pilula);background:var(--rebaixado-2);
    display:grid;place-items:center;font-size:var(--t-min);font-weight:700;color:var(--tinta-2)}
.tr-it.feito .tr-bol{background:var(--ok);color:var(--sobre-acao)}
.tr-it.agora .tr-bol{background:var(--acao);color:var(--sobre-acao)}
.tr-add{display:flex;gap:var(--e2);align-items:flex-start;margin-top:var(--e3)}
.tr-add .cp{flex:1}
.tr-descartar{margin:var(--e1) 0 var(--e4)}
.tr-pend .txt-cad + .txt-cad{margin-top:var(--e2)}

/* tela inicial, fichas, histórico, cardio e progressão */
.tr-atalhos{display:flex;gap:var(--e1);flex-wrap:wrap;margin-top:var(--e3)}
.tr-atalhos .pil{white-space:normal;text-align:left}
.tr-lin{display:flex;align-items:center;gap:var(--e3);padding:var(--e2) 0;min-height:var(--alt-toque);box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.tr-lin:last-child{box-shadow:none}
.tr-lin > span:first-child{flex:1;min-width:0}
.tr-lin small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.tr-lin-acoes{display:flex;align-items:center;gap:var(--e1);flex:none}
.tr-pro-v{text-align:right}
.tr-pro-v b{font-size:var(--t-corpo)}
.tr-bib{display:flex;flex-direction:column;gap:var(--e2)}
.tr-bib-nome{border:0;background:none;text-align:left;min-height:var(--alt-toque);flex:1;color:var(--tinta)}
.tr-bib-nome:hover{color:var(--acao)}
.tr-fi-itens{display:flex;flex-direction:column;gap:var(--e3)}
.tr-fi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:var(--e2);align-items:end;padding-bottom:var(--e3);
    box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.tr-fi-ex{grid-column:1 / -2}
.tr-num{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e2);margin-bottom:var(--e3)}
.tr-num .painel{margin:0;padding:var(--e3)}
.tr-num span{display:block;font-size:var(--t-min);color:var(--tinta-2);font-weight:600}
.tr-num b{display:block;font-size:var(--t-num-m);line-height:1.1}
.tr-num small{display:block;font-size:var(--t-min);color:var(--tinta-2)}
.tr-num small.bom{color:var(--ok);font-weight:600}
.tr-conta{font-size:var(--t-apoio);color:var(--tinta-2);background:var(--rebaixado);border-radius:var(--r-controle);padding:var(--e2) var(--e3)}
.tr-car-form{display:flex;flex-direction:column;gap:var(--e3)}
.tr-car-form .tr-add{margin-top:0}
.tr-pro-barra{display:flex;flex-direction:column;gap:var(--e2);margin-bottom:var(--e3)}
.tr-pro-leituras{display:flex;gap:var(--e1);flex-wrap:wrap}

/* gráfico de linha (componentes/grafico.js) */
.graf{display:block;width:100%;height:auto}
.graf-grade{stroke:var(--fio)}
.graf-eixo{font-family:var(--f-tela);font-size:var(--t-min);fill:var(--tinta-2)}
.graf-linha{fill:none;stroke:var(--acao);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.graf-ponto{fill:var(--painel);stroke:var(--acao);stroke-width:2}
.graf-ponto.ultimo{fill:var(--acao)}
.graf-valor{font-family:var(--f-num);font-stretch:var(--num-larg);font-weight:var(--num-peso);font-size:var(--t-num-s);fill:var(--tinta)}

@media (min-width:900px){
  .tr-grade{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--e4);align-items:start}
  .tr-trilha{display:none}
  .tr-desc{position:static;box-shadow:none;background:var(--painel);border-radius:var(--r-painel);margin-bottom:var(--e3);padding:var(--e3) var(--e4)}
  .tr-anda{padding-bottom:0}
  .tr-num{grid-template-columns:repeat(4,minmax(0,1fr))}
  .tr-pro-barra{flex-direction:row;align-items:center}
  .tr-pro-barra .cp{flex:1}
}

/* ============================================================
   CORPO (telas/corpo.js, componentes/silhueta.js)
   especificação: _dev/prot/mockup-corpo-v1.html
   ============================================================ */
.cp-reg{margin-left:auto}
.cp-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e2);margin-bottom:var(--e3)}
.cp-k{background:var(--painel);border-radius:var(--r-painel);padding:var(--e3) var(--e4);min-width:0}
.cp-k > span:first-child{display:block;font-size:var(--t-min);color:var(--tinta-2);font-weight:600}
.cp-k b{display:block;font-size:var(--t-num-m);line-height:1.1;margin-top:var(--vao)}
.cp-k b small{font-family:var(--f-tela);font-stretch:normal;font-size:var(--t-apoio);font-weight:500;color:var(--tinta-2);margin-left:var(--e1)}
.cp-d{display:block;font-size:var(--t-min);font-weight:600;color:var(--tinta-2)}
.cp-d.bom{color:var(--ok)}
.cp-d a{color:var(--acao)}
.cp-k svg{display:block;width:100%;height:var(--e5);margin-top:var(--e1)}
.cp-spark{fill:none;stroke:var(--acao);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}

/* a figura ocupa a largura do painel: no celular estreito o texto dos anéis não passa do piso */
.cp-fig{background:radial-gradient(90% 70% at 50% 35%,var(--elevado),var(--painel) 72%);margin:0 calc(var(--e4) * -1)}
.sil{display:block;width:100%;max-width:var(--larg-silhueta);height:auto;margin:0 auto}
.sil text{font-family:var(--f-tela);font-size:var(--t-min);fill:var(--tinta-2)}
.sil .sil-vl{fill:var(--tinta);font-weight:600;font-size:var(--t-apoio)}
.sil-ok{fill:var(--ok);font-weight:600}
.sil-falta{font-weight:600}
.sil-seta{font-weight:400}
.sil .sil-meta{fill:var(--acao)}
.sil-anel-tras{fill:none;stroke:var(--acao);stroke-width:1.5;stroke-dasharray:3 3;opacity:.5}
.sil-anel{fill:none;stroke:var(--acao);stroke-width:2.4;stroke-linecap:round}
.sil-ponto{fill:var(--acao)}
.sil-guia{stroke:var(--contorno);stroke-width:1}
.sil-def{fill:none;stroke:var(--treva);stroke-opacity:.35;stroke-width:1.4;stroke-linecap:round}
.sil-def-luz{fill:none;stroke:var(--luz);stroke-opacity:.1;stroke-width:1;stroke-linecap:round}
.sil-hoje{fill:none;stroke:var(--atencao);stroke-width:1.3;stroke-dasharray:3 3;opacity:.9}
.cp-ctr{display:flex;gap:var(--e2);align-items:center;flex-wrap:wrap;margin-top:var(--e3);font-size:var(--t-apoio);color:var(--tinta-2)}
.cp-ctr b{color:var(--tinta);font-weight:600}
.cp-trac{color:var(--atencao)}
.cp-ctr label{display:inline-flex;align-items:center;gap:var(--e2);margin-left:auto;cursor:pointer;min-height:var(--alt-toque)}
.cp-ajustar{margin-top:var(--e1);text-decoration:none;color:var(--acao)}

.cp-pils{display:flex;gap:var(--e1);overflow-x:auto;scrollbar-width:none;margin-bottom:var(--e3)}
.cp-pils .pil{flex:none}
.cp-evol,.cp-dias{display:block;width:100%;height:auto}
.cp-area{fill:var(--acao);opacity:.1}
.cp-ult{font-family:var(--f-tela);font-size:var(--t-corpo);font-weight:600;fill:var(--tinta)}

.cp-def-v{display:flex;align-items:baseline;gap:var(--e2);flex-wrap:wrap}
.cp-def-v b{font-size:var(--t-num-l);line-height:1}
.cp-def-v b.bom{color:var(--ok)}
.cp-def-v b.atencao{color:var(--atencao)}
.cp-def-v span{font-size:var(--t-apoio);color:var(--tinta-2)}
.cp-comp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e2);margin:var(--e3) 0}
.cp-comp > div{background:var(--rebaixado);border-radius:var(--r-controle);padding:var(--e2) var(--e3)}
.cp-comp span,.cp-comp small{display:block;font-size:var(--t-min);color:var(--tinta-2)}
.cp-comp b{font-size:var(--t-num-s)}
.cp-zero{stroke:var(--contorno)}
.cp-sem{fill:var(--contorno)}
.cp-b-def{fill:var(--ok);opacity:.9}
.cp-b-sup{fill:var(--atencao);opacity:.9}
.cp-b-luz{fill:var(--luz);opacity:.16}
.cp-b-v{font-family:var(--f-tela);font-size:var(--t-min);font-weight:600;fill:var(--tinta)}
.cp-nota{font-size:var(--t-min);color:var(--tinta-2);margin-top:var(--e1)}

.cp-reg-l{display:flex;align-items:center;gap:var(--e1);box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio)}
.cp-reg-l:last-child{box-shadow:none}
.cp-reg-b{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--e3);align-items:center;
     border:0;background:none;color:inherit;font:inherit;text-align:left;padding:var(--e2);min-height:var(--alt-toque);cursor:pointer}
.cp-reg-b:hover{background:var(--elevado);border-radius:var(--r-item)}
.cp-reg-b small{display:block;color:var(--tinta-2);font-size:var(--t-min)}
.cp-reg-b b{font-size:var(--t-titulo)}
.cp-reg-b .cp-reg-g{color:var(--tinta-2)}
.cp-folha{display:flex;flex-direction:column;gap:var(--e3)}

/* Ajustes → Meta do corpo: medida | hoje | meta */
.aj-med{display:grid;grid-template-columns:minmax(0,1fr) calc(var(--alt-toque) * 1.4) calc(var(--alt-toque) * 2);gap:var(--e3);align-items:center;
     padding:var(--e1) 0;box-shadow:inset 0 calc(var(--fio-esp) * -1) 0 var(--fio);font-size:var(--t-corpo)}
.aj-med:last-of-type{box-shadow:none}
.aj-med-h{color:var(--tinta-2);text-align:right}
.aj-med .cp{display:contents}
.aj-med input{text-align:right}
.aj-med .msg-erro{grid-column:1 / -1;text-align:right}
.aj-med-cab{font-size:var(--t-min);color:var(--tinta-2);box-shadow:none;padding-bottom:0;margin-bottom:calc(var(--e2) * -1)}
.aj-med-cab span:not(:first-child){text-align:right}

@media (min-width:900px){
  .cp-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cp-grade{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--e4);align-items:start}
  .cp-grade > div{min-width:0}
}

/* Treino → Concluir: intensidade da musculação (mockup-concluir-v1, 29/10/2026) */
.tr-int{display:flex;flex-direction:column;gap:var(--e2)}
.tr-int-cab{display:flex;align-items:center;gap:var(--e2)}
.tr-int-cab .cp-rot{flex:1}
.tr-int-pils{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e1)}
.tr-int-pils .pil{justify-content:center;min-height:var(--alt-toque)}
.tr-int-pils .pil small{font-size:var(--t-min);font-weight:400;opacity:.8;margin-left:var(--e1)}
.tr-int-sug{font-size:var(--t-apoio);color:var(--tinta-2)}
.tr-int-sug b{color:var(--tinta);font-weight:600}
.tr-int-sug .troca{color:var(--atencao)}