/* ══════════════════════════════════════════════════════════════════════
   profe.música — sistema visual "Cuaderno pautado"
   Papel y tinta, tipografías DM (las mismas de los manuales), una pauta
   musical que ordena en lugar de decorar y color solo para estados.
   Contrastes verificados (WCAG AA): texto ≥ 4.5:1, bordes de control ≥ 3:1.
   ══════════════════════════════════════════════════════════════════════ */

:root {
  --papel: #F4F0E8;
  --hoja: #FBF9F4;
  --hoja-2: #EEE8DC;
  --tinta: #1D1B18;
  --tinta-2: #4A4640;
  --tinta-3: #6B655C;
  --pauta: #DDD5C7;
  --pauta-fuerte: #8C8375;

  --verde: #2F6B52;
  --verde-oscuro: #245641;
  --verde-suave: #E3EFE7;
  --ambar: #855600;
  --ambar-suave: #FBEFD6;
  --azul: #1F4E8C;
  --azul-suave: #E4ECF7;
  --rojo: #A3303B;
  --rojo-suave: #F8E3E3;
  --gris: #5F5A52;
  --gris-suave: #ECE7DE;

  --serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono: 'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --e1: 4px; --e2: 8px; --e3: 12px; --e4: 16px; --e5: 24px; --e6: 32px; --e7: 48px; --e8: 72px;
  --r: 6px; --r-g: 10px;
  --sombra: 0 1px 2px rgba(29, 27, 24, .06), 0 10px 30px rgba(29, 27, 24, .10);
  --ancho: 1120px;
  --barra-alto: 60px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
body {
  margin: 0; background: var(--papel); color: var(--tinta);
  font-family: var(--sans); font-size: 16px; line-height: 1.55;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { margin: 0; line-height: 1.15; font-weight: 400; }
h1, h2 { font-family: var(--serif); letter-spacing: -.01em; }
h3, h4 { font-family: var(--sans); font-weight: 600; }
p { margin: 0 0 var(--e3); }
a { color: var(--verde); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--verde-oscuro); }
img, video, iframe { max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
::selection { background: #CFE3D6; }

:focus-visible { outline: 3px solid var(--azul); outline-offset: 2px; border-radius: 3px; }
h1[tabindex="-1"]:focus, main[tabindex="-1"]:focus { outline: none; }
.solo-lectores {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.saltar {
  position: absolute; left: var(--e3); top: -60px; z-index: 200; background: var(--tinta); color: #fff;
  padding: var(--e2) var(--e4); border-radius: var(--r); text-decoration: none;
}
.saltar:focus { top: var(--e3); color: #fff; }

.eyebrow {
  font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--tinta-3); margin: 0 0 var(--e2);
}
.mono { font-family: var(--mono); font-size: .92em; }
.suave { color: var(--tinta-3); }
.chico { font-size: 14px; }
.envoltura { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 var(--e5); }
.ico { flex: none; vertical-align: middle; }

/* ── botones ───────────────────────────────────────────────────────── */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e2);
  min-height: 42px; padding: 0 var(--e4); border-radius: var(--r); border: 1px solid var(--verde);
  background: var(--verde); color: #fff; font-weight: 600; font-size: 15px; text-decoration: none;
  line-height: 1.1; white-space: nowrap; transition: background .15s, border-color .15s;
}
.boton:hover { background: var(--verde-oscuro); border-color: var(--verde-oscuro); color: #fff; }
.boton:disabled, .boton[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.boton-secundario { background: var(--hoja); color: var(--tinta); border-color: var(--pauta-fuerte); }
.boton-secundario:hover { background: var(--hoja-2); color: var(--tinta); border-color: var(--tinta-3); }
.boton-fantasma { background: transparent; color: var(--verde); border-color: transparent; padding: 0 var(--e3); }
.boton-fantasma:hover { background: var(--verde-suave); color: var(--verde-oscuro); border-color: transparent; }
.boton-peligro { background: var(--rojo); border-color: var(--rojo); }
.boton-peligro:hover { background: #86262F; border-color: #86262F; }
.boton-chico { min-height: 34px; padding: 0 var(--e3); font-size: 14px; }
.boton-claro { background: #fff; color: var(--tinta); border-color: #fff; }
.boton-icono {
  display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: var(--r);
  border: 1px solid transparent; background: transparent; color: var(--tinta-2);
}
.boton-icono:hover { background: var(--hoja-2); color: var(--tinta); }
.acciones { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; }

/* ── formularios ───────────────────────────────────────────────────── */
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo > label, .etiqueta { font-size: 14px; font-weight: 600; color: var(--tinta-2); }
.campo .ayuda, .ayuda { font-size: 13px; color: var(--tinta-3); margin: 0; }
.campo-error { font-size: 13px; color: var(--rojo); font-weight: 600; min-height: 0; }
.campo-error:empty { display: none; }
input[type=text], input[type=password], input[type=email], input[type=date], input[type=time], input[type=number],
input[type=datetime-local], input[type=search], input[type=url], select, textarea {
  width: 100%; min-height: 42px; padding: 8px 12px; border: 1px solid var(--pauta-fuerte); border-radius: var(--r);
  background: #fff; color: var(--tinta); font-size: 16px;
}
textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { outline: 3px solid color-mix(in srgb, var(--azul) 55%, transparent); outline-offset: 0; border-color: var(--azul); }
[aria-invalid="true"] { border-color: var(--rojo) !important; background: #FFF8F8; }
.check { display: flex; gap: var(--e2); align-items: flex-start; font-size: 15px; }
.check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--verde); flex: none; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; font-weight: 600; font-size: 14px; color: var(--tinta-2); margin-bottom: 6px; }
.fila-campos { display: grid; gap: var(--e3); grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.segmentado { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--pauta-fuerte); border-radius: var(--r); overflow: hidden; background: #fff; }
.segmentado label, .segmentado button {
  position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; font-size: 14px; font-weight: 600;
  color: var(--tinta-2); cursor: pointer; border: 0; background: transparent; min-height: 40px;
}
.segmentado label + label, .segmentado button + button { border-left: 1px solid var(--pauta); }
.segmentado input { position: absolute; opacity: 0; pointer-events: none; }
.segmentado label:has(input:checked), .segmentado button[aria-pressed="true"] { background: var(--tinta); color: #fff; }
.segmentado label:has(input:focus-visible) { outline: 3px solid var(--azul); outline-offset: -3px; }

/* ── insignias de estado ───────────────────────────────────────────── */
.insignia {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; line-height: 1.5; white-space: nowrap; border: 1px solid transparent;
}
.insignia::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.insignia-sin-punto::before { display: none; }
.i-publicada, .i-aprobado, .i-dictada { background: var(--verde-suave); color: var(--verde); }
.i-programada { background: var(--azul-suave); color: var(--azul); }
.i-borrador, .i-importado, .i-en_revision { background: var(--ambar-suave); color: var(--ambar); }
.i-suspendida { background: var(--rojo-suave); color: var(--rojo); }
.i-pausada, .i-archivada, .i-archivado, .i-planificada { background: var(--gris-suave); color: var(--gris); }
.i-reprogramada { background: var(--azul-suave); color: var(--azul); }
.i-alerta { background: var(--rojo-suave); color: var(--rojo); }
.i-aviso { background: var(--ambar-suave); color: var(--ambar); }
.i-neutra { background: var(--gris-suave); color: var(--gris); }

.curso-punto { display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: none; }

/* ── mensajes en página ────────────────────────────────────────────── */
.mensaje {
  display: flex; gap: var(--e3); align-items: flex-start; padding: var(--e3) var(--e4); border-radius: var(--r);
  border: 1px solid; font-size: 15px; margin: 0 0 var(--e4);
}
.mensaje p { margin: 0; }
.mensaje-info { background: var(--azul-suave); border-color: #BBCDE6; color: #183D6E; }
.mensaje-alerta { background: var(--rojo-suave); border-color: #E7B9BC; color: #7C2129; }
.mensaje-aviso { background: var(--ambar-suave); border-color: #EBCF9A; color: #6A4400; }
.mensaje-ok { background: var(--verde-suave); border-color: #B9D7C4; color: #1F4B39; }
.mensaje .acciones { margin-top: var(--e2); }
.detalle-lista { margin: var(--e2) 0 0; padding-left: 1.1em; font-size: 14px; }

/* ── avisos flotantes ──────────────────────────────────────────────── */
.avisos-vivos { position: fixed; z-index: 300; left: 50%; bottom: var(--e5); transform: translateX(-50%); display: grid; gap: var(--e2); width: min(560px, calc(100% - 32px)); }
.toast {
  display: flex; align-items: center; gap: var(--e3); padding: var(--e3) var(--e3) var(--e3) var(--e4);
  border-radius: var(--r-g); background: var(--tinta); color: #fff; box-shadow: var(--sombra); font-size: 15px;
  animation: entrar .2s ease-out;
}
.toast-error { background: #7C2129; }
.toast-texto { flex: 1; }
.toast-detalle { display: block; font-size: 13px; opacity: .85; white-space: pre-line; margin-top: 2px; }
.toast-cerrar { background: transparent; border: 0; color: #fff; opacity: .8; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--r); }
.toast-cerrar:hover { opacity: 1; background: rgba(255, 255, 255, .12); }
@keyframes entrar { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ── diálogos y panel lateral ──────────────────────────────────────── */
.dialogo {
  border: 0; padding: 0; background: transparent; color: inherit; max-width: calc(100% - 24px); width: 560px;
  max-height: calc(100% - 24px);
}
.dialogo-ancho { width: 860px; }
.dialogo::backdrop { background: rgba(29, 27, 24, .45); }
.dialogo-marco { background: var(--hoja); border-radius: var(--r-g); box-shadow: var(--sombra); display: flex; flex-direction: column; max-height: calc(100vh - 24px); }
.dialogo-cabeza { display: flex; justify-content: space-between; gap: var(--e4); align-items: flex-start; padding: var(--e5) var(--e5) var(--e3); border-bottom: 1px solid var(--pauta); }
.dialogo-cabeza h2 { font-size: 26px; }
.dialogo-cabeza .eyebrow { margin-bottom: 4px; }
.dialogo-sub { margin: 6px 0 0; color: var(--tinta-3); font-size: 14px; }
.dialogo-cuerpo { padding: var(--e4) var(--e5) var(--e5); overflow-y: auto; display: flex; flex-direction: column; gap: var(--e4); }
.dialogo-pie { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--e2); padding: var(--e3) var(--e5); border-top: 1px solid var(--pauta); background: var(--hoja); border-radius: 0 0 var(--r-g) var(--r-g); }
.dialogo-pie .separador { flex: 1; }
.dialogo-pie .boton-fantasma { padding: 0 var(--e2); }
.dialogo-lado { margin: 0 0 0 auto; height: 100%; max-height: 100%; width: min(620px, 100%); max-width: 100%; }
.dialogo-lado .dialogo-marco { height: 100%; max-height: 100vh; border-radius: 0; }
.dialogo-lado .dialogo-pie { border-radius: 0; }
.dialogo[open] { animation: entrar .18s ease-out; }
.seccion-editor { border-top: 1px solid var(--pauta); padding-top: var(--e4); display: flex; flex-direction: column; gap: var(--e3); }
.seccion-editor:first-child { border-top: 0; padding-top: 0; }
.seccion-editor > h3 { font-size: 15px; display: flex; align-items: center; gap: var(--e2); }
.seccion-editor > h3 .suave { font-weight: 400; font-size: 13px; }

/* ══ PÚBLICO ═══════════════════════════════════════════════════════ */
.barra-publica { border-bottom: 1px solid var(--pauta); background: var(--papel); position: sticky; top: 0; z-index: 50; }
.barra-publica .envoltura { display: flex; align-items: center; gap: var(--e4); min-height: var(--barra-alto); }
.marca { font-family: var(--serif); font-size: 24px; color: var(--tinta); text-decoration: none; letter-spacing: -.01em; white-space: nowrap; }
.marca span { color: var(--verde); }
.marca:hover { color: var(--tinta); }
.barra-publica nav { margin-left: auto; display: flex; gap: var(--e2); align-items: center; }
.barra-publica nav a:not(.boton) { color: var(--tinta-2); text-decoration: none; font-weight: 500; padding: 8px 10px; border-radius: var(--r); }
.barra-publica nav a:not(.boton):hover { background: var(--hoja-2); color: var(--tinta); }

.portada { padding: var(--e7) 0 var(--e6); position: relative; }
.portada::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .55;
  background-image: repeating-linear-gradient(to bottom, transparent 0 27px, var(--pauta) 27px 28px);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 85%);
}
.portada .envoltura { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .9fr); grid-template-areas: "texto ingreso" "pasos ingreso"; column-gap: var(--e7); row-gap: 0; align-items: start; }
.portada-texto { grid-area: texto; }
.portada .pasos { grid-area: pasos; }
.portada .ingreso { grid-area: ingreso; }
.portada h1 { font-size: clamp(40px, 6vw, 68px); line-height: 1.02; margin-bottom: var(--e4); }
.portada h1 em { font-style: italic; color: var(--verde); }
.bajada { font-size: 19px; color: var(--tinta-2); max-width: 34em; line-height: 1.55; }
.pasos { list-style: none; counter-reset: paso; padding: 0; margin: var(--e5) 0 0; display: grid; gap: var(--e3); max-width: 34em; }
.pasos li { counter-increment: paso; display: grid; grid-template-columns: 36px 1fr; gap: var(--e3); align-items: baseline; font-size: 16px; color: var(--tinta-2); }
.pasos li::before { content: counter(paso); font-family: var(--mono); font-size: 13px; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--pauta-fuerte); display: grid; place-items: center; color: var(--tinta); background: var(--hoja); }
.pasos b { color: var(--tinta); font-weight: 600; }

.ingreso { background: var(--hoja); border: 1px solid var(--pauta); border-radius: var(--r-g); padding: var(--e5); box-shadow: 0 1px 0 rgba(29, 27, 24, .04); }
.ingreso h2 { font-size: 28px; margin-bottom: 4px; }
.ingreso form { display: grid; gap: var(--e3); margin-top: var(--e4); }
.ingreso .boton { width: 100%; min-height: 48px; font-size: 16px; }
.ingreso .nota-docente { margin: var(--e4) 0 0; padding-top: var(--e3); border-top: 1px solid var(--pauta); font-size: 14px; color: var(--tinta-3); }
.error-form { color: var(--rojo); font-weight: 600; font-size: 14px; margin: 0; }
.error-form:empty { display: none; }

.que-hay { padding: var(--e6) 0; }
.que-hay h2, .novedades h2, .seccion-titulo { font-size: 30px; margin-bottom: var(--e4); }
.que-hay ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--tinta); }
.que-hay li { padding: var(--e4) var(--e4) var(--e4) 0; border-right: 1px solid var(--pauta); }
.que-hay li + li { padding-left: var(--e4); }
.que-hay li:last-child { border-right: 0; }
.que-hay h3 { font-size: 17px; margin: var(--e2) 0 6px; }
.que-hay p { font-size: 15px; color: var(--tinta-2); margin: 0; }
.que-hay .mono { color: var(--verde); }

.novedades { padding: var(--e6) 0 var(--e7); }
.novedades .envoltura { max-width: 820px; }
.novedad { border-top: 1px solid var(--pauta); padding: var(--e5) 0; display: grid; grid-template-columns: 130px 1fr; gap: var(--e4); }
.novedad:first-of-type { border-top: 1px solid var(--tinta); }
.novedad-fecha { font-family: var(--mono); font-size: 13px; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .05em; }
.novedad-fecha b { display: block; color: var(--verde); font-weight: 500; }
.novedad h3 { font-family: var(--serif); font-weight: 400; font-size: 25px; margin-bottom: var(--e2); }
.novedad-cuerpo { color: var(--tinta-2); }
.novedad-fotos { display: flex; gap: var(--e2); flex-wrap: wrap; margin-top: var(--e3); }
.novedad-fotos button { padding: 0; border: 0; background: none; border-radius: var(--r); overflow: hidden; }
.novedad-fotos img { width: 170px; height: 120px; object-fit: cover; display: block; }
.video-16-9 { aspect-ratio: 16 / 9; max-width: 560px; margin-top: var(--e3); }
.video-16-9 iframe { width: 100%; height: 100%; border: 0; border-radius: var(--r); }

.manuales-cta { border-top: 1px solid var(--pauta); border-bottom: 1px solid var(--pauta); padding: var(--e5) 0; background: var(--hoja); }
.manuales-cta .envoltura { display: flex; justify-content: space-between; gap: var(--e4); align-items: center; flex-wrap: wrap; }
.manuales-cta h2 { font-size: 26px; }
.manuales-cta p { margin: 4px 0 0; color: var(--tinta-2); }
.pie { padding: var(--e5) 0 var(--e7); font-size: 14px; color: var(--tinta-3); }
.pie .envoltura { display: flex; gap: var(--e4); flex-wrap: wrap; justify-content: space-between; }
.pie a { color: var(--tinta-2); }

.ingreso-docente { max-width: 440px; margin: var(--e7) auto; padding: 0 var(--e4); }

/* ══ ESTUDIANTE ════════════════════════════════════════════════════ */
.barra-aula .curso-nombre { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; padding-left: var(--e4); border-left: 1px solid var(--pauta); }
.barra-aula .curso-nombre b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.barra-aula .curso-nombre span { font-size: 13px; color: var(--tinta-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aula { padding: var(--e6) 0 var(--e8); }
.aula-grilla { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); gap: var(--e6); align-items: start; }
.aula-col { display: flex; flex-direction: column; gap: var(--e6); min-width: 0; }

.proxima { position: relative; padding: var(--e5); background: var(--hoja); border: 1px solid var(--pauta); border-left: 4px solid var(--verde); border-radius: var(--r-g); }
.proxima .cuando { font-family: var(--serif); font-size: clamp(30px, 4vw, 40px); line-height: 1.08; margin: 0 0 6px; }
.proxima .cuando small { display: block; font-family: var(--sans); font-size: 16px; color: var(--tinta-3); margin-top: 6px; }
.proxima .tema { font-size: 21px; font-weight: 600; margin: var(--e3) 0 2px; }
.proxima .unidad { color: var(--tinta-3); font-size: 15px; margin: 0; }
.bloque-preparar { margin-top: var(--e4); padding-top: var(--e4); border-top: 1px dashed var(--pauta-fuerte); display: grid; gap: var(--e3); }
.bloque-preparar h3 { font-size: 13px; font-family: var(--mono); font-weight: 500; text-transform: uppercase; letter-spacing: .07em; color: var(--tinta-3); margin-bottom: 4px; }
.bloque-preparar p { margin: 0; font-size: 17px; }
.aviso-clase { display: flex; gap: var(--e2); align-items: flex-start; background: var(--ambar-suave); color: #6A4400; border-radius: var(--r); padding: var(--e2) var(--e3); margin-top: var(--e3); font-weight: 500; }
.sin-proxima { color: var(--tinta-2); }

.lista-materiales { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.lista-materiales a, .lista-materiales .item {
  display: flex; gap: var(--e3); align-items: center; padding: 10px 12px; border-radius: var(--r); text-decoration: none; color: var(--tinta);
  background: #fff; border: 1px solid var(--pauta);
}
.lista-materiales a:hover { border-color: var(--verde); color: var(--tinta); }
.lista-materiales .tipo { font-family: var(--mono); font-size: 12px; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .05em; margin-left: auto; white-space: nowrap; }
.lista-materiales .ico { color: var(--verde); }

.seccion-aula h2 { font-size: 28px; margin-bottom: var(--e3); display: flex; align-items: baseline; gap: var(--e3); }
.seccion-aula h2 .contador { font-family: var(--mono); font-size: 14px; color: var(--tinta-3); }
.entregas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--tinta); }
.entregas li { padding: var(--e3) 0; border-bottom: 1px solid var(--pauta); display: grid; gap: 2px; }
.entregas .vence { font-family: var(--mono); font-size: 13px; color: var(--ambar); }
.entregas .vence.urgente { color: var(--rojo); font-weight: 500; }
.entregas a { font-weight: 600; }
.avisos-aula { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e3); }
.avisos-aula li { border-left: 3px solid var(--verde); padding: 2px 0 2px var(--e3); }
.avisos-aula .tipo { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); }
.avisos-aula p { margin: 2px 0 0; }

/* Cronograma de estudiante: una pauta vertical con cabezas de nota. */
.pauta-clases { list-style: none; margin: 0; padding: 0; position: relative; }
.pauta-clases::before { content: ''; position: absolute; left: 11px; top: 6px; bottom: 6px; width: 2px; background: var(--pauta); }
.pauta-clases > li { position: relative; padding: 0 0 var(--e4) 40px; }
.cabeza-nota {
  position: absolute; left: 3px; top: 7px; width: 18px; height: 13px; border-radius: 50%; transform: rotate(-22deg);
  background: var(--papel); border: 2px solid var(--tinta-3);
}
.nota-pasada .cabeza-nota { background: var(--tinta-3); }
.nota-proxima .cabeza-nota { background: var(--verde); border-color: var(--verde); box-shadow: 0 0 0 4px var(--verde-suave); }
.nota-suspendida .cabeza-nota { background: var(--papel); border-color: var(--rojo); }
.nota-suspendida .cabeza-nota::after { content: ''; position: absolute; left: -4px; right: -4px; top: 50%; height: 2px; background: var(--rojo); transform: rotate(-30deg); }
.pauta-clases a.clase-enlace { display: block; text-decoration: none; color: var(--tinta); border-radius: var(--r); padding: 2px 6px; margin: -2px -6px; }
.pauta-clases a.clase-enlace:hover { background: var(--hoja-2); color: var(--tinta); }
.pauta-clases .cuando-corto { font-family: var(--mono); font-size: 13px; color: var(--tinta-3); display: block; }
.pauta-clases .titulo { font-weight: 600; }
.pauta-clases .meta { font-size: 14px; color: var(--tinta-3); display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; margin-top: 2px; }
.nota-pasada .titulo { color: var(--tinta-2); font-weight: 500; }
.grupo-pauta { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .07em; color: var(--tinta-3); margin: var(--e4) 0 var(--e3) 40px; }
details.anteriores > summary { cursor: pointer; font-weight: 600; color: var(--verde); margin: 0 0 var(--e3) 40px; list-style: none; }
details.anteriores > summary::-webkit-details-marker { display: none; }
details.anteriores > summary::before { content: '＋ '; }
details.anteriores[open] > summary::before { content: '－ '; }

.materiales-curso .unidad-materiales + .unidad-materiales { margin-top: var(--e4); }
.materiales-curso h3 { font-size: 15px; margin-bottom: var(--e2); color: var(--tinta-2); }

/* Lector */
.lector { padding: var(--e6) 0 var(--e8); }
.lector .envoltura { max-width: 860px; }
.migas { font-size: 14px; margin-bottom: var(--e4); display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; }
.migas a { display: inline-flex; align-items: center; gap: 4px; }
.lector h1 { font-size: clamp(32px, 5vw, 48px); margin: var(--e2) 0 var(--e3); }
.lector .bajada { margin-bottom: var(--e4); }
.ficha-clase { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--e3) var(--e5); padding: var(--e4) 0; margin: var(--e4) 0; border-top: 1px solid var(--pauta); border-bottom: 1px solid var(--pauta); }
.ficha-clase dt { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); }
.ficha-clase dd { margin: 2px 0 0; font-size: 16px; }
.contenido { font-size: 18px; line-height: 1.72; color: #26231F; }
.contenido h1, .contenido h2 { font-size: 30px; margin: var(--e6) 0 var(--e3); }
.contenido h3 { font-size: 20px; margin: var(--e5) 0 var(--e2); }
.contenido p, .contenido ul, .contenido ol { margin: 0 0 var(--e4); }
.contenido blockquote { margin: 0 0 var(--e4); padding: var(--e2) var(--e4); border-left: 3px solid var(--pauta-fuerte); color: var(--tinta-2); background: var(--hoja); }
.contenido table { border-collapse: collapse; width: 100%; margin: 0 0 var(--e4); font-size: 16px; display: block; overflow-x: auto; }
.contenido th, .contenido td { border: 1px solid var(--pauta); padding: 6px 10px; text-align: left; }
.contenido img { border-radius: var(--r); }
.marco-externo { width: 100%; min-height: 70vh; border: 1px solid var(--pauta); border-radius: var(--r); background: #fff; display: block; margin-top: var(--e4); }

/* ══ PANEL DOCENTE ═════════════════════════════════════════════════ */
.panel { display: grid; grid-template-columns: 250px minmax(0, 1fr); min-height: 100vh; }
.panel-nav { position: sticky; top: 0; height: 100vh; overflow-y: auto; background: var(--hoja); border-right: 1px solid var(--pauta); display: flex; flex-direction: column; }
.panel-nav .marca { font-size: 22px; padding: var(--e5) var(--e5) 2px; display: block; }
.panel-nav .rotulo { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-3); padding: 0 var(--e5) var(--e4); border-bottom: 1px solid var(--pauta); margin: 0; }
.panel-nav nav { padding: var(--e3); display: flex; flex-direction: column; gap: 2px; flex: 1; }
.panel-nav nav a {
  display: flex; align-items: center; gap: var(--e3); padding: 9px var(--e3); border-radius: var(--r); color: var(--tinta-2);
  text-decoration: none; font-weight: 500; font-size: 15px;
}
.panel-nav nav a:hover { background: var(--hoja-2); color: var(--tinta); }
.panel-nav nav a[aria-current="page"] { background: var(--tinta); color: #fff; }
.panel-nav nav a .contador { margin-left: auto; font-family: var(--mono); font-size: 12px; background: var(--ambar-suave); color: var(--ambar); border-radius: 999px; padding: 0 7px; }
.panel-nav nav a[aria-current="page"] .contador { background: rgba(255, 255, 255, .18); color: #fff; }
.panel-nav .separador-nav { height: 1px; background: var(--pauta); margin: var(--e2) var(--e3); }
.panel-nav .pie-nav { padding: var(--e3); border-top: 1px solid var(--pauta); display: grid; gap: var(--e2); }
.panel-principal { min-width: 0; display: flex; flex-direction: column; }
.panel-barra {
  position: sticky; top: 0; z-index: 40; min-height: 64px; display: flex; align-items: center; gap: var(--e3); padding: var(--e3) var(--e6);
  background: var(--papel); border-bottom: 1px solid var(--pauta);
}
.panel-barra h1 { font-size: 28px; }
.panel-barra .sub { font-size: 14px; color: var(--tinta-3); margin: 2px 0 0; }
.panel-barra .acciones { margin-left: auto; }
.boton-menu { display: none; }
.panel-contenido { padding: var(--e5) var(--e6) 120px; max-width: 1280px; width: 100%; }

.tarjeta { background: var(--hoja); border: 1px solid var(--pauta); border-radius: var(--r-g); padding: var(--e4) var(--e5); }
.bloque + .bloque { margin-top: var(--e6); }
.bloque-titulo { display: flex; align-items: baseline; gap: var(--e3); flex-wrap: wrap; margin-bottom: var(--e3); }
.bloque-titulo h2 { font-size: 26px; }
.bloque-titulo .acciones { margin-left: auto; }

/* resumen */
.hoy-linea { font-family: var(--serif); font-size: 22px; margin: 0 0 var(--e4); }
.alertas-lista { list-style: none; margin: 0 0 var(--e5); padding: 0; border: 1px solid var(--pauta); border-radius: var(--r-g); background: var(--hoja); }
.alerta-fila { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 6px var(--e3); align-items: center; padding: 10px var(--e4); border-top: 1px solid var(--pauta); }
.alerta-fila:first-child { border-top: 0; }
.alerta-fila p { margin: 0; }
.alerta-fila .ico { color: var(--tinta-3); align-self: start; margin-top: 3px; }
.alerta-fila.nivel-alerta .ico { color: var(--rojo); }
.alerta-fila.nivel-aviso .ico { color: var(--ambar); }
.alerta-fila.nivel-info .ico { color: var(--azul); }
.tabla { width: 100%; border-collapse: collapse; font-size: 15px; }
.tabla th { text-align: left; font-family: var(--mono); font-weight: 500; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--tinta-3); padding: 0 var(--e3) var(--e2); border-bottom: 1px solid var(--tinta); white-space: nowrap; }
.tabla td { padding: var(--e3); border-bottom: 1px solid var(--pauta); vertical-align: top; }
.tabla tr:hover td { background: color-mix(in srgb, var(--hoja-2) 45%, transparent); }
.tabla .num { font-family: var(--mono); text-align: right; white-space: nowrap; }
.tabla .num a { font-weight: 500; }
.tabla-cursos td:first-child { min-width: 200px; }
.cero { color: var(--tinta-3); opacity: .7; }
.envoltura-tabla { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.agenda-semana { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--tinta); }
.agenda-dia { border-right: 1px solid var(--pauta); padding: var(--e3) var(--e3) var(--e4); min-height: 140px; }
.agenda-dia:last-child { border-right: 0; }
.agenda-dia.es-hoy { background: color-mix(in srgb, var(--verde-suave) 60%, transparent); }
.agenda-dia.sin-clases { background: repeating-linear-gradient(-45deg, transparent 0 8px, var(--gris-suave) 8px 9px); }
.agenda-dia h3 { font-family: var(--mono); font-weight: 500; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--e2); display: flex; justify-content: space-between; gap: var(--e2); flex-wrap: wrap; }
.agenda-dia .motivo-dia { font-size: 12px; color: var(--rojo); text-transform: none; letter-spacing: 0; font-family: var(--sans); font-weight: 600; }
.bloque-clase {
  display: block; width: 100%; text-align: left; border: 1px solid var(--pauta); border-left: 4px solid var(--c, var(--verde)); background: #fff;
  border-radius: var(--r); padding: 6px 8px; margin-bottom: 6px; font-size: 14px; line-height: 1.3; color: var(--tinta);
}
.bloque-clase:hover { border-color: var(--tinta-3); border-left-color: var(--c, var(--verde)); }
.bloque-clase .h { font-family: var(--mono); font-size: 12px; color: var(--tinta-3); display: block; }
.bloque-clase .t { font-weight: 600; display: block; }
.bloque-clase .c { font-size: 12.5px; color: var(--tinta-3); display: block; }
.bloque-clase .marcas { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.bloque-clase.es-suspendida { opacity: .75; text-decoration: line-through; text-decoration-color: var(--rojo); }
.bloque-clase .insignia { font-size: 11px; padding: 0 6px; }

/* cronograma */
.herramientas { display: flex; flex-wrap: wrap; gap: var(--e3); align-items: end; margin-bottom: var(--e3); }
.herramientas .campo { min-width: 170px; }
.herramientas .campo-curso { min-width: 240px; }
.herramientas .buscar { flex: 1; min-width: 200px; }
.boton-mas-filtros { display: none !important; }
.filtros-rapidos { display: flex; gap: var(--e2); flex-wrap: wrap; margin: 0 0 var(--e4); }
.filtro-chip {
  border: 1px solid var(--pauta-fuerte); background: #fff; border-radius: 999px; padding: 4px 12px; font-size: 14px; font-weight: 500; color: var(--tinta-2);
  display: inline-flex; gap: 6px; align-items: center; min-height: 34px;
}
.filtro-chip b { font-family: var(--mono); font-weight: 500; }
.filtro-chip[aria-pressed="true"] { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.filtro-chip.alerta b { color: var(--rojo); }
.filtro-chip[aria-pressed="true"].alerta b { color: #FFD7DA; }

.grupo-semana { margin-top: var(--e5); }
.grupo-semana > h3 { font-family: var(--mono); font-weight: 500; font-size: 13px; text-transform: uppercase; letter-spacing: .07em; color: var(--tinta-3); padding-bottom: 6px; border-bottom: 1px solid var(--tinta); display: flex; gap: var(--e3); align-items: center; }
.grupo-semana > h3 .es-actual { color: var(--verde); }
.fila-clase {
  display: grid; grid-template-columns: 30px 150px minmax(0, 1fr) auto; gap: var(--e3); align-items: start;
  padding: var(--e3) 0; border-bottom: 1px solid var(--pauta);
}
.fila-clase.seleccionada { background: color-mix(in srgb, var(--azul-suave) 70%, transparent); }
.fila-clase.es-hoy .fc-fecha b { color: var(--verde); }
.fila-clase .fc-sel { padding-top: 4px; display: flex; justify-content: center; }
.fila-clase .fc-sel input { width: 20px; height: 20px; accent-color: var(--azul); }
.fc-fecha { font-family: var(--mono); font-size: 14px; line-height: 1.35; }
.fc-fecha b { font-weight: 500; display: block; font-size: 15px; color: var(--tinta); }
.fc-fecha span { color: var(--tinta-3); font-size: 13px; }
.fc-fecha .sin { color: var(--ambar); }
.fc-principal { min-width: 0; }
.fc-titulo { font-weight: 600; font-size: 16px; color: var(--tinta); text-align: left; background: none; border: 0; padding: 0; line-height: 1.3; }
.fc-titulo:hover { color: var(--verde); text-decoration: underline; }
.fc-meta { font-size: 13.5px; color: var(--tinta-3); display: flex; gap: 6px var(--e3); flex-wrap: wrap; align-items: center; margin-top: 3px; }
.fc-meta .curso { display: inline-flex; gap: 6px; align-items: center; color: var(--tinta-2); font-weight: 500; }
.fc-estados { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.fc-pendientes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.fc-acciones { display: flex; gap: 2px; }
.fila-clase.es-suspendida .fc-titulo { text-decoration: line-through; text-decoration-color: var(--rojo); }

.barra-lote {
  position: fixed; left: 250px; right: 0; bottom: 0; z-index: 60; background: var(--tinta); color: #fff;
  padding: var(--e3) var(--e6); display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; box-shadow: 0 -8px 30px rgba(0, 0, 0, .15);
}
.barra-lote b { margin-right: var(--e3); font-weight: 600; }
.barra-lote .boton { min-height: 36px; font-size: 14px; }
.barra-lote .boton-secundario { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); }
.barra-lote .boton-secundario:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.barra-lote .boton-fantasma { color: #fff; }
.barra-lote .boton-fantasma:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.menu-lote { position: relative; }

/* semana */
.nav-periodo { display: flex; gap: var(--e2); align-items: center; flex-wrap: wrap; margin: 0 0 var(--e3); }
.nav-periodo h2 { font-size: 22px; margin: 0 var(--e3); }
.semana { display: grid; grid-template-columns: repeat(var(--dias, 5), minmax(0, 1fr)); border: 1px solid var(--pauta); border-radius: var(--r-g); overflow: hidden; background: var(--hoja); }
.semana .agenda-dia { min-height: 320px; }

/* mes */
.mes { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--pauta); border-left: 1px solid var(--pauta); background: var(--hoja); }
.mes-cab { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); padding: 6px 8px; border-right: 1px solid var(--pauta); border-bottom: 1px solid var(--pauta); background: var(--papel); }
.mes-dia { min-height: 108px; border-right: 1px solid var(--pauta); border-bottom: 1px solid var(--pauta); padding: 4px 6px 6px; font-size: 13px; display: flex; flex-direction: column; gap: 3px; }
.mes-dia.fuera { background: var(--papel); color: var(--tinta-3); }
.mes-dia.es-hoy { box-shadow: inset 0 0 0 2px var(--verde); }
.mes-dia.sin-clases { background: repeating-linear-gradient(-45deg, var(--hoja) 0 8px, var(--gris-suave) 8px 9px); }
.mes-dia .num { font-family: var(--mono); font-size: 13px; display: flex; justify-content: space-between; gap: 4px; }
.mes-dia .motivo-dia { font-size: 11px; color: var(--rojo); font-weight: 600; line-height: 1.2; }
.mes-dia .bloque-clase { font-size: 12px; padding: 3px 6px; margin: 0; }

/* importar */
.pasos-importar { list-style: none; margin: 0 0 var(--e5); padding: 0; display: flex; gap: var(--e2); flex-wrap: wrap; counter-reset: pi; }
.pasos-importar li { counter-increment: pi; font-size: 14px; color: var(--tinta-3); display: flex; align-items: center; gap: 6px; }
.pasos-importar li::before { content: counter(pi); font-family: var(--mono); width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--pauta-fuerte); display: grid; place-items: center; font-size: 12px; }
.pasos-importar li[aria-current="step"] { color: var(--tinta); font-weight: 600; }
.pasos-importar li[aria-current="step"]::before { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.pasos-importar li.hecho::before { background: var(--verde); color: #fff; border-color: var(--verde); content: '✓'; }
.pasos-importar li + li::after { display: none; }
.dos-columnas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e5); }
.dos-columnas + .bloque, .confirmacion + .bloque, .mensaje + .bloque { margin-top: var(--e6); }
.grupo-pie { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; }
.grupo-pie-final { margin-left: auto; }
.zona-archivo { border: 2px dashed var(--pauta-fuerte); border-radius: var(--r-g); padding: var(--e5); text-align: center; background: #fff; display: grid; gap: var(--e3); justify-items: center; }
.zona-archivo.arrastrando { border-color: var(--verde); background: var(--verde-suave); }
.resumen-plan { display: flex; gap: var(--e2); flex-wrap: wrap; margin: 0 0 var(--e4); }
.cifra { background: #fff; border: 1px solid var(--pauta); border-radius: var(--r); padding: var(--e2) var(--e4); min-width: 120px; }
.cifra b { display: block; font-family: var(--serif); font-size: 30px; font-weight: 400; line-height: 1.1; }
.cifra span { font-size: 13px; color: var(--tinta-3); }
.cifra.alta b { color: var(--verde); }
.cifra.modificacion b { color: var(--azul); }
.cifra.error b { color: var(--rojo); }
.tabla-plan td { font-size: 14px; }
.tabla-plan .cambios { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.tabla-plan .cambios li { font-size: 13px; }
.tabla-plan .cambios del { color: var(--rojo); text-decoration-thickness: 1px; }
.tabla-plan .cambios ins { color: var(--verde); text-decoration: none; font-weight: 600; }
.tabla-plan .errores { color: var(--rojo); font-weight: 600; margin: 0; padding-left: 1em; }
.tabla-plan .avisos { color: var(--ambar); margin: 4px 0 0; padding-left: 1em; }
.confirmacion { background: var(--hoja); border: 1px solid var(--pauta-fuerte); border-radius: var(--r-g); padding: var(--e4) var(--e5); display: grid; gap: var(--e3); margin-top: var(--e5); }
.columnas-doc { font-size: 14px; }
.columnas-doc code { font-family: var(--mono); font-size: 13px; background: var(--hoja-2); padding: 1px 6px; border-radius: 4px; }

/* biblioteca */
.fila-material { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--e3); padding: var(--e3) 0; border-bottom: 1px solid var(--pauta); }
.fila-material .fm-titulo { font-weight: 600; font-size: 16px; }
.fila-material .fm-meta { font-size: 13.5px; color: var(--tinta-3); display: flex; gap: 6px var(--e3); flex-wrap: wrap; align-items: center; margin-top: 3px; }
.codigo { font-family: var(--mono); font-size: 13px; background: var(--hoja-2); border-radius: 4px; padding: 1px 6px; color: var(--tinta-2); border: 0; }
button.codigo:hover { background: var(--pauta); }

/* ajustes */
.lista-edicion { display: grid; gap: var(--e2); }
.fila-edicion { display: flex; flex-wrap: wrap; gap: var(--e2) var(--e3); align-items: flex-end; background: #fff; border: 1px solid var(--pauta); border-radius: var(--r); padding: var(--e3); }
.fila-edicion > .campo { flex: 1 1 150px; }
.fila-edicion > div:not(.campo) { flex: 1 1 220px; }
.fila-edicion > .acciones { flex: 0 0 auto; }
.fila-edicion .check { align-self: center; min-height: 42px; align-items: center; }
.curso-horario { padding: var(--e4) 0; border-bottom: 1px solid var(--pauta); display: grid; gap: var(--e3); }
.curso-horario h3 { font-size: 18px; display: flex; gap: var(--e2); align-items: center; flex-wrap: wrap; }

.vacio { text-align: center; padding: var(--e7) var(--e4); border: 1px dashed var(--pauta-fuerte); border-radius: var(--r-g); color: var(--tinta-2); background: color-mix(in srgb, var(--hoja) 70%, transparent); }
.vacio h3 { font-family: var(--serif); font-weight: 400; font-size: 24px; margin-bottom: var(--e2); color: var(--tinta); }
.vacio .acciones { justify-content: center; margin-top: var(--e3); }
.cargando { display: grid; place-items: center; min-height: 60vh; color: var(--tinta-3); font-family: var(--mono); font-size: 14px; }

/* modo demostración */
.cinta-demo {
  background: repeating-linear-gradient(-45deg, #1D1B18 0 14px, #2A2723 14px 28px); color: #fff; font-size: 14px;
  padding: 6px var(--e4); display: flex; gap: var(--e3); align-items: center; flex-wrap: wrap; justify-content: center; text-align: center;
  position: relative; z-index: 60;
}
.cinta-demo b { color: #FFD98A; letter-spacing: .04em; }
.cinta-demo button { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .5); border-radius: var(--r); padding: 2px 10px; font-size: 13px; }
.cinta-demo button:hover { background: rgba(255, 255, 255, .12); }

/* ── adaptación a pantallas ────────────────────────────────────────── */
@media (max-width: 1100px) {
  .panel-contenido { padding: var(--e5) var(--e5) 120px; }
  .panel-barra { padding: var(--e3) var(--e5); }
  .agenda-semana { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .portada .envoltura { grid-template-columns: 1fr; grid-template-areas: "texto" "ingreso" "pasos"; row-gap: var(--e5); }
  .aula-grilla, .dos-columnas { grid-template-columns: 1fr; gap: var(--e5); }
  .que-hay ul { grid-template-columns: 1fr 1fr; }
  .que-hay li:nth-child(2) { border-right: 0; }
  .que-hay li:nth-child(n+3) { border-top: 1px solid var(--pauta); }
  .que-hay li:nth-child(3) { padding-left: 0; }
  .panel { grid-template-columns: 1fr; }
  .panel-nav { position: fixed; z-index: 90; left: 0; top: 0; width: min(300px, 86vw); transform: translateX(-100%); transition: transform .2s; box-shadow: var(--sombra); }
  .panel-nav.abierta { transform: none; }
  .fondo-nav { position: fixed; inset: 0; background: rgba(29, 27, 24, .4); z-index: 80; }
  .boton-menu { display: inline-grid; }
  .barra-lote { left: 0; }
}
@media (max-width: 720px) {
  .envoltura { padding: 0 var(--e4); }
  .portada { padding: var(--e4) 0 var(--e4); }
  .portada h1 { font-size: 36px; margin-bottom: var(--e3); }
  .portada .eyebrow { font-size: 11px; }
  .pasos { margin-top: 0; }
  .cinta-demo { font-size: 12px; padding: 4px var(--e3); gap: 4px var(--e2); }
  .cinta-demo .cinta-extra { display: none; }
  .cinta-demo button { padding: 1px 8px; font-size: 12px; }
  .herramientas .filtro-extra { display: none; }
  .herramientas.abierta .filtro-extra { display: flex; }
  .boton-mas-filtros { display: inline-flex !important; }
  .filtros-rapidos { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
  .filtro-chip { flex: none; }
  .panel-barra .acciones { flex-wrap: nowrap; }
  .bajada { font-size: 17px; }
  .ingreso { padding: var(--e4); }
  .que-hay ul { grid-template-columns: 1fr; }
  .que-hay li, .que-hay li + li { border-right: 0; padding-left: 0; border-top: 1px solid var(--pauta); }
  .que-hay li:first-child { border-top: 0; }
  .novedad { grid-template-columns: 1fr; gap: var(--e2); }
  .barra-publica nav a:not(.boton) { display: none; }
  .barra-aula .curso-nombre { display: none; }
  .aula { padding-top: var(--e4); }
  .proxima { padding: var(--e4); }
  .panel-contenido { padding: var(--e4) var(--e4) 140px; }
  .panel-barra { padding: var(--e2) var(--e4); min-height: 56px; }
  .panel-barra h1 { font-size: 22px; }
  .panel-barra .acciones .boton span.texto-largo { display: none; }
  .fila-clase { grid-template-columns: 26px minmax(0, 1fr); }
  .fila-clase .fc-fecha { grid-column: 2; }
  .fila-clase .fc-principal { grid-column: 2; }
  .fila-clase .fc-acciones { grid-column: 2; }
  .fila-clase .fc-sel { grid-row: 1 / span 3; }
  .fc-fecha b, .fc-fecha span { display: inline; }
  .fc-fecha span::before { content: ' · '; }
  .agenda-semana, .semana { grid-template-columns: 1fr; }
  .agenda-dia { border-right: 0; border-bottom: 1px solid var(--pauta); min-height: 0; }
  .semana .agenda-dia { min-height: 0; }
  .mes { grid-template-columns: 1fr; }
  .mes-cab { display: none; }
  .mes-dia.fuera, .mes-dia.vacio-mes { display: none; }
  .mes-dia { min-height: 0; }
  .herramientas .campo, .herramientas .campo-curso { min-width: 0; flex: 1 1 100%; }
  .tabla-cursos thead { display: none; }
  .tabla-cursos tr { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--pauta); padding: var(--e2) 0; }
  .tabla-cursos td { border: 0; padding: 4px var(--e2) 4px 0; }
  .tabla-cursos td:first-child { grid-column: 1 / -1; }
  .tabla-cursos td[data-etiqueta]::before { content: attr(data-etiqueta) ' '; font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--tinta-3); display: block; }
  .tabla-cursos .num { text-align: left; }
  .dialogo-cabeza, .dialogo-cuerpo { padding-left: var(--e4); padding-right: var(--e4); }
  .dialogo-pie { padding: var(--e3) var(--e4); }
  .barra-lote { padding: var(--e2) var(--e3); flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .barra-lote b { position: sticky; left: 0; background: var(--tinta); padding-right: var(--e2); margin: 0; flex: none; }
  .barra-lote .boton { flex: none; }
  .fila-material { grid-template-columns: 1fr; }
  .alerta-fila { grid-template-columns: 20px minmax(0, 1fr); padding: 10px var(--e3); }
  .alerta-fila > .boton { grid-column: 2; justify-self: start; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media print {
  .barra-publica, .panel-nav, .panel-barra, .barra-lote, .cinta-demo, .avisos-vivos { display: none !important; }
  body { background: #fff; }
}