/* A1 «Entrar» del LMS — estilo del portal /cursos (alumno). Sin estilos en línea (CSP), sin fuentes externas.
   Tokens: los de OBT WebCorporativa\cursos\academia.css, con sus valores. Inter solo si está instalada. */
:root{
  --bg:#F6F7FB;--surface:#FFFFFF;--texto:#0B1020;--texto2:#475569;--borde:#E1E5EE;--campo:#64748B;
  --acento:#0B7C72;--acento-hover:#08665E;--acento-texto:#0B7C72;--sobre-acento:#FFFFFF;
  --foco:#0B1020;--error:#B42318;--error-fondo:#FEF3F2;--aviso:#7C2D12;--aviso-fondo:#FFEDD5;
  --sombra:0 1px 2px rgba(11,16,32,.06),0 8px 24px -12px rgba(11,16,32,.18);--radio:18px;
  --fuente:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-display:"Inter Tight","Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --sel:#E6F4F2;--ok-fondo:#E6F4F2; /* F3 (maqueta de Diseño): opción marcada y éxito suave */
}
@media (prefers-color-scheme:dark){:root[data-tema=auto]{
  --bg:#070A12;--surface:#111829;--texto:#EEF2FF;--texto2:#A9B3C9;--borde:#26314A;--campo:#8391AD;
  --acento:#5EEAD4;--acento-hover:#99F6E4;--acento-texto:#5EEAD4;--sobre-acento:#042F2A;
  --foco:#FDE68A;--error:#FDA4AF;--error-fondo:#3A1512;--aviso:#FDBA74;--aviso-fondo:#3B2410;
  --sombra:0 1px 2px rgba(0,0,0,.4),0 12px 32px -16px rgba(0,0,0,.7);--sel:#0F2F33;--ok-fondo:#0F2F33;}}
:root[data-tema=dark]{
  --bg:#070A12;--surface:#111829;--texto:#EEF2FF;--texto2:#A9B3C9;--borde:#26314A;--campo:#8391AD;
  --acento:#5EEAD4;--acento-hover:#99F6E4;--acento-texto:#5EEAD4;--sobre-acento:#042F2A;
  --foco:#FDE68A;--error:#FDA4AF;--error-fondo:#3A1512;--aviso:#FDBA74;--aviso-fondo:#3B2410;
  --sombra:0 1px 2px rgba(0,0,0,.4),0 12px 32px -16px rgba(0,0,0,.7);--sel:#0F2F33;--ok-fondo:#0F2F33}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;font-family:var(--fuente);color:var(--texto);background:var(--bg);line-height:1.55}
:focus-visible{outline:3px solid var(--foco);outline-offset:2px}
.solo{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.saltar{position:absolute;left:8px;top:-60px;background:var(--surface);color:var(--texto);padding:10px 14px;border-radius:8px;border:2px solid var(--foco);z-index:10}
.saltar:focus{top:8px}
/* cabecera */
.cab{background:var(--surface);border-bottom:1px solid var(--borde)}
.cab-in{max-width:1040px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}
.marca{display:inline-flex;align-items:center;gap:10px;font-weight:600}
.marca-logo{display:block;flex:none;width:40px;height:40px;border-radius:8px}
.marca-texto b{color:var(--acento-texto)}
.idioma{font:inherit;font-weight:600;font-size:.85rem;min-width:44px;min-height:44px;border-radius:999px;border:1px solid var(--campo);background:var(--surface);color:var(--texto);cursor:pointer}
.idioma:hover{border-color:var(--texto)}
/* contenido */
.principal{flex:1;display:grid;place-items:start center;padding:40px 20px 56px}
.principal:focus{outline:none}
.tarjeta{width:100%;max-width:440px;background:var(--surface);border:1px solid var(--borde);border-radius:var(--radio);box-shadow:var(--sombra);padding:32px 28px}
h1{margin:0 0 10px;font-size:1.6rem;line-height:1.2;letter-spacing:-.01em}
h1:focus{outline:none}
.lema{margin:0 0 18px;color:var(--texto);font-size:1.05rem}
.ayuda{margin:6px 0 0;color:var(--texto2);font-size:.9rem}
.icono{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;background:var(--borde);color:var(--acento-texto);margin-bottom:14px}
.icono.aviso{background:var(--aviso-fondo);color:var(--aviso);font-weight:800;font-size:1.5rem}
.icono.error-i{background:var(--error-fondo);color:var(--error);font-weight:800}
/* formulario */
.campo{margin:6px 0 18px}
label{display:block;font-weight:600;font-size:.95rem;margin:0 0 6px}
input[type=email]{width:100%;font:inherit;font-size:1rem;min-height:48px;padding:10px 12px;color:var(--texto);background:var(--surface);border:1px solid var(--campo);border-radius:8px}
input[type=email]:hover{border-color:var(--texto2)}
input[aria-invalid=true]{border:2px solid var(--error)}
.error{margin:8px 0 0;padding:8px 10px;border-radius:8px;background:var(--error-fondo);color:var(--error);font-size:.92rem;font-weight:600}
/* botones: objetivo ≥ 44 px; un solo botón relleno por pantalla */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:12px 22px;font:inherit;font-weight:600;font-size:1rem;color:var(--sobre-acento);background:var(--acento);border:2px solid var(--acento);border-radius:10px;cursor:pointer}
.boton:hover:not([aria-disabled=true]){background:var(--acento-hover);border-color:var(--acento-hover)}
.boton.secundario{color:var(--acento-texto);background:var(--surface)}
.boton.secundario:hover:not([aria-disabled=true]){background:var(--borde);color:var(--texto)}
.boton[aria-disabled=true]{opacity:.75;cursor:not-allowed}
.boton[aria-busy=true]{cursor:progress}
.espera{margin:10px 0 0;color:var(--texto2);font-size:.92rem;min-height:1.4em;text-align:center}
.privacidad{margin:18px 0 0;color:var(--texto2);font-size:.85rem}
.ayuda-enlace{margin:14px 0 0;text-align:center;font-size:.92rem}
a,.enlace{color:var(--acento-texto);text-decoration:underline;text-underline-offset:3px}
.enlace{font:inherit;background:none;border:0;padding:12px 8px;min-height:44px;cursor:pointer}
.pie{padding:20px;text-align:center;color:var(--texto2);font-size:.85rem}
.pie p{margin:0}
@media (max-width:480px){.tarjeta{padding:24px 18px}.principal{padding:24px 14px 40px}h1{font-size:1.4rem}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (forced-colors:active){.boton,input[type=email]{border:2px solid ButtonText}.boton[aria-disabled=true]{opacity:1;border-style:dashed}}
/* --- Añadidos del LMS (fuera de la maqueta A1) --- */
.banda-control{background:var(--aviso-fondo);color:var(--aviso);font-weight:600;text-align:center;padding:10px 16px;border-bottom:1px solid var(--borde)}
.dato{margin:0 0 12px;color:var(--texto2)}
.dato b{color:var(--texto)}
a.boton{text-decoration:none;margin-top:12px}
.ayuda + .boton{margin-top:18px}
/* --- F2: A2 «Mis cursos», A3 «Curso», A4 «Actividad» (propuesta del Coder: pendiente de revisión de Diseño) --- */
.ancho{width:100%;max-width:760px}
.ancho .tarjeta{max-width:none}
.migas{margin:0 0 14px;font-size:.92rem}
.migas a{display:inline-block;padding:10px 0;min-height:44px}
.ancho>h1{margin-bottom:18px}
.lista-cursos{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.lista-cursos .curso{padding:24px}
@media (min-width:600px){.curso .boton{width:auto;min-width:180px}}
.cab-acciones{display:flex;align-items:center;gap:8px}
.cab-acciones .enlace{padding:10px 12px}
.curso h2{margin:0 0 6px;font-size:1.2rem;line-height:1.3}
.curso p{margin:0 0 10px;color:var(--texto2)}
.curso .siguiente{color:var(--texto);font-weight:600}
.barra{display:flex;align-items:center;gap:12px;margin:8px 0 4px}
.barra{--pista:#D5DCE6}
:root[data-tema=dark] .barra{--pista:var(--borde)}
@media (prefers-color-scheme:dark){:root[data-tema=auto] .barra{--pista:var(--borde)}}
.barra progress{flex:1;height:10px;appearance:none;-webkit-appearance:none;border:0;border-radius:999px;background:var(--pista);overflow:hidden}
.barra progress::-webkit-progress-bar{background:var(--pista);border-radius:999px}
.barra progress::-webkit-progress-value{background:var(--acento);border-radius:999px}
.barra progress::-moz-progress-bar{background:var(--acento);border-radius:999px}
.barra b{min-width:3em;text-align:right}
.agenda{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--borde)}
.agenda li{border-bottom:1px solid var(--borde)}
.agenda a{display:flex;align-items:flex-start;gap:12px;padding:12px 8px;border-radius:8px;min-height:48px;text-decoration:none;color:var(--texto)}
.agenda a:hover{background:var(--bg)}
.agenda a:hover .titulo-act{text-decoration:underline}
.agenda a[aria-current=step]{background:var(--bg)}
.agenda a[aria-current=step] .titulo-act{font-weight:700}
.estado{flex:none;margin-top:2px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:2px solid var(--campo);color:var(--texto2);font-size:.85rem;font-weight:800}
.estado.hecha{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.estado.abierta{border-color:var(--acento);background:linear-gradient(90deg,var(--acento) 50%,transparent 50%);color:transparent}
.estado.pendiente{color:transparent}
.titulo-act{flex:1;min-width:0}
.minutos{flex:none;white-space:nowrap;color:var(--texto2);font-size:.9rem}
.contenido h2{font-size:1.1rem;margin:22px 0 8px}
.contenido ol,.contenido ul{margin:0 0 12px;padding-left:1.4em}
.contenido li{margin:0 0 8px}
.contenido .nota{display:block;margin-top:4px;color:var(--texto2);font-size:.92rem}
.contenido .prompt{display:block;margin-top:6px;padding:8px 10px;border-radius:8px;background:var(--bg);border:1px solid var(--borde);font-family:ui-monospace,Consolas,monospace;font-size:.9rem;white-space:pre-wrap;overflow-wrap:anywhere}
.acciones{display:grid;gap:10px;margin-top:22px}
.acciones .boton{margin-top:0}
@media (min-width:600px){.acciones{grid-template-columns:1fr 1fr}.acciones #marcar,.acciones .hecho,.acciones #con-control{grid-column:1/-1}}
.navegacion{display:flex;justify-content:space-between;gap:4px 12px;margin-top:18px;flex-wrap:wrap}
.navegacion a{display:inline-block;padding:10px 0;min-height:44px}
.hecho{margin:0;padding:10px 12px;border-radius:8px;background:var(--bg);border:1px solid var(--borde);font-weight:600}
/* A4 · vídeo (tramo 2): ocupa el ancho de la tarjeta y mantiene 16:9 mientras carga. Pendiente de revisar con Diseño. */
.video{margin:16px 0}.video video{display:block;width:100%;aspect-ratio:16/9;background:#000;border-radius:8px;border:1px solid var(--borde)}.video video[hidden]{display:none}
.video video:focus-visible{outline:3px solid var(--foco);outline-offset:2px}.video .error{margin:0 0 8px}
/* A3/A4 · juegos de repaso (tramo 2, revisión de Diseño): filas como la agenda, objetivo de 44 px y «↗» de que sale. */
#repaso{margin-top:22px}#repaso h2{font-size:1.1rem;margin:22px 0 8px}
.juegos{list-style:none;padding:0;margin:8px 0 16px;border-top:1px solid var(--borde)}.juegos li{border-bottom:1px solid var(--borde)}
.juegos a{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 4px}.juegos a:hover{background:var(--bg)}
.juegos .sale{margin-left:auto}
/* A2/A3 · curso que es parte de un programa (tramo 2): una línea pequeña encima del título. Pendiente de Diseño. */
.programa{margin:0 0 4px;font-size:.85rem;font-weight:600;color:var(--texto2)}
@media (forced-colors:active){.estado.abierta{forced-color-adjust:none;background:linear-gradient(90deg,Highlight 50%,Canvas 50%);border-color:Highlight}.estado.hecha{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight}}
/* ===== F3 · A3 con bloqueo, A4 bloqueada y A5 control (maqueta de Diseño, lms-f3-maqueta; sin el medidor ni el %:
   decisión 55) ===== */
.agenda .fila{display:flex;align-items:flex-start;gap:12px;padding:12px 8px;border-radius:8px;min-height:48px;color:var(--texto)}
.nota-bloqueo{display:flex;gap:12px;align-items:flex-start;margin:18px 0 0;padding:12px 14px;border-radius:10px;background:var(--aviso-fondo);color:var(--aviso);border:1px solid currentColor}
.nota-bloqueo svg{flex:none;margin-top:4px}
.nota-bloqueo p{margin:0;font-weight:600}
.nota-bloqueo a{color:inherit;font-weight:700;display:inline-block;padding:8px 0;min-height:44px}
.nota-bloqueo + .boton{margin-top:14px}
.nota-bloqueo[hidden] + .boton{margin-top:18px}
.marca-fila{display:inline-flex;align-items:center;gap:5px;margin-top:4px;padding:1px 9px;border-radius:999px;font-size:.8125rem;font-weight:600}
.marca-fila.control{border:1px solid var(--acento-texto);color:var(--acento-texto)}
.estado.bloqueada{border-style:dashed;color:var(--texto2)}
.estado.bloqueada svg{display:block}
.agenda .bloqueada-fila .titulo-act{color:var(--texto2)}
.agenda .bloqueada-fila .porque{display:block;margin-top:2px;font-size:.88rem;color:var(--texto2)}
.agenda .fila.bloqueada-fila{cursor:not-allowed}
.cabecera-final{margin:22px 0 0;font-size:.85rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--texto2)}
.cabecera-final + .agenda{margin-top:6px}
.icono svg{display:block}
.umbral{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:14px 0 4px;padding:10px 14px;border-radius:10px;background:var(--bg);border:1px solid var(--borde);font-weight:600}
.umbral + .ayuda{margin-top:0}
.pastilla{display:inline-flex;align-items:center;padding:1px 10px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}
.antetitulo{margin:0 0 6px}
.pregunta{margin:22px 0 0;padding:0 0 20px;border:0;border-bottom:1px solid var(--borde);min-width:0}
.pregunta legend{padding:0;margin:0 0 4px;font-weight:700;font-size:1.02rem;line-height:1.4}
.pregunta legend .n{color:var(--texto2);font-weight:600;font-size:.88rem;display:block}
.pregunta .tipo{margin:0 0 10px;color:var(--texto2);font-size:.88rem}
.opcion{display:flex;align-items:center;gap:12px;min-height:48px;margin:0 0 8px;padding:10px 14px;border:1px solid var(--campo);border-radius:10px;background:var(--surface);font-weight:400;cursor:pointer}
.opcion:hover{border-color:var(--texto2)}
.opcion input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--acento)}
.opcion:has(input:checked){background:var(--sel);border-color:var(--acento);box-shadow:inset 0 0 0 1px var(--acento);font-weight:600}
.opcion:has(input:focus-visible){outline:3px solid var(--foco);outline-offset:2px}
.pie-envio{margin:26px 0 0}
.pie-envio .ayuda{margin-top:10px}
.contador{margin:0;padding:8px 10px;border-radius:8px;background:var(--bg);border:1px solid var(--borde);font-size:.92rem}
.contador.faltan{background:var(--aviso-fondo);color:var(--aviso);border-color:currentColor;font-weight:600}
.resultado .cifras{margin:0 0 6px;font-size:1.1rem}
.resultado .cifras b{font-size:1.5rem}
.ok-caja{margin:16px 0 0;padding:12px 14px;border-radius:10px;background:var(--ok-fondo);border:1px solid var(--acento);font-weight:600}
.no-caja{margin:16px 0 0;padding:12px 14px;border-radius:10px;background:var(--aviso-fondo);color:var(--aviso);border:1px solid currentColor}
.no-caja p{margin:0}.no-caja p+p{margin-top:6px}
@media (min-width:600px){.acciones.fila2{grid-template-columns:1fr 1fr}}
.ya{margin:14px 0 0;padding:10px 14px;border-radius:10px;border:1px solid var(--acento);background:var(--ok-fondo);font-weight:600;display:flex;gap:8px;align-items:center}
.icono.ok{background:var(--acento);color:var(--sobre-acento)}
.icono.reintento{background:var(--aviso-fondo);color:var(--aviso);font-size:1.5rem}
.contador a{color:inherit;font-weight:800;padding:2px 4px;display:inline-block;min-width:24px;min-height:24px;text-align:center}
#r-intentos{margin-top:12px}
/* F4 acotada · seguimiento del tutor (T2 y T3): tablas en su caja (a 320 px se desplazan dentro, no la página) */
.ancho.amplio{max-width:1040px}
.principal.ancha{grid-template-columns:minmax(0,1040px)} /* la columna no crece con la tabla: la tabla se desplaza en su caja */
.quien{color:var(--texto2);font-size:.88rem;max-width:22ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:560px){.quien{display:none}}
.filtros{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:flex-end;margin:16px 0 12px}
.filtros label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.9rem;flex:1 1 200px;min-width:0}
.filtros input,.filtros select{font:inherit;font-weight:400;font-size:1rem;min-height:44px;padding:8px 10px;color:var(--texto);background:var(--surface);border:1px solid var(--campo);border-radius:8px;width:100%;min-width:0}
.tabla-caja{margin:12px 0 0;overflow-x:auto;border:1px solid var(--borde);border-radius:10px}
.tabla{border-collapse:collapse;width:100%;font-size:.92rem}
.tabla th,.tabla td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--borde)}
.tabla thead th{background:var(--bg);color:var(--texto2);font-size:.82rem;font-weight:700;white-space:nowrap}
.tabla tbody tr:last-child>*{border-bottom:0}
.tabla tbody th{font-weight:600}
.tabla tbody th a{display:inline-block;padding:2px 0;min-height:24px}
.tabla .num{white-space:nowrap}
.tabla .sub,.cifras-tutor .sub{display:block;color:var(--texto2);font-size:.82rem;font-weight:400}
.mini-barra{display:flex;align-items:center;gap:8px}
.mini-barra progress{width:72px;height:8px;appearance:none;-webkit-appearance:none;border:0;border-radius:999px;background:var(--borde);overflow:hidden}
.mini-barra progress::-webkit-progress-bar{background:var(--borde);border-radius:999px}
.mini-barra progress::-webkit-progress-value{background:var(--acento);border-radius:999px}
.mini-barra progress::-moz-progress-bar{background:var(--acento);border-radius:999px}
.bloque-curso{margin:26px 0 0;padding:22px 0 0;border-top:1px solid var(--borde)}
.bloque-curso h2{margin:0 0 10px;font-size:1.2rem}
.bloque-curso h3{margin:22px 0 4px;font-size:1rem}
.cifras-tutor{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.cifras-tutor li{padding:10px 12px;border:1px solid var(--borde);border-radius:10px;background:var(--bg)}
/* ===== Aspecto de /cursos (propuesta v1 de Diseño LMS, 2026-11-06). Va al final: pisa lo anterior. ===== */
h1,h2,h3{font-family:var(--f-display)}
h1{font-size:clamp(1.6rem,4vw,2.2rem);font-weight:720;line-height:1.12;letter-spacing:-.025em}
.cab{position:sticky;top:0;z-index:5;background:var(--bg)}
.cab-in{max-width:1200px;padding:10px 16px;gap:12px}
.marca{min-height:44px;font-family:var(--f-display);font-weight:720;letter-spacing:-.01em;color:var(--texto)}
.marca-logo{width:44px;height:44px;border-radius:12px;background:#FFF}
.marca-texto b{font-weight:inherit}
.tarjeta{padding:24px}
.boton{min-height:52px;padding:0 24px;font-weight:650;border-width:1.5px;border-radius:999px}
.boton.secundario{background:transparent;border-color:var(--campo);color:var(--texto)}
.boton.secundario:hover:not([aria-disabled=true]){background:var(--borde);color:var(--texto)}
input[type=email],.filtros input,.filtros select{border-radius:12px;border-width:1.5px}
:focus-visible{outline-offset:3px}
.lista-cursos{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:20px}
.lista-cursos .curso{padding:20px;border-top:4px solid var(--acento)}
.curso h2{font-weight:700}
.barra progress{height:8px}
.video video{border-radius:16px}
.pie{padding:24px 16px;background:#070A1A;color:#CBD5E1;font-size:.9rem}
@media (max-width:480px){.tarjeta{padding:20px 16px}.principal{padding:24px 16px 40px}.marca{font-size:.95rem}.marca-logo{width:40px;height:40px}}
/* Entrada: la banda oscura de marca de /cursos, con sus tokens propios en cualquier tema */
body.entrada{position:relative;isolation:isolate;background:#070A1A;color:#F8FAFC;
  --bg:#070A1A;--surface:#121730;--texto:#F8FAFC;--texto2:#CBD5E1;--borde:rgba(255,255,255,.2);--campo:rgba(255,255,255,.6);
  --acento:#FFFFFF;--acento-hover:#E2E8F0;--acento-texto:#5EEAD4;--sobre-acento:#0B1020;
  --foco:#FDE68A;--error:#FDA4AF;--error-fondo:#3A1512;--aviso:#FDBA74;--aviso-fondo:#3B2410;--sombra:0 12px 32px -16px rgba(0,0,0,.7)}
body.entrada::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(42% 55% at 8% 8%,rgba(37,99,235,.55),transparent 62%),
             radial-gradient(38% 50% at 92% 4%,rgba(219,39,119,.42),transparent 62%),
             radial-gradient(34% 46% at 58% 38%,rgba(124,58,237,.45),transparent 62%),
             radial-gradient(42% 55% at 80% 78%,rgba(249,115,22,.30),transparent 62%),
             radial-gradient(40% 50% at 18% 92%,rgba(20,184,166,.32),transparent 62%)}
body.entrada .cab{position:static;background:transparent;border-bottom:0}
body.entrada .tarjeta{border-radius:24px}
body.entrada .idioma{background:transparent}
body.entrada .pie{background:transparent}
.logo-entrada{display:block;width:200px;height:200px;margin:0 auto 20px;padding:10px;border-radius:18px;background:#FFF}
@media (max-height:700px),(max-width:360px){.logo-entrada{width:140px;height:140px}}
/* Revisión de Diseño LMS: Mis cursos alineado con la cabecera, «Salir» como botón secundario, siguiente actividad y 404 */
.principal.rejilla{padding-inline:0;grid-template-columns:minmax(0,1200px);justify-content:center}
.ancho.rejilla{max-width:none;padding:0 16px}
.ancho.rejilla>.tarjeta{max-width:560px}
.cab-acciones .enlace{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1.5px solid var(--campo);border-radius:999px;color:var(--texto);font-weight:600;text-decoration:none}
.cab-acciones .enlace:hover{background:var(--borde);color:var(--texto)}
@media (max-width:480px){.cab-acciones .enlace{padding:0 12px}}
#s-curso .siguiente{color:var(--texto);font-weight:600}
.cifra{margin:0 0 4px;font-family:var(--f-display);font-size:3.5rem;font-weight:720;line-height:1;letter-spacing:-.03em;color:var(--acento-texto)}
/* Selector de tema (propuesta de Diseño, 4.6). Mismo aspecto que el botón de idioma. */
:root[data-tema=light]{color-scheme:light}
:root[data-tema=dark]{color-scheme:dark}
.boton-tema{display:inline-grid;place-items:center;width:44px;padding:0}
.boton-tema[hidden]{display:none}
.boton-tema .tema-sol,.boton-tema[aria-pressed=true] .tema-luna{display:none}
.boton-tema[aria-pressed=true] .tema-sol{display:block}
.cab-in{flex-wrap:wrap;row-gap:8px}
.cab-acciones{margin-left:auto}
@media (max-width:400px){.cab{position:static}.cab-acciones{order:3;width:100%;justify-content:flex-end}}
/* ===== F4/F6 · T1 «Grupos», T6 «Grupo» y A7 «Mi diploma» (revisión de Diseño: semáforo con icono + texto + días,
   ámbar con --aviso/--aviso-fondo, rojo con --error/--error-fondo; nunca solo color) ===== */
.lista-grupos{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}
.grupo-tarjeta{max-width:none;padding:20px;border-top:4px solid var(--acento)}
.grupo-tarjeta.estado-cerrado{border-top-color:var(--campo)}
.grupo-cab{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 12px}
.grupo-cab h2{margin:0;font-size:1.2rem;line-height:1.3;min-width:0;overflow-wrap:anywhere}
.grupo-cab h2 a{display:inline-block;padding:4px 0;min-height:24px}
.grupo-curso{margin:4px 0 0;color:var(--texto2)}
.cifras-tutor b{overflow-wrap:anywhere}
.pastilla.estado-abierto{border:1px solid var(--acento-texto);color:var(--acento-texto)}
.pastilla.estado-cerrado{border:1px solid var(--campo);color:var(--texto2)}
.semaforos{display:grid;gap:8px;margin:14px 0 0}
.semaforo{display:flex;gap:10px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:10px;border:1px solid currentColor;font-size:.95rem}
.semaforo svg{flex:none;margin-top:2px}
/* Ámbar propio del semáforo (Diseño): más amarillo que --aviso, para que no se confunda con el rojo */
:root{--semaforo-ambar:#92400E;--semaforo-ambar-fondo:#FEF3C7}
@media (prefers-color-scheme:dark){:root[data-tema=auto]{--semaforo-ambar:#FCD34D;--semaforo-ambar-fondo:#3B2A08}}
:root[data-tema=dark]{--semaforo-ambar:#FCD34D;--semaforo-ambar-fondo:#3B2A08}
.semaforo.ambar{background:var(--semaforo-ambar-fondo);color:var(--semaforo-ambar)}
.semaforo.rojo{background:var(--error-fondo);color:var(--error);border-width:2px}
.semaforo.ok{background:var(--ok-fondo);color:var(--texto);border-color:var(--acento)}
.semaforo.ok svg{color:var(--acento-texto)}
.acciones-grupo{display:grid;gap:10px;margin:18px 0 0}
@media (min-width:600px){.acciones-grupo .boton{width:auto}}
#s-grupo h2{font-size:1.15rem;margin:26px 0 8px}
.comprobaciones{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.comprobaciones li{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:8px;border:1px solid var(--borde)}
.comprobaciones .marca-comprobacion{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-weight:800;font-size:.85rem}
.comprobaciones .ok .marca-comprobacion{background:var(--acento);color:var(--sobre-acento)}
.comprobaciones .no{background:var(--aviso-fondo);color:var(--aviso);border-color:currentColor}
.comprobaciones .no .marca-comprobacion{border:2px solid currentColor}
.comprobaciones .nota{color:var(--texto2);border-style:dashed}
.cerrar{display:grid;gap:8px;margin:18px 0 0}
@media (min-width:600px){.cerrar{grid-template-columns:auto 1fr;align-items:center}.cerrar .boton{width:auto}}
.motivo{margin:0;font-weight:600}
.motivo.no{color:var(--aviso)}
.motivo.ok{color:var(--acento-texto)}
.resultado-diploma{font-weight:700;color:var(--acento-texto)}
.resultado-certificado{font-weight:600}
.resultado-ninguno{color:var(--texto2)}
.tabla a.sub{display:inline-block;padding:4px 0;min-height:24px;color:var(--acento-texto);font-size:.85rem}
.dialogo{width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:24px;border:1px solid var(--borde);border-radius:var(--radio);background:var(--surface);color:var(--texto);box-shadow:var(--sombra)}
.dialogo::backdrop{background:rgba(7,10,18,.55)}
.dialogo h2{margin:0 0 10px;font-size:1.25rem}
.dialogo textarea{width:100%;font:inherit;font-size:1rem;padding:10px 12px;color:var(--texto);background:var(--surface);border:1.5px solid var(--campo);border-radius:12px;resize:vertical}
.dialogo textarea[aria-invalid=true]{border:2px solid var(--error)}
/* A7: el diploma y el certificado se distinguen sin color (título, borde lleno o discontinuo, texto) */
.documento{margin:22px 0 0;padding:16px 18px;border-radius:12px;border:1px solid var(--borde);background:var(--bg)}
.documento h2{margin:0 0 4px;font-size:1.1rem}
.documento.doc-diploma{border:2px solid var(--acento);background:var(--ok-fondo)}
.documento.doc-certificado{border:2px dashed var(--campo)}
.documento .boton{margin-top:12px}
@media (min-width:600px){.documento .boton{width:auto}}
@media (forced-colors:active){.semaforo,.comprobaciones li,.documento{border:2px solid CanvasText}.documento.doc-certificado{border-style:dashed}}
/* C1–C5 · informes del perfil de control (docs/c1-c5-control.md) */
.informes-nav{display:flex;flex-wrap:wrap;gap:0 20px}
.informes-nav a[aria-current=page]{font-weight:800;color:var(--texto);text-decoration:none}
.opciones-informe{border:1px solid var(--borde);border-radius:10px;margin:0 0 14px;padding:8px 14px 10px;min-width:0}
.opciones-informe legend{padding:0 4px;font-weight:700;font-size:.95rem}
.opciones-informe label{display:flex;gap:10px;align-items:center;min-height:44px;font-weight:400;margin:0}
.opciones-informe input{width:20px;height:20px;margin:0;flex:none;accent-color:var(--acento)}
.filtros input[type=date]{min-height:44px}
.exportar .acciones{margin-top:4px}
.grupo-informes{display:flex;flex-wrap:wrap;gap:0 18px;margin:10px 0 0;font-size:.92rem}
.grupo-informes a{display:inline-block;padding:10px 0;min-height:44px}

/* ===== H47 · barra superior fija por rol y tabla de alumnos (propuesta de Diseño LMS, 2026-11-08) ===== */
.banda-control{position:sticky;top:0;z-index:7}
body:has(.banda-control:not([hidden])) .cab{top:var(--alto-banda,40px)}
.cab{scroll-margin-top:80px}
.principal,.principal [id]{scroll-margin-top:96px}
.menu-sup{flex:1 1 auto;display:flex;align-items:center;min-width:0}
.menu-lista{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.menu-lista a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;color:var(--texto);font-weight:600;text-decoration:none;border-bottom:4px solid transparent}
.menu-lista a:hover{background:var(--borde)}
.menu-lista a[aria-current=page]{background:var(--sel);border-bottom-color:var(--acento)}
.menu-boton{display:none;min-height:44px;padding:0 16px;border:1.5px solid var(--campo);border-radius:999px;background:transparent;color:var(--texto);font:inherit;font-weight:600;cursor:pointer}
@media (max-width:860px){
  .menu-sup{position:static;flex:0 0 auto}
  .menu-boton{display:inline-flex;align-items:center}
  .menu-lista{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--bg);border-bottom:1px solid var(--borde);box-shadow:var(--sombra)}
  .menu-sup.abierto .menu-lista{display:flex}
  .menu-lista a{min-height:48px;padding:0 20px;border-bottom:0;border-left:5px solid transparent}
  .menu-lista a[aria-current=page]{border-left-color:var(--acento)}
  .cab-in{position:relative}
}
@media (forced-colors:active){.menu-lista a[aria-current=page]{border-color:Highlight}}
/* H55 · «Mi cuenta»: junto a «Salir» en escritorio; con el menú plegado (≤ 860 px), dentro del menú (no cabe a 320 px) */
.menu-lista .menu-cuenta{display:none}
@media (max-width:860px){.menu-lista .menu-cuenta{display:block}.cab-in:has(.menu-sup) #mi-cuenta{display:none}}
/* Tabla de alumnos */
.sub.licencia-ok::before{content:"✓ "}
.estado-lic{display:inline-block;margin-top:2px;padding:1px 8px;border-radius:999px;border:1.5px solid currentColor;font-size:.84rem;font-weight:650}
.estado-lic.pronto{color:var(--aviso);background:var(--aviso-fondo)}
.estado-lic.caducada{color:var(--error);background:var(--error-fondo);border-width:2px}
.estado-lic.vigente{color:var(--texto)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px;padding:0;list-style:none}
.chips button{min-height:36px;padding:0 12px;border:1.5px solid var(--campo);border-radius:999px;background:var(--surface);color:var(--texto);font:inherit;font-size:.9rem;cursor:pointer}
.paginacion{display:flex;gap:12px;align-items:center;justify-content:center;margin:14px 0 0}
.exportar-caja{margin:8px 0 0}
@media (max-width:760px){
  .tabla-caja table,.tabla-caja tbody,.tabla-caja tr,.tabla-caja th,.tabla-caja td{display:block}
  .tabla-caja thead{position:absolute;left:-9999px}
  .tabla-caja tr{margin:0 0 12px;padding:12px;border:1px solid var(--borde);border-radius:12px;background:var(--surface)}
  .tabla-caja td[data-et]::before{content:attr(data-et) ": ";font-weight:650;color:var(--texto2)}
}
/* H47: la tabla de alumnos lleva más columnas: más ancho en pantallas grandes y el curso no se parte palabra a palabra */
@media (min-width:1100px){.principal.ancha{grid-template-columns:minmax(0,1280px)}.ancho.amplio{max-width:1280px}}
.tabla td[data-et="Curso"]{min-width:10rem}
.tabla td[data-et="Licencia"]{min-width:13rem}

/* H47 · revisión de Diseño LMS (2026-11-08): tabla que cabe, tarjetas que no desbordan, filtros plegables, cabecera en una fila */
.tabla th,.tabla td{padding:10px}
.tabla td .sub,.tabla td .fuerte,.tabla th .sub{display:block}
.tabla td .fuerte{font-weight:650}
.estado-lic{display:block;width:fit-content;margin-top:4px}
.filtros{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.filtros label{flex:none}
.filtros-extra{display:contents}
#filtros-boton{display:none}
.barra-contador{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;margin:0 0 8px}
.barra-contador .contador{margin:0}
.exportar-caja{display:flex;flex-direction:column;align-items:flex-end;gap:2px;margin:0}
.exportar-caja .boton{min-height:44px;padding:0 18px;width:auto}
.exportar-caja .ayuda{margin:0;font-size:.82rem}
.cab-in:has(.menu-sup){flex-wrap:nowrap}
body:has(.banda-control:not([hidden])){--alto-banda:30px}
.banda-control{padding:4px 16px;font-size:.9rem}
@media (max-width:760px){
  .filtros{display:flex;flex-direction:column;align-items:stretch}
  .f-buscar{order:0}.f-orden{order:1}#filtros-boton{order:2;display:inline-flex}.filtros-extra{order:3}
  .filtros-extra{display:none;flex-direction:column;gap:12px}
  .filtros-extra.abierto{display:flex}
  .tabla-caja td{display:flex;flex-wrap:wrap;gap:2px 8px;min-width:0;overflow-wrap:anywhere}
  .tabla-caja td[data-et]::before{flex:0 0 auto}
  .tabla-caja td>*{min-width:0}
  .tabla-caja td.num{white-space:normal} /* H54: en tarjeta, «2 nov 2026, 10:06 (última señal…)» tiene que partirse (Ficha del alumno desbordaba 396 px a 390) */
  .tabla-caja td .sub,.tabla-caja td .estado-lic,.tabla-caja td .fuerte{flex-basis:100%}
  .exportar-caja{align-items:stretch;width:100%}
  .tabla td[data-et="Curso y grupo"],.tabla td[data-et="Licencia"]{min-width:0}
}
@media (max-width:860px){
  .cab-in:has(.menu-sup) .marca-texto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cab-in:has(.menu-sup){gap:8px}
}
.tabla td[data-et="Curso y grupo"]{min-width:11rem}
.tabla td[data-et="Licencia"]{min-width:9rem}

/* H47 · segunda revisión de Diseño LMS */
.barra-derecha{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:flex-end;margin-left:auto}
.barra-derecha .f-orden{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.9rem;min-width:15rem}
@media (max-width:760px){
  .barra-derecha{margin-left:0;width:100%;flex-direction:column;align-items:stretch}
  .tabla-caja td .estado-lic{flex:0 0 auto;display:inline-flex;width:auto}
  .tabla-caja{border:0;background:none;overflow:visible}
  .tabla-caja tr>*:last-child{border-bottom:0}
}
.estado-lic{display:inline-flex}
.barra-derecha select{min-height:44px;padding:0 12px;border:1.5px solid var(--campo);border-radius:12px;background:var(--surface);color:var(--texto);font:inherit}

/* H53 · pantalla del gestor de empresa (propuesta de Diseño LMS, 2026-11-08) */
.pastilla-empresa{display:inline-block;margin:0 0 6px;padding:2px 12px;border:1.5px solid var(--campo);border-radius:999px;font-weight:650;font-size:.92rem}
.cifra-grande{margin:8px 0 6px;font-family:var(--f-display);font-size:clamp(2rem,6vw,3rem);font-weight:760;line-height:1}
.cifra-grande .cifra-texto{font-size:1rem;font-weight:600;color:var(--texto2)}
.barra-plazas{height:14px;border-radius:999px;background:var(--borde);overflow:hidden;margin:0 0 16px}
.barra-plazas span{display:block;height:100%;background:var(--acento);border-radius:999px}
.barra-plazas.pocas span{background:var(--aviso)}
.pestanas{display:flex;gap:8px;margin:12px 0}
.pestanas [aria-selected=true]{background:var(--sel);border-color:var(--acento)}
#v-anadir textarea{width:100%;min-height:8rem;padding:10px 12px;border:1.5px solid var(--campo);border-radius:12px;background:var(--surface);color:var(--texto);font:inherit}
.fila-error td{background:var(--aviso-fondo)}
.ok-caja.error{background:var(--error-fondo);color:var(--error);border-color:var(--error)}
#avisos .nota-bloqueo,#avisos .error{margin:0 0 12px}
.boton[aria-disabled=true]{opacity:.55;pointer-events:none}

/* H53 · segunda revisión de Diseño LMS (gestor) */
.aviso-caja{display:grid;grid-template-columns:auto 1fr;column-gap:12px;margin:0 0 12px;padding:12px 14px;border-radius:12px;border:1.5px solid currentColor}
.aviso-caja .aviso-ico{grid-row:1 / span 2;display:grid;place-items:center;width:28px;height:28px;border-radius:999px;border:2px solid currentColor;font-weight:800}
.aviso-caja p{margin:0}.aviso-titulo{font-weight:700}.aviso-detalle{font-size:.92rem}
.aviso-caja.amb{background:var(--aviso-fondo);color:var(--aviso)}
.aviso-caja.rojo{background:var(--error-fondo);color:var(--error);border-width:2px}
.aviso-caja.neutro{background:var(--surface);color:var(--texto);border-style:dashed}
.barra-plazas.pocas span{background:var(--amb,#B45309)}
.barra-plazas.tope span{background:var(--texto2)}
.leyenda-plazas{margin:-8px 0 14px;font-size:.92rem;color:var(--texto2)}
.pastilla-estado{display:inline-flex;align-items:center;padding:2px 10px;border-radius:999px;border:1.5px solid currentColor;font-size:.86rem;font-weight:650;white-space:nowrap}
.pastilla-estado.finalizado,.pastilla-estado.res-ok{background:var(--ok-fondo)}
.pastilla-estado.sin-entrar{border-style:dashed;color:var(--texto2)}
.pastilla-estado.res-amb{background:var(--aviso-fondo);color:var(--aviso)}
.pastilla-estado.res-rojo{background:var(--error-fondo);color:var(--error);border-width:2px}
.fila-aviso td{background:transparent}
#v-plazas .acciones .boton,#v-anadir .boton,#v-exportar .boton{width:auto;min-width:0;padding:0 22px}
.boton[aria-disabled=true],.boton:disabled{background:var(--borde);color:var(--texto2);border-color:var(--borde);opacity:1}
.boton-texto{min-height:36px;padding:0 8px;border:0;background:none;color:var(--texto2);font:inherit;font-size:.92rem;text-decoration:underline;cursor:pointer}
.boton-texto:hover:not(:disabled){color:var(--error)}
.acciones-fila{white-space:normal}
@media (max-width:760px){.tabla-caja td.acciones-fila::before{content:none}}

/* H53 · botones de acción de la pantalla del gestor: ancho automático, no a media pantalla */
#v-plazas .acciones,#v-anadir .acciones,#v-exportar .acciones{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center}
#v-plazas .acciones .boton,#v-anadir .acciones .boton,#v-exportar .acciones .boton{width:auto;grid-column:auto;padding:0 24px}

/* Revisión final (360 px): el selector «Ordenar por» no puede ensanchar la página (la opción más larga lo hacía) */
.barra-derecha .f-orden{min-width:0;max-width:100%}
.barra-derecha select{max-width:100%;min-width:0}
@media (max-width:760px){.barra-derecha .f-orden{width:100%}.barra-derecha select{width:100%}}

/* Revisión final de Diseño LMS (2026-11-08) */
/* 2) menú móvil: el foco y el fondo del enlace ocupan el ancho completo y no se recortan en el borde */
@media (max-width:860px){
  .menu-lista{padding:8px 12px 12px}
  .menu-lista a{display:flex;width:100%;box-sizing:border-box;outline-offset:-3px;border-radius:8px}
}
/* 3) revisión de lista: la línea con error tiñe la tarjeta entera (y la fila en escritorio) */
.fila-error td,.fila-aviso td{background:transparent}
tr.fila-error{background:var(--error-fondo)}
tr.fila-aviso{background:var(--aviso-fondo)}
.tabla-caja tr.fila-error{background:var(--error-fondo)}
.tabla-caja tr.fila-aviso{background:var(--aviso-fondo)}
/* e) «Ordenar por» con ancho fijo en escritorio */
@media (min-width:761px){.barra-derecha .f-orden{width:220px;min-width:0}}
/* H54: el estado «cargando» lleva h1 desde el primer pintado (se ve igual que el párrafo de antes) */
h1.lema-cargando{font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;font-family:inherit}

/* H55 · app de Android (Diseño LMS, 2026-11-08): recortes, altura real, apaisado, tablet y toque */
html{background:var(--bg);overscroll-behavior-y:contain}
body{min-height:100vh;min-height:100dvh;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);-webkit-tap-highlight-color:transparent}
.cab{padding-top:env(safe-area-inset-top)}
.pie{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
.cab{scroll-margin-top:calc(80px + env(safe-area-inset-top))}
a,button,select,summary,[role=button]{touch-action:manipulation}
a:active,button:active{opacity:.85}
input,select,textarea,button{scroll-margin-block:80px}
.video video{max-height:calc(100dvh - 56px);object-fit:contain}
.video video:fullscreen{max-height:none;border-radius:0;background:#000}
@media (max-height:500px){
  .cab{position:static}
  .principal,.principal [id]{scroll-margin-top:16px}
  body.entrada .principal{padding-block:12px}
  .botonera,.acciones{gap:8px}
}
/* Tablet vertical (761–900 px): la tabla de alumnos pasa a tarjetas como en el móvil (nueve columnas no caben) */
@media (min-width:761px) and (max-width:900px){
  .tabla-caja table,.tabla-caja tbody,.tabla-caja tr,.tabla-caja th,.tabla-caja td{display:block}
  .tabla-caja thead{position:absolute;left:-9999px}
  .tabla-caja tr{margin:0 0 12px;padding:12px;border:1px solid var(--borde);border-radius:12px;background:var(--surface)}
  .tabla-caja td[data-et]::before{content:attr(data-et) ": ";font-weight:650;color:var(--texto2);flex:0 0 auto}
  .tabla-caja td{display:flex;flex-wrap:wrap;gap:2px 8px;min-width:0;overflow-wrap:anywhere}
  .tabla-caja td>*{min-width:0}
  .tabla-caja td.num{white-space:normal}
  .tabla-caja td .sub,.tabla-caja td .estado-lic,.tabla-caja td .fuerte{flex-basis:100%}
  .tabla td[data-et="Curso y grupo"],.tabla td[data-et="Licencia"]{min-width:0}
}