/* qup Training — interfaz nueva (traída de qup Gym): cabecera uniforme, barra de abajo, menú lateral y «Yo».
   Los colores NO se definen aquí: todo sale de las variables de cada tema de qup Training. */
.nx-logo { display: none; }

/* ---------- cabecera uniforme ---------- */
body.nx .header-sticky { background: var(--bg-card); box-shadow: none; }
body.nx .header-content { grid-template-columns: 52px minmax(0, 1fr) auto; }
body.nx .header-titulo { font: 500 16px 'Sora', 'Inter', sans-serif; }
body.nx .header-sub { font-size: 12px; }
body.nx .btn-header { font-size: 13px; }
.nx-hder { display: flex; align-items: center; gap: 4px; justify-self: end; }
.nx-av { width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; border: 1px solid var(--border-fuerte); background: rgba(var(--marca-rgb), .14); color: var(--marca); padding: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; font: 700 13px 'Sora', sans-serif; cursor: pointer; }
.nx-av img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- barra de abajo (celular) ---------- */
#nx-bar { display: none; }
body.nx #nx-bar.visible { display: flex; position: fixed; left: 50%; transform: translateX(-50%); bottom: 12px; width: min(536px, calc(100vw - 24px)); z-index: 900; justify-content: space-around; background: var(--bg-card); border: 1px solid var(--border); border-radius: 26px; padding: 6px; box-shadow: 0 8px 28px rgba(0,0,0,.18); margin-bottom: env(safe-area-inset-bottom, 0); }
#nx-bar button { position: relative; flex: 1; background: none; border: none; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 7px 2px; border-radius: 20px; font: 400 10px Inter, sans-serif; color: var(--text-3); min-height: 50px; cursor: pointer; }
#nx-bar button.on { color: var(--marca); font-weight: 600; background: rgba(var(--marca-rgb), .12); }
#nx-bar button:focus-visible, #nx-side button:focus-visible { outline: 3px solid color-mix(in srgb, var(--foco) 75%, transparent); outline-offset: 2px; }
body.nx #vista-profesor .container, body.nx #vista-admin .container, body.nx #vista-yo .container { padding-bottom: 110px; }

/* ---------- menú lateral (computador) ---------- */
#nx-side { display: none; }
@media (min-width: 1024px) {
  body.nx { padding-left: 248px; }
  body.nx #nx-side { display: flex; flex-direction: column; position: fixed; left: 0; top: 0; bottom: 0; width: 248px; z-index: 950; background: var(--bg-card); border-right: 1px solid var(--border); padding: 18px 14px 14px; overflow-y: auto; }
  #nx-side .gs-top { display: flex; align-items: center; gap: 10px; padding: 4px 6px 18px; }
  #nx-side .gs-top svg { width: 46px; height: auto; flex-shrink: 0; }
  #nx-side .gs-nom { min-width: 0; display: flex; flex-direction: column; }
  #nx-side .gs-nom b { font: 600 14px 'Sora', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #nx-side .gs-nom span { font-size: 12px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #nx-side .gs-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
  #nx-side button { font-family: inherit; cursor: pointer; color: inherit; }
  #nx-side .gs-nav > button { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; background: none; border: none; text-align: left; padding: 11px 12px; border-radius: 12px; font-size: 14px; color: var(--text-2); }
  #nx-side .gs-nav > button:hover { background: var(--bg-hover); color: var(--text); }
  #nx-side .gs-nav > button.on { background: rgba(var(--marca-rgb), .14); color: var(--marca); font-weight: 600; }
  #nx-side .gs-pie { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--border); padding-top: 12px; margin-top: 10px; }
  #nx-side .gs-pie .bh { margin-left: auto; background: none; border: none; color: var(--text-2); font-size: 12px; padding: 6px 4px; border-radius: 8px; }
  #nx-bar { display: none !important; }
  body.nx .header-content { grid-template-columns: minmax(0, 1fr) auto; }
  body.nx .header-logo { display: none; }
  body.nx .header-centro { text-align: left; }
  body.nx .header-titulo { font-size: 22px; }
  body.nx .header-sticky { padding: 16px 32px; }
  body.nx #vista-profesor .container, body.nx #vista-admin .container, body.nx #vista-yo .container { padding-bottom: 40px; }
  #nx-yo-cont { max-width: 760px; margin: 0 auto; padding: 24px 32px; }
  .nx-hder .nx-av { display: none; }   /* en computador el avatar ya está abajo del menú */
}

/* ---------- qupilot sobre la barra ---------- */
body.nx .qupilot-burbuja { bottom: 96px; }
@media (min-width: 1024px) { body.nx .qupilot-burbuja { bottom: 24px; } }
body.nx .qupilot-burbuja.sobre-tabbar { left: auto; right: 20px; margin-left: 0; bottom: 96px; width: 52px; height: 52px; }
@media (min-width: 1024px) { body.nx .qupilot-burbuja.sobre-tabbar { bottom: 24px; } }

/* ---------- «Yo» ---------- */
#vista-yo { display: none; }
#vista-yo.activa { display: block; animation: none; }
#nx-yo-cont { max-width: 640px; margin: 0 auto; padding: 14px 16px; }
@media (min-width: 1024px) { #nx-yo-cont { max-width: 760px; padding: 24px 32px; } }
.nx-ui .foto-perfil { width: 110px; height: 110px; border-radius: 50%; margin: 0 auto 12px; overflow: hidden; border: 2px solid var(--border-fuerte); background: rgba(var(--marca-rgb), .14); color: var(--marca); display: flex; align-items: center; justify-content: center; font: 700 40px Sora, sans-serif; }
.nx-ui .foto-perfil img { width: 100%; height: 100%; object-fit: cover; }
.nx-ui .cargando { text-align: center; color: var(--text-3); padding: 40px 0; font-size: 14px; }
.nx-ui .err { color: var(--error); font-size: 13px; margin-top: 8px; }
.nx-ui .mi-prof { display: flex; align-items: center; gap: 12px; width: 100%; background: none; border: none; padding: 4px 0; text-align: left; }
.nx-ui .mi-prof .av { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--border-fuerte); display: flex; align-items: center; justify-content: center; color: var(--marca); font: 700 16px Sora, sans-serif; flex-shrink: 0; overflow: hidden; }
.nx-ui .mi-prof .av img { width: 100%; height: 100%; object-fit: cover; }
.nx-ui .mi-prof b { flex: 1; font: 600 15px Sora, sans-serif; }
.nx-ui .mi-prof span { color: var(--marca); font-size: 13px; }
.nx-ui .pref-opcion { color: var(--text-2); font-family: inherit; }
.nx-ui .pref-opcion.activo { color: color-mix(in srgb, var(--marca) 75%, var(--text)); }
.nx-ui .btn.wa { background: #1f7a4d; }
.nx-ui .pie { margin-bottom: 20px; }
.nx-ui .nx-link { color: var(--text-3); }

/* Contraste: el color de la marca sobre su propio tinte no llegaba a 4,5 en algunos temas (oscuro 4,3 · daltonismo 4,2).
   Mezclado con el color del texto sube a 6,4 o más en los 7 temas, sin cambiar la «cara» de cada tema. */
#nx-bar button.on, body.nx #nx-side .gs-nav > button.on, .nx-av, .nx-ui .bd.in, .nx-ui .mi-prof .av, .nx-ui .foto-perfil { color: color-mix(in srgb, var(--marca) 60%, var(--text)); }

/* ---------- ventana emergente y registro en vivo ---------- */
.nx-ol { position: fixed; inset: 0; background: rgba(0,0,0,.55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); display: none; align-items: center; justify-content: center; padding: 14px; z-index: 3000; }
.nx-ol.on { display: flex; }
.nx-ol .mdl { width: 100%; max-width: 520px; max-height: 90vh; overflow-y: auto; background: var(--bg-card); border: 1px solid var(--border-fuerte); border-radius: 24px; padding: 20px; }
.nx-ol .mdl h2 { font: 600 18px 'Sora', sans-serif; margin-bottom: 8px; }
.nx-ol .mdl .sub { margin-bottom: 6px; }
.nx-medalla { width: 64px; height: 64px; border-radius: 18px; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center; color: var(--warn); border: 2px solid var(--warn-borde); background: var(--warn-fondo); }
#vista-vivo { display: none; }
#vista-vivo.activa { display: block; animation: none; }
#nx-vivo-cont { max-width: 640px; margin: 0 auto; padding: 14px 16px 110px; }
@media (min-width: 1024px) { #nx-vivo-cont { max-width: 760px; padding: 24px 32px 40px; } }
#nx-vivo-banner { margin-bottom: 12px; }

/* ---------- planificador tipo tablero ---------- */
#vista-plani { display: none; }
#vista-plani.activa { display: block; animation: none; }
#nx-plani-cont { max-width: 640px; margin: 0 auto; padding: 14px 16px 110px; }
@media (min-width: 1024px) { #nx-plani-cont { max-width: 1100px; padding: 24px 32px 40px; } }   /* centrado en la pantalla de computador */
.nx-ui .pl-top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.nx-gl { background: none; border: none; color: color-mix(in srgb, var(--marca) 60%, var(--text)); font: 600 13px Inter, sans-serif; padding: 6px 0; text-align: left; cursor: pointer; }
.nx-gl:disabled { opacity: .4; cursor: default; }
.nx-ui .pl-mini { background: none; border: 1px solid var(--border); border-radius: 8px; color: var(--text-2); font-size: 11px; padding: 4px 7px; min-height: 28px; }
.nx-ui .pl-mini:disabled { opacity: .35; cursor: default; }
.nx-ui .pl-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.nx-ol .pl-alum { max-height: 220px; overflow-y: auto; margin-top: 8px; border: 1px solid var(--border); border-radius: 14px; padding: 4px 12px; }
.nx-ol .pl-al { display: flex; align-items: center; gap: 10px; padding: 9px 0; margin: 0; border-bottom: 1px solid var(--border); font-size: 14px; color: var(--text); }
.nx-ol .pl-al:last-child { border-bottom: none; }
.nx-ol .pl-al input { width: 18px; height: 18px; min-height: 18px; padding: 0; }

/* ---------- «Entrenar» (tarjetas) y «Planificar» ---------- */
#vista-entrenar { display: none; }
#vista-entrenar.activa { display: block; animation: none; }
#nx-hub-cont { max-width: 640px; margin: 0 auto; padding: 14px 16px 110px; }
@media (min-width: 1024px) { #nx-hub-cont { max-width: 1100px; padding: 24px 32px 40px; } }   /* centrado en la pantalla de computador */
.nx-ui .pl-acc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.nx-ui .pl-acc .card { margin-bottom: 0; display: flex; flex-direction: column; }
.nx-ui .pl-acc .card .sub { margin-bottom: 14px; }
.nx-ui .pl-acc .card .btn { margin-top: auto !important; }
@media (max-width: 860px) { .nx-ui .pl-acc { grid-template-columns: 1fr; } }
.nx-ui .ico { width: 44px; height: 44px; border-radius: 14px; background: rgba(var(--marca-rgb), .14); color: color-mix(in srgb, var(--marca) 60%, var(--text)); display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }

/* ---------- menú lateral con secciones que se despliegan ---------- */
#nx-side .gs-nav > button[aria-expanded] .gs-fl { margin-left: auto; font-style: normal; font-size: 12px; opacity: .7; }
#nx-side .gs-sub { display: flex; flex-direction: column; gap: 1px; margin: 2px 0 6px 18px; padding-left: 10px; border-left: 1px solid var(--border); }
#nx-side .gs-sub button { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; background: none; border: none; text-align: left; padding: 8px 10px; border-radius: 12px; font-size: 13px; color: var(--text-2); }
#nx-side .gs-sub button:hover { background: var(--bg-hover); color: var(--text); }
#nx-side .gs-sub button.on { color: color-mix(in srgb, var(--marca) 60%, var(--text)); font-weight: 600; background: rgba(var(--marca-rgb), .08); }

/* ---------- «Inicio» y calendario del profesor ---------- */
#vista-inicio, #vista-cal { display: none; }
#vista-inicio.activa, #vista-cal.activa { display: block; animation: none; }
#nx-ini-cont, #nx-cal-cont { max-width: 640px; margin: 0 auto; padding: 14px 16px 110px; }
@media (min-width: 1024px) { #nx-ini-cont, #nx-cal-cont { max-width: 760px; padding: 24px 32px 40px; } }
.nx-ui .ini-saludo { text-align: center; padding: 14px 0 18px; }
.nx-ui .ini-saludo h2 { font: 700 26px Sora, sans-serif; margin: 0 0 4px; }
.nx-ui .ini-racha { display: inline-block; margin-top: 10px; font: 600 12px Inter, sans-serif; padding: 4px 12px; border-radius: 999px; background: rgba(var(--marca-rgb), .14); color: color-mix(in srgb, var(--marca) 60%, var(--text)); }
.nx-ui .ini-racha.inv { background: transparent; border: 1px dashed var(--border-fuerte); color: var(--text-3); }
.nx-ui .ini-prox .ini-fila { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; }
.nx-ui .ini-prox .ini-fila b { font: 600 14px Sora, sans-serif; }
.nx-ui .ini-nombre { font: 700 22px Sora, sans-serif; margin: 4px 0; }
.nx-ui .ini-prox .btn { margin-top: 14px; }
.nx-ui .ini-lista { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 4px; }
.nx-ui .ini-item { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.nx-ui .pto { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; background: var(--marca); }
.nx-ui .pto.ok { background: var(--success); }
.nx-ui .ini-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0; }
.nx-ui .ini-tile { background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px; padding: 16px; display: flex; flex-direction: column; gap: 4px; }
.nx-ui .ini-tile b { font: 700 24px Sora, sans-serif; }
.nx-ui .ini-tile span { font-size: 12px; color: var(--text-3); }

.nx-ui .cal-nav { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 0 0 10px; }
.nx-ui .cal-nav b { font: 600 16px Sora, sans-serif; min-width: 150px; text-align: center; }
.nx-ui .cal-nav .nx-gl { font-size: 22px; padding: 4px 12px; min-height: 40px; }
.nx-ui .cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.nx-ui .cal-dh { text-align: center; font: 600 11px Inter, sans-serif; color: var(--text-3); padding: 4px 0; }
.nx-ui .cal-d { position: relative; min-height: 52px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 4px 2px; font: 500 14px Inter, sans-serif; color: var(--text); cursor: pointer; }
.nx-ui .cal-d.fuera { opacity: .45; }
.nx-ui .cal-d.hoy { border-color: var(--marca); font-weight: 700; }
.nx-ui .cal-d.sel { background: rgba(var(--marca-rgb), .16); border-color: var(--marca); }
.nx-ui .cal-d i { display: flex; gap: 3px; min-height: 7px; }
.nx-ui .cal-d em { position: absolute; top: 3px; right: 5px; font: 600 10px Inter, sans-serif; font-style: normal; color: var(--text-3); }
.nx-ui .cal-d u, .nx-ui .cal-leyenda u { display: inline-block; width: 7px; height: 7px; border-radius: 50%; text-decoration: none; }
.nx-ui u.ok { background: var(--success); } .nx-ui u.pe { background: var(--marca); } .nx-ui u.at { background: var(--error); }
.nx-ui .cal-leyenda { display: flex; gap: 14px; justify-content: center; font-size: 12px; color: var(--text-3); margin: 10px 0 4px; }
.nx-ui .cal-leyenda span { display: inline-flex; align-items: center; gap: 6px; }
.nx-ui .cal-lista { padding: 4px 14px; }
.nx-ui .cal-ses { display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; background: none; border: none; border-bottom: 1px solid var(--border); padding: 12px 0; text-align: left; color: var(--text); cursor: pointer; font: inherit; }
.nx-ui .cal-ses:last-child { border-bottom: none; }
.nx-ui .cal-ses span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nx-ui .cal-ses b { font-size: 14px; font-weight: 600; }
.nx-ui .cal-ses small { font-size: 12px; color: var(--text-3); }
@media (min-width: 560px) and (max-width: 1023px) { body.nx #nx-bar.visible { width: min(616px, calc(100vw - 24px)); } }

/* ---------- Crear sesión (editor), estructuras y biblioteca ---------- */
.nx-ui .pl-intro { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 4px 2px 8px; }
.nx-ui .pl-intro h2 { margin: 0; font: 700 20px Sora, sans-serif; }
.nx-ui .nx-info { width: 26px; height: 26px; flex-shrink: 0; border-radius: 50%; border: 1px solid var(--border-fuerte); background: transparent; color: var(--text-2); font: italic 700 13px Georgia, serif; cursor: pointer; padding: 0; line-height: 1; }
.nx-ui .nx-info[aria-expanded="true"] { background: rgba(var(--marca-rgb), .14); color: color-mix(in srgb, var(--marca) 60%, var(--text)); border-color: var(--marca); }
.nx-ui .nx-info-txt { font-size: 13px; line-height: 1.45; color: var(--text-2); background: var(--bg-hover); border-radius: 12px; padding: 10px 12px; margin: 6px 0 10px; }
.nx-ui .pl-dos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 700px) { .nx-ui .pl-dos { grid-template-columns: 1fr; } }
.nx-ui .ed-cab input { font: 600 16px Sora, sans-serif; }
.nx-ui .ed-bloque { padding: 12px; }
.nx-ui .ed-bh { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.nx-ui .ed-bnom { flex: 1; min-width: 0; font: 700 15px Sora, sans-serif; background: transparent; border-color: transparent; padding: 6px 8px; }
.nx-ui .ed-bnom:hover, .nx-ui .ed-bnom:focus { border-color: var(--border-fuerte); background: var(--bg); }
.nx-ui .ed-ej { background: var(--bg-hover); border: 1px solid var(--border); border-radius: 16px; padding: 10px; margin-bottom: 10px; }
.nx-ui .ed-eh { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.nx-ui .ed-enom { flex: 1; min-width: 0; font: 600 15px Inter, sans-serif; }
.nx-ui .ed-eb { display: flex; gap: 4px; flex-shrink: 0; }
.nx-ui .ed-unid { display: flex; gap: 8px; margin-bottom: 8px; }
.nx-ui .ed-unid select { width: auto; min-width: 72px; padding: 6px 10px; min-height: 36px; }
.nx-ui .ed-sh, .nx-ui .ed-sr { display: grid; grid-template-columns: 24px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, .8fr) 32px; gap: 6px; align-items: center; margin-bottom: 6px; }
.nx-ui .ed-sh { font: 600 11px Inter, sans-serif; color: var(--text-3); text-transform: uppercase; letter-spacing: .04em; padding: 0 2px; }
.nx-ui .ed-sr input { padding: 8px 8px; min-height: 40px; font-size: 14px; text-align: center; margin: 0; }
.nx-ui .ed-n { font: 700 13px Sora, sans-serif; color: var(--text-3); text-align: center; }
.nx-ui .wod-tag { font: 700 11px Inter, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: color-mix(in srgb, var(--marca) 60%, var(--text)); background: rgba(var(--marca-rgb), .14); padding: 4px 10px; border-radius: 999px; }
.nx-ui .ed-wod .ed-eh { justify-content: space-between; }
.nx-ui .ed-wod .ed-enom { width: 100%; margin-bottom: 8px; }
.nx-ui .ed-fmt { width: 100%; }
.nx-ui .ed-pars { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.nx-ui .ed-par { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--text-2); margin: 0; }
.nx-ui .ed-mov { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, .8fr) minmax(0, .9fr) minmax(0, .8fr) 32px; gap: 6px; align-items: center; margin-bottom: 8px; }
.nx-ui .ed-mov input, .nx-ui .ed-mov select { margin: 0; min-height: 40px; padding: 8px; font-size: 14px; }
.nx-ui .ed-mov .ed-mdesc { grid-column: 1 / -1; }
.nx-ui .ed-add { padding: 12px; }
.nx-ui .ed-pie { position: sticky; bottom: 78px; display: flex; gap: 10px; padding: 10px; margin: 12px -4px 0; background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px; box-shadow: 0 8px 28px rgba(0,0,0,.14); z-index: 5; }
.nx-ui .ed-pie .btn { flex: 1; margin: 0; }
@media (min-width: 1024px) { .nx-ui .ed-pie { bottom: 16px; max-width: 520px; } #nx-plani-cont .pl { max-width: 860px; margin: 0 auto; } }

/* ---------- Microciclo (una semana) ---------- */
.nx-ui .pl-tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .nx-ui .pl-tres { grid-template-columns: 1fr; } }
.nx-ui .mc-dia { padding: 12px; }
.nx-ui .mc-dh { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.nx-ui .mc-dh b { font: 700 15px Sora, sans-serif; }
.nx-ui .mc-ses { background: var(--bg-hover); border: 1px solid var(--border); border-radius: 14px; padding: 10px; margin-bottom: 8px; }
.nx-ui .mc-ses .ed-bnom { width: 100%; font: 600 14px Inter, sans-serif; }
.nx-ui .mc-dsel { width: auto; flex: 1; min-width: 110px; min-height: 36px; padding: 6px 10px; margin: 0; }
.nx-ui .pl-pick { display: flex; align-items: center; gap: 12px; cursor: pointer; margin: 0; }
.nx-ui .pl-pick input { width: 20px; height: 20px; min-height: 20px; padding: 0; flex-shrink: 0; }
.nx-ui .pl-pick span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nx-ui .pl-pick b { font-size: 15px; }
.nx-ui .pl-pick small { font-size: 12px; color: var(--text-3); }

/* ---------- Mesociclo ---------- */
.nx-ui .ed-sems { margin: 0 0 8px; }
.nx-ui .ed-step { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.nx-ui .ed-step b { min-width: 18px; text-align: center; font: 700 16px Sora, sans-serif; }
.nx-ui .ed-step .pl-mini { width: 36px; height: 36px; font-size: 18px; }

div.pl-pick { justify-content: space-between; }

/* ---------- Mi plan: plan, alumnos, consultas, aviso de la prueba, mejorar plan y elegir alumnos ---------- */
.nx-ui .plan-fila { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.nx-ui .plan-med, .nx-ol .plan-med { margin-top: 14px; }
.nx-ui .plan-med .et, .nx-ol .plan-med .et { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--text-2); }
.nx-ui .plan-med .et b, .nx-ol .plan-med .et b { color: var(--text); font: 700 14px Sora, sans-serif; white-space: nowrap; }
.nx-ui .plan-med .barra { height: 8px; border-radius: 6px; background: var(--bg); overflow: hidden; margin-top: 6px; border: 1px solid var(--border); }
.nx-ui .plan-med .barra i { display: block; height: 100%; background: var(--marca); }
.nx-ui .plan-med .barra i.ad { background: var(--warn); }
.nx-ui .aviso { background: var(--warn-fondo); border: 1px solid var(--warn-borde); border-radius: 16px; padding: 14px 16px; margin: 0 0 12px; }
.nx-ui .aviso b { font: 700 15px Sora, sans-serif; display: block; margin-bottom: 4px; }
.nx-ui .aviso .t { font-size: 13px; line-height: 1.5; color: var(--text); }
.nx-ui .aviso .fila { margin-top: 12px; }
.nx-ui .chip-pausa { display: inline-block; font-size: 11px; font-weight: 600; color: var(--warn); background: var(--warn-fondo); border: 1px solid var(--warn-borde); border-radius: 50px; padding: 3px 9px; }
.nx-ol .plan-op { border: 1px solid var(--border); border-radius: 14px; padding: 12px 14px; margin-top: 10px; background: var(--bg-card); }
.nx-ol .plan-op .nom { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.nx-ol .plan-op .nom b { font: 700 16px Sora, sans-serif; }
.nx-ol .plan-op .nom span { font: 700 15px Sora, sans-serif; color: var(--marca); text-align: right; }
.nx-ol .plan-op .det { font-size: 12px; color: var(--text-3); margin: 4px 0 10px; line-height: 1.5; }
.nx-ol .al-fila { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.nx-ol .al-fila .av2 { width: 36px; height: 36px; border-radius: 50%; background: rgba(var(--marca-rgb), 0.15); color: var(--marca); display: flex; align-items: center; justify-content: center; font-weight: 700; flex: none; }
.nx-ol .al-fila .n { flex: 1; min-width: 0; color: var(--text); } .nx-ol .al-fila .n b { display: block; font-size: 14px; } .nx-ol .al-fila .n small { color: var(--text-3); font-size: 12px; }
.nx-ol .al-fila .ck { width: 24px; height: 24px; border-radius: 7px; border: 2px solid var(--border-fuerte); flex: none; display: flex; align-items: center; justify-content: center; font-size: 15px; color: #fff; }
.nx-ol .al-fila .ck.on { background: var(--accion); border-color: var(--accion); }

.nx-ol .per { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 4px; }
.nx-ol .per button { flex: 1; min-width: 68px; padding: 9px 8px; border-radius: 999px; border: 1px solid var(--border-fuerte); background: transparent; color: var(--text-2); font: 600 13px Inter, sans-serif; cursor: pointer; }
.nx-ol .per button.activo { background: var(--accion); color: var(--accion-texto); border-color: var(--accion); }

/* ---- Soporte técnico (Yo → Soporte) y cinta de campaña en «Mi plan» ---- */
.nx-ui .sop-fila { width: 100%; display: flex; align-items: center; gap: 10px; background: none; border: none; text-align: left; padding: 4px 0; min-height: 44px; }
.nx-ui .sop-fila > span:first-child { flex: 1; min-width: 0; }
.nx-ui .sop-fila b { display: block; font-size: 15px; color: var(--text); }
.nx-ui .sop-fila small { display: block; font-size: 12px; color: var(--text-3); margin-top: 2px; line-height: 1.4; }
.nx-ui .sop-flecha { color: var(--text-3); font-size: 20px; }
.nx-ui .sop-punto { display: inline-block; min-width: 20px; height: 20px; border-radius: 10px; background: #e03131; color: #fff; font: 700 11px Inter, sans-serif; font-style: normal; text-align: center; line-height: 20px; padding: 0 6px; }
.nx-ui .sop-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.nx-ui .sop-q { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border-fuerte); background: var(--bg); color: var(--marca); font: 700 15px Sora, sans-serif; padding: 0; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nx-ui .sop-ayuda { background: rgba(var(--marca-rgb), .08); border: 1px solid rgba(var(--marca-rgb), .3); border-radius: 14px; padding: 12px 14px; font-size: 13px; color: var(--text-2); line-height: 1.55; margin: 8px 0 10px; }
.nx-ui .sop-ayuda ul { margin: 6px 0 0 18px; padding: 0; } .nx-ui .sop-ayuda li { margin-bottom: 3px; }
.nx-ui .sop-caso { font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--text-3); text-align: center; margin: 14px 0 4px; }
.nx-ui .sop-bur { max-width: 84%; padding: 9px 12px; border-radius: 16px; font-size: 14px; line-height: 1.45; margin: 6px 0; word-break: break-word; }
.nx-ui .sop-bur small { display: block; font-size: 10px; opacity: .65; margin-top: 3px; }
.nx-ui .sop-bur.u { background: var(--accion); color: var(--accion-texto); margin-left: auto; border-bottom-right-radius: 4px; }
.nx-ui .sop-bur.a { background: var(--bg); border: 1px solid var(--border); color: var(--text); border-bottom-left-radius: 4px; }
.nx-ui .sop-res { border: 1px solid var(--success-borde); background: var(--success-fondo); border-radius: 16px; padding: 12px 14px; margin: 10px 0 4px; }
.nx-ui .sop-res b { color: var(--success); font-size: 13px; display: block; margin-bottom: 4px; }
.nx-ui .sop-res p { font-size: 14px; color: var(--text); margin: 0 0 10px; line-height: 1.45; }
.nx-ui .cinta-camp { background: rgba(var(--marca-rgb), .12); border: 1px solid rgba(var(--marca-rgb), .35); border-radius: 16px; padding: 12px 14px; font-size: 13px; color: var(--text); margin: 0 0 12px; line-height: 1.5; }
.nx-ui .cinta-camp b { color: var(--marca); }

/* ---- «(i)» en todas las pantallas, «Programar» y su ventana ---- */
.nx-ui .nx-info.mini { width: 20px; height: 20px; font-size: 11px; margin-left: 6px; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; }
.nx-ui .nx-info-txt[hidden] { display: none; }
.nx-ui .ini-tile .nx-info.mini { margin-left: 4px; }
.nx-ui .ed-aysr { display: flex; align-items: center; gap: 6px; margin: 0 0 6px; }
.nx-ui .ed-pie-yo { flex-direction: column; align-items: stretch; gap: 2px; }
.nx-ui .ed-pie-yo .btn { flex: none; }
.nx-ui .nx-sola { align-self: center; text-decoration: underline; color: var(--text-2); font-weight: 600; padding: 8px 12px; min-height: 36px; text-align: center; }
.nx-ui .pl-cuando { display: flex; gap: 8px; margin: 12px 0 6px; }
.nx-ui .pl-cuando .chip { flex: 1; min-height: 46px; text-align: center; }
.nx-ui .pl-cuando.pl-col { flex-direction: column; }
.nx-ui .pl-cuando.pl-col .chip { text-align: left; padding-left: 16px; }
.nx-ui .pl-pie-col { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }
.nx-ui .pl-ok { text-align: center; padding: 6px 0 2px; }
.nx-ui .pl-ok .tick { width: 54px; height: 54px; border-radius: 50%; background: var(--success-fondo); border: 1px solid var(--success-borde); color: var(--success); font: 700 26px Inter, sans-serif; display: flex; align-items: center; justify-content: center; margin: 4px auto 10px; }

/* ---- borradores sin terminar ---- */
.nx-ui .bor { border-style: dashed; }
.nx-ui .bor-pronto { font-size: 12px; font-weight: 600; color: var(--warn); }
.nx-ui .bor-pista { margin: 12px 2px 0; font-size: 13px; color: var(--text-2); }
.nx-ui .bor-pista .nx-gl { display: inline; padding: 0 2px; min-height: 0; }

/* ---- soporte: imágenes adjuntas ---- */
.nx-ol .sop-adj, .sop-adj { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0 0; }
.sop-minis { display: flex; gap: 8px; margin: 8px 0 0; }
.sop-mini { position: relative; width: 64px; height: 64px; }
.sop-mini img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; display: block; }
.sop-mini button { position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--border); background: var(--bg, #fff); color: var(--text, #111); font-size: 11px; line-height: 1; padding: 0; cursor: pointer; }
.sop-imgs { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.sop-img { border: 0; padding: 0; background: none; cursor: pointer; border-radius: 10px; overflow: hidden; width: 84px; height: 84px; display: block; }
.sop-img img { width: 100%; height: 100%; object-fit: cover; display: block; background: rgba(128, 128, 128, .2); }
.sop-borrada { font-size: 12px; opacity: .7; margin-top: 6px; }
.sop-visor { position: fixed; inset: 0; z-index: 100000; background: rgba(0, 0, 0, .88); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; cursor: pointer; }
.sop-visor img { max-width: 94vw; max-height: 84vh; border-radius: 8px; }
.sop-visor span { color: #fff; font-size: 13px; opacity: .8; }

/* ---- biblioteca de ejercicios ---- */
.nx-ol .bib-cab { display: flex; align-items: center; gap: 8px; }
.nx-ol .bib-cab h2 { flex: 1; margin: 0; }
.nx-ol .bib-x { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--border-fuerte); background: transparent; color: var(--text); font-size: 15px; cursor: pointer; flex: none; margin-left: auto; }
.nx-ol .bib input[type=search] { margin: 10px 0 8px; }
.nx-ol .bib-chips { margin: 0 0 8px; }
.nx-ol .bib-sec { margin: 10px 2px 6px; letter-spacing: .06em; font-weight: 600; }
.nx-ol .bib { min-width: 0; overflow-x: hidden; }
.nx-ol .bib-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nx-ol .bib-card { min-width: 0; }
.nx-ol .bib-info b { overflow-wrap: anywhere; }
.nx-ol .bib-card { border: 1px solid var(--border-fuerte); border-radius: 14px; overflow: hidden; background: var(--bg-card); cursor: pointer; display: flex; flex-direction: column; position: relative; }
.nx-ol .bib-card.on { border: 2px solid var(--accion); }
.nx-ol .bib-img { height: 74px; background: var(--bg-hover); display: flex; align-items: center; justify-content: center; position: relative; color: var(--text-3); overflow: hidden; }
.nx-ol .bib-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nx-ol .bib-ok { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border-radius: 50%; background: var(--accion); color: var(--accion-texto); font-style: normal; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.nx-ol .bib-info { padding: 8px 10px 10px; display: flex; flex-direction: column; gap: 2px; }
.nx-ol .bib-info b { font-size: 13px; line-height: 1.25; }
.nx-ol .bib-info small { font-size: 11px; color: var(--text-3); }
.nx-ol .bib-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.nx-ol .bib-tag { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 3px 7px; border-radius: 6px; border: 1px solid var(--border-fuerte); background: var(--bg-hover); color: var(--accion); cursor: pointer; min-height: 0; }
.nx-ol .bib-tag.mio { color: var(--text-2); cursor: default; }
.nx-ol .bib-pie { position: sticky; bottom: -20px; display: flex; gap: 8px; padding: 12px 0 4px; margin-top: 12px; background: var(--bg-card); border-top: 1px solid var(--border); }
.nx-ol .bib-pie .btn { flex: 1; }
.nx-ol .bib-media { width: 100%; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: var(--bg-hover); display: flex; align-items: center; justify-content: center; position: relative; border: 0; padding: 0; }
.nx-ol .bib-media iframe, .nx-ol .bib-media img { width: 100%; height: 100%; border: 0; object-fit: cover; display: block; }
.nx-ol .bib-play { position: absolute; width: 54px; height: 54px; border-radius: 50%; background: rgba(0,0,0,.6); color: #fff; font-size: 22px; display: flex; align-items: center; justify-content: center; }
.nx-ol .bib-sinvideo { flex-direction: column; gap: 8px; color: var(--text-3); font-size: 13px; }
.nx-ol .bib-pasos { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-direction: column; gap: 10px; }
.nx-ol .bib-pasos li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.4; }
.nx-ol .bib-pasos i { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--bg-hover); color: var(--accion); font-style: normal; font-weight: 700; font-size: 12px; display: flex; align-items: center; justify-content: center; }
.nx-ol .bib-error { background: var(--warn-fondo); border: 1px solid var(--warn-borde); border-radius: 12px; padding: 10px 12px; font-size: 13px; margin-bottom: 12px; }

/* ---- WODs en vivo ---- */
.nx-ui .vw-op, .nx-ol .vw-op { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; padding: 12px 14px; margin-top: 8px; border: 1px solid var(--border-fuerte); border-radius: 14px; background: var(--bg-card); color: var(--text); cursor: pointer; }
.nx-ol .vw-op b { font: 600 15px 'Sora', sans-serif; }
.nx-ol .vw-op small { font-size: 12px; color: var(--text-2); line-height: 1.35; }
.nx-ol .vw-par { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; margin: 8px 0 4px; }
.nx-ol .vw-mov { display: grid; grid-template-columns: minmax(0, 1fr) 58px 62px 52px 30px; gap: 6px; align-items: center; margin-top: 8px; }
.nx-ol .vw-mov input, .nx-ol .vw-mov select { min-width: 0; padding: 8px 6px; }
.nx-ol .vw-mov input:first-child { grid-column: 1 / -1; }
.nx-ui .vw-run { text-align: center; }
.nx-ui .vw-run.trabajo { border-color: var(--success); background: var(--success-fondo); }
.nx-ui .vw-run.descanso { border-color: var(--warn); background: var(--warn-fondo); }
.nx-ui .vw-run.pre .vw-reloj { color: var(--warn); }
.nx-ui .vw-reloj { font: 700 64px Sora, sans-serif; font-variant-numeric: tabular-nums; margin: 6px 0 0; line-height: 1.1; }
.nx-ui .vw-fase { font-size: 15px; font-weight: 600; margin: 4px 0 10px; min-height: 22px; }
.nx-ui .vw-rondas { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 8px 0 12px; font-size: 16px; }
.nx-ui .vw-rondas b { font: 700 24px Sora, sans-serif; }
.nx-ui .vw-movs { text-align: left; font-size: 13px; color: var(--text-2); margin-top: 8px; display: flex; flex-direction: column; gap: 3px; }
.nx-ui .vw-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; text-align: left; margin: 10px 0; }
.nx-ui .vw-campos .full { grid-column: 1 / -1; }

/* ---- «(i)» en las pantallas de siempre ---- */
.ay-btn { width: 20px; height: 20px; flex-shrink: 0; border-radius: 50%; border: 1px solid var(--border-fuerte); background: transparent; color: var(--text-2); font: italic 700 11px Georgia, serif; cursor: pointer; padding: 0; line-height: 1; margin-left: 6px; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; }
.ay-btn[aria-expanded="true"] { background: rgba(var(--marca-rgb), .14); color: var(--text); border-color: var(--marca); }
.ay-txt { font-size: 13px; line-height: 1.45; color: var(--text-2); background: var(--bg-hover); border-radius: 12px; padding: 10px 12px; margin: 6px 0 10px; text-transform: none; letter-spacing: 0; font-weight: 400; }
.ay-txt[hidden] { display: none; }
.ay-fila { display: flex; align-items: center; justify-content: center; gap: 4px; font-size: 12px; color: var(--text-3); margin: 2px 0 8px; }

/* ---- Cobros del profesor ---- */
.cb-tabs { margin: 0 0 12px; }
.cb-pesta { display: flex; gap: 6px; background: var(--bg-hover); border-radius: 14px; padding: 4px; }
.cb-pesta button { flex: 1; border: 0; background: transparent; color: var(--text-2); font: 600 14px Inter, sans-serif; padding: 9px 4px; border-radius: 11px; cursor: pointer; min-height: 38px; }
.cb-pesta button.on { background: var(--bg-card); color: var(--text); box-shadow: 0 1px 4px rgba(0,0,0,.18); }
.cb-panel { display: none; }
.pr-container.cb-on .cb-panel { display: block; }
.pr-container.cb-on #pr-seccion-alumnos { display: none !important; }
.pr-container:has(#pr-alumno.activa) .cb-tabs, .pr-container:has(#pr-crear.activa) .cb-tabs, .pr-container:has(#pr-ver.activa) .cb-tabs { display: none; }
.cb-mes { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; font: 600 16px Sora, sans-serif; }
.cb-mes button { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--border-fuerte); background: transparent; color: var(--text-2); font-size: 18px; cursor: pointer; }
.cb-mes button:disabled { opacity: .35; cursor: default; }
.cb-grande { font: 700 28px Sora, sans-serif; margin: 2px 0; }
.cb-grande small { font: 400 13px Inter, sans-serif; color: var(--text-3); }
.cb-barra { height: 10px; background: var(--bg-hover); border-radius: 6px; overflow: hidden; margin: 8px 0 6px; }
.cb-barra i { display: block; height: 100%; background: var(--success); }
.cb-al { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cb-al b { font: 600 15px Inter, sans-serif; }
.cb-al small { display: block; color: var(--text-3); font-size: 12px; margin-top: 2px; }
.cb-anio { display: flex; gap: 4px; align-items: flex-end; height: 90px; margin-top: 10px; }
.cb-anio > div { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; }
.cb-anio i { display: block; width: 100%; background: var(--marca); border-radius: 4px; }
.cb-anio span { font-size: 10px; color: var(--text-3); }
.nx-ui .est, .nx-ol .est { display: inline-block; font: 700 10px Inter, sans-serif; border-radius: 50px; padding: 3px 9px; letter-spacing: .03em; white-space: nowrap; }
.est.r { background: var(--error-fondo); color: var(--error); border: 1px solid var(--error-borde); }
.est.p { background: var(--success-fondo); color: var(--success); border: 1px solid var(--success-borde); }
.est.g { background: var(--bg-hover); color: var(--text-2); border: 1px solid var(--border-fuerte); }
.nx-ui .tip, .nx-ol .tip { background: rgba(var(--marca-rgb), .09); border: 1px solid rgba(var(--marca-rgb), .3); border-radius: 12px; padding: 9px 12px; font-size: 12.5px; line-height: 1.5; color: var(--text); margin: 6px 0 10px; }

/* ---- Etiqueta «Guardado» del editor (borradores) ---- */
.nx-ui .bor-est { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 12px; padding: 6px 12px; border-radius: 50px; font: 600 12px Inter, sans-serif; background: var(--bg-hover); color: var(--text-2); border: 1px solid var(--border-fuerte); }
.nx-ui .bor-est i { width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); flex: none; }
.nx-ui .bor-est.e-espera i { animation: bor-pulso 1s ease-in-out infinite; }
.nx-ui .bor-est.e-cuenta { background: var(--success-fondo); color: var(--success); border-color: var(--success-borde); }
.nx-ui .bor-est.e-cuenta i, .nx-ui .bor-est.e-celular i { background: var(--success); }
.nx-ui .bor-est.e-sinsenal i { background: var(--error); }
@keyframes bor-pulso { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .nx-ui .bor-est.e-espera i { animation: none; } }