/* =========================================================
   IRONLOG — estilo inspirado no Hevy
   Fundo preto, azul como cor principal, tipografia limpa (Inter),
   navegação de 3 abas, tipos de série coloridos e barra de descanso.
   ========================================================= */

:root{
  --bg:        #000000;
  --surface:   #1A1A1C;   /* cards                       */
  --surface-2: #2C2C2E;   /* inputs / pills              */
  --surface-3: #3A3A3C;   /* hover / divisórias          */
  --border:    #2A2A2C;

  --text:      #FFFFFF;
  --text-dim:  #8E8E93;
  --text-mute: #5A5A5E;

  --accent:    #F16719;   /* laranja MyEvo               */
  --accent-d:  #C9530F;

  /* tipos de série */
  --warmup:    #F5A623;   /* W — aquecimento (âmbar)     */
  --failure:   #FF453A;   /* F — falha (vermelho)        */
  --drop:      #0A84FF;   /* D — drop (azul)             */
  --gold:      #FFC93C;   /* medalha / recordes          */
  --up:        #30D158;   /* progressão                  */
  --down:      #FF453A;

  /* cores por grupo muscular (avatares e gráficos) */
  --m-peito:#FF6B5E; --m-costas:#5E9BFF; --m-ombros:#FFB020; --m-biceps:#34D399;
  --m-triceps:#A78BFA; --m-pernas:#FB923C; --m-gluteos:#F472B6; --m-abdomen:#2DD4BF;
  --m-antebraco:#22D3EE; --m-panturrilha:#A3E635; --m-cardio:#94A3B8;

  --radius:14px; --radius-sm:10px;
  --tabbar-h:60px;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
html,body{ height:100%; }
body{
  font-family:var(--font); background:var(--bg); color:var(--text);
  line-height:1.45; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
button{ font-family:inherit; cursor:pointer; color:inherit; border:none; background:none; }
input,select,textarea{ font-family:inherit; font-size:16px; color:var(--text); background:var(--surface-2); }
input:focus,select:focus,textarea:focus{ outline:none; box-shadow:0 0 0 2px var(--accent); }
::placeholder{ color:var(--text-mute); }
/* remove os spinners brancos dos campos numéricos */
input[type=number]{ -moz-appearance:textfield; appearance:textfield; }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }
/* impede o autofill do Chrome de pintar o fundo de branco */
input:-webkit-autofill,input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text);
  -webkit-box-shadow:0 0 0 1000px var(--surface-2) inset; caret-color:var(--text); }
a{ color:var(--accent); text-decoration:none; }
[hidden]{ display:none !important; }

::-webkit-scrollbar{ width:7px; height:7px; }
::-webkit-scrollbar-thumb{ background:var(--surface-3); border-radius:8px; }
@media (prefers-reduced-motion: reduce){ *{ animation:none!important; transition:none!important; } }

/* ---------- LAYOUT ---------- */
.app{ max-width:720px; margin:0 auto; padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 16px); }
.view{ animation:fade .2s ease; }
@keyframes fade{ from{opacity:0} to{opacity:1} }
.pad{ padding:0 16px; }

/* cabeçalho de cada tela */
.vhead{
  position:sticky; top:0; z-index:20; background:rgba(0,0,0,.82); backdrop-filter:blur(12px);
  padding:calc(env(safe-area-inset-top) + 12px) 16px 12px;
  display:flex; align-items:center; gap:10px;
}
.vhead h1{ font-size:26px; font-weight:800; letter-spacing:-.5px; flex:1; }
.vhead__actions{ display:flex; gap:6px; }
.icon-btn{ width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
  font-size:18px; color:var(--text); transition:background .15s; }
.icon-btn:active{ background:var(--surface-2); }
.pro{ background:var(--gold); color:#000; font-weight:800; font-size:12px; padding:5px 10px; border-radius:8px; }

/* ---------- NAV INFERIOR (3 abas) ---------- */
.tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));
  padding-bottom:env(safe-area-inset-bottom);
  display:flex; background:rgba(20,20,22,.94); backdrop-filter:blur(16px);
  border-top:1px solid var(--border);
}
.tab{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  font-size:11px; font-weight:600; color:var(--text-mute); }
.tab__ico{ display:flex; align-items:center; justify-content:center; line-height:1; }
.tab__ico svg{ display:block; color:inherit; }
.tab.is-active{ color:var(--accent); }

/* ---------- BOTÕES ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 18px; border-radius:var(--radius-sm); font-weight:700; font-size:15px;
  background:var(--surface-2); transition:transform .1s, background .15s; }
.btn:active{ transform:scale(.98); }
.btn--primary{ background:var(--accent); color:#fff; }
.btn--primary:active{ background:var(--accent-d); }
.btn--block{ width:100%; }
.btn--sm{ padding:9px 14px; font-size:13px; }
.btn--danger{ color:var(--failure); }
.btn--ghost{ background:var(--surface); }

/* ---------- CARDS ---------- */
.card{ background:var(--surface); border-radius:var(--radius); padding:16px; margin:0 16px 14px; }
.card__h{ font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.6px;
  color:var(--text-dim); margin-bottom:12px; }

/* avatar/thumbnail circular por grupo muscular */
.thumb{ width:42px; height:42px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center;
  font-size:16px; font-weight:800; color:#000; }
.thumb--sm{ width:34px; height:34px; font-size:13px; }
.thumb--img{ background-size:cover; background-position:center; background-repeat:no-repeat; background-color:var(--surface-3); }
.ex-photo{ width:100%; height:200px; object-fit:cover; border-radius:var(--radius); margin-bottom:16px; display:block; background:var(--surface-2); }
.ex-anim{ position:relative; width:100%; height:200px; border-radius:var(--radius); overflow:hidden;
  margin-bottom:16px; background:var(--surface-2); cursor:pointer; }
.ex-anim img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ex-anim__b{ animation:exFrame 1.8s steps(1,end) infinite; }
@keyframes exFrame{ 0%,45%{opacity:0} 55%,95%{opacity:1} 100%{opacity:0} }
.ex-anim__zoom{ position:absolute; right:8px; bottom:8px; z-index:2; background:rgba(0,0,0,.55);
  color:#fff; font-size:12.5px; font-weight:600; padding:4px 9px; border-radius:8px; }
.ex-anim--full{ width:min(88vw,460px); height:min(60vh,460px); margin:0; cursor:default; }
.sx__thumb{ padding:0; background:none; border:none; cursor:pointer; line-height:0; }
.sx__thumb--vid{ position:relative; display:inline-block; }
.sx__play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,.55); color:#fff; font-size:10px; line-height:22px; text-align:center; padding-left:2px; pointer-events:none; }
.sx__vid{ margin-left:auto; background:var(--surface-2); color:var(--accent); border:1px solid var(--surface-3);
  font-size:12px; font-weight:600; padding:5px 10px; border-radius:999px; cursor:pointer; -webkit-tap-highlight-color:transparent; white-space:nowrap; }
.sx__vid:active{ background:var(--surface-3); }
.lrow .sx__vid{ margin-left:8px; }
.lightbox__video{ width:min(92vw,720px); max-height:70vh; border-radius:14px; background:#000; border:none; }
.lightbox__video iframe, .lightbox__video{ aspect-ratio:16/9; }
div.lightbox__video{ overflow:hidden; }
div.lightbox__video iframe{ width:100%; height:100%; border:0; }
.lightbox{ position:fixed; inset:0; z-index:1000; background:rgba(0,0,0,.88);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:24px; }
.lightbox__title{ color:#fff; font-size:18px; font-weight:700; text-align:center; }
.lightbox__close{ background:var(--surface-2); color:var(--text); border:none; padding:12px 30px;
  border-radius:999px; font-size:15px; font-weight:600; cursor:pointer; }

/* ---------- FEED (Início = histórico) ---------- */
.feed-card{ background:var(--surface); border-radius:var(--radius); padding:16px; margin:0 16px 14px; }
.feed-top{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.feed-top .avatar{ width:40px; height:40px; border-radius:50%; background:var(--surface-3);
  display:grid; place-items:center; font-weight:800; color:var(--text); }
.feed-top b{ font-size:15px; } .feed-top span{ font-size:12.5px; color:var(--text-dim); }
.feed-title{ font-size:21px; font-weight:800; letter-spacing:-.3px; margin-bottom:10px; }
.feed-stats{ display:flex; gap:26px; margin-bottom:14px; }
.feed-stat .l{ font-size:12px; color:var(--text-dim); }
.feed-stat .v{ font-size:16px; font-weight:700; display:flex; align-items:center; gap:5px; }
.feed-ex{ display:flex; align-items:center; gap:11px; padding:5px 0; }
.feed-ex .name{ font-size:14.5px; }
.feed-more{ color:var(--text-dim); font-size:13.5px; padding:6px 0 0; }

/* ---------- ROTINAS (Treino) ---------- */
.routine{ background:var(--surface); border-radius:var(--radius); padding:16px; margin:0 16px 14px; }
.routine__top{ display:flex; align-items:start; justify-content:space-between; }
.routine__title{ font-size:18px; font-weight:800; }
.routine__sub{ font-size:13.5px; color:var(--text-dim); margin:4px 0 14px; line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ---------- LISTAS / LINHAS ---------- */
.lrow{ display:flex; align-items:center; gap:13px; padding:13px 16px; background:var(--surface);
  border-bottom:1px solid var(--border); }
.lrow:active{ background:var(--surface-2); }
.lrow__main{ flex:1; min-width:0; }
.lrow__title{ font-size:15.5px; font-weight:600; }
.lrow__sub{ font-size:13px; color:var(--text-dim); margin-top:1px; }
.lrow__chev{ color:var(--text-mute); font-size:20px; }
.list-group{ border-radius:var(--radius); overflow:hidden; margin:0 16px 14px; }
.list-group .lrow:last-child{ border-bottom:none; }

/* search + chips */
.searchbar{ margin:0 16px 12px; position:relative; }
.searchbar input{ width:100%; padding:12px 14px 12px 40px; border-radius:var(--radius-sm);
  background:var(--surface-2); border:none; }
.searchbar::before{ content:"⌕"; position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:var(--text-dim); font-size:18px; }
.chips{ display:flex; gap:8px; overflow-x:auto; padding:0 16px 12px; scrollbar-width:none; }
.chips::-webkit-scrollbar{ display:none; }
.chip{ padding:8px 14px; border-radius:999px; font-size:13px; font-weight:600; white-space:nowrap;
  background:var(--surface-2); color:var(--text); }
.chip.is-active{ background:var(--accent); color:#fff; }

/* ---------- ESTATÍSTICAS / GRID ---------- */
.statgrid{ display:flex; gap:24px; }
.statgrid .s .v{ font-size:22px; font-weight:800; }
.statgrid .s .l{ font-size:12px; color:var(--text-dim); }
.bigstats{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:0 16px 14px; }
.bigstats .s{ background:var(--surface); border-radius:var(--radius); padding:14px; }
.bigstats .v{ font-size:24px; font-weight:800; white-space:nowrap; }
.bigstats .v small{ font-size:13px; color:var(--text-dim); font-weight:600; }
.bigstats .l{ font-size:11.5px; color:var(--text-dim); margin-top:4px; }

/* segmentos Volume/Reps/Duração */
.seg{ display:flex; gap:8px; margin-bottom:14px; }
.seg__btn{ padding:8px 16px; border-radius:999px; font-size:13.5px; font-weight:700;
  background:var(--surface-2); color:var(--text); }
.seg__btn.is-active{ background:var(--accent); color:#fff; }

/* metas */
.goal{ margin-bottom:12px; }
.goal__top{ display:flex; justify-content:space-between; font-size:13.5px; margin-bottom:6px; }
.goal__bar{ height:7px; border-radius:5px; background:var(--surface-2); overflow:hidden; }
.goal__fill{ height:100%; background:var(--accent); border-radius:5px; transition:width .5s; }

/* week dots */
.weekdots{ display:flex; gap:6px; }
.weekdot{ flex:1; text-align:center; font-size:10px; color:var(--text-mute); text-transform:uppercase; }
.weekdot b{ display:grid; place-items:center; width:100%; max-width:34px; aspect-ratio:1; margin:5px auto 0;
  border-radius:50%; background:var(--surface-2); font-size:13px; color:var(--text-mute); }
.weekdot.done b{ background:var(--accent); color:#fff; }
.weekdot.today b{ box-shadow:0 0 0 2px var(--accent); }

/* medalha / pr */
.medal{ color:var(--gold); }
.delta{ font-size:13px; font-weight:700; }
.delta--up{ color:var(--up); } .delta--down{ color:var(--down); } .delta--eq{ color:var(--text-mute); }

/* ---------- SESSÃO ATIVA ---------- */
.session{ position:fixed; inset:0; z-index:60; background:var(--bg); display:flex; flex-direction:column;
  animation:slideUp .25s ease; }
@keyframes slideUp{ from{ transform:translateY(100%);} to{ transform:none; } }
.session__bar{ display:flex; align-items:center; gap:10px; padding:calc(env(safe-area-inset-top) + 10px) 14px 10px;
  border-bottom:1px solid var(--border); }
.session__bar .ttl{ flex:1; font-size:17px; font-weight:600; color:var(--text-dim); }
.session__stats{ display:flex; gap:0; padding:12px 16px; border-bottom:1px solid var(--border); }
.session__stats .s{ flex:1; }
.session__stats .l{ font-size:12px; color:var(--text-dim); }
.session__stats .v{ font-size:18px; font-weight:700; margin-top:2px; }
.session__stats .v.dur{ color:var(--accent); }
.session__body{ flex:1; overflow-y:auto; padding:14px 0 24px; }

/* card de exercício na sessão */
.sx{ margin:0 16px 22px; }
.sx__head{ display:flex; align-items:center; gap:11px; margin-bottom:4px; }
.sx__name{ flex:1; font-size:16.5px; font-weight:700; color:var(--accent); }
.sx__menu{ color:var(--text-dim); font-size:22px; padding:0 4px; }
.sx__note{ width:100%; background:none; border:none; color:var(--text-dim); font-size:14px;
  padding:2px 0 8px; }
.sx__rest{ color:var(--accent); font-size:13px; margin-bottom:8px; display:inline-flex; align-items:center; gap:6px;
  background:var(--surface-2); padding:5px 12px; border-radius:999px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.sx__rest:active{ background:var(--surface-3); }
.sx__rest-edit{ color:var(--text-dim); font-size:12px; font-weight:600; }
.sx__rest--locked{ color:var(--text-dim); background:var(--surface-2); cursor:default; }
.sx__rest--locked:active{ background:var(--surface-2); }
.sx__rest-lock{ color:var(--text-dim); font-size:11px; font-weight:600; }
.set-table{ width:100%; border-collapse:collapse; }
.set-table th{ font-size:11px; color:var(--text-dim); font-weight:600; text-transform:uppercase;
  letter-spacing:.4px; padding:4px 4px; }
.set-table th.c1{ width:38px; text-align:left; } .set-table th.cc{ text-align:center; } .set-table th.ck{ width:40px; } .set-table th.ckn{ width:30px; }
.set-row td{ padding:3px 4px; }
.set-row{ border-radius:8px; }
.set-row.done td{ background:rgba(241,103,25,.12); }
.set-row.done td:first-child{ border-radius:8px 0 0 8px; } .set-row.done td:last-child{ border-radius:0 8px 8px 0; }
.set-badge{ width:30px; height:30px; border-radius:8px; display:grid; place-items:center;
  font-weight:800; font-size:14px; background:var(--surface-2); }
.set-prev{ font-size:13px; color:var(--text-mute); text-align:center; }
.set-input{ width:100%; max-width:74px; margin:0 auto; display:block; text-align:center; padding:8px 4px;
  background:var(--surface-2); border:none; border-radius:8px; font-size:15px; font-weight:700; }
.set-row.done .set-input{ background:transparent; }
.set-check{ width:32px; height:32px; border-radius:8px; display:grid; place-items:center; margin:0 auto;
  background:var(--surface-2); color:var(--text-mute); font-size:15px; transition:all .12s; }
.set-row.done .set-check{ background:var(--accent); color:#fff; }
.set-note-btn{ width:26px; height:26px; border-radius:8px; display:grid; place-items:center; margin:0 auto;
  background:transparent; color:var(--text-mute); font-size:13px; opacity:.45; }
.set-note-btn.has-note{ opacity:1; background:rgba(241,103,25,.16); color:var(--accent); }
/* Comentário de série no histórico (dentro da tabela de séries do modal de detalhe).
   Antes era texto solto sem nenhum destaque; agora vira um bloco com a mesma
   linguagem visual da resposta do personal no feedback (borda + fundo laranja). */
.set-row td.set-hist-note{ padding:8px 10px !important; font-size:13px; line-height:1.45; color:var(--text);
  background:rgba(241,103,25,.08); border-left:3px solid var(--accent); border-radius:0 8px 8px 0;
  text-align:left; white-space:pre-wrap; }
.sx__add{ width:100%; margin-top:8px; padding:11px; border-radius:8px; background:var(--surface);
  color:var(--text); font-size:14px; font-weight:600; }
.sx__add:active{ background:var(--surface-2); }
.sx__add--warm{ background:rgba(245,166,35,.10); color:#F5A623; }
.set-badge--w{ position:relative; width:30px; height:30px; border-radius:8px; display:grid; place-items:center;
  background:var(--surface-2); font-weight:800; font-size:14px; }
.set-badge-x{ position:absolute; top:-6px; right:-6px; width:16px; height:16px; border-radius:50%;
  background:#FF453A; color:#fff; font-size:9px; line-height:1; display:grid; place-items:center; }
.session__foot{ padding:6px 16px 26px; }
.session__foot .row2{ display:flex; gap:10px; margin-top:10px; }
.session__foot .row2 .btn{ flex:1; }

/* mini barra de sessão */
.session-mini{ position:fixed; left:12px; right:12px; bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 8px);
  z-index:45; display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:12px;
  background:var(--accent); color:#fff; font-weight:700; box-shadow:0 8px 24px rgba(241,103,25,.45); }
.session-mini .dot{ width:8px; height:8px; border-radius:50%; background:#fff; animation:pulse 1.4s infinite; }
@keyframes pulse{ 50%{ opacity:.3; } }
.session-mini .t{ margin-left:auto; }

/* ---------- DESCANSO (barra inferior) ---------- */
.rest{ position:fixed; left:0; right:0; bottom:0; z-index:70; background:var(--surface);
  padding:12px 14px calc(env(safe-area-inset-bottom) + 12px); animation:slideUp .2s ease;
  max-width:720px; margin:0 auto; }
.rest__progress{ height:3px; border-radius:3px; background:var(--surface-3); margin-bottom:14px; overflow:hidden; }
.rest__progress > div{ height:100%; background:var(--accent); width:100%; transition:width 1s linear; }
.rest__row{ display:flex; align-items:center; gap:10px; }
.rest__row .seg-btn{ background:var(--surface-2); padding:13px 0; border-radius:10px; font-weight:700; min-width:64px; }
.rest__count{ flex:1; text-align:center; font-size:30px; font-weight:800; font-variant-numeric:tabular-nums; }
.rest__skip{ background:var(--accent); color:#fff; padding:13px 22px; border-radius:10px; font-weight:700; }
.rest.alert .rest__count{ color:var(--warmup); }
.rest.alert .rest__progress > div{ background:var(--warmup); }

/* ---------- TELA EMPILHÁVEL ---------- */
.screen{ position:fixed; inset:0; z-index:55; background:var(--bg); display:flex; flex-direction:column;
  animation:slideRight .22s ease; }
@keyframes slideRight{ from{ transform:translateX(100%);} to{ transform:none; } }
.screen__bar{ display:flex; align-items:center; gap:6px; padding:calc(env(safe-area-inset-top) + 12px) 12px 12px;
  border-bottom:1px solid var(--border); }
.screen__bar h1{ flex:1; font-size:17px; font-weight:700; }
.screen__bar .back{ font-size:26px; color:var(--accent); width:36px; }
.screen__bar .act{ color:var(--accent); font-weight:700; font-size:15px; padding:0 8px; }
.screen__body{ flex:1; overflow-y:auto; padding:14px 0 30px; }

/* ---------- MODAL / BOTTOM SHEET ---------- */
.modal{ position:fixed; inset:0; z-index:80; display:flex; align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.55); animation:fade .18s ease; }
.sheet{ width:100%; max-width:560px; max-height:88vh; overflow-y:auto; background:#1C1C1E;
  border-radius:18px 18px 0 0; padding:8px 18px calc(env(safe-area-inset-bottom) + 20px); animation:slideUp .22s ease; }
@media(min-width:560px){ .modal{ align-items:center; } .sheet{ border-radius:18px; } }
.sheet__grip{ width:38px; height:5px; border-radius:3px; background:var(--surface-3); margin:8px auto 14px; }
.sheet__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.sheet__head h2{ font-size:19px; font-weight:800; }
.field{ margin-bottom:14px; }
.field label{ display:block; font-size:13px; color:var(--text-dim); margin-bottom:6px; }
.field input,.field select,.field textarea{ width:100%; padding:13px 14px; border-radius:var(--radius-sm);
  background:var(--surface-2); border:none; }
.field textarea{ resize:vertical; min-height:60px; }
.field--row{ display:flex; gap:10px; } .field--row > div{ flex:1; }
.switch{ display:flex; align-items:center; justify-content:space-between; }
.switch input{ width:auto; transform:scale(1.3); }

/* opções de tipo de série / sheet de ações */
.opt{ display:flex; align-items:center; gap:14px; padding:15px 4px; border-bottom:1px solid var(--border); }
.opt:last-child{ border-bottom:none; }
.opt__badge{ width:26px; text-align:center; font-weight:800; font-size:16px; }
.opt__name{ flex:1; font-size:16px; }

/* pick list */
.pick{ max-height:52vh; overflow-y:auto; margin:0 -18px; }
.pick .lrow{ background:transparent; cursor:pointer; }
.pick .lrow.sel{ background:rgba(241,103,25,.14); }

/* estado vazio */
.empty{ text-align:center; padding:60px 30px; color:var(--text-mute); }
.empty__ico{ font-size:42px; opacity:.4; }
.empty__t{ font-size:20px; font-weight:800; color:var(--text-dim); margin:12px 0 6px; }
.empty p{ font-size:14px; margin-bottom:18px; }

/* gráficos */
.chart-wrap{ position:relative; height:200px; }

/* toasts */
.toasts{ position:fixed; left:0; right:0; top:calc(env(safe-area-inset-top) + 12px); z-index:90;
  display:flex; flex-direction:column; align-items:center; gap:8px; pointer-events:none; }
.toast{ background:#2C2C2E; color:#fff; padding:11px 18px; border-radius:999px; font-size:13.5px; font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,.4); animation:tin .3s ease; }
.toast--pr{ background:var(--gold); color:#000; }
@keyframes tin{ from{ opacity:0; transform:translateY(-10px);} to{ opacity:1; transform:none; } }

.muted{ color:var(--text-dim); } .center{ text-align:center; } .mt{ margin-top:14px; }
.divider{ height:1px; background:var(--border); margin:14px 0; }
.spread{ display:flex; align-items:center; justify-content:space-between; gap:10px; }

/* logo no cabeçalho */
.brand-ico{ width:28px; height:28px; border-radius:8px; flex:0 0 auto; }
.brand-logo{ height:26px; width:auto; display:block; }

/* modo de seleção (excluir vários treinos) */
.seldot{ width:24px; height:24px; border-radius:50%; border:2px solid var(--text-mute);
  display:grid; place-items:center; color:#fff; font-size:13px; font-weight:800; flex:0 0 auto; }
.seldot.on{ background:var(--accent); border-color:var(--accent); }
.feed-card.is-sel{ outline:2px solid var(--accent); outline-offset:-2px; }
.routine.is-sel{ outline:2px solid var(--accent); outline-offset:-2px; }
.reorder{ display:flex; gap:4px; flex:0 0 auto; }
.icon-btn:disabled{ opacity:.3; }

/* listas numeradas (ajuda de instalação) */
.steps{ padding-left:20px; font-size:14px; line-height:1.7; color:var(--text); }
.steps li{ margin-bottom:4px; }
.steps b{ color:#fff; }

.badge-coach{ display:inline-block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; background:rgba(241,103,25,.18); color:#F16719; border-radius:999px; padding:2px 7px; vertical-align:middle; margin-left:6px; }

/* instruções do personal na tela da rotina (aluno) */
.rd-eye{ display:inline-grid; place-items:center; width:32px; height:32px; border-radius:8px; background:var(--surface-2); color:var(--text-mute); flex:0 0 auto; align-self:center; }
.rd-eye.on{ color:var(--accent); }
.rd-instr{ margin:-4px 16px 10px; padding:10px 12px; background:var(--surface-2); border-radius:10px; color:var(--text-dim); font-size:13.5px; line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.rd-instr.hidden{ display:none; }
.rd-block{ padding:0 4px 10px; }
.rd-block + .rd-block{ border-top:1px solid var(--border); padding-top:10px; }
.rd-block-h{ font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--text-dim); margin-bottom:4px; }
.rd-block-b{ font-size:14px; color:var(--text); line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
.rd-guide-body.hidden{ display:none; }
/* superset no app do aluno */
.sx-super-h{ display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:800; letter-spacing:.5px; color:#fff; background:var(--accent); padding:4px 11px; border-radius:999px; margin:14px 0 6px; }
.sx-super-h::before{ content:'⚡'; font-size:12px; }
.sx--super{ border-left:4px solid var(--accent); background:rgba(241,103,25,.06); border-radius:0 12px 12px 0; }
.sx--super.is-last{ margin-bottom:14px; }
.lrow--super{ border-left:4px solid var(--accent); background:rgba(241,103,25,.06); }
/* Sessão do aluno: bloco de orientações/cardio do personal (somente leitura) */
.sx--guide{ background:var(--surface); border:1px solid var(--accent); border-radius:14px; padding:12px 14px; }
.sx__coach{ display:flex; align-items:center; gap:8px; margin:2px 0 8px; }
.sx__coach .rd-eye{ width:30px; height:30px; }
.sx__coach-l{ font-size:13px; color:var(--accent); font-weight:600; }
.sx__coach + .rd-instr{ margin:0 0 10px; }

/* --- Card "treino de hoje" na home --- */
.today-card{ display:flex; align-items:center; gap:12px; margin:0 0 12px; padding:14px 16px;
  background:var(--surface-2); border:1px solid var(--border); border-radius:16px; }
.today-card__ico{ font-size:24px; line-height:1; }
.today-card--done{ opacity:.85; }
.today-card--done .today-card__t{ color:var(--text-dim); }
.today-card__main{ flex:1; min-width:0; }
.today-card__k{ font-size:12px; color:var(--text-dim); font-weight:600; text-transform:uppercase; letter-spacing:.3px; }
.today-card__t{ font-size:16px; font-weight:700; color:var(--text); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* --- Feedback pós-treino (modal de conclusão) --- */
.fb-eff{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:12px; }
.fb-eff-b{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 6px; border:1px solid #2a2a2a; background:#141414; color:#ccc; border-radius:12px; cursor:pointer; }
.fb-eff-b.on{ border-color:#F16719; background:rgba(241,103,25,.14); color:#fff; }
.fb-eff-emo{ font-size:24px; line-height:1; }
.fb-eff-l{ font-size:12.5px; font-weight:600; }
.fb-toggle{ display:block; width:100%; text-align:left; background:transparent; border:0; color:#F16719; font-weight:600; font-size:14px; padding:8px 2px; cursor:pointer; }
.fb-in{ width:100%; box-sizing:border-box; background:#0e0e0e; border:1px solid #2a2a2a; color:#eee; border-radius:10px; padding:10px 12px; font-size:15px; margin-bottom:4px; }
@media(min-width:420px){ .fb-eff{ grid-template-columns:repeat(4,1fr); } }

/* Guia de uso (tela do aluno) */
.guia-sec{ border:1px solid #242424; border-radius:12px; margin-bottom:8px; background:var(--surface-2,#141414); }
.guia-sec summary{ cursor:pointer; padding:13px 15px; font-weight:700; font-size:15px; list-style:none; }
.guia-sec summary::-webkit-details-marker{ display:none; }
.guia-sec[open] summary{ color:var(--accent); }
.guia-b{ padding:0 15px 15px; font-size:14.5px; line-height:1.6; color:var(--muted,#c9c9c9); }
.guia-b b{ color:var(--text,#eee); }

/* ===== Tour guiado (compartilhado aluno/personal) ===== */
.tour-overlay{position:fixed;inset:0;z-index:4000;pointer-events:auto}
.tour-ring{position:fixed;border-radius:14px;box-shadow:0 0 0 9999px rgba(0,0,0,.74);border:2px solid var(--accent,#FF6B2C);transition:top .18s,left .18s,width .18s,height .18s;pointer-events:none}
.tour-card{position:fixed;width:min(340px,calc(100vw - 24px));background:#161618;border:1px solid #2A2A2E;border-radius:16px;padding:16px 16px 14px;box-shadow:0 18px 50px rgba(0,0,0,.55);color:#EDEDED;z-index:4001}
.tour-card--center{left:50%!important;top:50%!important;transform:translate(-50%,-50%)}
.tour-step{font-size:12px;color:#8A8A90;letter-spacing:.03em;margin-bottom:6px}
.tour-title{font-size:17px;font-weight:700;color:var(--accent,#FF6B2C);margin-bottom:6px}
.tour-body{font-size:14px;line-height:1.5;color:#D4D4D6}
.tour-body b{color:#fff}
.tour-dots{display:flex;gap:6px;justify-content:center;margin:14px 0 12px}
.tour-dot{width:7px;height:7px;border-radius:50%;background:#3A3A40}
.tour-dot.on{background:var(--accent,#FF6B2C);width:20px;border-radius:4px}
.tour-acts{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tour-nav{display:flex;gap:8px}
.tour-skip{background:none;border:none;color:#8A8A90;font-size:14px;padding:8px 4px;cursor:pointer}
.tour-back{background:#232327;border:1px solid #34343A;color:#D4D4D6;border-radius:10px;padding:9px 14px;font-size:14px;cursor:pointer}
.tour-next{background:var(--accent,#FF6B2C);border:none;color:#111;font-weight:700;border-radius:10px;padding:9px 18px;font-size:14px;cursor:pointer}

/* mídia/estrutura travada do treino do personal */
.set-badge--ro{cursor:default;display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;font-weight:700}
.lightbox__yt{display:inline-block;margin-top:12px;color:#fff;background:#c00;border-radius:8px;padding:8px 14px;font-size:14px;font-weight:600;text-decoration:none}

/* ===== Assinatura: ciclo (mensal/anual) + gerenciar ===== */
.plano-ciclo{display:flex;gap:8px;margin:10px 0}
.plano-ciclo-b{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border-radius:12px;border:1px solid #34343A;background:#161618;color:#C9C9CE;font-weight:600;cursor:pointer}
.plano-ciclo-b span{font-size:12px;font-weight:400;color:#8A8A90}
.plano-ciclo-b.on{border-color:var(--accent,#FF6B2C);background:rgba(255,107,44,.10);color:#EDEDED}
.plano-ciclo-b.on span{color:var(--accent,#FF6B2C)}
.plano-manage{margin:4px 0 12px}
.plano-badge{display:inline-block;padding:5px 12px;border-radius:999px;background:rgba(52,211,153,.14);color:#34D399;font-weight:700;font-size:14px}
.plano-row{margin-top:10px;color:#D4D4D6;font-size:14px}
.plano-cancel{margin-top:12px;font-size:13px;color:#9A9AA0;line-height:1.5}
.plano-cancel-note{margin:4px 0 10px;color:#9A9AA0}
.plano-cancel-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;color:#D4D4D6}
.plano-cancel-steps li{padding-left:2px}
.plano-cancel-steps b{color:#fff}

/* ---------- Splash de abertura ---------- */
.splash{position:fixed;inset:0;z-index:9999;background:var(--bg,#000);display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease}
.splash--out{opacity:0;pointer-events:none}
.splash-logo{width:min(52vw,220px);height:auto;animation:splashPulse 1.4s ease-in-out infinite}
@keyframes splashPulse{0%,100%{opacity:.7;transform:scale(.98)}50%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.splash-logo{animation:none}}

/* ---------- Ícone do halter (botão Treino) via máscara recolorível ---------- */
.tab__ico--halter{width:26px;height:22px;display:inline-block;background-color:currentColor;
  -webkit-mask:url("halter-icon.png") no-repeat center/contain;mask:url("halter-icon.png") no-repeat center/contain}

/* Lembrete do comentário da série anterior (puxado ao iniciar o treino) */
.set-prevnote-row td{ padding-top:0 !important; }
.set-prevnote{ font-size:12px; color:var(--text-dim); font-style:italic; padding:2px 4px 6px; line-height:1.35; }

/* Resumo "Treino concluído" — clean e objetivo */
.sum-clean{ display:flex; gap:10px; margin:4px 0 16px; }
.sum-stat{ flex:1; background:var(--surface); border-radius:12px; padding:16px 8px; display:flex; flex-direction:column; align-items:center; gap:4px; }
.sum-stat__v{ font-size:20px; font-weight:800; color:var(--text); line-height:1.1; }
.sum-stat__v small{ font-size:11px; font-weight:600; color:var(--text-dim); }
.sum-stat__l{ font-size:11px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.3px; }

/* Botões pequenos (guia rápido / instalar) no topo da home */
.hicon-btn{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
  background:var(--surface); color:var(--text-dim); border:1px solid var(--surface-3);
  font-size:16px; line-height:1; font-weight:700; }
.hicon-btn:active{ background:var(--surface-2); color:var(--text); }