/* =========================================================
   AULA · Eric (profesor de IA) — página de PRUEBA, fuera de
   cualquier módulo. Reutiliza los tokens de .aula (aula.css):
   ámbar (--work) = tu trabajo, índigo (--nav) = navegación y
   estado. Mismo criterio que el resto del aula.
   ========================================================= */

.profesor-prueba-aviso{
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:#ffb020;margin-left:auto;
}

.profesor-shell{max-width:720px;margin:0 auto;padding:40px 20px 80px}

.profesor-cargando{color:var(--ink-faint);font-family:var(--mono);font-size:13px}

/* ---------- cabecera del módulo ---------- */
.profesor-cabecera{margin-bottom:28px}
.profesor-cabecera .mono{color:var(--work-ink);display:block;margin-bottom:6px}
.profesor-cabecera h1{font-size:clamp(22px,4vw,28px);margin:0 0 8px}
.profesor-cabecera p{color:var(--ink-soft);margin:0;font-size:15px;line-height:1.55}

/* ---------- consentimiento ---------- */
.profesor-consentimiento{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;margin-bottom:24px;
}
.profesor-consentimiento p{margin:0 0 14px;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
.profesor-consentimiento label{
  display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--ink);
  cursor:pointer;margin-bottom:16px;
}
.profesor-consentimiento input[type=checkbox]{margin-top:3px;flex:none}

/* ---------- caja de entrega ---------- */
.profesor-caja{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 26px 22px;
}
/* ---------- avatar de Eric (7-oct-2026, maqueta aprobada) ---------- */
.profesor-eric{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.profesor-avatar{
  position:relative;width:96px;height:96px;border-radius:50%;overflow:hidden;flex:none;
  background:var(--nav);display:flex;align-items:center;justify-content:center;
}
.profesor-avatar-inicial{color:#fff;font-family:var(--ds-display);font-weight:700;font-size:36px}
.profesor-avatar img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 22%;
}
.profesor-eric-nombre{display:block;font-family:var(--ds-display);font-weight:700;font-size:21px;color:var(--ink)}
.profesor-eric-tag{
  display:inline-block;margin-top:5px;font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:#12131A;background:#8C9DF5;
  padding:2px 8px;border-radius:4px;
}

/* #profesor-app con ID a propósito: ".aula .body ol{list-style:decimal}"
   (aula.css) tiene más especificidad que una sola clase y, dentro de un
   módulo, ganaba ella — el número de serie del navegador se veía doble
   junto al círculo con el número (7-oct-2026). */
#profesor-app .profesor-pasos{margin:0 0 22px;padding:0;list-style:none;counter-reset:paso}
.profesor-pasos li{
  position:relative;padding-left:34px;margin-bottom:10px;font-size:14.5px;
  line-height:1.5;color:var(--ink-soft);counter-increment:paso;
}
.profesor-pasos li:last-child{margin-bottom:0}
.profesor-pasos li::before{
  content:counter(paso);position:absolute;left:0;top:0;width:22px;height:22px;
  border-radius:50%;background:var(--nav-soft);color:var(--nav);font-family:var(--mono);
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;
}

.profesor-caja h2{font-size:17px;margin:0 0 4px}
.profesor-caja .ayuda{color:var(--ink-faint);font-size:13px;margin:0 0 16px}
.profesor-tabs{display:flex;gap:4px;margin-bottom:14px;border-bottom:1px solid var(--line)}
.profesor-tabs button{
  font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--ink-faint);
  background:none;border:0;padding:8px 4px;margin-right:18px;cursor:pointer;
  border-bottom:2px solid transparent;
}
.profesor-tabs button.es-activa{color:var(--ink);border-bottom-color:var(--nav)}
.profesor-caja textarea{min-height:260px;resize:vertical;font-size:15px;line-height:1.6}
.profesor-contador{
  display:flex;justify-content:space-between;align-items:center;margin:8px 0 18px;
  font-family:var(--mono);font-size:12px;color:var(--ink-faint);
}
.profesor-contador.es-mal{color:#b4432c}
.profesor-dropzone{
  border:1.5px dashed var(--line);border-radius:var(--r-sm);padding:32px 18px;
  text-align:center;color:var(--ink-faint);font-size:14px;cursor:pointer;
}
.profesor-dropzone:hover{border-color:var(--nav);color:var(--nav)}
.profesor-dropzone input{display:none}
.profesor-dropzone .nombre-fichero{display:block;margin-top:8px;color:var(--ink);font-weight:600}

.profesor-aviso{
  background:#FDECEA;border:1px solid #F4C7BF;color:#8a3324;border-radius:var(--r-sm);
  padding:12px 14px;font-size:13.5px;margin:0 0 16px;line-height:1.5;
}

/* ---------- estado: en revisión ---------- */
.profesor-revision{
  background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--nav);
  border-radius:var(--r);padding:26px;display:flex;gap:18px;align-items:flex-start;
}
.profesor-revision .icono{
  width:40px;height:40px;border-radius:50%;background:var(--nav-soft);flex:none;
  display:flex;align-items:center;justify-content:center;
}
.profesor-revision .icono .punto{
  width:10px;height:10px;border-radius:50%;background:var(--nav);
  animation:profesor-pulso 1.4s ease-in-out infinite;
}
@keyframes profesor-pulso{0%,100%{opacity:.35}50%{opacity:1}}
.profesor-revision h2{font-size:17px;margin:0 0 6px}
.profesor-revision p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.55}
.profesor-revision .mono{display:block;margin-top:10px;color:var(--ink-faint);font-size:11.5px}

/* ---------- estado: no evaluable ---------- */
.profesor-no-evaluable{
  background:var(--paper);border:1px solid var(--line);border-left:4px solid #b4432c;
  border-radius:var(--r);padding:26px;
}
.profesor-no-evaluable h2{font-size:17px;margin:0 0 8px;color:#8a3324}
.profesor-no-evaluable p{margin:0 0 16px;color:var(--ink-soft);font-size:14.5px;line-height:1.55}

/* ---------- devolución ---------- */
.profesor-devolucion .cabecera{margin-bottom:24px}
.profesor-devolucion .cabecera .mono{color:var(--work-ink);display:block;margin-bottom:6px}
.profesor-devolucion .cabecera h1{font-size:clamp(20px,4vw,26px);margin:0}

.profesor-bloque{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;margin-bottom:18px;
}
.profesor-bloque h3{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  margin:0 0 14px;color:var(--ink-faint);
}
.profesor-funciona{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.profesor-funciona li{
  position:relative;padding-left:24px;font-size:14.5px;line-height:1.55;color:var(--ink);
}
.profesor-funciona li::before{
  content:"✓";position:absolute;left:0;top:1px;color:#1f8a4c;font-weight:700;
}

.profesor-problema{border-color:var(--work-soft);background:#FFFBF2}
.profesor-problema p{margin:0 0 10px;font-size:15px;line-height:1.6;color:var(--ink)}
.profesor-problema blockquote{
  margin:0;padding:10px 14px;background:var(--paper);border-left:3px solid var(--work);
  border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:13.5px;font-style:italic;
  color:var(--ink-soft);
}

.profesor-marca{
  border:1px solid var(--line);border-radius:var(--r-sm);padding:16px 18px;
  margin-bottom:12px;
}
.profesor-marca:last-child{margin-bottom:0}
.profesor-marca .tecnica{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--work-ink);display:inline-block;margin-bottom:8px;
  background:var(--work-soft);padding:3px 9px;border-radius:999px;
}
.profesor-marca blockquote{
  margin:0 0 10px;padding:0 0 0 12px;border-left:3px solid var(--line);
  font-size:14px;font-style:italic;color:var(--ink-soft);line-height:1.5;
}
.profesor-marca .nota{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink)}

.profesor-ejercicio{background:var(--nav-soft)}
.profesor-ejercicio p{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink)}

@media (max-width:640px){
  .profesor-shell{padding:28px 14px 60px}
  .profesor-revision{flex-direction:column}
}

/* ===== Tarjeta de Eric EMBEBIDA en el módulo: copiada EXACTA de
   eric-tarjeta-referencia.html (7-oct-2026, maqueta aprobada de Nicolás).
   Colores y tipografías en literal, tal cual la referencia — no tokens del
   design system, a propósito: es una pieza aparte, pensada para copiarse
   igual sin depender de que --nav/--ink no cambien nunca. ===== */
/* Fondo y borde iguales a los de «La fotocopia» (aula.css: --aula-fotocopia-papel
   y --aula-fotocopia-sepia), pedido 7-oct-2026: mismo papel color crema para
   el material "de fuera de la lección propiamente dicha" — fotocopia y Eric
   son las dos cosas del módulo que no son la lección en sí. El resto de la
   tarjeta (foto, etiqueta, botones) no cambia. */
.eric{position:relative;margin:76px 0 8px;background:#F7F1E6;border:1px solid #9A5B2E;border-radius:16px;font-family:Manrope,sans-serif;font-size:15px;line-height:1.5;color:#12131A}
.eric *{box-sizing:border-box}
/* La foto sale por encima del borde superior: la mitad queda fuera */
.eric__foto{position:absolute;top:-56px;left:24px;width:112px;height:112px;border-radius:50%;overflow:hidden;background:#3552EF;border:4px solid #FFFFFF;box-shadow:0 0 0 2px #3552EF}
#profesor-app .eric__foto img{display:block;width:100%;height:100%;object-fit:cover;margin:0;max-width:none}
.eric__cabecera{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;min-height:64px;padding:12px 24px 12px 154px;border-bottom:1px solid #12131A}
.eric__quien{display:flex;align-items:center;gap:10px}
.eric__nombre{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px;line-height:1.2}
.eric__etiqueta{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;color:#FFFFFF;background:#3552EF;padding:2px 7px;white-space:nowrap}
.eric__opcional{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:500;letter-spacing:.08em;color:#8A8B95}
.eric__main{display:flex;flex-direction:column;gap:16px;padding:24px}
.eric__titulo{margin:0;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:21px;line-height:1.3}
.eric__intro{margin:0;font-size:15px;color:#3A3B46}
.eric__subir{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:18px 20px;background:#F4F5FA;border:2px dashed #3552EF;border-radius:10px;cursor:pointer}
.eric__subir input{position:absolute;width:1px;height:1px;opacity:0}
.eric__subir-txt{flex:1 1 180px;min-width:0;display:flex;flex-direction:column;gap:2px}
.eric__subir-txt strong{font-size:16px}
.eric__subir-txt span{font-size:14px;color:#6A6B75}
.eric__elegir{background:#12131A;color:#FFFFFF;font-weight:700;font-size:15px;padding:10px 16px;border-radius:8px}
.eric__pegar{align-self:flex-start;background:none;border:0;padding:0;font:inherit;font-size:14px;color:#3552EF;text-decoration:underline;cursor:pointer}
.eric__texto{display:none;width:100%;min-height:180px;padding:12px 14px;border:1px solid #BFC5E6;border-radius:10px;font:inherit;font-size:15px;resize:vertical}
.eric--pegando .eric__texto{display:block}
.eric__pie{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.eric__enviar{background:#3552EF;color:#FFFFFF;border:0;border-radius:8px;font:inherit;font-weight:700;font-size:15px;padding:12px 22px;cursor:pointer}
.eric__nota{font-size:14px;color:#6A6B75}
.eric__aviso{font-size:13px;color:#8A8B95}
@media (max-width:520px){
  .eric{margin-top:60px}
  .eric__foto{top:-44px;left:16px;width:88px;height:88px}
  .eric__cabecera{padding:10px 16px 10px 116px;min-height:56px}
  .eric__main{padding:20px 16px}
}
/* No está en la referencia (ahí es una maqueta estática, sin estados de
   error): mismo criterio tipográfico que el resto de la tarjeta, para el
   aviso si falta texto/fichero o el backend rechaza el envío. */
.eric__error{margin:-4px 0 4px;font-size:13.5px;color:#B4432C}

/* Promoción (7-oct-2026): Eric se ve sin poder usarse todavía, en dos casos
   —sin sesión y con sesión pero fuera de fase 1—, así que tampoco están en
   la referencia (una maqueta de la tarjeta completa, sin estos estados). */
.eric__enviar--enlace{display:inline-block;text-decoration:none;text-align:center}
/* #profesor-app, no .eric__enviar--enlace sola: ".aula a{color:var(--nav)}"
   en aula.css tiene más especificidad que una sola clase y pintaba el texto
   del mismo azul que el fondo del botón — mismo motivo que el ID en
   "#profesor-app .eric__foto img" más abajo en este fichero. Encontrado al
   revisar la primera captura: el botón salía en blanco, sin letra visible. */
#profesor-app .eric__enviar--enlace{color:#FFFFFF}
.eric__proximamente{margin:0;font-size:15px;color:#3A3B46;font-style:italic}