/* Bubylift — dark by default, light via data-mode="light". Mobile first. */
:root{
  --bg:#0B0B0F;--panel:#16161C;--panel2:#1F1F27;--line:#2A2A33;--txt:#F5F5F7;--dim:#9A9AA6;
  --accent:#FF6B2C;--on-accent:#1A0A00;--green:#30D158;--on-green:#00210A;--red:#FF453A;--warn:#FFB340;
  --radius:14px;--tab-h:58px;
  --sans:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',Roboto,'Helvetica Neue',sans-serif;
}
:root[data-mode="light"]{
  --bg:#F2F2F7;--panel:#FFFFFF;--panel2:#EAEAF0;--line:#DCDCE3;--txt:#111114;--dim:#66666F;
  --accent:#D9480F;--on-accent:#FFFFFF;--green:#248A3D;--on-green:#FFFFFF;--red:#D70015;--warn:#B35C00;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{color-scheme:dark}
:root[data-mode="light"]{color-scheme:light}
body{background:var(--bg);color:var(--txt);font-family:var(--sans);font-size:1rem;line-height:1.35;min-height:100vh;min-height:100dvh;-webkit-text-size-adjust:100%}
body.noscroll{overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:var(--accent)}
h2{font-size:1.05rem;font-weight:700}
h3{font-size:1.15rem;font-weight:700;margin-bottom:.4rem}
.muted{color:var(--dim)}.sm{font-size:.85rem}

/* shell */
#app{max-width:640px;margin:0 auto;padding:0 14px calc(var(--tab-h) + 90px + env(safe-area-inset-bottom))}
#top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 0 10px;background:var(--bg)}
.brand{font-weight:800;font-size:1.3rem;letter-spacing:-.02em}
.brand::first-letter{color:var(--accent)}
.langsw{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.langsw button{padding:4px 9px;font-size:.8rem;font-weight:700;color:var(--dim)}
.langsw button.on{background:var(--accent);color:var(--on-accent)}
.spacer{flex:1}
.inst-btn{padding:7px 12px;border-radius:999px;background:var(--panel2);font-size:.85rem;font-weight:600}
main>*+*{margin-top:12px}
main>.sec{margin-top:20px}
#tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;height:calc(var(--tab-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--panel);border-top:1px solid var(--line)}
#tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--dim);font-size:.7rem;font-weight:600}
#tabbar button.on{color:var(--accent)}
#tabbar svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#tabbar svg circle[r="1.3"]{fill:currentColor}
#restbar{position:fixed;left:10px;right:10px;bottom:calc(var(--tab-h) + 10px + env(safe-area-inset-bottom));z-index:25;max-width:620px;margin:0 auto;background:var(--panel2);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.rb-bar{height:4px;border-radius:4px;background:var(--line);overflow:hidden;margin-bottom:8px}
#restF{height:100%;width:0;background:var(--accent);transition:width .25s linear}
.rb-row{display:flex;align-items:center;gap:8px}
.rb-l{color:var(--dim);font-size:.85rem}
#restT{font-size:1.35rem;font-variant-numeric:tabular-nums}
.rb-sp{flex:1}
#toast{position:fixed;left:50%;bottom:calc(var(--tab-h) + 80px + env(safe-area-inset-bottom));transform:translate(-50%,12px);z-index:60;background:var(--txt);color:var(--bg);padding:10px 16px;border-radius:999px;font-size:.9rem;font-weight:600;opacity:0;pointer-events:none;transition:.2s;max-width:90vw;text-align:center}
#toast.on{opacity:1;transform:translate(-50%,0)}

/* building blocks */
.card{display:block;width:100%;text-align:left;background:var(--panel);border-radius:var(--radius);padding:14px}
.card.warn{border:1px solid var(--warn)}
.card.tip{border:1px dashed var(--line)}
.card p{margin-top:4px}
.card>b+*{margin-top:6px}
.sec{display:flex;align-items:center;justify-content:space-between;gap:10px}
.row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 16px;min-height:44px;border-radius:12px;background:var(--panel2);border:1.5px solid color-mix(in srgb,var(--txt) 35%,transparent);color:var(--txt);font-weight:700;text-align:center}
.btn.pri{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.btn.danger{background:color-mix(in srgb,var(--red) 16%,var(--panel2));border-color:var(--red);color:var(--red)}
.btn.sm{min-height:38px}
.dz{margin-top:22px;padding-top:14px;border-top:1.5px solid var(--line)}
.dz .btn{width:100%}
.btn.sm{padding:7px 12px;font-size:.88rem;border-radius:10px}
.btn.wide{width:100%}
.btn.big{padding:16px;font-size:1.1rem;border-radius:16px}
.btn:active{opacity:.75}
.ico{width:36px;height:36px;border-radius:10px;background:var(--panel2);font-size:1.1rem;line-height:1}
.in{background:var(--panel2);border:1px solid transparent;border-radius:10px;padding:10px 12px;color:var(--txt);font:inherit;min-width:0;font-size:16px}
.in:focus{outline:2px solid var(--accent);outline-offset:-1px}
.in.wide{width:100%}
label{display:block;font-size:.85rem;color:var(--dim);margin-top:10px}
label .in{margin-top:4px;color:var(--txt)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lblrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;font-size:.95rem;color:var(--txt)}
.lbl{margin-top:14px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);font-weight:700}
details{margin-top:12px}summary{cursor:pointer;color:var(--accent);font-weight:600}
textarea.note-in{width:100%;background:var(--panel);border:0;border-radius:var(--radius);padding:12px;color:var(--txt);font:inherit;font-size:16px;resize:vertical}
.chips{display:flex;gap:6px;overflow-x:auto;padding:2px 0;margin:8px 0;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;padding:6px 12px;border-radius:999px;background:var(--panel2);font-size:.85rem;font-weight:600}
.chip.on{background:var(--accent);color:var(--on-accent)}
.seg{display:flex;gap:4px;background:var(--panel2);padding:3px;border-radius:12px;margin-top:8px}
.lblrow .seg{margin-top:0}
.seg button{flex:1;padding:8px 6px;border-radius:9px;font-weight:600;font-size:.9rem;color:var(--dim)}
.seg button.on{background:var(--accent);color:var(--on-accent)}
.menu{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.menu button,.btnl{display:block;width:100%;padding:12px 14px;border-radius:12px;background:var(--panel2);text-align:left;font-weight:600;cursor:pointer}
.menu .danger{color:var(--red)}
.stats{display:flex;gap:8px;text-align:center}
.stats>div{flex:1;min-width:0}
.stats b{display:block;font-size:1.25rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stats span{font-size:.75rem;color:var(--dim)}
.stats.grid2{display:grid;grid-template-columns:1fr 1fr;row-gap:12px}
.pr{font-style:normal;color:var(--warn);font-weight:700;font-size:.85rem}
.goalrow{display:flex;gap:8px;align-items:flex-end}.goalrow label{flex:1;margin-top:8px}
.mtab{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:8px}
.mtab div{display:flex;flex-direction:column}.mtab span{font-size:.78rem;color:var(--dim)}.mtab small{font-size:.7rem;color:var(--dim)}

/* charts */
.chart{width:100%;height:auto;margin-top:8px;display:block}
.ch-g{stroke:var(--line);stroke-width:1}
.ch-t{fill:var(--dim);font-size:10px}
.ch-l{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.ch-d{fill:var(--accent)}
.ch-goal{stroke:var(--green);stroke-width:1.5;stroke-dasharray:4 4}
.ch-b{fill:var(--panel2)}.ch-b.cur{fill:var(--accent)}

/* workout */
.wk-head{background:var(--panel);border-radius:var(--radius);padding:14px}
.wkname{width:100%;background:none;border:0;color:var(--txt);font:inherit;font-size:1.25rem;font-weight:700;margin-bottom:4px}
.wkname:focus{outline:none;border-bottom:1px solid var(--accent)}
#elapsed{font-variant-numeric:tabular-nums}
.exc{background:var(--panel);border-radius:var(--radius);padding:12px}
.exh{display:flex;align-items:center;justify-content:space-between;gap:8px}
.exh b{font-size:1.05rem}
.exsub{margin:2px 0 8px}
.srow{display:grid;grid-template-columns:36px .8fr 1fr 1fr 58px;gap:6px;align-items:center;margin-bottom:6px}
.srow.hd{font-size:.68rem;font-weight:700;color:var(--dim);text-align:center;margin-bottom:2px}
.srow .sn{font-weight:700;text-align:center;color:var(--dim)}
.srow .sn .pr{display:block;line-height:1}
.srow .sp{text-align:center;font-size:.8rem;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow .in{text-align:center;padding:9px 4px;width:100%}
.srow .in.dn{background:color-mix(in srgb,var(--green) 22%,var(--panel2))}
.chk{height:40px;border-radius:10px;background:var(--panel2);color:var(--dim);font-weight:800;font-size:1.1rem}
.srow.done .chk{background:var(--green);color:var(--on-green)}
.exc .btn.sm{margin-top:4px}

/* cards in lists */
.rt{display:flex;align-items:center;gap:10px}
.rt-main{flex:1;min-width:0}.rt-main .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-b{display:flex;gap:6px}
.wkc,.exp{cursor:pointer}
.wkc-d{display:flex;justify-content:space-between}
.wkc-n{font-weight:600;margin:2px 0}
.sm-card b{font-size:.95rem}
.bde{display:flex;align-items:center;justify-content:space-between;gap:8px}

/* sheet */
#sheetov{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center}
#sheetov[hidden]{display:none}
#sheet{width:100%;max-width:640px;max-height:88vh;max-height:88dvh;overflow-y:auto;background:var(--bg);border-radius:20px 20px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
.dlg p{font-size:1.02rem;margin-bottom:6px}
.dlg-b{display:flex;gap:8px;margin-top:14px}.dlg-b .btn{flex:1}
.pick-h{display:flex;align-items:center;justify-content:space-between}
.exlist{margin:6px 0 10px}
.exrow{display:block;width:100%;text-align:left;padding:11px 4px;border-bottom:1px solid var(--line)}
.exrow small{display:block;color:var(--dim);font-size:.78rem}
.rbx{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line)}
.rbx b{flex:1;min-width:0}
.rbs{display:flex;align-items:center;gap:6px;font-size:.85rem}
.sum{text-align:center}.sum-e{font-size:2.4rem}.sum .stats{margin:14px 0}.prs{margin:6px 0}
.sum .row{justify-content:center}
.wkd-ex{margin-top:14px}
.wkd-s{display:flex;gap:12px;padding:5px 0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.wkd-s span:first-child{width:22px;color:var(--dim)}
.wkd-note{margin-top:12px;color:var(--dim);white-space:pre-wrap}
.wn-k{font-size:.75rem;font-weight:800;letter-spacing:.08em;color:var(--accent)}
.wn-i{display:flex;gap:12px;margin:14px 0}.wn-ic{font-size:1.5rem;color:var(--accent);flex:none;line-height:1}.wn-ic .ic{width:1.5rem;height:1.5rem;display:block}
.inst{text-align:left}.inst-ic{width:56px;height:56px;border-radius:14px;margin-bottom:8px}
.inst ol{margin:10px 0 12px 20px}.inst li{margin:6px 0}
.ib{display:inline-block;padding:0 6px;border-radius:6px;background:var(--panel2)}
.note{background:var(--panel2);border-radius:10px;padding:10px;font-size:.88rem;margin-bottom:12px}

/* guided plan, technique, suggestions / plan guiado, técnica, sugerencias */
.card.plan{border:1px solid var(--accent)}
.plh{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.card.plan h3{margin:4px 0 8px}
.plex{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 0;border-top:1px solid var(--line)}
.plex span{display:flex;flex-direction:column;min-width:0}.plex small{color:var(--dim)}
.pldue{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding:8px 10px;border-radius:10px;background:var(--panel2)}

.goalln{margin:4px 0 6px;font-size:.88rem}.goalln .sg{color:var(--accent)}
.chips.wrap{flex-wrap:wrap}
ol.how{margin:6px 0 0 20px}ol.how li{margin:6px 0}

/* v4: steppers, swipe, wizard, substitutions / pasos, deslizar, asistente, sustituciones */
.stc{display:flex;align-items:center;gap:2px;min-width:0}
.stc .in{flex:1;min-width:0;padding:9px 2px}
.stp{flex:none;width:26px;height:36px;border-radius:8px;background:var(--panel2);color:var(--accent);font-weight:800;font-size:1.05rem;line-height:1}
@media(max-width:430px){.srow{grid-template-columns:34px 1fr 1fr 56px}.srow .sp,.srow.hd span:nth-child(2){display:none}}
.swp{position:relative;overflow:hidden;border-radius:var(--radius);margin-bottom:8px}
.swp-in{position:relative;touch-action:pan-y;margin:0}
.swp-h{position:absolute;top:0;bottom:0;display:flex;align-items:center;padding:0 16px;font-weight:700;font-size:.9rem;opacity:0;transition:opacity .12s;color:#fff}
.swp-hl{right:0;background:#C92A2A;justify-content:flex-end}
.swp-hr{left:0;background:#1971C2}
.swp.l .swp-hl,.swp.r .swp-hr{opacity:1}
.swhint{margin-top:8px;text-align:center}
.warnln{color:var(--warn)}.warnt{display:block;color:var(--warn)}
.pe-r{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-top:1px solid var(--line)}
.pe-s{display:flex;align-items:center;gap:12px}.pe-s b{min-width:38px;text-align:center}
.pe-s .stp{width:40px;height:40px}
.sumul{margin:6px 0 6px 20px}.sumul li{margin:5px 0}

/* v10: cleaner screens / pantallas más limpias */
.plex.tap{cursor:pointer;padding:12px 0}.plex .go{font-style:normal;color:var(--accent);font-weight:700;white-space:nowrap}
.brief{margin:6px 0 0}.brief+.muted{margin:2px 0 4px}
.daytabs{margin:12px 0 4px}.dayh{margin:10px 0 2px}
.exb{display:flex;gap:8px;margin:8px 0 2px}.exb .btn{flex:1;padding:8px 6px}
.dtl{margin-top:14px}.dtl summary{cursor:pointer;list-style:none;padding:12px 14px;border-radius:12px;background:var(--panel2);border:1.5px solid color-mix(in srgb,var(--txt) 35%,transparent);font-weight:700;min-height:44px;display:flex;align-items:center;justify-content:space-between}
.dtl summary::-webkit-details-marker{display:none}.dtl summary::after{content:'▾';color:var(--accent);margin-left:8px}.dtl[open] summary::after{content:'▴'}
.dtl[open]>summary{margin-bottom:10px}.dtl h4{margin:14px 0 4px}
.row.stack{flex-direction:column}.row.stack .btn{width:100%;justify-content:flex-start}
.menu button,.btnl{border:1.5px solid color-mix(in srgb,var(--txt) 35%,transparent);min-height:44px}.menu .danger{border-color:var(--red)}

/* ===== v12: Apple-style look — large titles, grouped cards, tinted buttons, translucent bars / estilo Apple ===== */
:root{
  --bg:#000;--panel:#1C1C1E;--panel2:#2C2C2E;--line:rgba(84,84,88,.55);--txt:#fff;--dim:#98989F;
  --accent:#FF7A3D;--on-accent:#1A0A00;--seg-on:#636366;--radius:14px;--tab-h:56px;
}
:root[data-mode="light"]{
  --bg:#F2F2F7;--panel:#fff;--panel2:#EEEEF3;--line:rgba(60,60,67,.16);--txt:#000;--dim:#6C6C70;
  --accent:#D9480F;--on-accent:#fff;--seg-on:#fff;
}
body{font-size:16px;line-height:1.35;-webkit-font-smoothing:antialiased}
#app{padding:0 16px calc(var(--tab-h) + 96px + env(safe-area-inset-bottom))}
main>*+*{margin-top:16px}
/* header: just the small brand; language lives in More / solo la marca; el idioma está en Más */
#top{position:static;padding:calc(8px + env(safe-area-inset-top)) 0 0;background:none}
.brand{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.brand::first-letter{color:var(--accent)}
.langsw,.spacer{display:none}.spacer{display:block}
.inst-btn{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);font-weight:600}
.lt{font-size:2.1rem;line-height:1.1;font-weight:700;letter-spacing:.01em;margin:4px 0 18px}
/* section headers like iOS lists */
.sec{margin-top:26px!important;padding:0 4px}
.sec h2{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--dim)}
.card h2{font-size:1.1rem;font-weight:600;text-transform:none;letter-spacing:0;color:var(--txt)}
/* cards */
.card,.wk-head,.exc{border:0;border-radius:var(--radius);padding:16px}
.card.plan,.card.tip{border:0}
.card.warn{border:0;background:color-mix(in srgb,var(--warn) 14%,var(--panel))}
h3{font-size:1.2rem;font-weight:600}
/* buttons: tinted, clearly labeled, 44pt+ / botones tintados con texto claro */
.btn{min-height:46px;border:0;border-radius:12px;background:color-mix(in srgb,var(--accent) 16%,var(--panel2));color:var(--accent);font-weight:600;padding:12px 18px}
.btn.pri{background:var(--accent);color:var(--on-accent);border:0}
.btn.danger{background:color-mix(in srgb,var(--red) 15%,var(--panel2));color:var(--red);border:0}
.btn.sm{min-height:36px;padding:6px 14px;border-radius:10px;font-size:.9rem}
.btn.big{min-height:54px;border-radius:14px;font-size:1.05rem;padding:14px}
.btn:active{opacity:.6}
.exb .btn{padding:6px}
.ico{width:32px;height:32px;border-radius:50%;background:var(--panel2);color:var(--dim);font-size:.95rem}
.dz{border-top:.5px solid var(--line)}
.row.stack .btn{justify-content:flex-start}
/* inputs, chips, segmented */
.in{border:0;border-radius:10px;background:var(--panel2)}
.chip{padding:8px 14px;border-radius:999px;background:var(--panel2);color:var(--txt);font-weight:500}
.chip.on{background:var(--accent);color:var(--on-accent);font-weight:600}
.seg{background:var(--panel2);padding:2px;border-radius:9px}
.seg button{border-radius:7px;font-weight:500;color:var(--txt);padding:7px 6px}
.seg button.on{background:var(--seg-on);color:var(--txt);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.menu button,.btnl{border:0;background:color-mix(in srgb,var(--accent) 12%,var(--panel2));color:var(--accent);font-weight:600;border-radius:12px;min-height:46px}
.menu .danger{color:var(--red);background:color-mix(in srgb,var(--red) 14%,var(--panel2))}
.dtl summary{border:0;background:var(--panel);color:var(--txt);font-weight:600;border-radius:12px}
.dtl summary::after{color:var(--dim)}
.lbl{font-size:.78rem;font-weight:600;letter-spacing:.04em;margin-top:22px;padding:0 2px}
/* lists */
.plex,.pe-r,.exrow,.rbx,.wkd-s{border-top:0;border-bottom:.5px solid var(--line)}
.plex:last-child{border-bottom:0}
.plex.tap{padding:14px 0}
.plex .go{font-weight:500;color:var(--dim)}
.card.plan .plex{border-bottom-color:var(--line)}
/* tab bar: translucent like iOS / barra translúcida */
#tabbar{background:color-mix(in srgb,var(--panel) 78%,transparent);-webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);border-top:.5px solid var(--line)}
#tabbar button{font-size:.62rem;font-weight:500;letter-spacing:.01em}
#tabbar svg{width:25px;height:25px;stroke-width:1.8}
#restbar{border:0;background:color-mix(in srgb,var(--panel2) 85%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:16px}
/* sheets with a grabber */
#sheetov{background:rgba(0,0,0,.4)}
#sheet{background:var(--bg);border-radius:16px 16px 0 0;padding:8px 16px calc(20px + env(safe-area-inset-bottom))}
#sheet::before{content:'';display:block;width:36px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 14px}
.pick-h h3{margin:0}
#toast{background:color-mix(in srgb,var(--txt) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}

.grp{padding:4px 16px}
.lrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:.5px solid var(--line);min-height:52px}
.lrow:last-child{border-bottom:0}
.lrow .seg{margin:0;min-width:0;flex:0 1 190px}
.lrow .seg button{font-size:.85rem;padding:6px 4px;white-space:nowrap}
.lrow .in{padding:7px 10px}
.dtl summary{margin-top:6px}
.menu button,.btnl{font-size:1rem}
.wkc{padding:14px 16px}.wkc-n{font-weight:500;color:var(--dim);margin:0 0 2px}
.wkc .muted:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wkc::after{content:'›';float:right;color:var(--dim)}
/* iOS Safari: date fields keep their width and align left / los campos de fecha en iOS respetan el ancho y van a la izquierda */
input[type=date],input[type=time]{-webkit-appearance:none;appearance:none;display:block;width:100%;min-width:0;max-width:100%;min-height:44px;text-align:left;line-height:1.2}
input[type=date]::-webkit-date-and-time-value,input[type=time]::-webkit-date-and-time-value{text-align:left;min-height:1.2em}
input[type=date]::-webkit-calendar-picker-indicator{opacity:.6}

/* ===== v14: profiles, sign-in gate, avatars, QR transfer / perfiles, entrada, avatares, transferencia QR ===== */
#gate{position:fixed;inset:0;z-index:80;background:var(--bg);overflow-y:auto;-webkit-overflow-scrolling:touch}
#gate[hidden]{display:none}
.gate-in{max-width:460px;margin:0 auto;padding:calc(14px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom))}
.g-top{display:flex;justify-content:space-between;align-items:center;min-height:44px}
.g-link{color:var(--accent);font-weight:600;font-size:1.05rem;min-height:44px;padding:0 4px}
.g-h{margin:6px 0 14px}
.g-c{display:flex;flex-direction:column;align-items:center;gap:8px;margin:10px 0 18px}
.g-n{font-size:1.4rem;font-weight:700}
.g-form{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.g-form label{display:flex;flex-direction:column;gap:6px;font-size:.88rem;color:var(--dim);font-weight:600}
.g-form .chk-l{flex-direction:row;align-items:center;gap:10px;color:var(--txt);font-size:.95rem}
.g-form .chk-l input{width:22px;height:22px;accent-color:var(--accent)}
.g-form .btn.wide,.btn.wide{width:100%}
.btn.big{min-height:52px;font-size:1.05rem;border-radius:14px}
.g-msg{min-height:1.3em;color:var(--red);font-size:.9rem;text-align:center}
.g-msg.c{color:var(--dim)}
.c{text-align:center}
.g-lang{display:flex;justify-content:center;gap:6px;margin-top:28px}
.g-lang button{padding:8px 14px;border-radius:999px;color:var(--dim);font-weight:600;min-height:40px}
.g-lang button.on{background:var(--panel2);color:var(--txt)}
.pf-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 12px;margin-top:26px;justify-items:center}
.pf-tile{display:flex;flex-direction:column;align-items:center;gap:10px;position:relative;padding:6px;border-radius:16px;width:100%}
.pf-tile b{font-size:1rem;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-tile:active .av{transform:scale(.95)}
.pf-pen{position:absolute;top:50%;left:50%;transform:translate(-50%,-70%);font-style:normal;font-size:1.6rem;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.av{display:inline-flex;align-items:center;justify-content:center;border-radius:22%;overflow:hidden;flex:none;line-height:1;transition:transform .12s;background:var(--panel2)}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av-add{background:var(--panel2);color:var(--accent);font-size:2.6rem}
.avbtn{width:36px;height:36px;padding:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-left:auto}
.avbtn .av{border-radius:50%}
.avbtn[hidden]{display:none}
.pw-w{position:relative;display:block}
.pw-w .in{padding-right:64px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--accent);font-weight:600;padding:8px 10px;min-height:40px}
.meter{display:flex;gap:6px;margin-top:-4px}
.meter i{flex:1;height:6px;border-radius:3px;background:var(--panel2);display:block}
.meter i.on.s1{background:var(--warn)}.meter i.on.s2,.meter i.on.s3{background:var(--green)}
.meter.big{margin-top:6px}.meter.big i{height:8px;background:var(--accent);width:0;transition:width .15s;flex:none}
.rules{list-style:none;display:flex;flex-direction:column;gap:3px;font-size:.85rem;color:var(--dim);margin:0;padding:0}
.rules li.ok,.okt{color:var(--green)}
.qb{display:flex;flex-direction:column;gap:8px;padding:12px;background:var(--panel);border-radius:14px}
.av-ch{justify-content:center}
.av-e{font-size:1.4rem;min-width:48px;min-height:48px}
.av-c{width:36px;height:36px;border-radius:50%;flex:none;border:3px solid transparent}
.av-c.on{border-color:var(--txt)}
.dz{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column}
.qrbox{width:min(100%,340px);aspect-ratio:1;margin:12px auto 6px;background:#fff;border-radius:16px;padding:8px;cursor:pointer}
.qrbox svg{width:100%;height:100%;display:block}
.pinbox{display:flex;flex-direction:column;align-items:center;gap:2px;margin:12px 0}
.pinbox b{font-size:2rem;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.pin-in{text-align:center;font-size:1.6rem;letter-spacing:.12em}
.cam{width:100%;border-radius:16px;background:#000;aspect-ratio:3/4;object-fit:cover;margin-top:10px}

/* ===== v16: creator card / tarjeta del creador ===== */
.cr-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.cr-av{position:relative;width:60px;height:60px;border-radius:50%;overflow:hidden;flex:none;display:flex;align-items:center;justify-content:center;font-size:1.6rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#FF7A3D,#FF3D6E)}
.cr-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.creator .btn{margin-top:6px;text-decoration:none}

/* ===== v17: weight entry and trend / registro de peso y tendencia ===== */
.bwhero .c,.c{text-align:center}
.bw-row{display:flex;align-items:center;justify-content:center;gap:14px;margin:8px 0 4px}
.bw-st{width:52px;height:52px;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--panel2));color:var(--accent);font-size:1.8rem;font-weight:600;line-height:1;flex:none}
.bw-f{display:flex;align-items:baseline;justify-content:center;gap:6px;min-width:0}
.bw-in{width:6.2ch;background:none;border:0;color:var(--txt);font:inherit;font-size:2.6rem;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;padding:0}
.bw-in:focus{outline:none}
.bw-in::placeholder{color:var(--dim);opacity:.8}
.bw-u{font-size:1rem;color:var(--dim);font-weight:600}
.bwhero .dtl{margin-top:8px}
.ch-d.lite{opacity:.4}
.mixh{margin:14px 0 2px;font-size:1rem}
.daytag{margin:-4px 0 8px}

/* ===== v18: clear-set button and weekly schedule / borrar serie y horario semanal ===== */
.clr{height:40px;border-radius:10px;background:color-mix(in srgb,var(--red) 14%,var(--panel2));color:var(--red);font-weight:700;font-size:1rem}
.clr.off{opacity:.35}
.schr{display:grid;grid-template-columns:92px 1fr auto;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.schr.pick{background:color-mix(in srgb,var(--accent) 12%,transparent);border-radius:12px;padding:10px 8px}
.schr.rest{opacity:.75}
.schw{font-weight:700;font-size:.85rem}
.schtd{display:inline-block;font-size:.65rem;background:var(--accent);color:var(--on-accent);border-radius:999px;padding:1px 6px;vertical-align:middle;margin-left:2px}
.schb{min-width:0}
.schb small{display:block;color:var(--dim);font-size:.78rem;margin-top:2px;line-height:1.3}
.schul{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:8px;font-size:.9rem}

/* ===== v19: easy schedule moves / mover días fácil ===== */
.schr{grid-template-columns:88px 1fr 44px 40px;position:relative;touch-action:pan-y}
.schr.rest{grid-template-columns:88px 1fr}
.schar{display:flex;flex-direction:column;gap:6px}
.sar{width:44px;height:36px;border-radius:10px;background:color-mix(in srgb,var(--accent) 16%,var(--panel2));color:var(--accent);font-size:1rem;font-weight:700}
.sar:disabled{opacity:.3}
.sdrag{width:40px;height:78px;border-radius:10px;background:var(--panel2);color:var(--dim);font-size:1.6rem;touch-action:none;cursor:grab}
.schr.lift{z-index:5;background:var(--panel);box-shadow:0 8px 24px rgba(0,0,0,.45);border-radius:12px;opacity:.97}
.schr.drop{background:color-mix(in srgb,var(--accent) 22%,transparent);border-radius:12px}

/* ===== v20: weekly volume / volumen semanal ===== */
.vrow{padding:10px 0;border-bottom:1px solid var(--line)}
.vh{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.vs{font-size:.72rem;font-weight:700;border-radius:999px;padding:2px 8px}
.vs.vOk{background:color-mix(in srgb,var(--green) 20%,transparent);color:var(--green)}
.vs.vUnder{background:color-mix(in srgb,var(--warn) 20%,transparent);color:var(--warn)}
.vs.vOver{background:color-mix(in srgb,var(--red) 18%,transparent);color:var(--red)}
.vbar{position:relative;height:14px;background:var(--panel2);border-radius:7px;overflow:hidden;margin-bottom:4px}
.vbar i{position:absolute;top:0;bottom:0;display:block}
.vz{background:color-mix(in srgb,var(--green) 28%,transparent)}
.vf{left:0;background:var(--accent);opacity:.9;height:60%;top:20%!important;bottom:auto!important;border-radius:0 4px 4px 0}
.vp{width:3px;background:var(--txt)}
.vleg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.75rem;color:var(--dim);margin:12px 0 2px}
.vleg i{display:inline-block;width:14px;height:8px;border-radius:2px;margin-right:5px;vertical-align:middle;position:static}
.vleg i.vp{width:3px;height:12px}

/* ===== v21: guest mode / modo invitado ===== */
.wel-e{font-size:3.4rem;margin-top:24px}
.g-c.muted,.g-form p.g-c{text-align:center}
.g-form .btn+p.muted.sm{margin:-4px 0 10px}
.menu button.pri{background:var(--accent);color:var(--on-accent);font-weight:700}

/* ===== v24: NASM OPT sessions / sesiones NASM OPT ===== */
.secl{margin:18px 0 6px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.ssl{display:inline-block;min-width:1.7em;margin-right:6px;padding:0 6px;border-radius:6px;background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);font-style:normal;font-size:.72rem;font-weight:800;text-align:center}
.optb{margin:10px 0}
.optul{margin:6px 0 0;padding-left:18px;font-size:.85rem;color:var(--dim);line-height:1.45}
.optd{margin:10px 0}
.optd summary{font-weight:700;cursor:pointer}
.optd .optul{margin-top:8px}

/* v25: one-question wizard, personalization / asistente de una pregunta, personalización */
#sheet.wzs{max-height:96vh;max-height:96dvh;min-height:70vh;min-height:70dvh;display:flex;flex-direction:column}
.wz{display:flex;flex-direction:column;flex:1 0 auto}
#sheet.wzs::before{flex:none}
#sheet{overscroll-behavior:contain;touch-action:pan-y}
.wz-top{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.wz-top .ico[disabled]{opacity:.25}
.wz-bar{flex:1;height:6px;border-radius:3px;background:var(--panel2);overflow:hidden}
.wz-bar i{display:block;height:100%;background:var(--accent);border-radius:3px;transition:width .3s}
.wz-in{flex:1}
.wz-in.fresh{animation:wzin .28s ease}
@keyframes wzin{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.wz-ic{font-size:2.6rem;text-align:center;margin:10px 0 2px}
.wz-q{text-align:center;font-size:1.35rem;line-height:1.2;margin:4px 0}
.wz-s{text-align:center;color:var(--muted);font-size:.9rem;margin:0 0 14px}
.wgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wgrid.c1{grid-template-columns:1fr}
.wgrid.c3{grid-template-columns:1fr 1fr 1fr}
.wopt{position:relative;display:flex;align-items:center;gap:10px;text-align:left;padding:14px 12px;border-radius:16px;background:var(--panel2);border:2px solid transparent;color:var(--txt);transition:transform .12s,border-color .12s,background .12s}
.wopt:active{transform:scale(.97)}
.wopt.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--panel2))}
.wopt .wi{font-size:1.6rem;line-height:1}
.wopt .wt{display:flex;flex-direction:column;min-width:0}
.wopt .wt b{font-size:.95rem}
.wopt .wt small{color:var(--muted);font-size:.78rem;margin-top:2px}
.wopt .wck{display:none;position:absolute;top:8px;right:10px;font-style:normal;color:var(--accent);font-weight:700}
.wopt.on .wck{display:block}
.wgrid.c3 .wopt{flex-direction:column;text-align:center;padding:12px 6px}
.wgrid.c3 .wopt .wt{align-items:center}
.wz-body .lbl{margin-top:16px;text-align:center}
.wz-foot{position:sticky;bottom:0;padding:12px 0 2px;background:linear-gradient(transparent,var(--bg) 30%)}
.wsum{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.wsum li{display:flex;gap:10px;align-items:flex-start;background:var(--panel2);border-radius:14px;padding:10px 12px}
.wsum .wi{font-size:1.3rem}
.why .optul{margin:6px 0 0}
.mnl{color:var(--accent);font-style:normal}
.adrow{display:flex;gap:10px;align-items:flex-start;padding:8px 0;font-size:.9rem}
.rz{color:var(--muted);font-style:italic}
.plex small.rz{font-size:.74rem}
.whyp{margin:8px 0}

/* v28 ready routines and challenges / rutinas listas y retos */
.libent{display:block;width:100%;text-align:left;margin:10px 0}
.lib .plex small.rz{display:block;margin-top:2px;font-size:.78rem;color:var(--muted);line-height:1.3}
.chc{display:block;width:100%;text-align:left;margin:8px 0}
.center{text-align:center}
.chclk{font-size:3.4rem;font-weight:800;text-align:center;margin:10px 0;font-variant-numeric:tabular-nums}
.chclk.work{color:var(--accent)}.chclk.rest{color:var(--muted)}
.chr{text-align:center;font-size:1.1rem;margin-bottom:8px}.chr b{font-size:2rem}
.chnow{font-size:1.5rem;font-weight:700;text-align:center;margin:10px 0}
.chseg{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:10px;margin:4px 0;background:var(--panel2);gap:8px;flex-wrap:wrap}
.chseg small{flex-basis:100%;color:var(--muted);font-weight:700}
.chseg.now{outline:2px solid var(--accent);font-weight:700}
.chseg.done{opacity:.6}.chseg i{font-style:normal;color:var(--muted);font-variant-numeric:tabular-nums}

/* v30 start screen: four clear ways to train / pantalla de inicio: cuatro formas claras de entrenar */
.pkh{margin:14px 0 8px;font-size:1.15rem}
.pks{display:flex;flex-direction:column;gap:10px;margin-bottom:8px}
.pk{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:14px 16px;margin:0}
.pk.pri{outline:2px solid var(--accent)}
.pk-i{font-size:1.9rem;flex:none}
.pk-t{flex:1;display:flex;flex-direction:column;gap:2px}
.pk-t b{font-size:1.05rem}
.pk-t small{color:var(--muted);font-size:.84rem;line-height:1.3}
.pk-a{font-size:1.6rem;color:var(--muted)}

/* v32 library layout: tabs, steps and rank cards that do not look alike / pestañas, pasos y rangos que no se parecen */
.seg{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--panel2);margin:6px 0 10px}
.seg button{flex:1;padding:10px 6px;border-radius:11px;font-weight:700;font-size:.95rem;color:var(--dim)}
.seg button.on{background:var(--accent);color:var(--on-accent)}
.lstep{display:flex;align-items:center;gap:10px;margin:20px 0 8px;padding-top:14px;border-top:1px solid var(--line);font-weight:800;font-size:1.02rem}
.lstep b{flex:none;width:26px;height:26px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center;font-size:.85rem}
.rkg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 10px}
.rk{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-radius:12px;background:var(--panel2);border:2px solid transparent;font-weight:700;font-size:.82rem;line-height:1.15;text-align:center}
.rk i{font-style:normal;font-size:.7rem;color:var(--dim);font-weight:600}
.rk.on{border-color:var(--accent);color:var(--accent)}
.rk.on i{color:var(--accent)}

/* v33 splits tab / pestaña de divisiones */
.seg button{font-size:.88rem;padding:10px 2px}
.spl{display:flex;flex-direction:column;gap:8px}
.spc{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;margin:0;padding:10px 12px;border:2px solid transparent}
.spc small{color:var(--dim);font-size:.8rem;line-height:1.3}
.spc.on{border-color:var(--accent)}
.spd{margin:8px 0}

.btn[disabled],.ico[disabled]{opacity:.35;pointer-events:none}

/* ---------- tablet + desktop layouts / vistas para tableta y computadora ---------- */
@media(min-width:720px){
  #app{max-width:900px;padding-left:24px;padding-right:24px}
  #restbar{max-width:880px}
  .pks{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .rkg{grid-template-columns:repeat(6,1fr)}
  .spl{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
  #sheetov{align-items:center;padding:24px}
  #sheet{max-width:720px;border-radius:20px;padding-top:20px}
  #sheet::before{display:none}
}
@media(min-width:1100px){
  :root{--side-w:216px}
  body{padding-left:var(--side-w)}
  #app{max-width:1000px;padding-bottom:60px}
  #tabbar{left:0;right:auto;top:0;bottom:0;width:var(--side-w);height:auto;flex-direction:column;justify-content:flex-start;gap:4px;padding:76px 12px 16px;border-top:0;border-right:.5px solid var(--line)}
  #tabbar button{flex:none;flex-direction:row;justify-content:flex-start;gap:12px;padding:12px 14px;border-radius:12px;font-size:.95rem;font-weight:600;width:100%}
  #tabbar button:hover{background:var(--panel2)}
  #tabbar button.on{background:color-mix(in srgb,var(--accent) 14%,transparent)}
  #restbar{left:calc(var(--side-w) + 20px);right:20px;bottom:20px}
  #toast{bottom:40px}
  .pks{grid-template-columns:repeat(3,1fr)}
  #main{display:block}
}
@media(min-width:720px) and (hover:hover){.pk:hover,.spc:hover,.rk:hover{border-color:var(--accent)}}

.inst-top{display:flex;align-items:center;gap:12px}.inst-top .inst-ic{margin:0}.why{list-style:none;margin:8px 0 0;padding:0}.why li{margin:8px 0;line-height:1.35}

.pf-tile.wrap b{white-space:normal;text-align:center;line-height:1.25}
#splash{position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .3s}
#splash.out{opacity:0;pointer-events:none}
#splash img{width:96px;height:96px;border-radius:22px;animation:splpop .5s cubic-bezier(.2,.9,.3,1.2)}
#splash b{font-size:1.25rem;font-weight:700;animation:splin .5s .1s both}
@keyframes splpop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes splin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#splash img,#splash b{animation:none}}

.faq details{background:var(--panel);border-radius:12px;margin:8px 0;padding:0 14px}
.faq summary{color:var(--txt);cursor:pointer;font-weight:600;padding:13px 22px 13px 0;list-style:none;position:relative;line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';position:absolute;right:0;top:11px;color:var(--accent);font-size:1.3rem;font-weight:700}
.faq details[open] summary::after{content:'−'}
.faq details p{margin:0 0 14px;color:var(--dim);line-height:1.45;font-size:.93rem}
.faqbox{margin-top:16px}
.faqbox textarea{width:100%;margin:8px 0;resize:vertical}

/* exercise photos (Free Exercise DB) — two frames that alternate / fotos de ejercicios: dos cuadros que alternan */
.eximg{position:relative;width:100%;max-width:320px;margin:8px auto;border-radius:10px;overflow:hidden;background:#fff;line-height:0}
.eximg img{width:100%;height:auto;display:block}
.eximg img.a{background:#20242b}
.eximg img.b{position:absolute;left:0;top:0;animation:exfl 1.6s steps(1,end) infinite}
@keyframes exfl{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.eximg img.b{animation:none;opacity:0}}

/* v51 modern look: photo tiles, hero plan card, thumbnails / aspecto moderno: tarjetas con foto, plan destacado, miniaturas */
.pks{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pk.pkt{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;min-height:168px;padding:14px;overflow:hidden;border-radius:20px;background:#111;color:#fff;isolation:isolate}
.pk.pkt.wide{grid-column:1/-1;min-height:120px}
.pkt-img{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;transition:transform .4s}
.pk.pkt::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.35) 45%,rgba(0,0,0,.88) 100%)}
.pk.pkt:active .pkt-img{transform:scale(1.05)}
.pk.pkt .pk-i{position:absolute;top:10px;left:10px;font-size:1.25rem;width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pk.pkt .pk-t{flex:none;gap:3px}
.pk.pkt .pk-t b{font-size:1.2rem;line-height:1.15;color:#fff}
.pk.pkt .pk-t small{color:rgba(255,255,255,.82);font-size:.78rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pk.pkt.pri{outline:0;box-shadow:inset 0 0 0 2px var(--accent)}
.pkh{font-size:1.5rem;font-weight:700;margin:22px 0 10px}
.card.plan{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 24%,var(--panel)) 0%,var(--panel) 62%);border-radius:20px;padding:18px}
.card.plan h3{font-size:1.6rem;font-weight:700}
.rt-th{flex:none;width:56px;height:56px;border-radius:14px;background-size:cover;background-position:center;background-color:var(--panel2)}
.rt-no{display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.card.rt{border-radius:18px}
.exrow .eximg,.plex .eximg{border-radius:14px}
@media(min-width:720px){.pk.pkt{min-height:200px}.pk.pkt.wide{min-height:150px}}
@media(prefers-reduced-motion:reduce){.pkt-img{transition:none}}
.plsec{flex-wrap:wrap;gap:8px}.plsec .btn{flex:1 1 auto}
.mlist{padding:0!important;overflow:hidden}
.mrow{display:flex;align-items:center;gap:14px;width:100%;min-height:58px;padding:10px 16px;margin:0;border:0;border-radius:0;background:none;color:var(--txt);text-align:left;font:inherit;font-weight:500;text-decoration:none;border-bottom:.5px solid var(--line);cursor:pointer}
.mrow:last-child{border-bottom:0}
.mrow:active{background:var(--panel2)}
.mi{flex:none;width:36px;height:36px;border-radius:10px;background:color-mix(in srgb,var(--accent) 16%,var(--panel2));display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.mt{flex:1;display:flex;flex-direction:column;gap:1px}.mt small{color:var(--dim);font-weight:400;font-size:.78rem}
.mc{color:var(--dim);font-size:1.5rem}
.mnote{padding:0 6px;margin-top:8px}
.exrow.exth{display:flex;align-items:center;gap:12px;padding:9px 4px}
.ex-th{flex:none;width:52px;height:52px;border-radius:12px;background-size:cover;background-position:center;background-color:var(--panel2)}
.ex-no{display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.ex-tx{flex:1;min-width:0}
.plex .ex-th{width:46px;height:46px;margin-right:12px;border-radius:11px}.plex>span:not(.ex-th){flex:1;min-width:0}

/* v52 Tabler icons instead of emojis / iconos Tabler en vez de emojis */
.ic{width:1.2em;height:1.2em;vertical-align:-.22em;flex:none}
.pk.pkt .pk-i .ic{width:22px;height:22px;color:#fff}
.mi .ic{width:20px;height:20px;color:var(--accent)}
.ex-no .ic,.rt-no .ic{width:24px;height:24px;color:var(--dim)}
.btn .ic{margin-right:2px}

/* v53 equipment picker with photos / selector de equipo con fotos */
.hvg{display:grid;grid-template-columns:1fr;gap:8px;margin:8px 0}
.hv{position:relative;display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:8px 40px 8px 8px;border-radius:16px;background:var(--panel2);border:2px solid transparent;color:var(--txt)}
.hv.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel2))}
.hv-th{flex:none;width:64px;height:64px;border-radius:12px;background-size:cover;background-position:center;background-color:var(--panel)}
.hv-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hv-t small{color:var(--dim);font-size:.78rem;line-height:1.25}
.hv-ck{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;border:2px solid var(--line);font-style:normal;font-size:.8rem;display:flex;align-items:center;justify-content:center;color:transparent}
.hv.on .hv-ck{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.hvw .wopt{padding:8px 10px 8px 8px}
.hvw .wopt .wi{width:64px;height:64px;font-size:0;flex:none}
.hvw .hv-th{width:64px;height:64px}
@media(min-width:720px){.hvg{grid-template-columns:1fr 1fr}}
.wi .hv-th{display:block}

/* v54 library with photos / biblioteca con fotos */
.lat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0}
.lt-i{position:relative;aspect-ratio:1/1;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;border:2px solid transparent;display:flex;align-items:flex-end;padding:0;color:#fff;isolation:isolate}
.lt-i::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.82) 100%)}
.lt-i span{display:block;width:100%;padding:6px 8px;font-size:.82rem;font-weight:700;line-height:1.15;text-align:left}
.lt-i.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.lt-i.on::after{content:"✓";position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--on-accent);font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.spc{flex-direction:row!important;align-items:center!important;gap:12px!important}
.spc .hv-th{width:56px;height:56px}
.spc-t{display:flex;flex-direction:column;gap:2px;min-width:0}
@media(min-width:720px){.lat{grid-template-columns:repeat(5,1fr)}}

/* v55 challenges and ranks with photos / retos y rangos con fotos */
.chp{display:flex;align-items:center;gap:12px}
.chp .hv-th{width:64px;height:64px}
.chp-t{flex:1;min-width:0}
.rk.rkp{position:relative;overflow:hidden;color:#fff;background-size:cover;background-position:center;min-height:64px;justify-content:flex-end;isolation:isolate;text-align:left;align-items:flex-start;padding:8px}
.rk.rkp::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.8))}
.rk.rkp i{color:rgba(255,255,255,.8)}
.rk.rkp.on{color:#fff;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.rk.rkp.on i{color:var(--accent);background:#fff;border-radius:6px;padding:0 5px}

/* v56 compact library tiles / fichas de la biblioteca más compactas */
.lat{grid-template-columns:repeat(4,1fr);gap:6px}
.lt-i{aspect-ratio:1/.8;border-radius:12px}
.lt-i span{padding:4px 6px;font-size:.7rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lt-i.on::after{width:18px;height:18px;top:4px;right:4px;font-size:.65rem}
@media(min-width:720px){.lat{grid-template-columns:repeat(6,1fr)}}

/* v57 readable sub-heading / subtítulo legible */
.lsub{display:flex;align-items:center;gap:10px;margin:18px 0 6px}
.lsub::before,.lsub::after{content:"";flex:1;height:1px;background:var(--line)}
.lsub::before{flex:0 0 14px}
.lsub span{font-size:1.05rem;font-weight:700;color:var(--txt)}

/* v58 history, progress and body with photos and accent / historial, progreso y cuerpo con fotos y acento */
.wkp{display:flex!important;align-items:center;gap:12px;text-align:left}
.wkp .hv-th{width:60px;height:60px;border-radius:14px}
.hv-no{display:flex;align-items:center;justify-content:center;color:var(--dim)}
.hv-no .ic{width:26px;height:26px}
.wkp-t{flex:1;min-width:0;display:block}
.wkp-t .muted:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.wkp::after{float:none!important;margin-left:auto}
.stats.card{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 18%,var(--panel)) 0%,var(--panel) 70%);border-radius:20px}
.stats.card b{font-size:1.7rem;font-weight:800;color:var(--accent)}
.bwhero{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 18%,var(--panel)) 0%,var(--panel) 65%);border-radius:20px}
.bw-in{font-weight:800}

/* v59 clean placeholder when an exercise has no photo / marcador limpio cuando un ejercicio no tiene foto */
.ex-no,.rt-no,.hv-no{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 22%,var(--panel2)),var(--panel2))!important}
.ex-no .ic,.rt-no .ic,.hv-no .ic{color:var(--accent)!important;opacity:.85}

/* v62 training styles */
.stys{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.sty{position:relative;display:flex;gap:12px;width:100%;text-align:left;padding:10px 40px 10px 10px;border-radius:16px;background:var(--panel2);border:2px solid transparent;color:var(--txt)}
.sty.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel2))}
.sty-img{flex:none;width:72px;height:72px;border-radius:12px;background-size:cover;background-position:center;background-color:var(--panel)}
.sty-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.sty-t small{color:var(--dim);font-size:.82rem;line-height:1.25}
.sty-l{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dim);margin-top:4px}
.sty-c{display:flex;flex-wrap:wrap;gap:4px}
.sty-c em{font-style:normal;font-size:.76rem;padding:2px 8px;border-radius:99px;background:var(--panel);border:1px solid var(--line)}
.sty-d{font-size:.8rem;line-height:1.3}
.sty-n{font-style:normal;display:inline-flex;width:18px;height:18px;border-radius:50%;background:var(--accent);color:var(--on-accent);font-size:.7rem;align-items:center;justify-content:center;margin-left:4px}
.sty .wck{position:absolute;right:12px;top:14px;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);font-style:normal;font-size:.8rem;display:flex;align-items:center;justify-content:center;color:transparent}
.sty.on .wck{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* v63 tastes */
.btn.on{border-color:var(--accent);color:var(--accent)}
.menu button .ic,.btn .ic{vertical-align:-3px}

/* v65 goals */
.goals .gl-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.gl{position:relative;padding:8px 0;border-top:1px solid var(--line)}
.gl-t{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.gl-t span{display:flex;flex-direction:column;gap:2px}
.gl-t small{color:var(--dim);font-size:.8rem}
.gl-bar{height:10px;border-radius:99px;background:var(--panel2);overflow:hidden;margin-top:6px}
.gl-bar i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .4s}
.gl-r{display:flex;align-items:center;gap:8px;margin-top:6px}.gl-r .gl-bar{flex:1;margin-top:0}.gl-p{font-weight:700;font-size:.85rem;color:var(--accent);min-width:2.6em;text-align:right}
.gl.done{opacity:.75}

/* v68 habit */
.streak{display:flex;align-items:center;gap:14px}
.st-n{display:flex;align-items:center;gap:4px;font-size:1.8rem;font-weight:800;color:var(--accent)}
.st-n .ic{width:26px;height:26px}
.st-t{display:flex;flex-direction:column;gap:2px}
.st-t small{color:var(--dim);font-size:.82rem;line-height:1.25}

/* v70 easier to use */
.exh{display:flex;align-items:center;gap:10px}
.exh-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.cue{color:var(--dim);font-size:.8rem;line-height:1.25;font-weight:400}
.exdm{position:relative;flex:none;width:56px;height:56px;border-radius:12px;overflow:hidden;background:#fff;padding:0;border:0;line-height:0}
.exdm img{width:100%;height:100%;object-fit:cover;display:block}
.exdm img.b{position:absolute;left:0;top:0;animation:exfl 1.6s steps(1,end) infinite}
@media (prefers-reduced-motion:reduce){.exdm img.b{animation:none;opacity:0}}
.btn.fl{margin:4px 0}
#restT{font-size:1.6rem;font-variant-numeric:tabular-nums}
#restT.rdone{color:#1f9d55;animation:rdp .6s ease 3}
@keyframes rdp{50%{transform:scale(1.12)}}

/* v74 visual polish: type scale, spacing, radius, small-text floor, motion, empty states */
:root{--radius:16px;--dim:#A8A8B3}
:root[data-mode="light"]{--dim:#5C5C66}
main>*+*{margin-top:14px}
.card{padding:16px}
.sec h2{font-size:1.2rem;font-weight:800;letter-spacing:-.01em}
h3{letter-spacing:-.01em}
#tabbar button{font-size:.68rem}
.srow.hd{font-size:.72rem}
.secl,.sty-l,.vs,.rk i,.lt-i span{font-size:.74rem}
.schtd,.lt-i.on::after{font-size:.7rem}
.stats span,.hv-t small,.exrow small,.schb small,.wopt .wt small{font-size:.82rem}
.lbl{font-size:.8rem}
@keyframes pop{0%{transform:scale(.8)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes bump{0%,100%{transform:none}40%{transform:translateY(-4px) rotate(-8deg) scale(1.2)}}
.srow.done .chk{animation:pop .3s ease-out}
.srow .pr{display:inline-block;animation:bump .7s ease-out 1}
main>.card,main>.stats{animation:rise .25s ease-out}
@media (prefers-reduced-motion:reduce){.srow.done .chk,.srow .pr,main>.card,main>.stats{animation:none}}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:28px 18px}
.empty .em-i{width:60px;height:60px;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--panel2));color:var(--accent);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.empty .em-i .ic{width:30px;height:30px}
.empty b{font-size:1.1rem}
.empty p{color:var(--dim);max-width:30ch}
.empty .btn{margin-top:8px}

/* v76 set types */
.sn.tyb{border-radius:8px;font-weight:800;min-width:2rem;height:2rem;background:var(--panel2);color:var(--txt);display:inline-flex;align-items:center;justify-content:center;gap:2px}
.sn.tyb.ty-w{background:color-mix(in srgb,var(--warn) 25%,var(--panel2));color:var(--warn)}
.sn.tyb.ty-d{background:color-mix(in srgb,#8e5cf7 25%,var(--panel2));color:#a98bff}
.sn.tyb.ty-f{background:color-mix(in srgb,var(--red) 25%,var(--panel2));color:var(--red)}
/* v77 cleaner active workout: one menu per exercise, quiet secondary actions */
.exh{align-items:center}
.exh-t{flex:1}
.exmore{flex:none;width:38px;height:38px;border-radius:50%;background:var(--panel2);font-size:1.3rem;font-weight:800;line-height:1;color:var(--dim)}
.cue{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.exsub{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 4px}
.exsub span{min-width:0}
.lnk-d{color:var(--accent);font-weight:600;font-size:.85rem;padding:6px 2px;white-space:nowrap}
.wk-head .wk-act{margin-top:0}
.wk-head .wk-act .btn{width:100%}

main>.lnk-d{display:block;margin:12px auto 0;color:var(--dim)}

/* v79 charts + 1RM */
.tl{display:block;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer}
.tl-h{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.tl-d{font-weight:700;font-size:13px;white-space:nowrap}.tl-d.up{color:var(--green)}.tl-d.dn{color:var(--red)}
.rmc-in{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.rmc-big{display:flex;flex-direction:column;align-items:center;padding:8px 0}.rmc-big b{font-size:28px;color:var(--accent)}.rmc-big span{font-size:12px;color:var(--dim)}
.rmc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.rmc-grid div{background:var(--panel2);border-radius:10px;padding:8px 4px;text-align:center}.rmc-grid b{display:block;font-size:15px}.rmc-grid span{font-size:11px;color:var(--dim)}

/* undo toast / aviso con Deshacer */
#toast.undo{pointer-events:auto}
#toast .tundo{margin-left:10px;background:none;border:0;color:inherit;font:inherit;font-weight:800;text-decoration:underline;padding:4px 2px;cursor:pointer}
.welc{text-align:center}.welc-ic{width:84px;height:84px;border-radius:21px;margin:4px auto 10px;display:block;box-shadow:0 8px 24px rgba(0,0,0,.25)}.welc h3{margin:0 0 4px}.welc .why{text-align:left;margin:14px 0}.welc .btn{margin-top:8px}
.welc .qrbox{margin:8px auto}.welc .qrbox svg{width:150px;height:150px}.welc .why{font-size:.95em}
.welc .qrbox{display:flex;justify-content:center;width:auto;max-width:none}
.welc .qrbox{aspect-ratio:auto;height:auto;width:166px}
.cr-av.nf::before{content:'M'}