/* El taller de cursos: el alta y el tablero de tres columnas, con su propio
   tema (sus variables, su degradado, sus radios y sus clases nb-*, mnc-*,
   cc-* y ulx-*). Todo va acotado a `.taller`: el resto del panel no cambia.
   Sin estilos en línea: los anchos de las columnas los pone el script por
   CSSOM y los colores de cada aula van por clase. */

.taller {
  --primario-color: var(--texto);
  --secundario-color: var(--cian);
  --terciario-color: var(--azul-tinta);
  --quinario-color: var(--cian-suave);
  --ulx-grad: var(--marca-firme);
  --ulx-grad-v: var(--marca-firme-vertical);
  --aula: var(--terciario-color);
  --aula-fondo: var(--cian-suave);
  /* El taller es claro siempre, como Learnia, aunque el sistema esté en
     oscuro: su paleta clara se declara en estilos.css (`:root, .taller`), y
     los controles nativos (la lista de un selector, el botón de un archivo,
     las barras) se piden claros. Así las reglas generales del panel que
     alcanzan a lo de adentro (input, label, button) no traen la paleta oscura
     a una pantalla blanca. */
  color-scheme: light;
  position: fixed; inset: 0; z-index: 60; overflow: auto;
  background: var(--superficie); color: var(--texto);
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 16px; line-height: 1.45;
}
.taller[hidden] { display: none; }
body.taller-abierto { overflow: hidden; }
.taller *, .taller *::before, .taller *::after { box-sizing: border-box; }
.taller button, .taller input, .taller select, .taller textarea { font-family: inherit; }
/* Todo campo del taller es blanco con letra oscura; el que lleva otro fondo
   (el título de un módulo a mano, el destello) lo dice en su regla, que es más
   específica. */
.taller input, .taller select, .taller textarea { background: var(--superficie); color: var(--texto); }
.taller h3, .taller h5, .taller h6, .taller p { margin: 0; }
/* Lo que recibe el foco sin ser un control (la caja de un diálogo, una zona
   cuyo control enfocado ya no existe) no dibuja contorno: no se pulsa. */
.taller [tabindex="-1"]:focus { outline: none; }

/* Los colores de las cuatro aulas */
.taller .aula-onboarding { --aula: var(--cian-tinta); --aula-fondo: var(--cian-suave); }
.taller .aula-explora { --aula: var(--azul-tinta); --aula-fondo: var(--azul-suave); }
.taller .aula-interactua { --aula: var(--acento); --aula-fondo: var(--acento-suave); }
.taller .aula-transforma { --aula: var(--alerta); --aula-fondo: var(--alerta-suave); }
.taller .sin-aula { --aula: var(--terciario-color); --aula-fondo: var(--cian-suave); }

/* ══ Insignias, tarjeta, botones ══ */
.taller .ulx-ia-badge, .taller .ulx-ia-badge-solid {
  font-size: 0.68rem; font-weight: 700; padding: 2px 9px; border-radius: 20px; letter-spacing: 0.4px;
  text-transform: uppercase; display: inline-flex; align-items: center; gap: 4px;
}
.taller .ulx-ia-badge-solid { background: var(--acento); color: var(--sobre-acento); }
.taller .ulx-ia-badge { background: linear-gradient(var(--superficie),var(--superficie)) padding-box, var(--ulx-grad) border-box; border: 1.5px solid transparent; color: var(--cian-tinta); }
.taller .ulx-ia-badge.borrador { color: var(--alerta); }
.taller .ulx-ia-badge.revision { color: var(--acento); }
.taller .ulx-ia-badge.aprobado { color: var(--azul-tinta); }
.taller .ulx-ia-badge.publicado { color: var(--cian-tinta); }

.taller .ulx-ia-panel {
  background-color: var(--cian-suave); border-left: 4px solid transparent; border-image: var(--ulx-grad-v) 1;
  border-radius: 0 8px 8px 0; padding: 14px 18px;
}
.taller .ulx-ia-card {
  border: 1px solid var(--borde); border-radius: 12px; background: var(--superficie); box-shadow: 0 2px 10px var(--sombra);
  transition: box-shadow 0.2s, transform 0.2s; overflow: hidden; margin-bottom: 16px;
}
.taller .ulx-ia-card::before { content: ''; display: block; height: 3px; background: var(--ulx-grad); flex-shrink: 0; }
.taller .ulx-ia-card:hover { box-shadow: 0 6px 22px var(--sombra); }
.taller .ulx-ia-card .card-header-ia {
  background: var(--ulx-grad); color: var(--sobre-acento); padding: 10px 16px; font-size: 0.78rem; font-weight: 700;
  display: flex; align-items: center; gap: 6px;
}
.taller .ulx-ia-card .card-header-ia .del-curso { font-weight: 400; font-size: 0.9rem; }
.taller .ulx-ia-card .card-header-ia .revisa { margin-left: auto; background: var(--cristal); color: var(--sobre-acento); font-size: 0.7rem; padding: 2px 9px; border-radius: 20px; }
.taller .ulx-ia-card .card-body-ia { padding: 16px; }

.taller .btn-ulx-primary, .taller .btn-ulx-send {
  background: var(--ulx-grad); color: var(--sobre-acento); border: none; border-radius: 8px; padding: 8px 20px; font-size: 0.84rem; font-weight: 600;
  cursor: pointer; transition: filter 0.2s, transform 0.15s, box-shadow 0.2s; display: inline-flex; align-items: center; gap: 6px;
  box-shadow: 0 2px 8px var(--sombra); text-decoration: none;
}
.taller .btn-ulx-primary:hover, .taller .btn-ulx-send:hover { filter: brightness(1.06); }
.taller .btn-ulx-primary:disabled, .taller .btn-ulx-send:disabled { filter: grayscale(.5); cursor: progress; }
.taller .btn-ulx-primary.crear { padding: 8px 22px; font-weight: 800; }
.taller .btn-ulx-primary.crear:hover { background: var(--texto); filter: none; }
.taller .btn-ulx-primary.ancho { width: 100%; justify-content: center; font-size: .82rem; }
.taller .btn-ulx-primary.chico, .taller .btn-ulx-outline.chico { font-size: .74rem; padding: 5px 13px; }
.taller .btn-ulx-outline {
  background: linear-gradient(var(--superficie),var(--superficie)) padding-box, var(--ulx-grad) border-box; border: 2px solid transparent; color: var(--azul-tinta);
  border-radius: 8px; padding: 7px 16px; font-size: 0.84rem; font-weight: 600; cursor: pointer; transition: all 0.2s;
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
}
.taller .btn-ulx-outline:hover { background: var(--ulx-grad); color: var(--sobre-acento); }
.taller .btn-ulx-outline:disabled { opacity: .55; cursor: not-allowed; }
.taller .enlace-volver { background: none; border: none; padding: 0; cursor: pointer; color: var(--terciario-color); font-weight: 600; }

/* ══ Gestionar Cursos (dentro de Administración) ══ */
.gestionar-cursos .lista-de-cursos { list-style: none; padding: 0; margin: 12px 0; display: flex; flex-direction: column; gap: 8px; }
.gestionar-cursos .lista-de-cursos li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; padding: 10px 12px; border: 1px solid var(--borde); border-radius: 10px; }
.gestionar-cursos .lista-de-cursos strong { flex: 1; min-width: 180px; overflow-wrap: anywhere; }

/* ══ Alta de nuevo curso ══ */
.taller .alta { padding: 20px 24px 40px; max-width: 1400px; margin: 0 auto; }
.taller .alta-encabezado { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.taller .alta-encabezado .titulos { flex: 1; }
.taller .alta-encabezado .enlace-volver { font-size: 0.8rem; }
.taller .alta-encabezado h3 { margin: 5px 0 2px; font-size: 1.4rem; font-weight: 700; color: var(--primario-color); }
.taller .alta-encabezado p { font-size: 0.82rem; color: var(--tenue); }
.taller .alta-columnas { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
@media (max-width: 768px) { .taller .alta-columnas { grid-template-columns: 1fr; } .taller .ulx-chat-container { height: 360px; } }

.taller .campo-alta { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.taller .campo-alta > .rotulo { font-size: 0.82rem; font-weight: 600; color: var(--texto); }
.taller .campo-alta > .rotulo .obligatorio { color: var(--peligro); }
.taller .campo-alta small { font-size: 0.73rem; color: var(--tenue); }
.taller .campo-alta .contador { margin-top: 0; font-size: 0.73rem; }
.taller .form-control {
  width: 100%; border: 1px solid var(--borde-control); border-radius: 6px; padding: 7px 10px; font-size: 0.85rem; color: var(--texto); background: var(--superficie); outline: none;
  transition: background-color .9s;
}
.taller .form-control:focus { border-color: var(--secundario-color); }
.taller textarea.form-control { resize: vertical; }
.taller textarea.form-control.descripcion { min-height: 92px; }
/* El destello de un campo que Pepe acaba de llenar. */
.taller .form-control.destello { background: var(--cian-suave); transition: none; }
.taller .campo-invalido { border-color: var(--peligro) !important; }
.taller .errores-del-alta { list-style: none; margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--peligro); background: var(--peligro-suave); border-radius: 7px; color: var(--peligro); font-size: .8rem; }
.taller .errores-del-alta:empty { display: none; }

.taller .perfiles-elegidos { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 7px; }
.taller .perfiles-elegidos:empty { display: none; }
.taller .chip-perfil {
  display: inline-flex; align-items: center; gap: 5px; background: var(--cian-suave); border: 1px solid var(--secundario-color); border-radius: 20px;
  padding: 4px 10px; font-size: .75rem; color: var(--primario-color); font-weight: 600;
}
.taller .chip-perfil button { background: none; border: none; cursor: pointer; font-size: .65rem; color: var(--tenue); padding: 0 2px; }
.taller .chip-perfil button:hover { color: var(--peligro); }
.taller .btn-seleccionar-perfiles {
  display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 12px; border-radius: 7px; width: 100%;
  border: 1.5px dashed var(--secundario-color); background: transparent; color: var(--terciario-color); font-size: 0.78rem; font-weight: 700; cursor: pointer;
  transition: background .15s;
}
.taller .btn-seleccionar-perfiles:hover { background: var(--quinario-color); }
.taller .pie-del-alta { display: flex; gap: 10px; margin-top: 14px; align-items: center; }

/* El conmutador Manual / Pepe */
.taller .conmutador { display: flex; border: 1.5px solid var(--borde-control); border-radius: 9px; overflow: hidden; margin-bottom: 12px; }
.taller .conmutador button { flex: 1; padding: 9px; border: none; font-size: .78rem; font-weight: 700; cursor: pointer; background: var(--fondo); color: var(--tenue); }
.taller .conmutador button[aria-pressed="true"] { background: var(--ulx-grad); color: var(--sobre-acento); }
.taller .conmutador.conmutado button[aria-pressed="true"] { background: var(--terciario-color); }

/* El chat */
.taller .ulx-chat-container { display: flex; flex-direction: column; height: 420px; border: 1px solid var(--borde); border-radius: 10px; overflow: hidden; background: var(--superficie); }
.taller .ulx-chat-header { background: var(--ulx-grad); color: var(--sobre-acento); padding: 11px 16px; font-size: 0.82rem; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.taller .ulx-chat-header .ia-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sobre-acento); display: inline-block; }
.taller .ulx-chat-messages { flex: 1; overflow-y: auto; padding: 16px; background: var(--fondo); display: flex; flex-direction: column; gap: 10px; }
.taller .ulx-chat-input-area { border-top: 1px solid var(--borde); padding: 10px 12px; display: flex; gap: 8px; background: var(--superficie); flex-shrink: 0; }
.taller .ulx-chat-input-area input { flex: 1; border: 1px solid var(--borde-control); border-radius: 20px; padding: 7px 16px; outline: none; font-size: 0.84rem; min-width: 0; }
.taller .ulx-chat-input-area input:focus { border-color: var(--secundario-color); }
.taller .btn-ulx-send { border-radius: 20px; padding: 7px 18px; font-size: 0.82rem; box-shadow: none; }
.taller .msg-ia { display: flex; gap: 8px; align-items: flex-start; }
.taller .msg-ia .avatar-ia {
  width: 30px; height: 30px; border-radius: 50%; background: var(--acento); display: flex; align-items: center; justify-content: center;
  color: var(--sobre-acento); font-size: 0.7rem; font-weight: 800; flex-shrink: 0;
}
.taller .msg-ia .bubble {
  background-color: var(--acento-suave); border-left: 4px solid transparent; border-image: var(--ulx-grad-v) 1; border-radius: 0 10px 10px 10px;
  padding: 9px 14px; font-size: 0.83rem; color: var(--primario-color); max-width: 82%; line-height: 1.5; overflow-wrap: anywhere;
}
.taller .msg-ia > div:not(.avatar-ia) { min-width: 0; max-width: 82%; }
.taller .msg-ia > div:not(.avatar-ia) .bubble { max-width: 100%; }
.taller .msg-ia .bubble p + p { margin-top: 6px; }
.taller .msg-ia .bubble .chica { font-weight: 400; font-size: .92em; opacity: var(--apagado); }
.taller .msg-ia.msg-aviso .bubble { color: var(--peligro); }
.taller .msg-ia.escribiendo .bubble { color: var(--tenue); font-style: italic; background: var(--fondo); }
.taller .msg-user { display: flex; justify-content: flex-end; }
.taller .msg-user .bubble { background: var(--acento); color: var(--sobre-acento); border-radius: 10px 0 10px 10px; padding: 9px 14px; font-size: 0.83rem; max-width: 80%; line-height: 1.5; overflow-wrap: anywhere; }
.taller .msg-actions { display: flex; gap: 6px; margin-top: 7px; flex-wrap: wrap; }

/* La metodología */
.taller .panel-metodologia { margin-top: 10px; }
.taller .panel-metodologia .rotulo { font-size: .74rem; font-weight: 700; color: var(--texto); margin: 0 0 6px; }
.taller .metodologias { display: flex; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.taller .metodo-card {
  display: flex; align-items: flex-start; gap: 6px; font-size: .79rem; flex: 1; min-width: 120px; border-radius: 8px; padding: 7px 10px;
  border: 1.5px solid var(--borde-control); cursor: pointer; margin: 0;
}
.taller .metodo-card.sel { border-color: var(--terciario-color); background: var(--cian-suave); font-weight: 700; }
.taller .metodo-card input { accent-color: var(--terciario-color); width: auto; padding: 0; margin: 2px 0 0; flex-shrink: 0; }
.taller .metodo-card .detalle { display: block; font-size: .7rem; color: var(--tenue); font-weight: 400; }

/* La estructura: tarjetas de módulo editables y constructor manual */
.taller .perfil-de-salida { margin-bottom: 14px; }
.taller .perfil-de-salida .rotulo { font-size: .72rem; font-weight: 700; color: var(--terciario-color); display: block; margin-bottom: 4px; }
.taller .perfil-de-salida p { font-size: .82rem; color: var(--texto); line-height: 1.6; }
.taller .perfil-de-salida p.cargando { color: var(--tenue); }
.taller .rotulo-modulos { font-size: .78rem; font-weight: 700; color: var(--texto); margin-bottom: 8px; }
.taller .modulos-dinamicos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 576px) { .taller .modulos-dinamicos { grid-template-columns: 1fr; } }
.taller .modulos-dinamicos .estado { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; font-size: .8rem; color: var(--tenue); }
.taller .modulos-dinamicos .estado.error { color: var(--peligro); }
.taller .spinner { width: 20px; height: 20px; border: 2px solid var(--terciario-color); border-top-color: transparent; border-radius: 50%; animation: taller-spin .7s linear infinite; }
@keyframes taller-spin { to { transform: rotate(360deg); } }
.taller .est-modulo { background: var(--aula-fondo); border: 1.5px solid var(--aula); border-radius: 8px; padding: 12px; }
.taller .est-modulo.sin-aula { border-color: var(--borde); }
.taller .est-modulo .cabecera { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.taller .est-modulo .fase { font-size: .68rem; font-weight: 800; color: var(--aula); white-space: nowrap; }
.taller .est-modulo .titulo-modulo { flex: 1; min-width: 0; border: 1px solid var(--aula); border-radius: 5px; padding: 3px 7px; font-size: .76rem; font-weight: 700; color: var(--aula); background: var(--superficie); }
.taller .quitar { background: none; border: none; color: var(--tenue); cursor: pointer; font-size: .8rem; padding: 2px 5px; }
.taller .quitar:hover { color: var(--peligro); }
.taller .act-renglon { display: flex; gap: 3px; align-items: center; margin-bottom: 4px; }
.taller .act-renglon input[type=text] { flex: 2; min-width: 0; border: 1px solid var(--borde-control); border-radius: 5px; padding: 3px 6px; font-size: .72rem; }
.taller .act-renglon select { flex: 1; min-width: 0; border: 1px solid var(--borde-control); border-radius: 5px; padding: 3px 2px; font-size: .68rem; }
.taller .act-renglon input[type=number] { width: 52px; border: 1px solid var(--borde-control); border-radius: 5px; padding: 3px 4px; font-size: .72rem; }
.taller .mas-actividad {
  width: 100%; border: 1.5px dashed var(--aula); background: transparent; color: var(--aula); border-radius: 6px; padding: 3px 8px;
  font-size: .71rem; font-weight: 700; margin-top: 5px; cursor: pointer;
}
.taller .est-aviso { background: var(--alerta-suave); border: 1px solid var(--alerta); border-radius: 7px; padding: 10px 14px; margin: 12px 0; font-size: 0.78rem; color: var(--alerta); }
.taller .est-botones { display: flex; gap: 8px; }
.taller .est-botones .derecha { margin-left: auto; }
.taller .est-botones .btn-ulx-outline { font-size: 0.8rem; }

.taller .constructor { max-height: 480px; overflow-y: auto; padding-right: 2px; }
.taller .aula-manual { border: 1.5px solid var(--aula); border-radius: 9px; margin-bottom: 10px; overflow: hidden; }
.taller .aula-manual .franja { background: var(--aula); padding: 7px 12px; display: flex; align-items: center; gap: 8px; color: var(--sobre-acento); font-size: .78rem; font-weight: 700; }
.taller .aula-manual .franja .que-va { margin-left: auto; color: var(--sobre-acento); font-size: .67rem; font-weight: 400; }
.taller .aula-manual .franja input { flex: 1; min-width: 0; background: var(--cristal); border: none; color: var(--sobre-acento); border-radius: 5px; padding: 4px 8px; font-size: .76rem; }
.taller .aula-manual .franja input::placeholder { color: var(--sobre-acento); }
.taller .aula-manual .franja .quitar { color: var(--sobre-acento); }
.taller .aula-manual .cuerpo { padding: 9px 12px; background: var(--aula-fondo); }
.taller .aula-manual .cuerpo > input { width: 100%; border: 1px solid var(--aula); border-radius: 6px; padding: 5px 8px; font-size: .76rem; margin-bottom: 7px; }
.taller .aula-manual.libre { --aula: var(--tenue); --aula-fondo: var(--fondo); }
.taller .aula-manual.libre .mas-actividad { --aula: var(--tenue); }
.taller .mas-modulo { width: 100%; border: 1.5px dashed var(--terciario-color); color: var(--terciario-color); background: transparent; border-radius: 8px; padding: 8px; font-size: .78rem; font-weight: 700; cursor: pointer; }
.taller .nota-manual { margin-top: 8px; padding: 8px 11px; background: var(--cian-suave); border-radius: 7px; font-size: .71rem; color: var(--terciario-color); font-weight: 600; }

/* ══ Tablero: encabezado y franja editorial ══ */
.taller .tablero { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.taller .tablero-hdr { padding: 9px 20px 7px; border-bottom: 1px solid var(--borde); background: var(--superficie); display: flex; align-items: center; gap: 12px; flex-shrink: 0; flex-wrap: wrap; }
.taller .tablero-hdr .enlace-volver { font-size: .72rem; }
.taller .tablero-hdr .curso { display: flex; align-items: center; gap: 9px; margin-top: 1px; }
.taller .tablero-hdr h3 { font-size: 1.05rem; font-weight: 800; color: var(--primario-color); }
.taller .tablero-hdr .guia { margin-left: auto; font-size: .68rem; color: var(--tenue); }
.taller .franja-editorial { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.taller .franja-editorial .detalle { font-size: .68rem; color: var(--tenue); }

/* ══ Tablero: tres columnas ══ */
.taller .nb-workspace { display: grid; grid-template-columns: 255px 5px 1fr 5px 310px; flex: 1; min-height: 0; overflow: hidden; }
.taller .nb-col-resizer { background: var(--quinario-color); cursor: col-resize; position: relative; z-index: 20; transition: background .15s; user-select: none; touch-action: none; }
.taller .nb-col-resizer::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 1px; height: 40px; background: var(--borde-control); border-radius: 1px; }
.taller .nb-col-resizer:hover, .taller .nb-col-resizer.rsz-active { background: var(--ulx-grad); }
.taller .nb-col-resizer.rsz-active::after { background: var(--superficie); }
.taller .nb-col-resizer.apagado { pointer-events: none; opacity: 0; }
body.rsz-dragging { cursor: col-resize !important; user-select: none !important; }

.taller .nb-left { background: var(--cian-suave); display: flex; flex-direction: column; overflow: hidden; min-width: 36px; }
.taller .nb-left-hdr { position: relative; padding: 11px 14px 8px; border-bottom: 1px solid var(--borde); flex-shrink: 0; background: var(--quinario-color); }
.taller .nb-left-hdr h6 { margin: 0 0 1px; font-size: .71rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .07em; }
.taller .nb-left-hdr p { font-size: .67rem; color: var(--tenue); }
.taller .nb-tree-toggle {
  position: absolute; top: 50%; right: 8px; transform: translateY(-50%); background: none; border: none; cursor: pointer; color: var(--terciario-color);
  font-size: .85rem; padding: 3px 7px; border-radius: 4px; line-height: 1; opacity: var(--apagado); transition: opacity .15s, background .15s;
}
.taller .nb-tree-toggle:hover { opacity: 1; background: var(--acento-suave); }
.taller .nb-left.nb-collapsed .nb-left-hdr h6, .taller .nb-left.nb-collapsed .nb-left-hdr p { opacity: 0; pointer-events: none; }
.taller .nb-left.nb-collapsed .nb-left-tree { display: none; }
.taller .nb-left.nb-collapsed .nb-tree-toggle { right: auto; left: 50%; transform: translate(-50%, -50%); }
.taller .nb-left-tree { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 6px 4px; }
.taller .nb-left-tree::-webkit-scrollbar { width: 4px; }
.taller .nb-left-tree::-webkit-scrollbar-thumb { background: var(--quinario-color); border-radius: 2px; }
.taller .nb-mod-activo { background: var(--quinario-color) !important; border-radius: 6px; }

/* El árbol */
.taller .menu-arbol { background-color: var(--fondo); border-radius: 1rem; margin: 0; padding: 15px 6px 15px 0.5rem; list-style: none; color: var(--tenue); }
.taller .menu-arbol ul { padding: 0 0 0 0.5rem; margin: 0; list-style: none; }
.taller .menu-arbol li { list-style: none; padding: 0.2rem; }
.taller .menu-arbol .raiz { font-size: 18px; font-weight: 700; text-transform: capitalize; color: var(--tenue); }
.taller .menu-arbol .renglon { display: flex; align-items: flex-start; gap: 4px; }
.taller .menu-arbol .ampliar {
  border: var(--cian) solid 1px; border-radius: 3px; padding: 0 0.5rem; margin-right: 0.4rem; color: var(--cian-tinta); background: none; cursor: pointer;
  font-size: 16px; line-height: 1.4; flex-shrink: 0;
}
.taller .menu-arbol .ampliar[aria-expanded="true"] { color: var(--coach); }
.taller .menu-arbol .cerrada { opacity: 0.5; height: 1px; overflow: hidden; margin-top: 0.5rem; }
.taller .menu-arbol .nombre-modulo {
  background: none; border: none; cursor: pointer; color: var(--tenue); font-size: 18px; font-weight: 700; text-transform: capitalize; text-align: left; padding: 0 4px;
  white-space: normal; word-break: break-word; flex: 1;
}
.taller .menu-arbol .aula-marca { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--aula); margin-right: 5px; }
.taller .btn_padre { margin: 1px; padding: 0; font-size: 14px; font-weight: 400; cursor: pointer; border: none; background-color: transparent; color: var(--tenue); text-align: left; white-space: normal; word-break: break-word; flex: 1; }
.taller .btn_hijo { margin: 2px; padding: 0; cursor: pointer; border: none; background-color: transparent; color: var(--acento); font-size: 14px; font-weight: 400; text-align: left; white-space: normal; word-break: break-word; }
.taller .btn-arbol { background: var(--terciario-color); color: var(--sobre-acento); border: none; border-radius: 5px; padding: 5px 10px; font-size: 14px; font-weight: bold; cursor: pointer; }
.taller .btn-arbol:hover { filter: brightness(1.1); }

.taller .nb-center { display: flex; flex-direction: column; background: var(--superficie); overflow: hidden; min-width: 280px; }
.taller .nb-center-hdr { background: var(--ulx-grad); padding: 11px 16px 10px; flex-shrink: 0; display: flex; align-items: center; gap: 12px; }
.taller .nb-center-hdr-logo {
  width: 36px; height: 36px; border-radius: 9px; background: var(--superficie); flex-shrink: 0; display: flex; align-items: center; justify-content: center; padding: 3px; overflow: hidden;
}
.taller .nb-center-hdr-logo img { width: 100%; height: 100%; object-fit: contain; }
.taller .nb-center-hdr-info { flex: 1; }
.taller .nb-center-hdr .tag { font-size: .63rem; font-weight: 800; color: var(--sobre-acento); text-transform: uppercase; letter-spacing: .07em; display: block; }
.taller .nb-center-hdr h5 { margin: 1px 0 0; font-size: .9rem; font-weight: 800; color: var(--sobre-acento); }
.taller .nb-chat-msgs { flex: 1; overflow-y: auto; padding: 14px 16px; background: var(--fondo); display: flex; flex-direction: column; gap: 10px; }
.taller .nb-chat-msgs::-webkit-scrollbar { width: 5px; }
.taller .nb-chat-msgs::-webkit-scrollbar-thumb { background: var(--quinario-color); border-radius: 3px; }
.taller .nb-center .msg-ia .avatar-ia { background: var(--superficie); border: 1.5px solid var(--borde); padding: 3px; overflow: hidden; }
.taller .nb-center .msg-ia .avatar-ia img { width: 100%; height: 100%; object-fit: contain; }
.taller .msg-typing { display: flex; gap: 4px; align-items: center; padding: 9px 13px; background: var(--quinario-color); border-radius: 0 10px 10px 10px; width: fit-content; }
.taller .msg-typing span { width: 6px; height: 6px; border-radius: 50%; background: var(--secundario-color); animation: taller-ia-dot 1.2s infinite; }
.taller .msg-typing span:nth-child(2) { animation-delay: .2s; }
.taller .msg-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes taller-ia-dot { 0%,60%,100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-5px); opacity: 1; } }
.taller .nb-ctx { padding: 5px 14px; background: var(--quinario-color); border-top: 1px solid var(--borde); font-size: .7rem; color: var(--terciario-color); flex-shrink: 0; font-weight: 600; }

.taller .nb-right { background: var(--superficie); display: flex; flex-direction: column; overflow: hidden; }
.taller .nb-right-hdr { padding: 11px 15px 9px; border-bottom: 1px solid var(--borde); background: var(--quinario-color); flex-shrink: 0; }
.taller .nb-right-hdr h6 { margin: 0 0 1px; font-size: .78rem; font-weight: 800; color: var(--terciario-color); }
.taller .nb-right-hdr p { font-size: .67rem; color: var(--tenue); }
.taller .nb-right-body { flex: 1; overflow-y: auto; padding: 12px 13px; display: flex; flex-direction: column; gap: 11px; }
.taller .nb-right-body::-webkit-scrollbar { width: 4px; }
.taller .nb-right-body::-webkit-scrollbar-thumb { background: var(--quinario-color); border-radius: 2px; }
.taller .nb-sec-lbl { font-size: .67rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.taller .nb-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 12px; text-align: center; color: var(--tenue); border: 1.5px dashed var(--borde); border-radius: 8px; min-height: 120px; gap: 5px; }
.taller .nb-empty span { font-size: 1.6rem; }
.taller .nb-empty p { font-size: .73rem; }

/* Las secciones plegables del panel derecho */
.taller .nb-fuente-seccion { background: linear-gradient(var(--superficie),var(--superficie)) padding-box, var(--ulx-grad) border-box; border: 1.5px solid transparent; border-radius: 9px; flex-shrink: 0; }
.taller .nb-fuente-seccion-hdr {
  background: var(--quinario-color); padding: 8px 11px; display: flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; transition: background .15s;
  border-radius: 8px; border: none; width: 100%; text-align: left;
}
.taller .nb-fuente-seccion-hdr.open { border-radius: 8px 8px 0 0; }
.taller .nb-fuente-seccion-hdr:hover { background: var(--azul-suave); }
.taller .nb-fuente-seccion-hdr .fs-ico { font-size: .85rem; flex-shrink: 0; }
.taller .nb-fuente-seccion-hdr .fs-lbl { font-size: .68rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .06em; flex: 1; }
.taller .nb-fuente-seccion-hdr .fs-cnt { font-size: .65rem; font-weight: 700; color: var(--cian-tinta); background: var(--superficie); padding: 1px 7px; border-radius: 8px; }
.taller .nb-fuente-seccion-hdr .fs-arr { font-size: .7rem; color: var(--terciario-color); transition: transform .2s; flex-shrink: 0; }
.taller .nb-fuente-seccion-hdr.open .fs-arr { transform: rotate(180deg); }
.taller .nb-fuente-seccion-body { padding: 9px 11px; display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--borde); border-radius: 0 0 8px 8px; }
.taller .nb-fuente-seccion-body[hidden] { display: none; }
.taller .nb-fuente-seccion-body small { font-size: .69rem; color: var(--tenue); }
.taller .nb-fuente-seccion-body label { font-size: .69rem; font-weight: 700; color: var(--terciario-color); display: flex; flex-direction: column; gap: 2px; }
.taller .nb-fuente-seccion-body select, .taller .nb-fuente-seccion-body input, .taller .nb-fuente-seccion-body textarea {
  border: 1px solid var(--borde-control); border-radius: 6px; padding: 5px 8px; font-size: .76rem; width: 100%; outline: none; font-weight: 400; color: var(--texto);
}
.taller .nb-fuente-seccion-body textarea { resize: vertical; }
.taller .nb-fuente-seccion-body .fila { display: flex; align-items: center; gap: 8px; }
.taller .nb-fuente-seccion-body .guardado { font-size: .7rem; color: var(--cian-tinta); font-weight: 700; flex: 1; }
.taller .nb-fuente-chip { display: flex; align-items: center; gap: 6px; background: var(--superficie); border: 1px solid var(--borde); border-radius: 7px; padding: 5px 8px; font-size: .72rem; color: var(--texto); }
.taller .nb-fuente-chip.perfil { border-color: var(--secundario-color); background: var(--cian-suave); }
.taller .nb-fuente-chip .fc-icon { font-size: .82rem; flex-shrink: 0; }
.taller .nb-fuente-chip .fc-nom { flex: 1; min-width: 0; font-weight: 600; display: flex; flex-direction: column; }
.taller .nb-fuente-chip .fc-nom span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.taller .nb-fuente-chip .fc-area { font-size: .63rem; color: var(--cian-tinta); font-weight: 700; }
.taller .nb-fuente-chip .fc-sub { font-size: .65rem; color: var(--tenue); font-weight: 400; max-width: 180px; }
.taller .nb-fuente-chip .fc-ok { font-size: .6rem; color: var(--cian-tinta); background: var(--cian-suave); border-radius: 4px; padding: 1px 4px; }
.taller .nb-fuente-chip .fc-del { font-size: .68rem; color: var(--tenue); cursor: pointer; padding: 2px 5px; border-radius: 4px; transition: color .15s; flex-shrink: 0; line-height: 1; background: none; border: none; }
.taller .nb-fuente-chip .fc-del:hover { color: var(--peligro); background: var(--peligro-suave); }
.taller .nb-btn-add-fuente {
  display: flex; align-items: center; justify-content: center; gap: 5px; padding: 7px 10px; border-radius: 7px; border: none; background: var(--ulx-grad); color: var(--sobre-acento);
  font-size: .72rem; font-weight: 700; cursor: pointer; width: 100%;
}
.taller .nb-nota-centrada { font-size: .67rem; color: var(--tenue); text-align: center; }
/* Una sección cuyos datos no llegaron: lo dice en su lugar y ofrece pedirlos otra vez */
.taller .nb-carga-fallo { display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border: 1px solid var(--peligro); border-radius: 7px; background: var(--peligro-suave); }
.taller .nb-carga-fallo p { font-size: .72rem; color: var(--peligro); }
/* Por dónde va la lectura de un archivo (PDF, Word, Excel), en las fuentes y en el modal del examen */
.taller .nb-fuente-avance { font-size: .69rem; font-weight: 700; color: var(--terciario-color); }
.taller .btn-guardar-chico { background: var(--ulx-grad); color: var(--sobre-acento); border: none; padding: 6px 16px; border-radius: 7px; font-size: .76rem; font-weight: 800; cursor: pointer; }

/* Contenidos del curso (cc-*) */
.taller .cc-modulo { border: 1px solid var(--borde); border-radius: 7px; overflow: hidden; }
.taller .cc-modulo-hdr { display: flex; align-items: center; gap: 6px; width: 100%; border: none; background: var(--fondo); padding: 6px 9px; cursor: pointer; font-size: .74rem; font-weight: 700; color: var(--primario-color); text-align: left; }
.taller .cc-modulo-hdr .cc-arr { font-size: .6rem; transition: transform .2s; color: var(--terciario-color); }
.taller .cc-modulo-hdr[aria-expanded="true"] .cc-arr { transform: rotate(90deg); }
.taller .cc-modulo-hdr .cc-nom { flex: 1; }
.taller .cc-modulo-hdr .cc-cnt { background: var(--acento); color: var(--sobre-acento); border-radius: 9px; padding: 1px 7px; font-size: .62rem; }
.taller .cc-modulo-body { padding: 6px 9px; display: flex; flex-direction: column; gap: 4px; }
.taller .cc-modulo-body[hidden] { display: none; }
.taller .cc-act { font-size: .7rem; font-weight: 700; color: var(--texto); margin-top: 3px; }
.taller .cc-cont-item { display: flex; align-items: center; gap: 6px; border: 1px solid var(--azul-tinta); border-radius: 6px; padding: 4px 7px; background: var(--superficie); cursor: pointer; font-size: .71rem; width: 100%; text-align: left; color: var(--texto); }
.taller .cc-cont-item .cc-tipo { margin-left: auto; font-size: .58rem; font-weight: 800; color: var(--sobre-acento); background: var(--acento); border-radius: 6px; padding: 1px 6px; text-transform: uppercase; }
.taller .cc-vacio { font-size: .7rem; color: var(--tenue); }

/* ══ Modales: selector de perfiles (nb-modal), visor y altas manuales (mnc) ══ */
.taller .nb-modal-overlay { position: fixed; inset: 0; background: var(--velo); z-index: 9999; display: flex; align-items: center; justify-content: center; }
.taller .nb-modal { background: var(--superficie); border-radius: 12px; width: 440px; max-width: 95vw; max-height: 82vh; display: flex; flex-direction: column; box-shadow: 0 8px 36px var(--sombra); }
.taller .nb-modal-hdr { padding: 13px 16px 10px; border-bottom: 1px solid var(--borde); display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.taller .nb-modal-hdr h6 { font-size: .9rem; font-weight: 800; color: var(--primario-color); flex: 1; }
.taller .nb-modal-close { background: none; border: none; cursor: pointer; font-size: 1.1rem; color: var(--tenue); padding: 0 3px; line-height: 1; }
.taller .nb-modal-close:hover { color: var(--peligro); }
.taller .nb-modal-sub { font-size: .68rem; color: var(--tenue); padding: 7px 16px 0; flex-shrink: 0; }
.taller .nb-modal-body { flex: 1; overflow-y: auto; padding: 8px 14px 10px; display: flex; flex-direction: column; gap: 5px; }
.taller .nb-perfil-opt { display: flex; align-items: center; gap: 10px; margin: 0; padding: 9px 11px; border-radius: 9px; border: 1.5px solid var(--borde-control); cursor: pointer; transition: all .15s; user-select: none; }
.taller .nb-perfil-opt:hover { border-color: var(--secundario-color); background: var(--quinario-color); }
.taller .nb-perfil-opt.sel { border-color: var(--terciario-color); background: var(--cian-suave); }
.taller .nb-perfil-opt input[type=checkbox] { accent-color: var(--terciario-color); width: 15px; height: 15px; flex-shrink: 0; cursor: pointer; margin: 0; }
.taller .nb-perfil-opt .po-ico { font-size: 1rem; flex-shrink: 0; }
.taller .nb-perfil-opt .po-info { flex: 1; min-width: 0; }
/* El nombre y el área van cada uno en su renglón. Son <span> (dentro de un
   <label> no cabe un <div>), y en línea no se recortan ni toman margen. */
.taller .nb-perfil-opt .po-nom { display: block; font-size: .81rem; font-weight: 700; color: var(--primario-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.taller .nb-perfil-opt .po-area { display: block; font-size: .67rem; color: var(--tenue); margin-top: 1px; }
.taller .nb-perfil-opt .po-acciones { display: flex; gap: 2px; }
.taller .nb-modal-ftr { padding: 10px 14px; border-top: 1px solid var(--borde); display: flex; gap: 7px; flex-shrink: 0; background: var(--fondo); border-radius: 0 0 12px 12px; }
.taller .nb-modal-sel-count { font-size: .72rem; color: var(--terciario-color); font-weight: 700; align-self: center; flex: 1; }
.taller .nb-modal-confirm { padding: 8px 18px; border-radius: 8px; border: none; background: var(--ulx-grad); color: var(--sobre-acento); font-size: .8rem; font-weight: 800; cursor: pointer; }
.taller .nb-modal-confirm:hover { background: var(--primario-color); }
.taller .nb-modal-cancel { padding: 8px 12px; border-radius: 8px; border: 1.5px solid var(--borde-control); background: var(--superficie); color: var(--tenue); font-size: .8rem; font-weight: 700; cursor: pointer; }
.taller .nb-modal-cancel:hover { background: var(--quinario-color); }
.taller .nb-modal-empty { font-size: .78rem; color: var(--tenue); text-align: center; padding: 24px 12px; }
.taller .nb-modal-error { font-size: .74rem; color: var(--peligro); padding: 0 16px; }
.taller .nb-modal-error:empty { display: none; }

.taller .nb-viewer-overlay { position: fixed; inset: 0; background: var(--velo); z-index: 8800; display: flex; align-items: center; justify-content: center; }
.taller .nb-viewer-modal { background: var(--superficie); border-radius: 14px; width: min(1200px,96vw); height: 90vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px var(--sombra); }
.taller .nb-viewer-hdr { background: var(--ulx-grad); padding: 13px 20px; display: flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--sobre-acento); }
.taller .nb-viewer-hdr h6 { color: var(--sobre-acento); font-size: 1rem; flex: 1; font-weight: 700; }
.taller .nb-viewer-close { background: none; border: none; color: var(--sobre-acento); font-size: 1.1rem; cursor: pointer; opacity: var(--apagado); padding: 4px 9px; border-radius: 4px; }
.taller .nb-viewer-close:hover { opacity: 1; background: var(--cristal); }
.taller .nb-viewer-body { flex: 1; overflow-y: auto; overflow-wrap: anywhere; padding: 20px 24px; font-size: .88rem; }
.taller .visor-acciones { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 10px; }
.taller .visor-titulo { text-align: center; font-size: 1.1rem; font-weight: 700; color: var(--primario-color); margin-bottom: 14px; }
.taller .visor-sub { font-size: .78rem; color: var(--tenue); margin-bottom: 10px; }
.taller .orden-de-actividades { list-style: none; margin: 0 auto; padding: 0; max-width: 640px; display: flex; flex-direction: column; gap: 8px; }
.taller .orden-de-actividades li { display: flex; align-items: center; gap: 8px; border: 1px solid var(--borde); border-radius: 9px; padding: 10px 12px; background: var(--superficie); cursor: grab; transition: opacity .15s, border-color .15s, background-color .15s; }
.taller .orden-de-actividades li.arrastrando { opacity: .5; }
.taller .orden-de-actividades li.destino { border-color: var(--terciario-color); background: var(--cian-suave); }
.taller .orden-de-actividades li .nombre { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 600; color: var(--primario-color); }
.taller .orden-de-actividades li .detalle { font-size: .72rem; color: var(--tenue); }
.taller .visor-bloque { border: 1px solid var(--borde); border-radius: 10px; padding: 14px 16px; margin-bottom: 12px; }
.taller .visor-bloque > h4 { margin: 0 0 8px; font-size: .95rem; color: var(--primario-color); }
.taller .visor-bloque .parte { margin: 6px 0; }
.taller .visor-bloque .parte > span:not(.titulo) { white-space: pre-line; overflow-wrap: anywhere; }
.taller .visor-bloque .parte .titulo { display: block; font-size: .72rem; font-weight: 700; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .04em; }
.taller .visor-bloque .nota-de-autor { font-size: .74rem; color: var(--alerta); background: var(--alerta-suave); border: 1px solid var(--alerta); border-radius: 6px; padding: 5px 9px; margin-bottom: 8px; }
.taller .visor-bloque .parte li.correcta { color: var(--cian-tinta); background: var(--cian-suave); border-radius: 6px; padding: 1px 6px; font-weight: 700; list-style: none; }
.taller .visor-bloque .clave-nota { display: block; font-size: .8rem; margin-top: 4px; color: var(--tenue); }
.taller .visor-bloque .clave-nota.correcta { color: var(--cian-tinta); font-weight: 700; }
.taller .visor-bloque .clave-nota.falta { color: var(--alerta); font-weight: 700; }
.taller .visor-interruptor { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: .8rem; font-weight: 700; color: var(--terciario-color); cursor: pointer; }
.taller .visor-interruptor input { width: auto; padding: 0; margin: 0; flex-shrink: 0; accent-color: var(--terciario-color); }
.taller .visor-vacio { color: var(--tenue); text-align: center; padding: 24px; }
.taller .btn-icono { background: var(--superficie); border: 1.5px solid var(--borde-control); border-radius: 7px; padding: 5px 10px; cursor: pointer; font-size: .78rem; font-weight: 700; color: var(--terciario-color); }
.taller .btn-icono:hover { background: var(--quinario-color); }
.taller .btn-icono.peligro { border-color: var(--peligro); color: var(--peligro); }
.taller .btn-icono.peligro:hover { background: var(--peligro-suave); border-color: var(--peligro); }
.taller .btn-icono:disabled { opacity: .45; cursor: not-allowed; }

.taller .mnc-overlay { position: fixed; inset: 0; background: var(--velo); z-index: 9000; display: flex; align-items: center; justify-content: center; }
.taller .mnc-modal { background: var(--superficie); border-radius: 14px; width: min(640px,96vw); max-height: 88vh; display: flex; flex-direction: column; box-shadow: 0 8px 40px var(--sombra); overflow: hidden; }
.taller .mnc-modal.angosto { width: min(420px,96vw); }
.taller .mnc-modal.w400 { width: min(400px,96vw); }
.taller .mnc-modal.w440 { width: min(440px,96vw); }
.taller .mnc-modal.w480 { width: min(480px,96vw); }
.taller .mnc-hdr { background: var(--ulx-grad); padding: 14px 18px 13px; display: flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--sobre-acento); }
.taller .mnc-hdr h6 { font-size: .95rem; font-weight: 800; color: var(--sobre-acento); }
.taller .mnc-hdr .mnc-close { margin-left: auto; background: var(--cristal); border: none; border-radius: 50%; width: 26px; height: 26px; color: var(--sobre-acento); cursor: pointer; font-size: .85rem; display: flex; align-items: center; justify-content: center; }
.taller .mnc-body { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.taller .mnc-ftr { padding: 12px 18px; border-top: 1px solid var(--borde); display: flex; gap: 8px; justify-content: flex-end; flex-shrink: 0; }
.taller .mnc-motivos { list-style: none; margin: 0; padding: 10px 18px 0; color: var(--peligro); font-size: .78rem; line-height: 1.4; flex-shrink: 0; }
.taller .mnc-motivos:empty { display: none; }
.taller .mnc-motivos li + li { margin-top: 4px; }
/* En el visor el fallo va arriba de su cuerpo, y se queda a la vista aunque la lista se haya desplazado. */
.taller .nb-viewer-body .mnc-motivos.del-visor { position: sticky; top: -20px; z-index: 1; margin: -20px -24px 16px; padding: 10px 24px; background: var(--superficie); border-bottom: 2px solid var(--peligro); font-size: .88rem; }
.taller .mnc-tipos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.taller .mnc-tipo-card { border: 1.5px solid var(--borde-control); border-radius: 10px; padding: 11px 12px; cursor: pointer; display: flex; align-items: center; gap: 9px; font-size: .8rem; font-weight: 700; color: var(--primario-color); transition: .15s; background: var(--superficie); text-align: left; }
.taller .mnc-tipo-card:hover { border-color: var(--terciario-color); background: var(--cian-suave); }
.taller .mnc-tipo-card.sel { border-color: var(--terciario-color); background: var(--quinario-color); }
.taller .mnc-tipo-card .mnc-ico { font-size: 1.3rem; }
.taller .mnc-tipo-card .desc { display: block; font-size: .67rem; font-weight: 400; color: var(--tenue); line-height: 1.3; }
.taller .mnc-form-area { border-top: 1px solid var(--borde); padding-top: 12px; }
.taller .mnc-field, .taller .mns-field { display: flex; flex-direction: column; gap: 3px; margin-bottom: 8px; font-size: .69rem; font-weight: 700; color: var(--terciario-color); }
.taller .mnc-field input, .taller .mnc-field textarea, .taller .mnc-field select, .taller .mns-field input, .taller .mns-field select, .taller .mns-field textarea {
  border: 1px solid var(--borde-control); border-radius: 7px; padding: 6px 9px; font-size: .8rem; outline: none; width: 100%; font-weight: 400; color: var(--texto);
}
.taller .mns-field { gap: 4px; margin-bottom: 10px; font-size: .72rem; }
.taller .mns-field input, .taller .mns-field select, .taller .mns-field textarea { padding: 7px 10px; font-size: .82rem; }
.taller .mnc-field textarea { resize: vertical; }
.taller .mnc-field .reservado { align-self: flex-start; font-size: .6rem; background: var(--alerta-suave); border: 1px solid var(--alerta); color: var(--alerta); border-radius: 6px; padding: 1px 6px; }
.taller .mnc-field .ayuda { font-weight: 400; color: var(--tenue); font-size: .67rem; }
.taller .mns-field.corto input { width: 80px; }
.taller .mnc-casilla { display: flex; align-items: center; gap: 6px; font-size: .76rem; color: var(--texto); }
.taller .mnc-casilla input { width: auto; flex-shrink: 0; margin: 0; accent-color: var(--terciario-color); }
.taller .mnc-section-lbl { font-size: .68rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .06em; border-bottom: 1.5px solid var(--borde); padding-bottom: 4px; margin-bottom: 7px; }
.taller .mnc-pregunta { border: 1px solid var(--borde); border-radius: 9px; padding: 10px 12px; margin-bottom: 8px; display: flex; flex-direction: column; gap: 6px; }
.taller .mnc-pq-hdr { display: flex; align-items: center; justify-content: space-between; font-size: .75rem; font-weight: 700; color: var(--terciario-color); }
.taller .mnc-btn-add-q { border: 1.5px dashed var(--terciario-color); background: var(--superficie); color: var(--terciario-color); border-radius: 8px; padding: 7px 14px; font-size: .78rem; font-weight: 700; cursor: pointer; width: 100%; margin-top: 4px; }
.taller .mnc-btn-add-q:hover { background: var(--quinario-color); }
.taller .mnc-ia { display: flex; flex-direction: column; gap: 5px; margin: -2px 0 10px; }
.taller .mnc-ia-botones { display: flex; flex-wrap: wrap; gap: 5px; }
.taller .mnc-ia-btn { border: 1.5px solid var(--borde-control); background: var(--superficie); color: var(--terciario-color); border-radius: 8px; padding: 4px 9px; font-size: .71rem; font-weight: 700; cursor: pointer; }
.taller .mnc-ia-btn:hover:not(:disabled) { background: var(--quinario-color); border-color: var(--terciario-color); }
.taller .mnc-ia-btn:disabled { opacity: .6; cursor: progress; }
.taller .mnc-ia .ayuda { font-size: .67rem; font-weight: 400; color: var(--tenue); }
.taller .mnc-ia-estado { margin: 0; font-size: .73rem; font-weight: 700; color: var(--cian-tinta); }
.taller .mnc-ia-estado.fallo { color: var(--peligro); }
.taller .mnc-ia-estado:empty { display: none; }
.taller .lista-de-versiones { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.taller .lista-de-versiones li { border: 1px solid var(--borde); border-radius: 9px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.taller .lista-de-versiones .sub { font-size: .74rem; color: var(--tenue); }

/* ══ Recursos didácticos con IA: chips, generar y «Recursos generados» ══ */
.taller .nb-recursos { display: flex; flex-direction: column; gap: 8px; }
.taller .nb-sec-lbl.menor { margin: 4px 0 0; font-size: .62rem; color: var(--tenue); }
.taller .nb-chips { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.taller .nb-chip {
  display: block; padding: 7px 7px 5px; border-radius: 8px; border: 1.5px solid var(--borde-control); background: var(--superficie); color: var(--primario-color);
  font-size: .71rem; font-weight: 700; cursor: pointer; text-align: center; transition: .15s; min-width: 0;
}
.taller .nb-chip:hover { border-color: var(--terciario-color); background: var(--quinario-color); color: var(--terciario-color); }
.taller .nb-chip.sel { border-color: var(--terciario-color); background: var(--ulx-grad); color: var(--sobre-acento); }
.taller .nb-chip .nb-chip-ico { display: block; margin-bottom: 2px; font-size: .9rem; }
.taller .nb-gen {
  display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; padding: 9px; border: none; border-radius: 8px; background: var(--ulx-grad); color: var(--sobre-acento);
  font-size: .83rem; font-weight: 800; cursor: pointer;
}
.taller .nb-gen:hover { filter: brightness(1.06); }
.taller .nb-gen .rayo { display: inline-block; animation: taller-ia-dot .7s infinite alternate; }
.taller .nb-gen:disabled { background: var(--borde); color: var(--tenue); filter: none; cursor: not-allowed; }
.taller .nb-gen.generando:disabled { background: var(--ulx-grad); color: var(--sobre-acento); opacity: .8; cursor: progress; }
.taller .nb-div { display: flex; align-items: center; gap: 8px; font-size: .64rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .06em; margin-top: 4px; }
.taller .nb-div::before, .taller .nb-div::after { content: ''; flex: 1; height: 1px; background: var(--quinario-color); }
.taller .nb-resultados { display: flex; flex-direction: column; gap: 8px; }
.taller .nb-res-card { border: 1.5px solid var(--borde); border-radius: 8px; background: var(--superficie); overflow: hidden; }
.taller .nb-res-card.nb-res-estado-fallida { border-color: var(--peligro); }
.taller .nb-res-head { display: flex; align-items: center; gap: 7px; padding: 7px 11px; background: var(--fondo); }
.taller .nb-res-head input { flex: 1; min-width: 0; border: 1px solid var(--terciario-color); border-radius: 6px; padding: 3px 6px; font-size: .72rem; outline: none; }
.taller .nb-res-badge { flex-shrink: 0; font-size: .58rem; font-weight: 800; color: var(--sobre-acento); background: var(--acento); border-radius: 8px; padding: 2px 7px; text-transform: uppercase; white-space: nowrap; }
.taller .nb-res-title { display: block; flex: 1; min-width: 0; font-size: .78rem; font-weight: 700; color: var(--primario-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.taller .nb-res-ico { flex-shrink: 0; background: none; border: none; cursor: pointer; font-size: .72rem; color: var(--tenue); padding: 2px 4px; border-radius: 4px; line-height: 1; }
.taller .nb-res-ico:hover { color: var(--terciario-color); background: var(--quinario-color); }
.taller .nb-del { flex-shrink: 0; padding: 5px 8px; border-radius: 7px; border: 1.5px solid color-mix(in srgb, var(--peligro) 25%, var(--superficie)); background: none; font-size: .71rem; font-weight: 700; color: var(--peligro); cursor: pointer; transition: all .15s; }
.taller .nb-del:hover { background: var(--peligro-suave); border-color: var(--peligro); }
.taller .nb-res-carga { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 16px 10px; text-align: center; font-size: .7rem; color: var(--tenue); }
.taller .nb-res-carga .reloj { font-size: 1.3rem; animation: taller-ia-dot 1.2s infinite; }
.taller .nb-res-fallo { padding: 9px 10px; font-size: .71rem; color: var(--peligro); background: var(--peligro-suave); }
/* La miniatura: el recurso mismo, pintado grande y reducido al 42 %; nada de adentro se usa. El botón cubre toda la miniatura y su pastilla aparece al pasar el
   puntero o al recibir el foco. */
.taller .nb-res-thumb { position: relative; height: 160px; overflow: hidden; background: var(--fondo); border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); }
.taller .nb-res-thumb::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 60px; background: linear-gradient(to bottom, transparent, var(--superficie)); pointer-events: none; }
.taller .nb-res-mini { width: 238%; padding: 12px; transform: scale(.42); transform-origin: top left; font-size: 14px; line-height: 1.5; pointer-events: none; user-select: none; }
.taller .nb-res-mini .visor-bloque { margin: 0; }
.taller .nb-res-ver { position: absolute; inset: 0; z-index: 1; display: flex; align-items: flex-end; justify-content: center; padding: 0 0 6px; border: none; border-radius: 0; background: transparent; cursor: pointer; }
.taller .nb-res-ver span { padding: 3px 12px; border-radius: 10px; background: var(--ulx-grad); color: var(--sobre-acento); font-size: .67rem; font-weight: 700; white-space: nowrap; opacity: 0; transition: opacity .2s; }
.taller .nb-res-ver:hover span, .taller .nb-res-ver:focus-visible span { opacity: 1; }
.taller .nb-res-acts { display: flex; gap: 6px; padding: 7px 8px; }
.taller .nb-add { flex: 1; border: none; border-radius: 7px; padding: 5px 8px; background: var(--ulx-grad); color: var(--sobre-acento); font-size: .71rem; font-weight: 800; cursor: pointer; }
.taller .nb-add:hover { filter: brightness(1.06); }
.taller .nb-add:disabled { filter: grayscale(.5); cursor: progress; }
.taller .nb-res-btn { border: 1.5px solid var(--borde-control); border-radius: 7px; padding: 5px 10px; background: var(--superficie); color: var(--terciario-color); font-size: .71rem; font-weight: 700; cursor: pointer; }
.taller .nb-res-btn:hover { background: var(--quinario-color); }

/* «Personalizar — {Tipo}» (mpg) */
.taller .mnc-modal.w480 .mnc-body { padding: 18px 20px; gap: 14px; }
.taller .mpg-grupo { display: flex; flex-direction: column; }
.taller .mpg-grupo select, .taller .mpg-grupo textarea { border: 1px solid var(--borde-control); border-radius: 7px; padding: 6px 9px; font-size: .8rem; outline: none; width: 100%; }
.taller .mpg-grupo textarea { resize: vertical; }
.taller .mpg-lbl { margin-bottom: 6px; font-size: .69rem; font-weight: 700; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .04em; }
.taller .mpg-fila { display: flex; flex-wrap: wrap; gap: 6px; }
.taller .mpg-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 6px; }
.taller .mpg-rejilla.de-tres { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.taller .mpg-card {
  border: 1.5px solid var(--borde-control); border-radius: 9px; padding: 9px 8px; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: .74rem; font-weight: 400;
  line-height: 1.3; color: var(--primario-color); background: var(--superficie); text-align: center; transition: .15s;
}
.taller .mpg-card:hover { border-color: var(--terciario-color); background: var(--cian-suave); }
.taller .mpg-card.sel { border-color: var(--terciario-color); background: var(--quinario-color); box-shadow: 0 0 0 2px var(--azul-suave); }
.taller .mpg-card .mpg-ico { font-size: 1.15rem; }
.taller .mpg-card .desc { font-size: .66rem; font-weight: 400; color: var(--tenue); line-height: 1.3; }
.taller .mpg-card.estilo { gap: 0; padding: 12px 6px 9px; border-radius: 11px; font-size: .7rem; font-weight: 600; line-height: 1.2; }
.taller .mpg-card.estilo .mpg-ico { display: block; margin-bottom: 5px; font-size: 1.7rem; line-height: 1; }
.taller .mpg-card.estilo .desc { margin-top: 2px; font-size: .63rem; }
.taller .mpg-formatos { display: flex; flex-direction: column; gap: 8px; }
.taller .mpg-formato {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; align-items: start; padding: 13px 15px; border: 1.5px solid var(--borde-control); border-radius: 11px;
  background: var(--superficie); color: var(--primario-color); font-size: .87rem; font-weight: 700; line-height: 1.2; text-align: left; cursor: pointer; transition: .15s;
}
.taller .mpg-formato:hover { border-color: var(--terciario-color); background: var(--cian-suave); }
.taller .mpg-formato.sel { border-color: var(--terciario-color); background: var(--quinario-color); color: var(--terciario-color); }
.taller .mpg-formato.sel::after {
  content: '✓'; position: absolute; top: 10px; right: 12px; width: 18px; height: 18px; border-radius: 50%; background: var(--terciario-color); color: var(--sobre-acento);
  font-size: .65rem; font-weight: 900; display: flex; align-items: center; justify-content: center;
}
.taller .mpg-formato .mpg-ico { grid-row: 1 / span 2; font-size: 1.4rem; }
.taller .mpg-formato .desc { margin-top: 3px; font-size: .74rem; font-weight: 400; color: var(--tenue); line-height: 1.4; }
.taller .mpg-lvl-btn { flex: 1; border: 1.5px solid var(--borde-control); border-radius: 9px; padding: 11px 6px; background: var(--superficie); color: var(--primario-color); font-size: .76rem; font-weight: 700; cursor: pointer; transition: .15s; }
.taller .mpg-lvl-btn:hover { border-color: var(--terciario-color); color: var(--terciario-color); }
.taller .mpg-lvl-btn.sel { border-color: var(--terciario-color); background: var(--terciario-color); color: var(--sobre-acento); }
.taller .mpg-orient-btn { flex: 1; border: 1.5px solid var(--borde-control); border-radius: 9px; padding: 9px 6px; background: var(--superficie); color: var(--primario-color); font-size: .76rem; font-weight: 600; cursor: pointer; transition: .15s; }
.taller .mpg-orient-btn:hover { border-color: var(--terciario-color); }
.taller .mpg-orient-btn.sel { border-color: var(--terciario-color); background: var(--terciario-color); color: var(--sobre-acento); }
.taller .mpg-aviso { margin-top: 8px; font-size: .74rem; line-height: 1.45; color: var(--alerta); background: var(--alerta-suave); border: 1px solid var(--alerta); border-radius: 8px; padding: 8px 11px; }
.taller .mpg-ayuda { margin-top: 6px; font-size: .68rem; color: var(--tenue); }
.taller .contador { display: block; margin-top: 4px; font-size: .68rem; font-weight: 400; color: var(--tenue); text-align: right; }
.taller .contador.pasado { color: var(--peligro); font-weight: 700; }
.taller .mpg-archivo { display: flex; flex-direction: column; gap: 4px; }
.taller .mpg-archivo input { border: 1px solid var(--borde-control); border-radius: 6px; padding: 5px 8px; font-size: .76rem; width: 100%; color: var(--texto); }
.taller .mpg-vacio { font-size: .72rem; color: var(--tenue); border: 1px dashed var(--borde); border-radius: 6px; padding: 7px 9px; text-align: center; }
.taller .mpg-volver { align-self: flex-start; background: none; border: none; padding: 0; color: var(--terciario-color); font-size: .72rem; font-weight: 700; cursor: pointer; }
.taller .mpg-volver:hover { text-decoration: underline; }

/* «¿Dónde agregar el recurso?» (mad) */
.taller .mad-modulo { font-size: .8rem; color: var(--primario-color); }
.taller .mad-ayuda, .taller .mad-nota { font-size: .7rem; color: var(--tenue); }
.taller .mad-lista { display: flex; flex-direction: column; gap: 8px; max-height: 44vh; overflow-y: auto; }
.taller .mad-opcion { display: flex; align-items: center; gap: 8px; margin: 0; border: 1.5px solid var(--borde-control); border-radius: 9px; padding: 8px 10px; font-size: .78rem; font-weight: 600; color: var(--primario-color); cursor: pointer; }
.taller .mad-opcion:hover { border-color: var(--secundario-color); background: var(--quinario-color); }
.taller .mad-opcion.nueva { margin-bottom: 2px; border-style: dashed; color: var(--terciario-color); }
.taller .mad-opcion input { width: auto; margin: 0; flex-shrink: 0; accent-color: var(--terciario-color); }

/* «Edición de Recurso» (mer): a la izquierda cómo se ve, a la derecha sus campos */
.taller .mer-overlay { position: fixed; inset: 0; background: var(--velo); z-index: 9000; display: flex; align-items: center; justify-content: center; }
.taller .mer-modal { background: var(--superficie); border-radius: 14px; width: min(880px,97vw); height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px var(--sombra); overflow: hidden; }
.taller .mer-cuerpo { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) 340px; }
.taller .mer-vista { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--borde); background: var(--fondo); }
.taller .mer-edicion { display: flex; flex-direction: column; gap: 9px; min-height: 0; overflow-y: auto; padding: 0 16px 14px; }
.taller .mer-franja { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 14px; font-size: .68rem; font-weight: 800; color: var(--terciario-color); text-transform: uppercase; letter-spacing: .06em; flex-shrink: 0; }
.taller .mer-edicion .mer-franja { padding: 9px 0 0; }
.taller .mer-lienzo { flex: 1; min-height: 0; overflow-y: auto; padding: 0 14px 14px; }
.taller .mer-campos { display: flex; flex-direction: column; }
.taller .mer-aviso { font-size: .73rem; font-weight: 700; border-radius: 7px; padding: 6px 10px; }
.taller .mer-aviso.falta { color: var(--alerta); background: var(--alerta-suave); border: 1px solid var(--alerta); }
.taller .mer-aviso.completo { color: var(--cian-tinta); background: var(--cian-suave); border: 1px solid var(--cian); }
.taller .mer-errores { list-style: none; margin: 0; padding: 10px 18px 0; color: var(--peligro); font-size: .78rem; line-height: 1.4; flex-shrink: 0; max-height: 22vh; overflow-y: auto; }
.taller .mer-errores li + li { margin-top: 4px; }
.taller .mer-ia { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--borde); padding-top: 10px; }
.taller .mer-ia textarea { border: 1px solid var(--borde-control); border-radius: 7px; padding: 6px 9px; font-size: .8rem; outline: none; width: 100%; resize: vertical; }
.taller .mer-ia .nb-add { flex: none; align-self: flex-start; }
.taller .mer-estado { margin: 0; padding: 10px 18px 0; flex-shrink: 0; font-size: .73rem; color: var(--cian-tinta); font-weight: 700; }
.taller .mer-estado.fallo { color: var(--peligro); }