/* Situaciones de Aprendizaje · Divina Pastora
   Los colores de cada apartado son los bordes de las tablas de la plantilla oficial. */
:root {
  --red: #d81e1e;
  --amber: #e0a100;
  --green: #0e9f4f;
  --blue: #0a6bbf;
  --ink: #1c2330;
  --ink-2: #4b5565;
  --muted: #7a8494;
  --line: #dfe3ea;
  --bg: #f4f5f8;
  --card: #ffffff;
  --accent: #0a6bbf;
  --accent-soft: #e7f1fb;
  --ok: #0e9f4f;
  --warn: #c77700;
  --bad: #c62828;
  --radius: 10px;
  --shadow: 0 1px 2px rgba(20, 30, 50, .06), 0 4px 16px rgba(20, 30, 50, .05);
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; background: var(--bg); font-size: 14px; line-height: 1.45; }
button, input, select, textarea { font: inherit; color: inherit; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
[hidden] { display: none !important; }

/* Cabecera */
.top {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 20px; background: #fff; border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 10px; }
.brand strong { display: block; font-size: 15px; }
.brand small { color: var(--muted); }
.brand-mark {
  width: 36px; height: 36px; border-radius: 9px; display: grid; place-items: center;
  font-weight: 800; color: #fff; letter-spacing: .5px;
  background: linear-gradient(135deg, var(--red) 0 25%, var(--amber) 25% 50%, var(--green) 50% 75%, var(--blue) 75%);
}
.top-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sep { width: 1px; height: 22px; background: var(--line); margin: 0 4px; }

button {
  border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 7px 12px;
  cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s;
}
button:hover { background: #f1f4f8; border-color: #cfd5de; }
button.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
button.primary:hover { background: #085a9f; }
button.ghost-accent { color: var(--accent); border-color: #bcd6ee; background: var(--accent-soft); }
button.small-btn { padding: 4px 9px; font-size: 12.5px; }
button.danger { color: var(--bad); }
button.icon { border: 0; background: transparent; font-size: 22px; line-height: 1; padding: 2px 8px; }
button.wide { width: 100%; margin-top: 10px; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Distribución */
.layout { display: grid; grid-template-columns: 220px minmax(0, 1fr) 280px; gap: 20px; padding: 20px; max-width: 1500px; margin: 0 auto; }
.steps, .review { position: sticky; top: 76px; align-self: start; }
.steps { display: flex; flex-direction: column; gap: 4px; }
.st { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; color: var(--ink-2); text-decoration: none; border-left: 4px solid transparent; }
.st:hover { background: #fff; }
.st b { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; color: #fff; }
.st-red { border-left-color: var(--red); } .st-red b { background: var(--red); }
.st-amber { border-left-color: var(--amber); } .st-amber b { background: var(--amber); }
.st-green { border-left-color: var(--green); } .st-green b { background: var(--green); }
.st-blue { border-left-color: var(--blue); } .st-blue b { background: var(--blue); }
.save-state { margin-top: 14px; font-size: 12px; color: var(--muted); padding-left: 10px; }

.review { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; max-height: calc(100vh - 96px); overflow: auto; }
.review h2 { margin: 0; font-size: 15px; }
.checks { list-style: none; margin: 10px 0 14px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.checks li { display: grid; grid-template-columns: 18px 1fr; gap: 6px; font-size: 12.5px; }
.checks .i { font-weight: 700; }
.checks .ok .i { color: var(--ok); }
.checks .warn .i { color: var(--warn); }
.checks .bad .i { color: var(--bad); }

/* Secciones */
.main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.sec { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); border-top: 5px solid var(--line); padding: 18px 20px 20px; }
.sec.red { border-top-color: var(--red); }
.sec.amber { border-top-color: var(--amber); }
.sec.green { border-top-color: var(--green); }
.sec.blue { border-top-color: var(--blue); }
.sec > h2 { margin: 0 0 4px; font-size: 18px; }
.sec > .lead { margin: 0 0 14px; color: var(--muted); font-size: 13px; }
.sub { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-2); margin: 18px 0 8px; }

.grid { display: grid; gap: 12px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.span2 { grid-column: span 2; }
.field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.field > span { font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.field.compact { margin-top: 8px; }
.hint { font-size: 12px; color: var(--muted); }
input[type=text], input[type=number], select, textarea {
  width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; background: #fff;
}
textarea { resize: vertical; min-height: 70px; line-height: 1.45; }
textarea.tall { min-height: 180px; }
select { cursor: pointer; }
.row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.row.end { justify-content: flex-end; }
.spacer { flex: 1; }

/* Chips */
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; font-size: 12.5px; background: #fff; cursor: pointer; user-select: none; }
.chip.on { background: var(--accent-soft); border-color: #9cc3e8; color: #0b4f8c; font-weight: 600; }
.chip.ods.on { background: #e8f6ee; border-color: #8fd1ab; color: #0b6b37; }

/* Currículo */
.pack-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #fbf7ea; border: 1px solid #f0e2b3; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.pack-bar .src { font-size: 12px; color: var(--ink-2); flex-basis: 100%; }
.ce { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.ce > summary { list-style: none; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; padding: 10px 12px; cursor: pointer; align-items: start; }
.ce > summary::-webkit-details-marker { display: none; }
.ce[open] > summary { background: #fafbfd; border-bottom: 1px solid var(--line); }
.ce .code { font-weight: 700; color: #8a6500; white-space: nowrap; }
.ce .count { font-size: 12px; color: var(--muted); white-space: nowrap; }
.ce .desc-codes { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.crit { display: grid; grid-template-columns: auto auto 1fr; gap: 8px; padding: 8px 12px; border-top: 1px dashed #edf0f4; align-items: start; }
.crit:first-child { border-top: 0; }
.crit .code { color: var(--ink); }
.crit .sabs { grid-column: 3; font-size: 11.5px; color: var(--muted); }
.sab-bloque { margin: 10px 0 4px; font-weight: 700; font-size: 13px; }
.sab { display: grid; grid-template-columns: auto auto 1fr; gap: 8px; padding: 4px 0; align-items: start; font-size: 13px; }
.sab .code { font-weight: 600; color: var(--ink-2); white-space: nowrap; font-size: 12px; }
.sab.linked .code { color: var(--green); }
.scroll-box { max-height: 420px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; }
input[type=checkbox] { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--accent); cursor: pointer; }
.empty { padding: 16px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: 8px; }

/* Competencias clave */
.cc { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.cc h4 { margin: 0 0 6px; font-size: 13.5px; }
.cc h4 small { color: var(--muted); font-weight: 400; }
.desc { display: grid; grid-template-columns: auto auto 1fr; gap: 8px; padding: 3px 0; font-size: 13px; }
.desc .code { font-weight: 700; white-space: nowrap; }
.desc.sugerido .code { color: var(--amber); }

/* Sesiones y productos */
.card { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; background: #fcfdfe; }
.card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.card-head .num { background: var(--green); color: #fff; border-radius: 6px; padding: 2px 8px; font-weight: 700; font-size: 12.5px; }
.card-head .num.final { background: #7b3fb8; }
.card-head input[type=text] { flex: 1; min-width: 180px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; align-items: center; }
.toolbar select { width: auto; padding: 5px 8px; font-size: 12.5px; }
.chip-group { margin-top: 6px; }
.chip-group > span { font-size: 11.5px; color: var(--muted); display: block; margin-bottom: 3px; }

/* Modal */
.modal { border: 0; border-radius: 12px; padding: 0; width: min(860px, calc(100vw - 32px)); max-height: calc(100vh - 40px); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.modal::backdrop { background: rgba(15, 20, 30, .45); }
.modal-inner { display: flex; flex-direction: column; max-height: calc(100vh - 40px); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.modal-head h2 { margin: 0; font-size: 17px; }
.modal-body { padding: 16px 18px; overflow: auto; }
.modal-foot { display: flex; gap: 8px; justify-content: flex-end; padding: 12px 18px; border-top: 1px solid var(--line); }
.modal-foot:empty { display: none; }
.list { display: flex; flex-direction: column; gap: 6px; }
.list-item { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; }
.list-item .grow { flex: 1; min-width: 0; }
.list-item .grow small { display: block; color: var(--muted); }
pre.prompt { white-space: pre-wrap; background: #f6f8fb; border: 1px solid var(--line); border-radius: 8px; padding: 12px; font-size: 12px; max-height: 50vh; overflow: auto; }

.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); background: #1c2330; color: #fff; padding: 10px 16px; border-radius: 8px; opacity: 0; pointer-events: none; transition: .25s; z-index: 50; max-width: calc(100vw - 32px); }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 1180px) {
  .layout { grid-template-columns: minmax(0, 1fr); }
  .steps { position: static; flex-direction: row; flex-wrap: wrap; }
  .save-state { flex-basis: 100%; margin-top: 4px; }
  .review { position: static; max-height: none; order: 3; }
}
@media (max-width: 720px) {
  .top { padding: 10px 16px; }
  .layout { padding: 12px 16px; }
  .g2, .g3, .g4 { grid-template-columns: minmax(0, 1fr); }
  .span2 { grid-column: auto; }
  .sec { padding: 14px; }
  .st { padding: 6px 8px; font-size: 13px; }
}
@media print { .top, .steps, .review { display: none; } }

/* ---------- Escudo y panel «Crear situación de aprendizaje» ---------- */
.escudo { width: 44px; height: 56px; object-fit: contain; }
.steps-title { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 0 10px 6px; }
.crear { max-width: 1100px; margin: 22px auto 0; padding: 0 20px; }
.crear-card { background: var(--card); border-radius: 16px; box-shadow: var(--shadow); padding: 24px 26px; border-top: 6px solid transparent;
  border-image: linear-gradient(90deg, var(--red), var(--amber), var(--green), var(--blue)) 1; border-image-slice: 1 0 0 0; }
.crear-head { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 16px; }
.crear-head h1 { margin: 0 0 4px; font-size: 24px; }
.crear-head p { margin: 0; color: var(--ink-2); max-width: 620px; }
.pasos { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; }
.pasos li { display: flex; align-items: center; gap: 6px; background: var(--bg); border-radius: 999px; padding: 6px 12px 6px 6px; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.pasos b { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: #fff; font-size: 12px; }
.crear-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.crear-grid .span2 { grid-column: span 2; }
.crear-grid .span4 { grid-column: 1 / -1; }
.drop { display: flex; gap: 14px; align-items: center; border: 2px dashed #b9cde3; border-radius: 12px; padding: 18px 20px; background: #f6faff; cursor: pointer; transition: .15s; }
.drop:hover, .drop.over { border-color: var(--accent); background: var(--accent-soft); }
.drop-ico { font-size: 34px; }
.drop small { color: var(--muted); }
.files { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.files li { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; background: #fff; flex-wrap: wrap; }
.files .grow { flex: 1; min-width: 160px; }
.files small { color: var(--muted); margin-left: 6px; }
.files input[type=text] { width: 230px; padding: 6px 9px; }
.calidad { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 16px 0 4px; }
.calidad .opt { display: flex; flex-direction: column; gap: 2px; border: 2px solid var(--line); border-radius: 12px; padding: 10px 14px; cursor: pointer; position: relative; }
.calidad .opt input { position: absolute; opacity: 0; }
.calidad .opt.on { border-color: var(--accent); background: var(--accent-soft); }
.calidad .opt small { color: var(--muted); }
.calidad .opt:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.crear-acciones { margin-top: 14px; }
button.big { font-size: 16px; padding: 12px 22px; border-radius: 10px; }
button.link { border: 0; background: none; color: var(--accent); text-decoration: underline; padding: 4px; }
a.btn { display: inline-block; border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 7px 12px; color: var(--ink); text-decoration: none; }
a.btn:hover { background: #f1f4f8; }
.clave { background: #fff8e6; border: 1px solid #f1d68c; border-radius: 10px; padding: 12px 14px; margin-bottom: 14px; }
.clave p { margin: 0 0 8px; }
.aviso { background: #f3f6fb; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; }
.error { background: #fdecec; border: 1px solid #f3b7b7; color: #8f1d1d; border-radius: 10px; padding: 10px 14px; margin-top: 12px; }
.progreso { display: flex; gap: 12px; align-items: center; margin-top: 14px; background: var(--accent-soft); border-radius: 10px; padding: 12px 16px; }
.progreso b, .progreso small { display: block; }
.progreso small { color: var(--ink-2); }
.spinner { width: 26px; height: 26px; border-radius: 50%; border: 3px solid #bcd6ee; border-top-color: var(--accent); animation: gira 0.9s linear infinite; flex: none; }
@keyframes gira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 3s; } }
.resultado { margin-top: 16px; border: 1px solid #b7e2c6; background: #f1faf4; border-radius: 12px; padding: 14px 16px; }
.res-head { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; }
.res-head .ok { font-size: 26px; }
.res-head b, .res-head small { display: block; }
.res-head small { color: var(--ink-2); }
.res-bloque { margin: 8px 0; font-size: 13.5px; }
.res-bloque ul { margin: 4px 0 0; padding-left: 20px; }
@media (max-width: 720px) {
  .crear { padding: 0 16px; }
  .crear-card { padding: 18px 16px; }
  .crear-grid, .calidad { grid-template-columns: minmax(0, 1fr); }
  .crear-grid .span2 { grid-column: auto; }
  .pasos { display: none; }
}

/* ---------- Materiales para el aula ---------- */
#materiales { margin-top: 18px; }
.m-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.m-group { border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px 12px; margin: 0; min-width: 0; }
.m-group legend { font-weight: 700; padding: 0 6px; }
.m-chk { display: flex; gap: 8px; align-items: flex-start; padding: 3px 0; cursor: pointer; }
.m-mini { gap: 2px; margin-bottom: 2px; }
.m-niveles { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; font-size: 12.5px; color: var(--ink-2); }
.m-niveles .chip { cursor: pointer; }
.m-group-ancho { grid-column: 1 / -1; }
.perfil-sel { display: flex; align-items: center; gap: 6px; font-weight: 700; margin-left: 14px; }
.perfil-sel select { border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; font: inherit; font-weight: 700; background: var(--bg-2, #f6faff); cursor: pointer; }
.otros-docentes { margin-top: 14px; }
/* Curso completo */
.lote .pasos li.on { color: var(--accent); font-weight: 700; box-shadow: inset 0 0 0 2px var(--accent); }
.lote .pasos li:not(.on) { opacity: .6; }
.lote-tabla td.c { white-space: nowrap; }
.lote-tabla td.c select { width: auto; min-width: 64px; display: block; margin: 0 auto; }
.lote-tabla td.c input[type=number] { width: 64px; }
.lote-tabla td { vertical-align: top; }
.lote-sa { min-width: 260px; }
.lote-sa input[type=text], .lote-sa textarea { width: 100%; font: inherit; border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; }
.lote-sa input[data-lp="titulo"] { font-weight: 700; }
.lote-sa textarea { margin-top: 4px; font-size: 12.5px; resize: vertical; }
.lote-sa small { display: block; margin-top: 3px; font-size: 11.5px; }
.lote-sa label { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.lote-crit { min-width: 190px; }
.lote-crit .chip { font-size: 12px; padding: 2px 4px 2px 8px; }
.lote-crit .x { border: 0; background: transparent; cursor: pointer; font-weight: 700; padding: 0 4px; color: inherit; }
.lote-crit select { margin-top: 6px; max-width: 200px; font-size: 12px; }
.lote-fechas { font-size: 12px; white-space: nowrap; line-height: 1.6; }
.cobertura { border-radius: 12px; padding: 10px 14px; margin: 10px 0 14px; }
.cobertura.bien { background: #e8f6ee; border: 1px solid #b7e2c7; }
.cobertura.mal { background: #fdecec; border: 1px solid #f3c1c1; }
.cobertura .chips { margin-top: 8px; }
.chip.crit { font-size: 12px; cursor: help; }
.chip.crit.falta { background: #fde2e2; border-color: #f0a8a8; color: #9c1c1c; font-weight: 700; }
.lote-barra { height: 10px; border-radius: 99px; background: var(--line); overflow: hidden; margin: 6px 0 10px; }
.lote-barra span { display: block; height: 100%; background: var(--accent); transition: width .4s; }
.lote-ico { width: 26px; text-align: center; font-size: 18px; }
.m-list li small { display: block; }
.otros-docentes summary { cursor: pointer; font-weight: 700; padding: 6px 0; }
.m-prog { border-radius: 10px; padding: 4px 8px; margin: 2px -8px; }
.m-prog.on { background: var(--bg-2, #f6faff); }
.m-prog-body { padding: 2px 0 8px 26px; display: flex; flex-direction: column; gap: 8px; }
.m-prog-body .m-niveles { margin-top: 2px; }
.m-tema { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--ink-2); }
.m-tema input { border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font: inherit; font-size: 13px; color: var(--ink); }
.m-niveles button.chip { cursor: pointer; font: inherit; font-size: 12px; }
.m-notas { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font: inherit; font-size: 13px; resize: vertical; }
.m-fichas { font-size: 12.5px; color: var(--ink-2); display: flex; gap: 6px; align-items: center; }
.m-fichas select { border: 1px solid var(--line); border-radius: 8px; padding: 3px 6px; font: inherit; font-size: 12.5px; }
@media (max-width: 720px) { .m-prog-body { padding-left: 0; } }
.m-list-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 22px 0 8px; }
.m-list-head h2 { margin: 0; font-size: 17px; flex: 1; }
.m-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.m-list li { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; flex-wrap: wrap; }
.m-list .grow { flex: 1; min-width: 200px; }
.m-list small { display: block; color: var(--muted); }
.m-ico { font-size: 22px; }
.visor { position: fixed; inset: 0; z-index: 60; background: rgba(20, 24, 32, .85); display: flex; flex-direction: column; }
.visor-bar { display: flex; gap: 8px; align-items: center; background: #fff; padding: 10px 16px; }
.visor-pages { overflow: auto; padding: 20px 16px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.visor-holder { overflow: hidden; box-shadow: 0 6px 24px rgba(0, 0, 0, .4); flex: none; }
.export-area { position: fixed; left: -10000px; top: 0; width: 794px; }
@media (max-width: 720px) { .m-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Hojas A4 (misma apariencia en pantalla y en el PDF) ---------- */
.hoja { width: 794px; height: 1123px; background: #fff; color: #111; padding: 44px 48px 40px; position: relative; overflow: hidden;
  font-family: "Open Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-size: 14.5px; line-height: 1.4; }
.hoja b { font-weight: 700; }
.h-head { display: flex; gap: 12px; align-items: center; border-bottom: 3px solid; border-image: linear-gradient(90deg, #d81e1e, #e0a100, #0e9f4f, #0a6bbf) 1; padding-bottom: 8px; }
.h-escudo { width: 46px; height: 58px; object-fit: contain; }
.h-head-t small { display: block; color: #555; font-size: 11.5px; }
.h-title { font-size: 21px; font-weight: 800; line-height: 1.15; margin: 2px 0; }
.h-level { font-size: 12.5px; font-weight: 700; border: 1.5px solid #0e9f4f; color: #0b6b37; border-radius: 999px; padding: 1px 8px; vertical-align: middle; }
.h-head-min { justify-content: space-between; font-size: 12px; color: #555; border-bottom-width: 2px; padding-bottom: 4px; }
.h-name { display: flex; gap: 8px; align-items: flex-end; margin: 10px 0 4px; font-size: 13.5px; }
.h-name u { flex: 1; border-bottom: 1.5px solid #333; text-decoration: none; min-height: 18px; }
.h-name u.s { flex: .45; }
.h-instr { margin: 6px 0 0; font-size: 13.5px; color: #333; background: #f5f7fa; border-radius: 6px; padding: 6px 10px; }
.h-body { margin-top: 10px; }
.h-foot { position: absolute; bottom: 16px; right: 48px; font-size: 11px; color: #888; }
.h-block { margin: 0 0 14px; break-inside: avoid; }
.h-enun { display: flex; gap: 8px; align-items: flex-start; font-weight: 600; margin-bottom: 6px; }
.h-enun .grow { flex: 1; }
.h-n { background: #0a6bbf; color: #fff; border-radius: 50%; width: 24px; height: 24px; display: inline-grid; place-items: center; font-size: 13px; flex: none; }
.h-badge { font-size: 11px; font-weight: 600; color: #555; border: 1px solid #bbb; border-radius: 999px; padding: 0 7px; white-space: nowrap; }
.h-box { border: 1.5px solid #9bb8d6; background: #f6faff; border-radius: 8px; padding: 8px 12px; }
.h-read { margin-bottom: 8px; }
.h-q { margin: 6px 0; }
.h-q > span:first-child { font-weight: 700; margin-right: 4px; }
.h-lines i { display: block; border-bottom: 1px solid #999; height: 27px; }
.h-fill { margin: 7px 0; line-height: 2; }
.h-gap { display: inline-block; min-width: 110px; border-bottom: 1.5px solid #333; text-decoration: none; }
.h-bank { border: 1.5px dashed #999; border-radius: 8px; padding: 6px 10px; margin-bottom: 8px; text-align: center; }
.h-match { display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px; row-gap: 10px; }
.h-m-l { text-align: right; } .h-match em { font-style: normal; color: #0a6bbf; }
.h-vf { display: flex; gap: 8px; align-items: center; margin: 6px 0; }
.h-vf .grow { flex: 1; }
.h-ck { width: 26px; height: 24px; border: 1.5px solid #333; border-radius: 4px; display: grid; place-items: center; font-size: 11px; color: #777; }
.h-opts { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 4px 0 0 20px; }
.h-opts i { font-style: normal; display: inline-grid; place-items: center; width: 20px; height: 20px; border: 1.5px solid #333; border-radius: 50%; font-size: 11px; margin-right: 4px; }
.h-ord { display: flex; gap: 10px; align-items: center; margin: 6px 0; }
.h-num { width: 28px; height: 26px; border: 1.5px solid #333; border-radius: 4px; flex: none; }
.h-cols { display: grid; gap: 10px; }
.h-cols > div { border: 1.5px solid #333; border-radius: 6px; padding: 6px 8px; }
.h-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.h-table th, .h-table td { border: 1px solid #555; padding: 5px 7px; vertical-align: top; text-align: left; }
.h-table th { background: #eef3f9; }
.h-table td { height: 28px; }
.h-first td:first-child { width: 45%; }
.h-rub { font-size: 12px; table-layout: fixed; } .h-rub th:first-child { width: 20%; } .h-rub .h-asp { font-weight: 600; background: #fafafa; }
.h-draw { border: 1.5px solid #333; border-radius: 8px; height: 230px; }
.h-calc { border: 1.5px dashed #999; border-radius: 6px; height: 90px; margin: 6px 0; }
.h-sol u { display: inline-block; min-width: 260px; border-bottom: 1.5px solid #333; text-decoration: none; }
.h-mind { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; align-items: center; }
.h-mind-c { grid-column: 2; grid-row: 1 / span 2; border: 2.5px solid #0a6bbf; border-radius: 50%; min-height: 120px; display: grid; place-items: center; text-align: center; font-weight: 700; padding: 10px; }
.h-mind-b { border: 1.5px solid #333; border-radius: 10px; padding: 6px 8px; }
.h-diana-wrap { display: flex; gap: 18px; align-items: center; }
.h-diana { width: 320px; height: 320px; flex: none; }
.h-diana-wrap ol { margin: 0; padding-left: 20px; } .h-diana-wrap li { margin: 6px 0; }
.h-note { font-size: 12px; color: #555; margin: 6px 0 0; }
.h-ticket { border: 2px dashed #333; border-radius: 8px; padding: 8px 12px; }

.h-crit { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 6px 0 0; font-size: 12.5px; }
.h-crit span { border: 1.5px solid #0a6bbf; color: #0a4f8f; border-radius: 999px; padding: 0 8px; font-weight: 700; }
.h-crit-t { font-size: 12px; } .h-crit-t td:nth-child(2) { width: 55%; } .h-logro { white-space: nowrap; color: #666; font-size: 11px; }

.h-picto { font-size: 1.35em; line-height: 1; vertical-align: -0.12em; margin-right: .18em; }
.h-choice { display: grid; gap: 6px; }
.h-opt { display: flex; gap: 8px; align-items: flex-start; border: 1.5px solid #9bb8d6; border-radius: 8px; padding: 6px 10px; background: #f6faff; }
.h-ckb { width: 18px; height: 18px; border: 1.5px solid #333; border-radius: 4px; flex: none; margin-top: 2px; }
.h-work { border: 1.5px dashed #999; border-radius: 8px; height: 170px; margin-top: 8px; }
.h-glos { display: grid; grid-template-columns: 30% 1fr; border: 1.5px solid #9bb8d6; border-radius: 8px; overflow: hidden; }
.h-glos > div { padding: 5px 10px; border-bottom: 1px solid #dbe6f1; }
.h-glos > div:nth-child(odd) { background: #f6faff; }
.h-sem td { height: 34px; } .h-sem .h-luz { width: 46px; text-align: center; font-size: 20px; }

.ed-body { overflow: auto; padding: 18px; background: var(--bg); flex: 1; }
.ed-body > * { max-width: 980px; margin-left: auto; margin-right: auto; }
#edForm { display: flex; flex-direction: column; gap: 10px; }
.ed-bloque { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; display: flex; flex-direction: column; gap: 8px; }
.ed-bloque legend { font-weight: 700; padding: 0 6px; }
.ed-fila { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.ed-grow { flex: 1; min-width: 220px; }
.ed-num { max-width: 110px; }
.ed-acc { justify-content: flex-end; }
.ed-body .calidad { max-width: 980px; }
.retocar-btn { margin-left: auto; }
.gasto-mes { font-size: 12.5px; color: var(--ink-2); background: var(--bg); border-radius: 999px; padding: 5px 12px; align-self: center; }

.grupos-box { border: 1px solid #cfe0f1; background: #f6faff; border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; }
.grupos-box .row { gap: 10px; }
.fechas-vista { margin: 8px 0 0; padding-left: 20px; font-size: 13px; }
.warn-txt { color: var(--warn); font-weight: 600; }
.ses-fechas { font-size: 12px; color: var(--ink-2); background: #eef5fc; border-radius: 999px; padding: 2px 10px; }
.mapa-tabla { border-collapse: collapse; font-size: 12.5px; background: #fff; }
.mapa-tabla th, .mapa-tabla td { border: 1px solid var(--line); padding: 5px 7px; vertical-align: top; }
.mapa-tabla th { background: #f3f6fa; position: sticky; top: 0; }
.mapa-tabla td.c { text-align: center; white-space: nowrap; }
.mapa-tabla tr.falta td:first-child { border-left: 4px solid var(--bad); }
.mapa-tabla tr.solo td:first-child { border-left: 4px solid var(--warn); }
.mapa-tabla tr.ok td:first-child { border-left: 4px solid var(--ok); }
.mapa-wrap { overflow: auto; max-height: calc(100vh - 220px); border-radius: 10px; }
.mapa-resumen { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
.mapa-resumen span { background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; font-size: 13px; }
.tabs-curso { display: flex; gap: 8px; }
.tabs-curso .chip { font-size: 14px; padding: 6px 14px; }
.mapa-tabla input[type=text] { min-width: 240px; }

.m-list li.m-sub { margin-left: 28px; border-style: dashed; background: #fbfdff; }

/* Programas individuales */
.prog-crit { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; padding: 6px; }
.prog-c { display: flex; gap: 8px; align-items: flex-start; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 13px; line-height: 1.35; }
.prog-c:hover { background: var(--bg, #f3f6fa); }
.prog-c.on { background: var(--accent-soft, #e7f1fb); }
.prog-c b { min-width: 44px; }
.prog-c span { color: var(--ink-2); }
.h-name u:not(:empty) { font-weight: 600; padding: 0 4px; }
