/* Ávila Smart: estilos. Tokens y componentes vienen de la maqueta 04, ya auditada. */
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;src:url('../fuentes/chakra-petch-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;src:url('../fuentes/chakra-petch-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fuentes/inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fuentes/inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fuentes/inter-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fuentes/inter-latin-700-normal.woff2') format('woff2')}
:root{
  /* seis tamaños de letra, ni uno más */
  --t1:25px;   /* título de pantalla */
  --t2:19px;   /* título de tarjeta */
  --t3:15px;   /* etiqueta fuerte */
  --t4:13.5px; /* cuerpo */
  --t5:12px;   /* apoyo */
  --t6:10.5px; /* micro: barra y rótulos */
  --t-cifra:26px; /* cifras */
  --t-reloj:90px; /* solo el reloj del descanso */
  /* seis pasos de espacio */
  --e1:4px; --e2:8px; --e3:12px; --e4:16px; --e5:20px; --e6:28px;

  --naranja:#FF6A00; --sobre-naranja:#000; --naranja-suave:rgba(255,106,0,.13);
  --fondo:#1A1A1A; --tarjeta:#262626; --tarjeta-2:#303030; --linea:#3A3A3A;
  --texto:#F5F5F5; --tenue:#9E9E9E;
  /* solo para iconos y adornos: como texto no llega al contraste mínimo */
  --tenue-2:#8A8A8A;
  --hecho:#3ECF8E; --hecho-suave:rgba(62,207,142,.14);
  --alerta:#E8706C; --frio:#7FB2E8;
  --chaflan:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);
  --chaflan-sm:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
  --logo:url('../img/logo-oscuro.png');
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{font-family:'Inter',system-ui,sans-serif;background:var(--fondo);color:var(--texto);-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
:focus-visible{outline:3px solid var(--naranja);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* una sola regla para los iconos de línea: mismo grosor y mismos remates */
svg[viewBox="0 0 24 24"]{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ===== dentro del teléfono ===== */
.app{background:var(--fondo);color:var(--texto);min-height:100vh;min-height:100dvh;max-width:480px;margin:0 auto;display:flex;flex-direction:column}
.app h1,.app h2,.app h3,.num{font-family:'Chakra Petch',sans-serif;letter-spacing:-.005em;line-height:1.12}
.env{padding:0 var(--e5)}
.mini{font-size:var(--t5);color:var(--tenue);line-height:1.5}
.tenue{color:var(--tenue)}

.barra{display:flex;align-items:center;padding:var(--e4) var(--e5) var(--e3)}
.logotipo{display:block;height:40px;width:71px;background:var(--logo) left center/contain no-repeat}
.avatar{margin-left:auto;padding:var(--e1) var(--e3);border-radius:8px;background:var(--tarjeta);border:1px solid var(--linea);
  font-size:var(--t6);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tenue)}

.btn{display:flex;align-items:center;justify-content:center;gap:var(--e2);width:100%;padding:var(--e4) var(--e5);
  background:var(--naranja);color:var(--sobre-naranja);font-size:var(--t3);font-weight:700;clip-path:var(--chaflan)}
.btn.fantasma{background:transparent;color:var(--texto);border:1px solid var(--linea);clip-path:none;
  font-weight:600;font-size:var(--t3);padding:var(--e4);border-radius:12px}
.btn svg{width:19px;height:19px;stroke:currentColor}

.card{background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e4);
  margin-bottom:var(--e3);display:flex;flex-direction:column}
.rotulo{font-size:var(--t6);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue);margin-bottom:var(--e2)}
.card-ir{display:flex;align-items:center;justify-content:space-between;gap:var(--e2);width:100%;white-space:nowrap;
  min-height:44px;margin-top:auto;padding:var(--e3) var(--e1) 0;border-top:1px solid var(--linea);text-align:left;
  font-size:var(--t4);font-weight:600;color:var(--texto)}
.card-ir svg{width:16px;height:16px;flex:none;stroke:var(--tenue-2)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3);align-items:stretch;margin-bottom:var(--e3)}
.duo>.card,.duo>.hoy-card{margin-bottom:0}
.duo .card-ir{font-size:var(--t5)}
.duo .card{margin-bottom:var(--e3)}
.cifra{font-family:'Chakra Petch',sans-serif;font-size:var(--t-cifra);font-weight:700;line-height:1}
.cifra i{font-style:normal;font-size:var(--t5);color:var(--tenue);font-weight:600}
.et{font-size:var(--t5);color:var(--tenue);margin-top:var(--e2);line-height:1.45}

/* tarjeta del día */
.hoy-card{background:linear-gradient(150deg,#FF6A00,#E85D00);color:var(--sobre-naranja);
  padding:var(--e4);margin-bottom:var(--e3);clip-path:var(--chaflan-sm);display:flex;flex-direction:column}
.hoy-card .eti{font-size:var(--t6);font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.68}
.hoy-card h2{font-size:var(--t2);font-weight:700;margin:var(--e1) 0 var(--e1);line-height:1.1}
.hoy-card .meta-dia{font-size:var(--t5);font-weight:600;opacity:.75;margin-bottom:var(--e3)}
.hoy-card .empezar{display:flex;align-items:center;justify-content:center;gap:var(--e2);width:100%;margin-top:auto;
  padding:var(--e3);background:#000;color:#fff;font-size:var(--t4);font-weight:700;clip-path:var(--chaflan-sm)}
.hoy-card .empezar svg{width:18px;height:18px;stroke:currentColor}

.abierto{display:flex;align-items:center;gap:var(--e2);justify-content:center;font-size:var(--t5);color:var(--tenue);margin:0 0 var(--e4)}
.abierto i{width:7px;height:7px;border-radius:50%;background:var(--hecho);flex:none}
/* barra inferior */
.nav{position:sticky;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--e1);background:var(--fondo);
  border-top:1px solid var(--linea);padding:var(--e3) var(--e2) var(--e4);margin-top:var(--e5)}
.nav a{display:grid;justify-items:center;gap:var(--e1);font-size:var(--t6);color:var(--tenue);text-decoration:none;font-weight:500}
.nav a svg{width:21px;height:21px;stroke:currentColor}
.nav a.on{color:var(--naranja)}
.nav a.off{opacity:.32}

/* instalar */
.instalar{padding:0 var(--e6);text-align:center}
.instalar .marca{display:flex;justify-content:center;padding:var(--e6) 0 var(--e6)}
.instalar .marca .logotipo{height:52px;width:93px}
.instalar h1{font-size:var(--t1);font-weight:700;margin-bottom:var(--e2)}
.instalar p.sub{font-size:var(--t4);color:var(--tenue);line-height:1.6;margin-bottom:var(--e6)}
.paso{display:flex;gap:var(--e3);align-items:center;text-align:left;background:var(--tarjeta);border:1px solid var(--linea);
  border-radius:14px;padding:var(--e4) var(--e4);margin-bottom:var(--e2)}
.paso .n{width:26px;height:26px;flex:none;background:var(--tarjeta-2);color:var(--tenue);display:grid;
  place-items:center;font-family:'Chakra Petch',sans-serif;font-size:var(--t5);font-weight:700;border-radius:8px}
.paso span{flex:1;min-width:0;font-size:var(--t4);line-height:1.45}
.paso b{font-weight:600}
.paso svg{width:18px;height:18px;flex:none;stroke:var(--tenue-2)}

/* ===== catálogo ===== */
.mapa{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3);margin-bottom:var(--e4)}
.vista{background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e3) var(--e2) var(--e2)}
.vista svg{display:block;width:100%;height:auto}
.vista .cara{text-align:center;font-size:var(--t5);color:var(--tenue);font-weight:500;margin-top:var(--e2)}
/* Cada zona son dos trazos: uno se ve, otro solo recibe el toque.
   Así la marcada puede llevar contorno sin perder área táctil, y el
   estado no depende solo del color. */
.zona{cursor:pointer;touch-action:manipulation}
.zona .v{fill:#41474F}
.zona .t{fill:transparent;stroke:transparent;stroke-width:11}
@media (hover:hover){.zona:hover .v{fill:#525A64}}
.zona.sel .v{fill:var(--naranja);stroke:var(--texto);stroke-width:1.6;stroke-linejoin:round}
.zona:focus{outline:none}
.zona:focus-visible .v{stroke:var(--texto);stroke-width:2.4;stroke-linejoin:round}
.zona.sel{fill:var(--naranja)}
.hueso{fill:#31363D}
.otros{display:flex;gap:var(--e2);margin-bottom:var(--e5)}
.gr{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--e2);padding:var(--e3) var(--e4);
  border:1px solid var(--linea);border-radius:11px;background:var(--tarjeta);
  font-size:var(--t4);font-weight:600;color:var(--texto)}
.gr svg{width:16px;height:16px;flex:none;stroke:var(--tenue)}
.gr.sel svg{stroke:var(--naranja-texto)}
.sub-grupo{font-size:var(--t6);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tenue);margin:var(--e5) 0 var(--e2)}
.sub-grupo:first-child{margin-top:0}
.vacio{font-size:var(--t4);color:var(--tenue);line-height:1.6;background:var(--tarjeta);
  border:1px dashed var(--linea);border-radius:14px;padding:var(--e5)}
.gr.sel{border-color:var(--naranja);background:var(--naranja-suave);color:var(--naranja-texto)}
.cab-lista{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--e3)}
.cab-lista h2{font-size:var(--t2);font-weight:700}
.cab-lista span{font-size:var(--t5);color:var(--tenue)}
.ejer{display:flex;align-items:center;gap:var(--e3);width:100%;text-align:left;padding:var(--e3) var(--e3);margin-bottom:var(--e2);
  background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px}
.ejer .fig{width:50px;height:50px;flex:none;border-radius:11px;background:#fff;overflow:hidden;position:relative;cursor:zoom-in}
.ejer .fig svg{display:block;width:100%;height:100%}
.ejer .fig .lupa{position:absolute;right:3px;bottom:3px;width:16px;height:16px;background:rgba(0,0,0,.55);
  border-radius:5px;display:grid;place-items:center}
.ejer .fig .lupa svg{width:10px;height:10px;stroke:#fff}
.ejer .tx{flex:1;min-width:0;text-align:left}
.ejer .tx b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1);line-height:1.3}
.ejer .tx small{font-size:var(--t5);color:var(--tenue)}
.ejer .mas{width:34px;height:34px;flex:none;border-radius:10px;background:var(--tarjeta-2);display:grid;place-items:center}
.ejer .mas svg{width:17px;height:17px;stroke:var(--tenue)}
.ejer[aria-pressed="true"]{border-color:var(--naranja)}
.ejer[aria-pressed="true"] .mas{background:var(--naranja)}
.ejer[aria-pressed="true"] .mas svg{stroke:var(--sobre-naranja)}
.nivel{display:inline-block;font-size:var(--t6);font-weight:600;padding:var(--e1) var(--e2);border-radius:6px;margin-left:var(--e2);
  background:var(--tarjeta-2);color:var(--tenue)}
.nivel.basico{background:var(--hecho-suave);color:var(--hecho)}
.nivel.avanzado{color:var(--texto);box-shadow:inset 0 0 0 1px var(--linea)}
/* el botón y la barra comparten el pie: si los dos se pegan abajo, se tapan */
.pie-fijo{position:sticky;bottom:0;background:var(--fondo)}
.pie-fijo .barra-abajo{position:static;padding-bottom:0}
.pie-fijo .nav{position:static;margin-top:var(--e3)}
.paso .n svg{width:14px;height:14px;stroke:var(--tenue)}
.barra-abajo{position:sticky;bottom:0;background:linear-gradient(transparent,var(--fondo) 26%);padding:var(--e5) var(--e5) var(--e5);margin-top:var(--e1)}

/* zoom de la guía */
.zoom{position:fixed;inset:0;background:rgba(12,12,12,.975);display:none;flex-direction:column;
  align-items:center;justify-content:center;padding:var(--e5);z-index:9}
.zoom.ver{display:flex}
.zoom .lienzo{width:100%;max-width:320px;background:#fff;border-radius:18px;overflow:hidden}
.zoom .lienzo svg{display:block;width:100%;height:auto}
.zoom .nom{font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700;margin-top:var(--e4);text-align:center}
.zoom .dat{font-size:var(--t5);color:var(--tenue);margin-top:var(--e1)}
.zoom .cerrar{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:12px;
  background:rgba(255,255,255,.12);display:grid;place-items:center}
.zoom .cerrar svg{width:19px;height:19px;stroke:#fff}
.zoom .tip{font-size:var(--t5);color:var(--tenue);margin-top:var(--e5)}

/* ===== entrenar ===== */
.ejec-top{display:flex;align-items:center;gap:var(--e3);padding:var(--e4) var(--e5) var(--e4)}
.ejec-top .x{width:34px;height:34px;border-radius:10px;background:var(--tarjeta);display:grid;place-items:center;flex:none}
.ejec-top .x svg{width:17px;height:17px;stroke:var(--texto)}
.ejec-top b{display:block;font-size:var(--t3);font-weight:600}
.ejec-top small{font-size:var(--t5);color:var(--tenue)}
.progreso{display:flex;gap:var(--e1);padding:0 var(--e5) var(--e5)}
.pg{flex:1;height:4px;border-radius:2px;background:var(--tarjeta-2)}
.pg.ok{background:var(--hecho)} .pg.ac{background:var(--naranja)}
.demo{background:#fff;border-radius:16px;overflow:hidden;margin-bottom:var(--e4);position:relative}
.demo svg{display:block;width:100%;height:auto}
.demo .etiq{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,.06);color:#333;
  font-size:var(--t6);font-weight:600;padding:var(--e1) var(--e3);border-radius:7px}
.serie{display:flex;align-items:center;justify-content:space-between;background:var(--tarjeta);
  border:1px solid var(--linea);border-radius:16px;padding:var(--e4) var(--e5);margin-bottom:var(--e3)}
.serie .b .cifra{font-size:var(--t-cifra)}
.serie .b small{display:block;font-size:var(--t5);color:var(--tenue);margin-top:var(--e1)}
.serie .sep{width:1px;height:36px;background:var(--linea)}
.saltos{display:grid;grid-template-columns:1fr 1fr;gap:var(--e2);margin-top:var(--e3)}
.saltos button{display:flex;align-items:center;justify-content:center;gap:var(--e2);padding:var(--e3) var(--e2);
  border-radius:11px;background:transparent;border:1px solid var(--linea);
  font-size:var(--t5);font-weight:600;color:var(--tenue);white-space:nowrap}
.saltos svg{width:15px;height:15px;flex:none;stroke:currentColor}
/* solo lo oye el lector de pantalla */
.aviso-lector{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.como{background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;padding:var(--e4) var(--e4);margin-top:var(--e3)}
.como b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e3)}
.como li{list-style:none;display:flex;gap:var(--e3);font-size:var(--t4);color:var(--tenue);line-height:1.5;margin-bottom:var(--e2)}
.como li:last-child{margin-bottom:0}
.como li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--naranja);flex:none;margin-top:var(--e2)}
.descanso{position:fixed;inset:0;background:rgba(16,16,16,.97);color:var(--texto);font-family:'Inter',sans-serif;
  display:none;flex-direction:column;align-items:center;justify-content:center;padding:var(--e6);text-align:center;z-index:8}
.descanso.ver{display:flex}
.descanso .et2{font-size:var(--t3);color:var(--tenue);font-weight:500}
.descanso .reloj{font-family:'Chakra Petch',sans-serif;font-size:var(--t-reloj);font-weight:700;color:var(--naranja);
  line-height:1;font-variant-numeric:tabular-nums;margin:var(--e2) 0}
.descanso .sig{font-size:var(--t4);margin-bottom:var(--e6)}
.descanso .acciones{display:flex;gap:var(--e3);width:100%;max-width:290px}
.descanso .acciones button{flex:1;padding:var(--e4);border-radius:12px;background:var(--tarjeta);
  border:1px solid var(--linea);font-size:var(--t4);font-weight:600;color:var(--texto)}
.descanso .acciones .saltar{background:var(--naranja);color:var(--sobre-naranja);border-color:var(--naranja);
  clip-path:var(--chaflan-sm);border-radius:0}

/* ===== al terminar ===== */
.cierre{padding:0 var(--e5) var(--e5);text-align:center}
.cierre .sello{width:64px;height:64px;margin:var(--e6) auto var(--e5);background:var(--naranja);
  display:grid;place-items:center;clip-path:var(--chaflan-sm)}
.cierre .sello svg{width:30px;height:30px;stroke:var(--sobre-naranja);stroke-width:2.6}
.cierre h1{font-size:var(--t1);font-weight:700;margin-bottom:var(--e2)}
.cierre .sub{font-size:var(--t4);color:var(--tenue);margin-bottom:var(--e6)}
.marcas{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e2);margin-bottom:var(--e3)}
.marcas div{background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;padding:var(--e4) var(--e2)}
.marcas .cifra{display:block;font-size:var(--t-cifra)}
.marcas small{display:block;font-size:var(--t5);color:var(--tenue);margin-top:var(--e1)}

/* ===== entrega 02, fase 1 ===== */
:root{--naranja-texto:#FF6A00}

:root[data-theme="light"]{--fondo:#F3F3F1;--tarjeta:#FFFFFF;--tarjeta-2:#ECECE9;--linea:#D9D9D5;--texto:#1A1A1A;
  --tenue:#595959;--tenue-2:#8A8A8A;--hecho:#1B7A51;--hecho-suave:rgba(27,122,81,.12);--alerta:#B3372F;--frio:#2A64A8;
  --naranja-texto:#A84500;--naranja-suave:rgba(255,106,0,.12);--logo:url('../img/logo-claro.png')}
:root[data-theme="light"] .hueso{fill:#D4D4D0}
:root[data-theme="light"] .zona .v{fill:#AEB2B8}
/* A1: naranja solo para lo que se toca y la cifra que importa */
.saludo .foto{box-shadow:0 0 0 2px var(--fondo),0 0 0 4px var(--linea)}
.racha .llama svg{filter:none}
.racha .llama .fuego{fill:#FF6A00}
.racha .llama .nucleo{fill:#FFC23D}
.racha .llama .n b{font-weight:700}
.pd.hoy{background:transparent;color:var(--texto);box-shadow:inset 0 0 0 2px var(--texto)}
.pd.libre{background:transparent;border:1px dashed var(--linea);color:var(--tenue)}
.pista i{background:var(--frio)}
.pg.ac{background:var(--texto)}
.cierre .sello{background:var(--hecho);clip-path:none;border-radius:50%}
.como li::before{background:var(--tenue-2)}
.insignia svg,.comida .ct svg{stroke:var(--tenue)}
.graf-linea{color:var(--texto)}
/* A4: texto de la tarjeta del día sin transparencia */
.hoy-card .eti,.hoy-card .meta-dia{opacity:1}
/* C: tamaño táctil */
.zona .v,.zona .t,.hueso{pointer-events:none}
.zona .toque{fill:transparent;pointer-events:all}
.ver-toque .zona .toque{fill:rgba(62,207,142,.18);stroke:#3ECF8E;stroke-width:.6}
.hoja .paso{display:flex;align-items:center;gap:var(--e3);padding:var(--e3);margin-bottom:var(--e2);background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:14px;font-size:var(--t4)}
.hoja .paso .n{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--tarjeta);font-size:var(--t5);font-weight:700;color:var(--tenue)}
.revisar{display:block;margin:0 auto 12px;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid #444;background:#2A2A2A;color:#F5F5F5;font-size:13.5px;font-weight:600}

.nav{padding-top:var(--e1)}
.nav a{min-height:48px;align-content:center;color:var(--tenue)}
.nav a.on{color:var(--naranja-texto)}
.agua-btns button{min-height:44px}
.ejer .mas{width:44px;height:44px}
.ejer .tx{min-height:44px}
.saltos button{min-height:44px}
.zoom .cerrar{width:44px;height:44px}

/* barra superior */
.barra{gap:var(--e2)}
.acc-barra{margin-left:auto;display:flex;gap:var(--e1)}
.ib{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;color:var(--tenue)}
.ib svg{width:21px;height:21px;stroke:currentColor}
@media (hover:hover){.ib:hover{background:var(--tarjeta)}}
/* selector de Plan */
/* Selectores (entrega 23, «más baja»). Dos formas según lo que hacen:
   - Pestañas (Rutina / Alimentación, cambian la pantalla): texto con una línea naranja fina debajo, 40 px.
   - Cápsulas (General / Detallado, filtros de la Comunidad, cambian una parte): gris, sin naranja, 36 px a la vista.
   En las dos el dedo toca 44 px: una franja invisible sobresale arriba y abajo. */
.seg{display:grid;grid-template-columns:1fr 1fr;margin:0 var(--e5) var(--e5);border-bottom:1px solid var(--linea)}
.seg button{position:relative;min-height:40px;font-size:var(--t4);font-weight:500;color:var(--tenue)}
.seg button::before{content:'';position:absolute;left:0;right:0;top:-2px;bottom:-2px}
.seg button[aria-selected="true"]{color:var(--texto);font-weight:700}
.seg button[aria-selected="true"]::after{content:'';position:absolute;left:18%;right:18%;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--naranja)}
.capsula{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;background:var(--tarjeta-2);border-radius:12px}
.capsula.tres{grid-template-columns:1fr 1fr 1fr}
.capsula button{position:relative;min-height:30px;padding:7px 4px;border-radius:9px;font-size:var(--t4);line-height:16px;font-weight:700;color:var(--tenue);white-space:nowrap}
.capsula button::after{content:'';position:absolute;left:0;right:0;top:-7px;bottom:-7px}
.capsula button[aria-pressed="true"]{background:var(--capsula-sel);color:var(--texto);box-shadow:0 1px 2px rgba(0,0,0,.3)}
:root{--capsula-sel:#4A4A4A}
:root[data-theme="light"]{--capsula-sel:#FFFFFF}
:root[data-theme="light"] .capsula button[aria-pressed="true"]{box-shadow:0 1px 3px rgba(0,0,0,.12)}
.otro-grupo{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;padding:0 var(--e4);
  margin-bottom:var(--e3);border:1px solid var(--linea);border-radius:14px;background:var(--tarjeta);font-size:var(--t4);font-weight:600}
.otro-grupo svg{width:16px;height:16px;stroke:var(--tenue-2)}
/* Entrega 39: con la tarjeta del día en gris, el camino a otro músculo se marca en naranja, sin relleno. */
.otro-grupo.destacar{border-color:var(--naranja);color:var(--naranja-texto)}
.otro-grupo.destacar svg{stroke:var(--naranja-texto)}
/* entrenando: anotar */
.ejec-top .x{width:44px;height:44px;border-radius:12px}
.ejec-top h1{font-size:var(--t3);font-weight:600;font-family:'Inter',system-ui,sans-serif;letter-spacing:0}
.anota{display:grid;gap:var(--e2);margin-bottom:var(--e3)}
.anota .caja{display:flex;align-items:center;justify-content:space-between;background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e2) var(--e2) var(--e2) var(--e4)}
.anota .lbl{font-size:var(--t4);font-weight:600;margin:0;line-height:1.2}
.paso-num{display:grid;grid-template-columns:44px 96px 44px;align-items:center;gap:var(--e1)}
.paso-num button{width:44px;height:44px;border-radius:12px;background:var(--tarjeta-2);display:grid;place-items:center}
.paso-num button svg{width:18px;height:18px;stroke:var(--texto)}
.paso-num output{white-space:nowrap;text-align:center;font-family:'Chakra Petch',sans-serif;font-size:var(--t-cifra);font-weight:700;line-height:1}
.paso-num output i{font-style:normal;font-size:var(--t5);color:var(--tenue);font-weight:600}
.serie-cab{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--e3)}
.serie-cab b{font-family:'Chakra Petch',sans-serif;font-size:var(--t2)}
.serie-cab small{font-size:var(--t5);color:var(--tenue)}
.vez{display:flex;gap:var(--e3);align-items:flex-start;font-size:var(--t5);color:var(--tenue);line-height:1.5;
  background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;padding:var(--e3) var(--e4);margin-bottom:var(--e3)}
.vez svg{width:16px;height:16px;flex:none;stroke:var(--tenue);margin-top:var(--e1)}
.vez b{color:var(--texto);font-weight:600}
.saltos.tres{grid-template-columns:1fr 1fr 1fr}
.saltos.tres button{white-space:normal;line-height:1.2;padding:var(--e2) var(--e1)}
/* hoja inferior */
.velo{position:fixed;inset:0;color:var(--texto);background:rgba(0,0,0,.6);display:flex;align-items:flex-end;z-index:9}
.hoja{width:100%;background:var(--tarjeta);border-radius:22px 22px 0 0;padding:var(--e3) var(--e5) var(--e6)}
/* La cabecera se agarra para bajar la hoja: la barrita visible mide 40 × 4, pero su franja de toque es de 44 px de alto
   y todo el ancho. touch-action:none para que el navegador no se lleve el gesto. */
.hoja-cab{touch-action:none;cursor:grab;margin:calc(var(--e3) * -1) calc(var(--e5) * -1) 0;padding:0 var(--e5)}
.hoja-cab:active{cursor:grabbing}
.hoja .asa{position:relative;height:44px;margin:0 calc(var(--e5) * -1)}
.hoja .asa::before{content:'';position:absolute;left:50%;top:var(--e3);width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--linea)}
.hoja h2{font-size:var(--t2);font-weight:700;margin-bottom:var(--e2)}
.hoja p{font-size:var(--t4);color:var(--tenue);line-height:1.55;margin-bottom:var(--e5)}
.alt{display:flex;align-items:center;gap:var(--e3);width:100%;min-height:64px;padding:var(--e2) var(--e3);margin-bottom:var(--e2);
  background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:14px;text-align:left}
.alt .fig{width:48px;height:48px;flex:none;border-radius:10px;overflow:hidden;background:#fff}
.alt .fig svg{display:block;width:100%;height:100%}
.alt span{flex:1}
.alt b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1)}
.alt small{font-size:var(--t5);color:var(--tenue)}
.alt em{font-style:normal;font-size:var(--t5);font-weight:700;color:var(--naranja-texto)}
.hoja .btn.fantasma{margin-top:var(--e2)}
/* descanso de hoy */
.descansa{background:var(--tarjeta);clip-path:var(--chaflan);padding:var(--e5) var(--e4);display:flex;flex-direction:column}
.descansa .eti{font-size:var(--t6);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue)}
.descansa h2{font-size:var(--t2);font-weight:700;margin:var(--e1) 0}
.descansa p{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-bottom:var(--e3)}
.descansa .btn.fantasma{margin-top:auto;padding:var(--e2) var(--e1);min-height:44px;font-size:var(--t4);white-space:nowrap}
/* instalación */
.instalar .nota{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin:var(--e2) 0 var(--e5)}
.instalar .paso b{font-weight:700}
.copiado{display:flex;align-items:center;gap:var(--e2);font-size:var(--t5);color:var(--tenue);margin-top:var(--e3);justify-content:center}
.hoy-card .empezar,.gr{min-height:44px}
.oculto-lector{font-size:var(--t1);position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hoja .btn{margin-top:var(--e2)}
.accion-fija{position:sticky;bottom:0;z-index:2;padding:var(--e5) var(--e5) var(--e5);margin-top:calc(var(--e3) * -1);background:linear-gradient(to bottom,transparent,var(--fondo) 35%)}
.accion-fija .btn{margin:0}
.velo[hidden]{display:none}
.saltos.tres{margin:var(--e3) 0 var(--e5)}

/* ===== fase 1: piezas propias de la app ===== */
.titulo{padding:var(--e2) var(--e5) var(--e5)}
.titulo h1{font-size:var(--t1);font-weight:700}
.titulo p{margin-top:var(--e2);font-size:var(--t4);line-height:1.55;color:var(--tenue)}
#vista{flex:1;padding-bottom:var(--e6)}
/* con la barra de secciones abajo, el botón fijo se apoya encima de ella y no debajo */
.con-nav .barra-abajo{bottom:var(--alto-nav,0px)}
.con-nav #vista{padding-bottom:0}
#vista:focus{outline:none}
h1:focus{outline:none}
.nav{margin-top:0;padding-bottom:calc(var(--e4) + env(safe-area-inset-bottom))}
.nav a{text-align:center}
.barra{padding-top:calc(var(--e4) + env(safe-area-inset-top))}
.ejec-top{padding-top:calc(var(--e4) + env(safe-area-inset-top))}
.accion-fija,.barra-abajo{padding-bottom:calc(var(--e5) + env(safe-area-inset-bottom))}
.btn[aria-disabled="true"]{background:var(--tarjeta-2);color:var(--tenue);cursor:not-allowed}
.btn:not([aria-disabled="true"]):active{transform:translateY(1px)}
.hoy-card h2{color:var(--sobre-naranja)}
.cab-lista{margin-top:var(--e1)}
.sub-grupo{margin-top:var(--e5)}
/* hojas inferiores reales: se centran en pantallas anchas */
.velo{z-index:20;justify-content:center}
.hoja{max-width:480px;max-height:92vh;overflow-y:auto;padding-bottom:calc(var(--e6) + env(safe-area-inset-bottom))}
.hoja:focus{outline:none}
.hoja .medio-grande{background:#fff;border-radius:16px;overflow:hidden;margin-bottom:var(--e4)}
.hoja .medio-grande img{display:block;width:100%;height:auto}
.demo img{display:block;width:100%;height:auto}
.ejer .fig img,.alt .fig img{display:block;width:100%;height:100%;object-fit:cover}
.descanso{z-index:15}
.descanso .sig{max-width:300px;line-height:1.5}
.descanso .acciones button{min-height:48px}
/* avisos breves */
.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:30;
  max-width:min(440px,calc(100% - 40px));background:var(--texto);color:var(--fondo);font-size:var(--t4);font-weight:600;
  padding:var(--e3) var(--e4);border-radius:12px;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
/* pantallas que llegan en otras fases */
.pronto{background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e5)}
.pronto .rotulo{margin-bottom:var(--e2)}
.pronto h2{font-size:var(--t2);font-weight:700;margin-bottom:var(--e2)}
.pronto p{font-size:var(--t4);color:var(--tenue);line-height:1.55}
/* inicio */

.ultima{margin-top:var(--e1)}
.ultima .et{margin-top:var(--e1)}
.ultima b{font-size:var(--t3);font-weight:600}
.oculto-lector{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.valor-sube{color:var(--hecho)}
@media (min-width:600px){ body{background:#101010} :root[data-theme="light"] body{background:#E4E4E2} .app{box-shadow:0 0 0 1px var(--linea)} }

.barra .logotipo{height:44px}
/* el descanso usa los colores del tema: en tema de día no puede quedar texto oscuro sobre fondo oscuro */
.descanso{background:var(--fondo);background:color-mix(in srgb,var(--fondo) 97%,transparent)}
.descanso .reloj{color:var(--naranja-texto)}
/* la barra de secciones se pega abajo en toda la pantalla, no solo al final */
#nav{position:sticky;bottom:0;z-index:6}
#nav .nav{position:static}
:root[data-theme="light"] .zona.sel .v{fill:var(--naranja);stroke:var(--texto)}


/* ===== fase 2: piezas traídas de la maqueta ===== */
/* racha */
.racha .llama{display:flex;align-items:center;gap:var(--e3);margin-bottom:var(--e3)}
.racha .llama svg{width:32px;height:32px;flex:none;fill:var(--naranja);stroke:none;
  filter:drop-shadow(0 0 6px rgba(255,106,0,.75)) drop-shadow(0 0 13px rgba(255,106,0,.35))}
.racha .llama .n{font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700;line-height:1}
.racha .llama small{font-size:var(--t5);color:var(--tenue);white-space:nowrap}
.comodin{margin-left:auto;font-size:var(--t6);font-weight:600;color:var(--frio);
  background:rgba(127,178,232,.13);padding:var(--e1) var(--e2);border-radius:7px;white-space:nowrap}
.semana{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--e1)}
.pd{height:40px;border-radius:9px;background:var(--tarjeta-2);display:grid;place-items:center;gap:var(--e1);
  font-size:var(--t5);font-weight:600;color:var(--tenue)}
.pd u{text-decoration:none;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.5}
.pd svg{width:13px;height:13px;stroke:currentColor}
.pd.ok{background:var(--hecho-suave);color:var(--hecho)}
.pd.hoy{background:var(--naranja);color:var(--sobre-naranja);font-size:var(--t6);font-weight:700}
.pd.hoy b{font-family:'Chakra Petch',sans-serif;font-size:var(--t4)}
.pd.salvado{background:rgba(127,178,232,.16);color:var(--frio)}
.recuerdo{display:flex;gap:var(--e3);align-items:flex-start;margin-top:var(--e3);padding-top:var(--e3);
  border-top:1px solid var(--linea);font-size:var(--t5);color:var(--tenue);line-height:1.5}
.recuerdo svg{width:16px;height:16px;flex:none;stroke:var(--frio);margin-top:var(--e1)}
.recuerdo b{color:var(--texto);font-weight:600}

/* agua */
.pista{height:8px;border-radius:4px;background:var(--tarjeta-2);overflow:hidden}
.pista i{display:block;height:100%;background:var(--naranja);border-radius:4px;transition:width .2s}
.agua-btns{display:grid;grid-template-columns:1fr 1fr;gap:var(--e2);margin-top:var(--e3)}
.agua-btns button{padding:var(--e3) var(--e1);border-radius:9px;background:var(--tarjeta-2);border:1px solid var(--linea);
  font-size:var(--t5);font-weight:600;color:var(--texto);white-space:nowrap}

.bloque{margin-bottom:var(--e6)}
.lbl{font-size:var(--t3);font-weight:600;margin-bottom:var(--e3)}
.lbl span{display:block;font-size:var(--t5);font-weight:400;color:var(--tenue);margin-top:var(--e1);line-height:1.45}
.caja-in{display:flex;align-items:center;gap:var(--e3);background:var(--tarjeta);border:1px solid var(--linea);
  border-radius:13px;padding:var(--e4) var(--e4)}
.caja-in .pre{font-family:'Chakra Petch',sans-serif;font-size:var(--t3);font-weight:700;color:var(--tenue)}
.caja-in .valor{font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:600;letter-spacing:.02em}
.par-dato{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
.meta-op{display:flex;align-items:flex-start;gap:var(--e3);width:100%;text-align:left;padding:var(--e4);margin-bottom:var(--e2);
  background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px}
.meta-op .ic{width:36px;height:36px;flex:none;border-radius:10px;background:var(--tarjeta-2);display:grid;place-items:center}
.meta-op .ic svg{width:19px;height:19px;stroke:var(--tenue)}
.meta-op b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1)}
.meta-op small{font-size:var(--t5);color:var(--tenue);line-height:1.45;display:block}
.meta-op[aria-pressed="true"]{border-color:var(--naranja);background:var(--naranja-suave)}
.meta-op[aria-pressed="true"] .ic{background:var(--naranja)}
.meta-op[aria-pressed="true"] .ic svg{stroke:var(--sobre-naranja)}
.dias{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--e2)}
.dia{padding:var(--e4) 0;border:1px solid var(--linea);border-radius:11px;background:var(--tarjeta);
  font-family:'Chakra Petch',sans-serif;font-size:var(--t3);font-weight:600;text-align:center}
.dia[aria-pressed="true"]{border-color:var(--naranja);background:var(--naranja-suave);color:var(--naranja)}
.eco{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-top:var(--e3)}
.pista-meta{display:flex;gap:var(--e3);align-items:flex-start;margin-top:var(--e3);font-size:var(--t5);color:var(--tenue);line-height:1.5}
.pista-meta svg{width:15px;height:15px;flex:none;stroke:var(--tenue-2);margin-top:var(--e1)}
.pista-meta b{color:var(--texto);font-weight:600}

.ficha{display:flex;align-items:center;gap:var(--e4);padding:var(--e1) var(--e5) var(--e5)}
.ficha .foto-p{position:relative;width:54px;height:54px;flex:none;border-radius:50%;background:var(--tarjeta-2);
  display:grid;place-items:center;font-family:'Chakra Petch',sans-serif;font-size:17px;font-weight:700;
  color:var(--texto);box-shadow:0 0 0 2px var(--fondo),0 0 0 4px var(--naranja)}
.ficha b{display:block;font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700}
.ficha small{font-size:var(--t5);color:var(--tenue)}
.lista-datos{background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;overflow:hidden;margin-bottom:var(--e5)}
.dato{display:flex;align-items:center;gap:var(--e3);width:100%;text-align:left;padding:var(--e4) var(--e4);border-top:1px solid var(--linea)}
.dato:first-child{border-top:none}
.dato .ic{width:32px;height:32px;flex:none;border-radius:9px;background:var(--tarjeta-2);display:grid;place-items:center}
.dato .ic svg{width:16px;height:16px;stroke:var(--tenue)}
.dato .tx{flex:1;min-width:0}
.dato .tx b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1)}
.dato .tx small{font-size:var(--t5);color:var(--tenue)}
.dato .val{font-family:'Chakra Petch',sans-serif;font-size:var(--t3);font-weight:600;color:var(--texto)}
.dato .fl{width:16px;height:16px;flex:none;stroke:var(--tenue-2)}
.interruptor{width:44px;height:26px;flex:none;border-radius:13px;background:var(--tarjeta-2);border:1px solid var(--linea);position:relative}
.interruptor i{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--tenue-2);transition:.15s}
.interruptor[aria-pressed="true"]{background:var(--naranja);border-color:var(--naranja)}
.interruptor[aria-pressed="true"] i{left:20px;background:#000}
.seccion{font-size:var(--t6);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue);margin:0 0 var(--e2)}
.tiras{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e2)}
.tira{aspect-ratio:3/4;border-radius:10px;background:#E9EAEC;overflow:hidden;position:relative}
.tira svg{display:block;width:100%;height:100%}
.horario .fila-h span{color:var(--tenue)}
.banda{display:flex;gap:var(--e3);align-items:flex-start;border-radius:14px;padding:var(--e4);margin-bottom:var(--e3);border:1px solid var(--linea)}
.banda .ic{width:32px;height:32px;flex:none;border-radius:9px;background:var(--tarjeta-2);display:grid;place-items:center}
.banda .ic svg{width:16px;height:16px;stroke:var(--tenue)}
.banda b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1)}
.banda small{display:block;font-size:var(--t5);color:var(--tenue);line-height:1.5}
.banda.fria{background:var(--tarjeta);border-left:3px solid var(--frio)}
.banda.fria .ic svg{stroke:var(--frio)}
.banda.fuerte{background:var(--naranja-suave);border-color:rgba(255,106,0,.4)}
.banda.fuerte .ic{background:var(--naranja)}
.banda.fuerte .ic svg{stroke:var(--sobre-naranja)}
.wa-chico{display:flex;align-items:center;justify-content:center;gap:var(--e2);width:100%;padding:var(--e3);margin-top:var(--e3);
  background:var(--naranja);color:var(--sobre-naranja);font-size:var(--t4);font-weight:700;clip-path:var(--chaflan-sm)}
.wa-chico svg{width:16px;height:16px;fill:currentColor;stroke:none}
.bloqueo{background:var(--tarjeta);border:1px dashed var(--linea);border-radius:16px;padding:var(--e6) var(--e5);text-align:center;margin-bottom:var(--e3)}

/* ===== fase 2: ajustes y piezas propias ===== */
.ficha .foto-p{font-size:var(--t3);box-shadow:0 0 0 2px var(--fondo),0 0 0 4px var(--linea)}
.dia[aria-pressed="true"]{color:var(--naranja-texto)}
.dia{min-height:48px}
.racha{margin-bottom:var(--e3)}
.racha .llama svg{filter:none}
.racha .llama .fuego{fill:#FF6A00}
.racha .llama .nucleo{fill:#FFC23D}
.racha .llama.apagada .fuego{fill:var(--tenue-2)}
.racha .llama.apagada .nucleo{fill:var(--linea)}
.racha .llama .n b{font-weight:700}
.pd{height:44px}
.pd.salvado svg,.pd.ok svg{width:13px;height:13px}
.duo .descansa{margin-bottom:0}
.descansa .eti{color:var(--tenue)}
.agua-btns{grid-template-columns:1fr 1fr}
.agua-btns button{min-height:44px}
.deshacer{display:block;width:100%;min-height:44px;margin-top:var(--e1);font-size:var(--t5);font-weight:600;color:var(--tenue);text-decoration:underline;text-underline-offset:3px}
.deshacer[hidden]{display:none} /* entrega 39: sin tomas no se ve */
.banda{align-items:center}
.banda .tx{flex:1;min-width:0}
.banda .cerrar-b{width:44px;height:44px;flex:none;border-radius:10px;display:grid;place-items:center;color:var(--tenue);margin:calc(var(--e2) * -1) calc(var(--e2) * -1) calc(var(--e2) * -1) 0}
.banda .cerrar-b svg{width:16px;height:16px;stroke:currentColor}
.banda .accion-b{display:inline-flex;align-items:center;min-height:44px;margin-top:var(--e1);font-size:var(--t5);font-weight:700;color:var(--naranja-texto)}
/* formularios */
.campo{margin-bottom:var(--e5)}
.campo label,.campo .lbl-c{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e2)}
.campo .ayuda{display:block;font-size:var(--t5);color:var(--tenue);margin:calc(var(--e1) * -1) 0 var(--e2);line-height:1.45}
.entrada{display:flex;align-items:center;gap:var(--e2);background:var(--tarjeta);border:1px solid var(--linea);border-radius:13px;padding:0 var(--e4);min-height:52px}
.entrada:focus-within{border-color:var(--texto)}
.entrada input{flex:1;min-width:0;background:none;border:none;color:var(--texto);font:600 var(--t3) 'Inter',system-ui,sans-serif;padding:var(--e3) 0;outline:none}
.entrada input::placeholder{color:var(--tenue-2);font-weight:400}
.entrada .suf{font-size:var(--t5);color:var(--tenue);font-weight:600}
.entrada input[type="date"],.entrada input[type="time"]{color-scheme:dark}
:root[data-theme="light"] .entrada input[type="date"],:root[data-theme="light"] .entrada input[type="time"]{color-scheme:light}
.error-c{display:block;font-size:var(--t5);color:var(--alerta);margin-top:var(--e2);line-height:1.45}
.campo[data-error] .entrada{border-color:var(--alerta)}
.opciones{display:grid;gap:var(--e2)}
.opciones.dos{grid-template-columns:1fr 1fr}
.opcion{min-height:48px;padding:var(--e3);border:1px solid var(--linea);border-radius:12px;background:var(--tarjeta);font-size:var(--t4);font-weight:600;color:var(--texto)}
.opcion[aria-pressed="true"]{border-color:var(--naranja);background:var(--naranja-suave);color:var(--naranja-texto)}
.meta-op{min-height:64px}
.pasos-bienv{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--e4) + env(safe-area-inset-top)) var(--e5) var(--e3)}
.pasos-bienv .atras{min-width:44px;min-height:44px;display:flex;align-items:center;gap:var(--e1);font-size:var(--t4);font-weight:600;color:var(--tenue)}
.pasos-bienv .atras svg{width:18px;height:18px;stroke:currentColor;transform:scaleX(-1)}
.pasos-bienv .cuenta{font-size:var(--t5);color:var(--tenue);font-weight:600}
.progreso-bienv{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e1);padding:0 var(--e5) var(--e5)}
.progreso-bienv i{height:4px;border-radius:2px;background:var(--tarjeta-2)}
.progreso-bienv i.ok{background:var(--texto)}
.dato{min-height:64px}
.dato .val{text-align:right}
.hoja .campo{margin-bottom:var(--e4)}
/* la regla de color vuelve a mandar sobre las piezas traídas */
.pd.hoy{background:transparent;color:var(--texto);box-shadow:inset 0 0 0 2px var(--texto);font-size:var(--t6);font-weight:700}
.pd.libre{background:transparent;border:1px dashed var(--linea);color:var(--tenue)}
.pista i{background:var(--frio)}
#nav .nav{grid-template-columns:repeat(var(--columnas,5),1fr)}
.dias{gap:var(--e1)}
.dia[aria-pressed="true"],.opcion[aria-pressed="true"]{color:var(--texto);font-weight:700}
/* toda la caja del campo recibe el toque */
.entrada{cursor:text}
.entrada input{align-self:stretch;min-height:50px}
.pista-meta{margin-bottom:var(--e5)}
.cierre .racha{text-align:left}
.cierre .racha .llama{margin-bottom:0}
.cierre .racha .llama small{white-space:normal}

/* ===== fase 2B ===== */
.grafico svg{display:block;width:100%;height:auto}
.dif{font-size:var(--t4);font-weight:600;color:var(--tenue);margin-left:var(--e2)}
.dif.a-favor{color:var(--hecho)}
.rango{display:inline-block;vertical-align:middle;font-family:'Inter',system-ui,sans-serif;font-size:var(--t5);font-weight:600;color:var(--texto);background:var(--tarjeta-2);padding:var(--e1) var(--e3);border-radius:7px;margin-left:var(--e2)}
.regla{height:9px;border-radius:5px;overflow:hidden;display:grid;grid-template-columns:17.5fr 32.5fr 25fr 25fr;gap:2px;margin-top:var(--e3)}
.regla i{display:block;background:var(--tarjeta-2)}
.regla .b2{background:var(--tenue-2)}
.aguja{position:relative;height:16px;margin-top:calc(var(--e1) * -1)}
.aguja i{position:absolute;top:0;width:4px;height:16px;background:var(--texto);border-radius:2px;transform:translateX(-50%)}
.regla-et{display:grid;grid-template-columns:17.5fr 32.5fr 25fr 25fr;font-size:var(--t6);color:var(--tenue);margin-top:var(--e1)}
.regla-et span:nth-child(1){grid-column:2}.regla-et span:nth-child(2){grid-column:3}.regla-et span:nth-child(3){grid-column:4}
.aclara{font-size:var(--t5);color:var(--tenue);line-height:1.55}
.semanas{display:grid;grid-template-columns:repeat(8,1fr);gap:var(--e2);height:56px}
.sem{background:var(--tarjeta-2);border-radius:5px;position:relative;height:100%;overflow:hidden}
.sem i{position:absolute;left:0;right:0;bottom:0;background:var(--tenue-2);border-radius:5px}
.sem i.actual{background:var(--texto)}
.semanas-et{display:flex;justify-content:space-between;font-size:var(--t6);color:var(--tenue);margin-top:var(--e2)}
.logro{display:flex;align-items:center;gap:var(--e3);background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;padding:var(--e4);margin-bottom:var(--e2)}
.logro .med{width:36px;height:36px;flex:none;background:var(--hecho-suave);display:grid;place-items:center;border-radius:10px}
.logro .med svg{width:18px;height:18px;stroke:var(--hecho)}
.logro.gris .med{background:var(--tarjeta-2)}
.logro.gris .med svg{stroke:var(--tenue-2)}
.logro b{display:block;font-size:var(--t4);font-weight:600;margin-bottom:var(--e1)}
.logro small{font-size:var(--t5);color:var(--tenue);line-height:1.4}
.fotos-duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
.foto-slot{position:relative;display:grid;place-items:center;aspect-ratio:3/4;border-radius:12px;overflow:hidden;background:var(--tarjeta-2);color:var(--tenue);cursor:pointer}
.foto-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.foto-slot span{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.62);color:#fff;font-size:var(--t5);font-weight:600;text-align:center;padding:var(--e2) var(--e1)}
.foto-slot.vacia{border:1px dashed var(--linea);align-content:center;gap:var(--e2)}
.foto-slot.vacia svg{width:24px;height:24px;stroke:currentColor}
.foto-slot.vacia span{position:static;background:none;color:var(--tenue);padding:0 var(--e2)}
.foto-slot:focus-within{outline:3px solid var(--naranja);outline-offset:2px}
.privado{display:flex;gap:var(--e2);align-items:flex-start;font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-top:var(--e3)}
.privado svg{width:15px;height:15px;flex:none;stroke:var(--hecho);margin-top:2px}
.previa{background:#000;border-radius:14px;overflow:hidden;margin-bottom:var(--e4);display:grid;place-items:center}
.previa img{display:block;max-width:100%;max-height:52vh;object-fit:contain}
.fila-switch{display:flex;align-items:center;justify-content:space-between;gap:var(--e3);min-height:48px;margin-bottom:var(--e2);font-size:var(--t4);font-weight:600}
.interruptor{width:52px;height:32px;border-radius:16px;background:var(--tarjeta-2);border:1px solid var(--linea);position:relative;flex:none}
.interruptor i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--tenue-2);transition:.15s}
.interruptor[aria-checked="true"]{background:var(--naranja);border-color:var(--naranja)}
.interruptor[aria-checked="true"] i{left:23px;background:#000}
.interruptor::after{content:"";position:absolute;inset:-8px}
.btn.peligro{color:var(--alerta)}
.hito{text-align:left}
.hito-n{display:block;font-family:'Chakra Petch',sans-serif;font-size:var(--t1);font-weight:700;margin-top:var(--e1)}
.plato{display:flex;align-items:center;gap:var(--e4)}
.plato svg{width:108px;height:108px;flex:none}
.plato .ley div{display:flex;align-items:flex-start;gap:var(--e2);font-size:var(--t4);margin-bottom:var(--e3);line-height:1.35}
.plato .ley div:last-child{margin-bottom:0}
.plato .ley i{width:11px;height:11px;border-radius:3px;flex:none;margin-top:var(--e1)}
.plato .ley b{font-weight:600}
.plato .ley small{display:block;font-size:var(--t5);color:var(--tenue)}
.kcal{display:flex;gap:var(--e3);align-items:flex-start}
.kcal .ic{width:32px;height:32px;flex:none;background:var(--tarjeta-2);display:grid;place-items:center;border-radius:10px}
.kcal .ic svg{width:16px;height:16px;stroke:var(--tenue)}
.kcal b{display:block;font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700;margin-bottom:var(--e1)}
.kcal small{font-size:var(--t5);color:var(--tenue);line-height:1.5}
.comida{background:var(--tarjeta);border:1px solid var(--linea);border-radius:14px;padding:var(--e4);margin-bottom:var(--e2)}
.comida .ct{display:flex;align-items:center;gap:var(--e2);margin-bottom:var(--e2)}
.comida .ct svg{width:17px;height:17px;stroke:var(--tenue)}
.comida .ct b{font-size:var(--t4);font-weight:600}
.comida li{list-style:none;display:flex;gap:var(--e2);font-size:var(--t4);color:var(--tenue);line-height:1.5;margin-bottom:var(--e2)}
.comida li:last-child{margin-bottom:0}
.comida li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--tenue-2);flex:none;margin-top:var(--e2)}
.descargo{font-size:var(--t5);color:var(--tenue);line-height:1.55;margin-top:var(--e4);padding:var(--e4);background:var(--tarjeta);border-radius:12px}

.fila-switch{width:100%;text-align:left;color:var(--texto);padding:0 var(--e1)}
.fila-switch[aria-checked="true"] .interruptor{background:var(--naranja);border-color:var(--naranja)}
.fila-switch[aria-checked="true"] .interruptor i{left:23px;background:#000}
.interruptor::after{content:none}
.foto-slot.espera{cursor:default}

/* ===== fase 3: acceso, membresía y panel (de la maqueta 07) ===== */
.acceso{padding:0 var(--e5) var(--e6)}
.acceso .marca{display:flex;justify-content:center;padding:calc(var(--e6) + var(--e2) + env(safe-area-inset-top)) 0 var(--e6)}
.acceso .marca .logotipo{height:52px;width:93px}
.acceso h1{font-size:var(--t1);font-weight:700;margin-bottom:var(--e2)}
.acceso .sub{font-size:var(--t4);color:var(--tenue);line-height:1.6;margin-bottom:var(--e6)}
.volver{display:flex;align-items:center;gap:var(--e1);min-height:44px;padding:calc(var(--e3) + env(safe-area-inset-top)) var(--e5) 0;font-size:var(--t4);font-weight:600;color:var(--tenue)}
.volver svg{width:18px;height:18px;stroke:currentColor;transform:scaleX(-1)}
.cedula{display:flex;align-items:stretch;background:var(--tarjeta);border:1px solid var(--linea);border-radius:13px;min-height:52px;overflow:hidden}
.cedula .letra{display:grid;grid-template-columns:44px 44px;border-right:1px solid var(--linea)}
.cedula .letra button{font:700 var(--t3) 'Chakra Petch',sans-serif;color:var(--tenue);min-height:50px}
.cedula .letra button[aria-pressed="true"]{color:var(--texto);box-shadow:inset 0 -3px 0 var(--naranja)}
.cedula input{flex:1;min-width:0;background:none;border:none;color:var(--texto);font:600 var(--t3) 'Inter',system-ui,sans-serif;padding:0 var(--e4);outline:none}
.cedula input::placeholder{color:var(--tenue-2);font-weight:400}
.cedula:focus-within{border-color:var(--texto)}
.campo[data-error] .cedula{border-color:var(--alerta)}
.entrada .ojo{width:44px;height:44px;margin-right:calc(var(--e3) * -1);display:grid;place-items:center;color:var(--tenue);flex:none}
.entrada .ojo svg{width:19px;height:19px;stroke:currentColor}
.opcional{font-weight:500;color:var(--tenue)}
.cuidado{display:flex;gap:var(--e2);align-items:flex-start;font-size:var(--t5);color:var(--texto);line-height:1.45;margin:calc(var(--e3) * -1) 0 var(--e5)}
.cuidado[hidden]{display:none}
.cuidado svg{width:15px;height:15px;flex:none;stroke:var(--tenue);margin-top:1px}
.enlace{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:var(--t4);font-weight:600;color:var(--naranja-texto);text-decoration:underline;text-underline-offset:3px}
.centro{text-align:center}
.alterno{margin-top:var(--e3);text-align:center;font-size:var(--t4);color:var(--tenue)}
.alterno .enlace{margin-left:var(--e1)}
.error-caja{display:flex;gap:var(--e3);align-items:flex-start;padding:var(--e4);margin-bottom:var(--e5);border-radius:13px;background:var(--tarjeta);border:1px solid var(--linea);border-left:3px solid var(--alerta);font-size:var(--t4);line-height:1.5}
.error-caja>svg{width:18px;height:18px;flex:none;stroke:var(--alerta);margin-top:1px}
.error-caja b{display:block;font-weight:600;margin-bottom:var(--e1)}
.error-caja small{display:block;font-size:var(--t5);color:var(--tenue)}
.error-caja:focus{outline:none}
.sello-grande{width:64px;height:64px;border-radius:50%;margin:var(--e2) 0 var(--e5);display:grid;place-items:center;background:var(--tarjeta);border:1px solid var(--linea)}
.sello-grande svg{width:28px;height:28px;stroke:var(--texto)}
.correo-dest{font-family:'Chakra Petch',sans-serif;font-size:var(--t3);font-weight:600;word-break:break-all}
.btn[aria-busy="true"]{opacity:.7}
a.btn{text-decoration:none}
/* versión de muestra */
.caja-demo{margin-top:var(--e6);padding:var(--e4);border:1px dashed var(--linea);border-radius:14px;text-align:left}
.caja-demo>b{display:block;font-size:var(--t4);font-weight:700;margin-bottom:var(--e1)}
.caja-demo p{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-bottom:var(--e3)}
.caja-demo p b{color:var(--texto)}
.caja-demo .btn{margin-top:var(--e1)}
.fila-demo{display:flex;align-items:center;gap:var(--e3);width:100%;min-height:48px;text-align:left;font-size:var(--t4);font-weight:600;color:var(--texto);border-top:1px solid var(--linea)}
.fila-demo svg{width:17px;height:17px;flex:none;stroke:var(--tenue)}
.fila-demo svg:last-child{margin-left:auto;width:15px;height:15px;stroke:var(--tenue-2)}
.lista-demo .alt{text-align:left;background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:14px}
.lista-demo .alt>svg{width:16px;height:16px;flex:none;stroke:var(--tenue-2)}
/* membresía */
.banda.alerta{background:var(--tarjeta);border-left:3px solid var(--alerta)}
.banda.alerta .ic svg{stroke:var(--alerta)}
.banda.neutra{background:var(--tarjeta)}
.racha .llama.congelada .fuego{fill:var(--frio)}
.racha .llama.congelada .nucleo{fill:var(--tarjeta-2)}
.renovar-card{margin-bottom:var(--e3)}
.renovar-card h2{margin-bottom:var(--e2)}
.renovar-card p{font-size:var(--t4);line-height:1.55;margin-bottom:var(--e5)}
.chip-est{align-self:flex-start;display:inline-flex;align-items:center;gap:var(--e1);font-size:var(--t5);font-weight:600;padding:2px var(--e2);border-radius:6px;box-shadow:inset 0 0 0 1px var(--linea);color:var(--tenue);white-space:nowrap}
.chip-est i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.chip-est.ok{color:var(--hecho)}
.chip-est.mal{color:var(--alerta)}
/* la etiqueta «2 congeladores» se salía de la tarjeta (medido: página de 431 px en pantallas de 360 a 414) */
.racha .llama{flex-wrap:wrap}
.racha .llama>div{flex:1;min-width:0}
.racha .llama small{white-space:normal}
/* panel del gimnasio: más ancho que la app */
.app.ancho{max-width:1100px}
.panel-entrar{max-width:440px;margin:0 auto;width:100%}
.panel-app{padding:0 var(--e5) var(--e6)}
.panel-cab{display:flex;align-items:center;gap:var(--e3);padding:calc(var(--e4) + env(safe-area-inset-top)) 0 var(--e4);border-bottom:1px solid var(--linea);margin-bottom:var(--e5)}
.panel-cab .quien{margin-left:auto;text-align:right;font-size:var(--t5);line-height:1.35}
.panel-cab .quien b{display:block;font-size:var(--t4)}
.panel-cab .quien small{font-size:var(--t5);color:var(--tenue)}
.panel-cab .btn{width:auto;min-height:44px;padding:0 var(--e4);font-size:var(--t4)}
.panel-cuerpo{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:var(--e5);align-items:start}
.panel-lista h1{font-size:var(--t1);font-weight:700;margin-bottom:var(--e4)}
.panel-lista .entrada svg{width:17px;height:17px;flex:none;stroke:var(--tenue)}
.panel-lista .campo{margin-bottom:var(--e2)}
.miembro-fila{display:flex;align-items:center;justify-content:space-between;gap:var(--e3);width:100%;min-height:56px;text-align:left;padding:var(--e2) var(--e3);margin-bottom:var(--e1);border-radius:12px;border:1px solid transparent}
.miembro-fila b{display:block;font-size:var(--t4);font-weight:600}
.miembro-fila small{font-size:var(--t5);color:var(--tenue)}
.miembro-fila[aria-current="true"]{background:var(--tarjeta);border-color:var(--linea)}
@media (hover:hover){.miembro-fila:hover{background:var(--tarjeta)}}
.panel-ficha .card h2{font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700;margin-bottom:var(--e2)}
.panel-ficha .card h2:focus{outline:none}
.panel-volver{display:none;padding:0 0 var(--e2)}
.datos-m{display:grid;grid-template-columns:auto 1fr;gap:var(--e2) var(--e4);margin:var(--e4) 0;font-size:var(--t4)}
.datos-m dt{color:var(--tenue)}
.datos-m dd{font-weight:600;min-width:0;overflow-wrap:anywhere}
.acciones-m{display:flex;gap:var(--e2);flex-wrap:wrap}
.acciones-m .btn{width:auto;min-height:44px;padding:var(--e2) var(--e4);font-size:var(--t4)}
.historial{list-style:none;font-size:var(--t5);line-height:1.5}
.historial li{padding:var(--e2) 0;border-top:1px solid var(--linea)}
.historial li:first-child{border-top:none;padding-top:0}
.historial b{display:block;font-weight:600;color:var(--texto)}
.historial span{color:var(--tenue)}
h3.rotulo{font-family:'Inter',system-ui,sans-serif}
.tramos{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e2);margin-bottom:var(--e4)}
.tramos .opcion{min-height:44px;padding:var(--e2) var(--e1);font-size:var(--t4)}
.resultado{border:1px solid var(--linea);border-radius:13px;padding:var(--e4);margin-bottom:var(--e3)}
.resultado .fila-r{display:flex;justify-content:space-between;gap:var(--e3);font-size:var(--t4);padding:var(--e1) 0}
.resultado .fila-r span{color:var(--tenue)}
.resultado .fila-r b{font-weight:600;text-align:right}
.resultado .nota-r{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-top:var(--e2);padding-top:var(--e2);border-top:1px solid var(--linea)}
.clave-grande{font-family:'Chakra Petch',sans-serif;font-size:var(--t-cifra);font-weight:700;letter-spacing:.04em;text-align:center;padding:var(--e4);border:1px dashed var(--linea);border-radius:13px;margin-bottom:var(--e3)}
.registro-m{font-size:var(--t5);color:var(--tenue);line-height:1.5;margin-bottom:var(--e3)}
@media (max-width:760px){
  .panel-cuerpo{grid-template-columns:1fr}
  .panel-app.con-ficha .panel-lista{display:none}
  .panel-app:not(.con-ficha) .panel-ficha{display:none}
  .panel-volver{display:flex}
  .tramos{grid-template-columns:repeat(3,1fr)}
}
/* el campo de peso de la bienvenida se salía de la pantalla (fase 2): los campos del par pueden encoger */
.par-dato>.campo{min-width:0}
/* videos de los ejercicios (16:9) */
.demo video,.hoja .medio-grande video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}
.demo .etiq.arriba{top:12px;bottom:auto;background:rgba(255,255,255,.88)}
.credito{font-size:var(--t5);color:var(--tenue);line-height:1.45;margin:calc(var(--e3) * -1) 0 var(--e4)}
/* ajustes de textos de acceso */
.eti-acceso{font-family:'Chakra Petch',sans-serif;font-size:var(--t5);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue);margin-bottom:var(--e3)}
.sello-grande.centrado{margin-left:auto;margin-right:auto}
.sello-grande.ok{background:var(--hecho-suave);border-color:transparent}
.sello-grande.ok svg{stroke:var(--hecho)}
.enlaces-caja{display:flex;flex-wrap:wrap;gap:0 var(--e4)}
/* logros como insignias: palabra corta y, si faltan, cuánto */
.insignias{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--e2) var(--e1);background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e4) var(--e2)}
.insignia{display:flex;flex-direction:column;align-items:center;gap:var(--e1);min-height:44px;padding:var(--e1) 0;border-radius:12px;text-align:center}
.insignia .sello{position:relative;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--tarjeta-2);color:var(--tenue)}
.insignia .sello svg{width:24px;height:24px;stroke:currentColor}
.insignia .sello b{font-family:'Chakra Petch',sans-serif;font-size:var(--t3);font-weight:700}
.insignia.ok .sello{background:var(--hecho-suave);color:var(--hecho);box-shadow:inset 0 0 0 2px var(--hecho)}
.insignia .candado-i{position:absolute;right:-2px;bottom:-2px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea)}
.insignia .sello .candado-i svg{width:11px;height:11px;stroke:var(--tenue)}
.insignia .palabra{font-size:var(--t5);font-weight:600;line-height:1.2}
.insignia:not(.ok) .palabra{color:var(--tenue)}
.insignia small{font-size:var(--t6);color:var(--tenue);line-height:1.2}
.insignia .pista-i{width:44px;height:3px;border-radius:2px;background:var(--tarjeta-2);overflow:hidden}
.insignia .pista-i i{display:block;height:100%;background:var(--tenue)}
/* ===== comunidad ===== */
.globo{position:absolute;top:4px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#D0021B;color:#fff;font:700 var(--t6)/18px 'Inter',system-ui,sans-serif;text-align:center;box-shadow:0 0 0 2px var(--fondo)}
.nav a{position:relative}
.titulo-com{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--e3)}
.campana-com{position:relative;flex:none;margin-top:var(--e1)}
.campana-com .globo{top:2px;left:auto;right:2px}
.av-com{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--tarjeta-2);font:700 var(--t5) 'Chakra Petch',sans-serif;color:var(--texto)}
.card.publicar{flex-direction:row;gap:var(--e3);align-items:flex-start}
.publicar-cuerpo{flex:1;min-width:0}
.publicar textarea{width:100%;min-height:76px;resize:none;background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:12px;color:var(--texto);font:400 var(--t4)/1.45 'Inter',system-ui,sans-serif;padding:var(--e3)}
.publicar textarea::placeholder{color:var(--tenue)}
.publicar-acc{display:flex;justify-content:space-between;align-items:center;margin-top:var(--e2)}
.foto-b{display:inline-flex;align-items:center;gap:var(--e2);min-height:44px;padding:0 var(--e2);font-size:var(--t4);font-weight:600;color:var(--texto);cursor:pointer;border-radius:10px}
.foto-b svg{width:18px;height:18px;stroke:currentColor}
.foto-b:has(input:focus-visible){outline:3px solid var(--naranja);outline-offset:2px}
.btn.chico{width:auto;min-height:44px;padding:0 var(--e5);font-size:var(--t4)}
.vista-foto{position:relative;margin-top:var(--e2)}
.vista-foto img{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:12px}
.quitar-foto{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.6);color:#fff;border-radius:50%}
.pub{padding:var(--e4) 0 var(--e2)}
.pub.resaltada{box-shadow:0 0 0 2px var(--frio)}
.pub-cab{display:flex;align-items:center;gap:var(--e3);padding:0 var(--e4)}
.pub-quien{flex:1;min-width:0}
.pub-quien b{display:block;font-size:var(--t4);font-weight:600}
.pub-quien small{font-size:var(--t5);color:var(--tenue)}
.pub-texto{padding:var(--e3) var(--e4) 0;font-size:var(--t4);line-height:1.55;overflow-wrap:anywhere}
.pub-foto{display:block;width:100%;max-height:440px;object-fit:cover;margin-top:var(--e3);background:var(--tarjeta-2)}
.pub-resumen{display:flex;justify-content:space-between;padding:var(--e3) var(--e4) var(--e2);font-size:var(--t5);color:var(--tenue)}
.pub-acc{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--linea);margin:0 var(--e4)}
.accion-pub{display:flex;align-items:center;justify-content:center;gap:var(--e2);min-height:44px;font-size:var(--t4);font-weight:600;color:var(--tenue)}
.accion-pub svg{width:18px;height:18px;stroke:currentColor}
.reacciones{display:flex;justify-content:space-around;margin:var(--e1) var(--e4) var(--e2);padding:var(--e1);background:var(--tarjeta-2);border-radius:24px}
.reacciones[hidden]{display:none}
.reacciones button{width:48px;height:48px;border-radius:50%;font-size:26px;line-height:1}
.reacciones button[aria-pressed="true"]{background:var(--tarjeta);box-shadow:inset 0 0 0 2px var(--naranja)}
.comentarios{padding:var(--e2) var(--e4) 0;border-top:1px solid var(--linea);margin:0 0 var(--e1)}
.ver-mas{min-height:44px;font-size:var(--t5);font-weight:600;color:var(--tenue)}
.comentario{display:flex;gap:var(--e2);margin-bottom:var(--e3)}
.comentario .av-com{width:32px;height:32px;font-size:var(--t6)}
.comentario>div{background:var(--tarjeta-2);border-radius:12px;padding:var(--e2) var(--e3);min-width:0;font-size:var(--t5)}
.comentario b{font-weight:600}
.comentario small{color:var(--tenue);font-size:var(--t6)}
.comentario p{font-size:var(--t4);line-height:1.45;margin-top:2px;overflow-wrap:anywhere}
.comentar{display:flex;gap:var(--e2);align-items:center;padding:var(--e2) var(--e4) var(--e2)}
.comentar input{flex:1;min-width:0;min-height:44px;background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:22px;padding:0 var(--e4);color:var(--texto);font:400 var(--t4) 'Inter',system-ui,sans-serif}
.comentar input::placeholder{color:var(--tenue)}
.comentar .ib svg{stroke:var(--naranja-texto)}
.normas ul{padding-left:var(--e5);font-size:var(--t4);line-height:1.55;margin-bottom:var(--e3)}
.normas li{margin-bottom:var(--e2)}
.avisos-com{display:flex;flex-direction:column;gap:var(--e1);margin-bottom:var(--e3)}
.aviso-com{display:flex;gap:var(--e3);align-items:flex-start;text-align:left;padding:var(--e3);border-radius:12px;min-height:44px}
.aviso-com.nueva{background:var(--tarjeta-2)}
.aviso-com .t{display:block;font-size:var(--t4);line-height:1.4}
.aviso-com small{font-size:var(--t5);color:var(--tenue)}
/* La app queda fija, como una app instalada: sin zoom con doble toque (botones de agua, +/-),
   sin zoom al escribir y sin rebote ni desplazamiento lateral. touch-action no se hereda: va en
   todos los elementos. Los campos van en 16 px, el tamaño en que iPhone no agranda la página.
   Complementan esto la etiqueta viewport (index.html) y el freno de gestos en app.js. */
*,*::before,*::after{touch-action:manipulation}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* Sin rebote. Nada de overflow en html/body: convierte a body en contenedor de desplazamiento y la
   barra de menú (sticky) deja de quedarse abajo. Lo que se salga de lado se recorta en .app con
   «clip», que recorta sin crear un contenedor de desplazamiento. */
html,body{overscroll-behavior:none}
.app{overflow-x:clip}
.app input,.app textarea,.app select,.hoja input,.hoja textarea,.hoja select,.cedula input{font-size:16px}
.pedir-aviso{display:block;margin:var(--e5) auto 0;min-height:44px;padding:0 var(--e3);font-size:var(--t4);font-weight:600;color:var(--tenue);text-decoration:underline;text-underline-offset:3px}
/* instalar y tema también en la primera pantalla, sin sesión */
.barra-acceso{display:flex;justify-content:flex-end;gap:var(--e1);padding:calc(var(--e2) + env(safe-area-inset-top)) var(--e3) 0}
.acceso-inicio .marca{padding-top:var(--e3)}
/* pantalla de cierre: bajo la muesca del iPhone (app instalada, barra de estado transparente) y
   check blanco sobre un verde que contrasta en los dos temas (5,3:1) */
.cierre{padding-top:env(safe-area-inset-top)}
.cierre .sello{background:#1B7A51}
.cierre .sello svg{stroke:#fff}
.av-com{overflow:hidden}
.av-com img{width:100%;height:100%;object-fit:cover}
/* ===== Inicio: foto, objetivo, evolución, comida y membresía (maqueta 17) ===== */
.saludo{display:flex;align-items:center;gap:var(--e3)}
.foto-ini{width:64px;height:64px;border-radius:50%;overflow:hidden;flex:none;display:grid;place-items:center;background:var(--tarjeta-2);font:700 var(--t4) 'Chakra Petch',sans-serif;color:var(--texto);text-decoration:none;box-shadow:0 0 0 2px var(--fondo),0 0 0 4px var(--linea)}
.foto-ini img{width:100%;height:100%;object-fit:cover}
.duo-dos{margin-top:var(--e3)}
.duo-dos .card{margin-bottom:0}
.card.par .cifra{font-size:var(--t2)}
.card.par .et{margin-bottom:var(--e2)}
.card.par .card-ir{margin-top:auto}
.card.par .chip-est{margin-bottom:var(--e2)}
.grande{display:block;font-family:'Chakra Petch',sans-serif;font-size:var(--t2);font-weight:700;margin-bottom:var(--e1)}
a.card-ir.naranja{color:var(--naranja-texto);text-decoration:none}
.meta-barra{height:8px;border-radius:4px;background:var(--tarjeta-2);overflow:hidden;margin:var(--e3) 0 var(--e1)}
.meta-barra i{display:block;height:100%;background:var(--hecho);border-radius:4px}
.meta-et{display:flex;justify-content:space-between;gap:var(--e2);font-size:var(--t5);color:var(--tenue);margin-bottom:var(--e2)}
.meta-et b{color:var(--texto);font-weight:600}
.fotos-duo.compacto .foto-slot{aspect-ratio:4/5}
.ficha .foto-p.con-foto{padding:0;overflow:visible;cursor:pointer}
.ficha .foto-p.con-foto img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.ficha .foto-p .cam{position:absolute;right:-4px;bottom:-4px;width:26px;height:26px;border-radius:50%;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea);display:grid;place-items:center}
.ficha .foto-p .cam svg{width:14px;height:14px;stroke:var(--texto)}
.hoja label.btn{cursor:pointer;margin-top:var(--e2)}
.hoja label.btn:focus-within{outline:3px solid var(--naranja);outline-offset:2px}
/* foto de perfil más grande para distinguir la imagen: 64 px en Inicio y 72 px en Perfil */
.foto-ini{width:64px;height:64px}
.ficha .foto-p{width:72px;height:72px}
/* foto de perfil más grande para distinguirla: 64 px en Inicio, 76 px en Perfil */
.ficha .foto-p.con-foto{width:76px;height:76px}
/* ===== entrenamiento a medias fuera de la pantalla de entrenar ===== */
/* salir a la app sin terminar: flecha arriba a la derecha y botón en el descanso */
.ejec-top>div{flex:1;min-width:0}
.ejec-top .minimizar{margin-left:auto}
.salir-desc{display:flex;align-items:center;gap:var(--e2);min-height:44px;margin-top:var(--e5);padding:0 var(--e3);
  font-size:var(--t4);font-weight:600;color:var(--texto)}
.salir-desc svg{width:18px;height:18px;stroke:currentColor}
/* barra sobre las secciones: cuánto va, el descanso que sigue contando y el botón para volver */
.mini-ent{position:relative;display:flex;align-items:center;gap:var(--e3);width:100%;min-height:60px;padding:var(--e3) var(--e5);
  background:var(--tarjeta);border-top:1px solid var(--linea);text-align:left}
.mini-pista{position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--tarjeta-2)}
.mini-pista i{display:block;height:100%;background:var(--hecho)}
.mini-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mini-tx b{font-size:var(--t4);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-tx small{font-size:var(--t5);color:var(--tenue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-reloj,[data-reloj-medias]{font-family:'Chakra Petch',sans-serif;font-weight:700;font-variant-numeric:tabular-nums}
.mini-reloj{color:var(--naranja-texto)}
.mini-ir{flex:none;padding:var(--e2) var(--e4);border-radius:10px;background:var(--naranja);color:var(--sobre-naranja);font-size:var(--t4);font-weight:700}
.mini-ent:active .mini-ir{transform:translateY(1px)}
/* Inicio: la tarjeta del día a todo el ancho, con la barra de avance */
.medias-pista{height:6px;border-radius:3px;background:rgba(0,0,0,.2);overflow:hidden;margin:var(--e2) 0}
.medias-pista i{display:block;height:100%;background:#000;border-radius:3px}
.medias-sec{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin-top:var(--e1);
  font-size:var(--t4);font-weight:700;color:var(--sobre-naranja);text-decoration:underline;text-underline-offset:3px}
.medias-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--e3)}
.medias-reloj{font-family:'Chakra Petch',sans-serif;font-size:var(--t-cifra);font-weight:700;line-height:1;font-variant-numeric:tabular-nums;color:var(--sobre-naranja)}
/* Alimentación: lo que más cuenta para cada objetivo */
.claves ul{display:grid;gap:var(--e3)}
.claves li{list-style:none;display:flex;gap:var(--e3);font-size:var(--t4);line-height:1.5}
.claves li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--hecho);flex:none;margin-top:7px}
/* Comunidad: publicar en una línea, como en Facebook; la cámara va dentro de la línea, a la derecha.
   Los campos marcan el foco con el borde, como el resto. */
.card.publicar{padding:var(--e3)}
.publicar-linea{position:relative;flex:1}
.publicar .publicar-linea textarea{display:block;min-height:44px;height:44px;border-radius:22px;padding:11px 44px 11px 14px;overflow:hidden;white-space:nowrap}
.publicar .publicar-linea textarea::placeholder{font-size:var(--t3)}
.publicar.abierta .publicar-linea textarea{min-height:76px;height:auto;border-radius:12px;padding:var(--e3) 44px var(--e3) var(--e3);overflow:auto;white-space:pre-wrap}
.publicar textarea:focus,.comentar input:focus{outline:none;border-color:var(--texto)}
.publicar-linea .foto-b{position:absolute;right:0;top:0;width:44px;height:44px;justify-content:center;padding:0}
.publicar-linea .foto-b svg{width:21px;height:21px}
.publicar-acc{display:none}
.publicar.abierta .publicar-acc{display:flex;justify-content:space-between}
/* Entrenando: Anterior inactivo en el primer ejercicio y «−» inactivo en el peso mínimo */
.saltos button[aria-disabled="true"]{color:var(--tenue);background:transparent;border-style:dashed;cursor:not-allowed}
.paso-num button[aria-disabled="true"]{background:transparent;box-shadow:inset 0 0 0 1px var(--linea);cursor:not-allowed}
.paso-num button[aria-disabled="true"] svg{stroke:var(--tenue-2)}
.saltos [data-anterior] svg{transform:rotate(180deg)}
/* Comunidad: videos cortos, igual que las fotos */
.vista-foto video{display:block;width:100%;max-height:260px;border-radius:12px;background:#000}
video.pub-foto{background:#000;object-fit:contain}
.video-listo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--e2);min-height:160px;border-radius:12px;
  background:var(--tarjeta-2);color:var(--texto);font-size:var(--t4);text-align:center;padding:var(--e4)}
.video-listo svg{width:28px;height:28px;stroke:var(--texto)}
.video-listo small{font-size:var(--t5);color:var(--tenue)}
.pub-foto.video-listo{border-radius:0}
.nota-video{font-size:var(--t5);color:var(--tenue);margin-top:var(--e2);line-height:1.45}
/* Entrenando: Anterior, Máquina ocupada y Saltar con más presencia, sin competir con la acción principal */
.saltos button{background:var(--tarjeta-2);border:1px solid transparent;color:var(--texto);font-size:var(--t4);min-height:48px}
.saltos svg{width:17px;height:17px}
:root[data-theme="light"] .saltos button:not([aria-disabled="true"]){background:var(--tarjeta);border-color:var(--linea)}
.saltos button[aria-disabled="true"]{background:transparent;border:1px dashed var(--linea);color:var(--tenue)}
.saltos [data-ocupada]{text-align:center}
/* Tu evolución: una foto por mes en una fila que se desliza; la casilla del mes al final */
.evo-fila{display:flex;gap:var(--e3);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.evo-fila::-webkit-scrollbar{display:none}
.evo-carrusel{position:relative}
.evo-flecha{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.18);z-index:1}
.evo-flecha::before{content:'';position:absolute;inset:-4px}
.evo-flecha svg{width:18px;height:18px;stroke:#fff;stroke-width:2.5}
.evo-flecha.izq{left:6px}
.evo-flecha.izq svg{transform:scaleX(-1)}
.evo-flecha.der{right:6px}
.evo-flecha[hidden]{display:none}
.evo-fila .foto-slot{flex:0 0 calc(50% - var(--e3) / 2);scroll-snap-align:end}
.evo-fila .foto-slot:only-child{flex-basis:calc(50% - var(--e3) / 2)}
.foto-slot.vacia.evo{color:var(--texto)}
.foto-slot.vacia.evo span{color:var(--texto);font-weight:600}
.foto-slot.vacia.evo:has(input:focus-visible){outline:3px solid var(--naranja);outline-offset:2px}
.foto-slot:focus-within{outline:none}
.evo-consejo{font-size:var(--t5);color:var(--tenue);margin-top:var(--e2)}
.chip-toca{margin-left:var(--e2);padding:2px var(--e2);border-radius:999px;background:var(--tarjeta-2);color:var(--texto);font-size:var(--t6);letter-spacing:0;text-transform:none;font-weight:600}
/* Visor de fotos a pantalla completa */
.velo.visor{flex-direction:column;align-items:stretch;justify-content:stretch;background:rgba(0,0,0,.94);color:#fff;z-index:30;
  padding:env(safe-area-inset-top,0) 0 env(safe-area-inset-bottom,0)}
.visor-top{display:flex;align-items:center;justify-content:space-between;gap:var(--e3);padding:var(--e3) var(--e4)}
.visor-b{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff}
.visor-b svg{width:22px;height:22px;stroke:#fff}
.visor-fecha{font:700 var(--t3) 'Chakra Petch',sans-serif}
.visor-pista{flex:1;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;min-height:0}
.visor-pista::-webkit-scrollbar{display:none}
.visor-foto{flex:0 0 100%;scroll-snap-align:center;display:grid;place-items:center;padding:0 var(--e4);margin:0;min-height:0}
.visor-foto img{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px}
.visor-comparar{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:var(--e2);align-items:center;padding:0 var(--e3);min-height:0}
.visor-comparar[hidden]{display:none}
.visor-comparar figure{margin:0;display:grid;gap:var(--e2);justify-items:center}
.visor-comparar img{width:100%;max-height:60vh;object-fit:contain;border-radius:10px}
.visor-comparar figcaption{font-size:var(--t5);color:#fff}
.visor-pie{display:flex;flex-direction:column;align-items:center;gap:var(--e3);padding:var(--e4) var(--e4) var(--e5)}
.visor-puntos{display:flex;gap:6px}
.visor-puntos i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}
.visor-puntos i.activo{background:#fff}
.visor-cuenta{font-size:var(--t5);color:rgba(255,255,255,.8)}
.visor-comp{min-height:44px;padding:0 var(--e5);border-radius:12px;border:1px solid rgba(255,255,255,.35);color:#fff;font-size:var(--t4);font-weight:600}
/* Aviso de versión nueva: arriba, sin tapar la barra de secciones */
.version-nueva{position:fixed;left:var(--e4);right:var(--e4);top:calc(env(safe-area-inset-top,0px) + var(--e3));z-index:40;display:flex;align-items:center;gap:var(--e3);
  padding:var(--e3) var(--e3) var(--e3) var(--e4);border-radius:14px;background:var(--tarjeta);border:1px solid var(--linea);box-shadow:0 8px 24px rgba(0,0,0,.25);
  font-size:var(--t4);color:var(--texto);max-width:480px;margin:0 auto}
.version-nueva span{flex:1}
.visor-pista[hidden],.visor-puntos[hidden],.visor-cuenta[hidden]{display:none}
/* Agua: aviso al pasar la meta y botones inactivos en el tope */
#aguaNota{margin-top:var(--e2)}
.agua-meta{display:flex;align-items:center;gap:6px;white-space:nowrap;color:var(--texto);font-weight:600}
.agua-meta svg{width:16px;height:16px;flex:none;stroke:var(--hecho);stroke-width:3}
/* Inactivos en el tope: como «Anterior» inactivo (letra tenue y borde punteado), sin transparencia, para que
   el texto se siga leyendo con buen contraste en los dos temas. */
.agua-btns button[aria-disabled="true"]{color:var(--tenue);background:transparent;border-style:dashed;cursor:not-allowed}
/* Comunidad: ventas y publicidad (entrega 23) */
.filtro-com{margin:0 0 var(--e4)}
.venta-b{display:inline-flex;align-items:center;gap:var(--e2);min-height:44px;padding:0 var(--e2) 0 0;font-size:var(--t4);font-weight:600;color:var(--texto)}
.venta-b .caja-v{width:22px;height:22px;flex:none;display:grid;place-items:center;border-radius:6px;box-shadow:inset 0 0 0 2px var(--tenue)}
.venta-b .caja-v svg{width:14px;height:14px;stroke:var(--sobre-naranja);stroke-width:3;opacity:0}
.venta-b[aria-pressed="true"] .caja-v{background:var(--naranja);box-shadow:none}
.venta-b[aria-pressed="true"] .caja-v svg{opacity:1}
.chip-venta{display:inline-block;margin-left:var(--e2);padding:0 var(--e2);border-radius:6px;box-shadow:inset 0 0 0 1px var(--linea);font-size:var(--t6);font-weight:700;color:var(--texto);vertical-align:1px}
.form-acceso{display:contents}
/* ===== silueta (entrega 23): un lado en grande, el otro en miniatura; General o Detallado ===== */
:root{--silu-mus:#62676E;--silu-neu:#3A3E44;--silu-raya:#C9C9C9;--silu-borde:transparent;--silu-hueco:var(--tarjeta)}
:root[data-theme="light"]{--silu-mus:#A3A8AF;--silu-neu:#DADAD6;--silu-raya:#FFFFFF;--silu-borde:#B8B8B3;--silu-hueco:#DADAD6}
.silu-ayuda{font-size:var(--t5);color:var(--tenue);margin:var(--e2) var(--e1) var(--e3)}
.silu-vista{position:relative;background:var(--tarjeta);border:1px solid var(--linea);border-radius:16px;padding:var(--e3) var(--e2) var(--e2);margin-bottom:var(--e4)}
.silu-principal svg{display:block;width:100%;height:min(430px,58vh);touch-action:manipulation;-webkit-user-select:none;user-select:none}
.silu-cara{position:absolute;left:var(--e4);top:var(--e3);font-size:var(--t5);font-weight:600;color:var(--tenue)}
/* Arriba a la derecha: abajo la taparía el botón fijo al entrar a la pantalla. */
.silu-mini{position:absolute;right:var(--e2);top:var(--e2);width:72px;padding:var(--e1) var(--e1) 2px;display:flex;flex-direction:column;align-items:center;gap:2px;
  background:var(--tarjeta-2);border:1px solid var(--linea);border-radius:12px}
.silu-mini svg{display:block;width:100%;height:100px;pointer-events:none}
.silu-mini span{font-size:var(--t6);font-weight:600;color:var(--texto)}
.silu-mini .punto{position:absolute;top:6px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--naranja);box-shadow:0 0 0 2px var(--tarjeta-2)}
.silu-mini .punto[hidden]{display:none}
.silu-cuerpo{fill:var(--silu-raya);stroke:var(--silu-borde);stroke-width:2}
.silu-hueco{fill:var(--silu-hueco)}
.silu-mini .silu-hueco{fill:var(--tarjeta-2)}
:root[data-theme="light"] .silu-mini .silu-hueco{fill:var(--silu-hueco)}
.silu-neutro{fill:var(--silu-neu)}
.zona .m,.zona-mini .m{fill:var(--silu-mus);transition:fill .12s}
.zona{cursor:pointer;touch-action:manipulation}
.zona.sel .m,.zona-mini.sel .m{fill:var(--naranja)}
.zona:focus{outline:none}
.zona:focus-visible .m{stroke:var(--texto);stroke-width:3;stroke-linejoin:round}
@media (hover:hover){.zona:not(.sel):hover .m{fill:#7A8088}}
/* ===== Plan › Rutina: la semana (entrega 25) ===== */
.seg.tres-p{grid-template-columns:1fr 1fr 1fr}
.dias-sem{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--e1);margin-bottom:var(--e4)}
.dia-b{position:relative;height:52px;border-radius:10px;background:var(--tarjeta-2);display:grid;place-items:center;align-content:center;gap:2px;color:var(--texto)}
.dia-b small{font-size:var(--t6);color:var(--tenue);font-weight:600;line-height:1}
.dia-b b{font:700 var(--t4) 'Chakra Petch',sans-serif;line-height:1}
.dia-b u{text-decoration:none;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.5}
.dia-b.libre{background:transparent;border:1px dashed var(--linea)}
.dia-b.libre u{visibility:hidden}
.dia-b .hecho-dia{display:grid;place-items:center;height:10px}
.dia-b .hecho-dia svg{width:10px;height:10px;stroke:var(--hecho);stroke-width:3.5}
.dia-b[aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--texto)}
.dia-b.es-hoy small{color:var(--texto)}
.plan-dia h3{font:700 var(--t2) 'Chakra Petch',sans-serif;margin:0 0 var(--e1)}
.plan-dia .rotulo{margin-bottom:var(--e1)}
.meta-dia2{font-size:var(--t5);color:var(--tenue);margin:0 0 var(--e3)}
.nota-dia{color:var(--tenue);font-size:var(--t4);margin:0 0 var(--e4)}
.plan-dia .btn{margin-bottom:var(--e3)}
.plan-dia .otro-grupo{margin-bottom:0}
.hechas-dia{list-style:none;margin:var(--e2) 0 0;padding:0;display:grid;gap:var(--e2)}
.hechas-dia li{display:flex;gap:var(--e2);align-items:flex-start}
.hechas-dia svg{width:18px;height:18px;flex:none;stroke:var(--hecho);stroke-width:3;margin-top:2px}
.hechas-dia b{display:block;font-size:var(--t4)}
.hechas-dia small{font-size:var(--t5);color:var(--tenue)}
.ejs-v{list-style:none;margin:0 0 var(--e4);padding:0;display:grid;gap:var(--e2)}
.ej-v{display:flex;align-items:center;gap:var(--e3);width:100%;padding:var(--e2);border:1px solid var(--linea);border-radius:14px;background:var(--tarjeta-2);text-align:left}
.ej-v .n{font:700 var(--t5) 'Chakra Petch',sans-serif;color:var(--tenue);width:14px;text-align:center;flex:none}
.clip{position:relative;flex:none;width:64px;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:var(--fondo)}
.clip video,.clip img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.clip .marca{position:absolute;right:4px;top:4px;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.22)}
.clip .marca svg{width:11px;height:11px;stroke:currentColor;stroke-width:2.4}
.clip .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;border-radius:50%;display:none;place-items:center;color:#fff;background:rgba(0,0,0,.55)}
.clip .play svg{width:12px;height:12px;fill:currentColor;stroke:none;margin-left:2px}
.clip.quieto .play{display:grid}.clip.quieto .marca{display:none}
.ej-v .txt{flex:1;min-width:0}
.ej-v .txt b{display:block;font-size:var(--t4);font-weight:600;line-height:1.3}
.ej-v .txt small{font-size:var(--t5);color:var(--tenue)}
.comidas-dia .seccion{margin-top:var(--e1)}
/* Calentamiento (entrega 31): solo la zona del día, 20 s por movimiento; y la sugerencia de dos series ligeras */
.cal-para,.cal-guia{font-size:var(--t4);color:var(--tenue);line-height:1.5;margin:0 0 var(--e3)}
.cal-guia{margin-bottom:var(--e4)}
.cal-mov{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--e3);margin-top:var(--e4)}
.cal-mov h2{font-size:var(--t2);margin:0 0 var(--e1)}
.cal-mov small,.cal-cuenta small{font-size:var(--t5);color:var(--tenue);line-height:1.4}
.cal-cuenta{text-align:right;flex:none}
.cal-cifra{display:block;font:700 var(--t-cifra)/1 'Chakra Petch',sans-serif;color:var(--naranja-texto);font-variant-numeric:tabular-nums}
.cal-barra{height:4px;border-radius:2px;background:var(--tarjeta-2);margin-top:var(--e3);overflow:hidden}
.cal-barra i{display:block;height:100%;width:0;background:var(--texto)}
.cal-lista{list-style:none;margin:0;padding:0;display:grid;gap:var(--e2)}
.cal-lista li,.cal-lista li>button{display:flex;align-items:center;gap:var(--e3);width:100%;text-align:left}
.cal-lista li{padding:var(--e3);border:1px solid var(--linea);border-radius:14px;background:var(--tarjeta)}
.cal-lista li.con-boton{padding:0}
.cal-lista li>button{padding:var(--e3);min-height:44px;border-radius:13px;color:inherit}
.cal-lista li.ac{border-color:var(--texto)}
.cal-lista .m{width:24px;height:24px;flex:none;border-radius:50%;display:grid;place-items:center;font:700 var(--t5) 'Chakra Petch',sans-serif;background:var(--tarjeta-2);color:var(--tenue)}
.cal-lista .ok .m{background:var(--hecho-suave)}
.cal-lista .ok .m svg{width:14px;height:14px;stroke:var(--hecho);stroke-width:3}
.cal-lista .ok b{color:var(--tenue)}
.cal-lista li span:not(.m):not(.clip){flex:1;min-width:0}
.cal-lista b{display:block;font-size:var(--t4);font-weight:600;line-height:1.3}
.cal-lista small{font-size:var(--t5);color:var(--tenue);line-height:1.4}
.cal-lista em{font:600 var(--t5) 'Chakra Petch',sans-serif;font-style:normal;color:var(--tenue);flex:none}
.cal-apro{margin-bottom:var(--e3)}
.cal-hoja{margin-bottom:var(--e4)}
.cal-hoja .clip{width:48px}
.saltos [data-cal-ant] svg{transform:rotate(180deg)}