/* Situar MI Asignatura · ux-pantallas.css · rama ux/situar-navegacion-simple · capa «pantallas»
   Estilos de las ocho pantallas redibujadas según referencias/04-recorrido-general.png (secuencia y características)
   con la identidad EsGenIAl (tokens de app.css: --verde, --hondo, --crema, --oro, --gris, --borde, --rojo).
   Cada pantalla vive en un contenedor .uxp encima de los módulos existentes; el contenido heredado queda disponible en
   <details class="ux-detalle"> («Ver el detalle completo»), nunca eliminado. */

/* ---------- comunes ---------- */
.uxp{ margin:0 0 14px; }
.uxp-cab{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0 0 14px; }
.uxp-cab h2, .uxp-cab h3.uxp-t{ font-family:Georgia,'Times New Roman',serif; font-weight:400; color:var(--hondo); margin:0; font-size:1.5rem; line-height:1.2; }
.uxp-cab > div:first-child{ flex:1 1 320px; min-width:0; }
.uxp-cab .uxp-sub{ color:var(--gris); margin:4px 0 0; font-size:.95rem; }
.uxp-cab .uxp-der{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.uxp-chip{ display:inline-flex; align-items:center; gap:6px; border-radius:99px; padding:2px 10px; font-size:.78rem; font-weight:600; border:1.4px solid var(--borde); background:#fff; color:var(--gris); white-space:nowrap; }
.uxp-chip.ok{ background:#E7F1EA; border-color:#B9D6C2; color:var(--verde); }
.uxp-chip.warn{ background:#FBF1D8; border-color:#EBD59A; color:#7A5A00; }
.uxp-chip.rojo{ background:#F7E3E3; border-color:#E4B9B9; color:var(--rojo); }
.uxp-chip.neutro{ background:var(--crema); }
.uxp-bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:18px 0 4px; padding-top:14px; border-top:1px solid var(--borde); }
.uxp-bar .btn.primary{ min-height:44px; padding:10px 20px; font-weight:700; }
.uxp-bar .uxp-volver{ background:#fff; }
.uxp-fila{ display:flex; align-items:center; gap:14px; background:#fff; border:1.4px solid var(--borde); border-radius:12px; padding:12px 14px; margin:0 0 8px; }
.uxp-fila .uxp-num{ min-width:26px; color:var(--gris); font-weight:700; }
.uxp-fila .uxp-cuerpo{ flex:1; min-width:0; }
.uxp-fila .uxp-titulo{ font-weight:700; color:var(--hondo); }
.uxp-fila .uxp-meta{ color:var(--gris); font-size:.85rem; margin-top:2px; }
.uxp-fila .uxp-acc{ display:flex; gap:8px; align-items:center; flex-shrink:0; }
.uxp-mas{ position:relative; }
.uxp-mas > summary{ list-style:none; cursor:pointer; width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; border:1.4px solid var(--borde); background:#fff; color:var(--gris); font-weight:700; letter-spacing:1px; }
.uxp-mas > summary::-webkit-details-marker{ display:none; }
.uxp-mas > .ux-menu-panel{ position:absolute; right:0; top:calc(100% + 6px); background:#fff; color:var(--tinta); border:1.5px solid var(--borde); border-radius:12px; min-width:250px; padding:8px; box-shadow:0 12px 30px rgba(10,46,32,.16); z-index:30; }
.uxp-mas .ux-menu-panel button{ display:block; width:100%; text-align:left; background:transparent; border:none; border-radius:8px; padding:10px 10px; font:inherit; font-size:.92rem; color:var(--tinta); cursor:pointer; }
.uxp-mas .ux-menu-panel button:hover{ background:var(--crema); }
.uxp-enl{ background:none; border:none; color:var(--verde); text-decoration:underline; cursor:pointer; font:inherit; font-size:.9rem; padding:0; }
.uxp-nota{ color:var(--gris); font-size:.85rem; }
.uxp-vacio{ background:var(--crema); border:1.4px dashed var(--borde); border-radius:12px; padding:22px; text-align:center; color:var(--gris); }
/* el contenido heredado del módulo, plegado */
.ux-detalle{ margin:16px 0 0; border-top:1px dashed var(--borde); padding-top:8px; }
.ux-detalle > summary{ cursor:pointer; color:var(--gris); font-size:.88rem; padding:8px 0; list-style:none; display:flex; align-items:center; gap:8px; }
.ux-detalle > summary::-webkit-details-marker{ display:none; }
.ux-detalle > summary::before{ content:'›'; display:inline-block; transition:transform .15s; color:var(--oro); font-weight:700; }
.ux-detalle[open] > summary::before{ transform:rotate(90deg); }
.ux-detalle > summary:focus-visible{ outline:3px solid var(--oro); outline-offset:2px; border-radius:6px; }
.ux-detalle .ux-detalle-cuerpo{ padding-top:8px; }
.uxp-oculto{ display:none !important; }

/* ---------- cuenta como avatar con iniciales ---------- */
header.app.ux .ux-avatar{ width:40px; height:40px; min-height:40px; border-radius:50%; padding:0; display:inline-flex; align-items:center; justify-content:center; font-size:.85rem; font-weight:700; letter-spacing:.04em; background:#E8C766; color:var(--hondo); border-color:transparent; }
header.app.ux .ux-avatar .ux-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ---------- P1 · Inicio · Mis asignaturas ---------- */
.uxp-inicio h2{ font-size:1.9rem; }
.uxp-tarjetas{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:14px; margin:6px 0 16px; }
.uxp-tarjeta{ background:#fff; border:1.4px solid var(--borde); border-radius:14px; padding:16px 16px 14px; display:flex; flex-direction:column; gap:8px; min-height:150px; position:relative; }
.uxp-tarjeta.destacada{ border-color:var(--verde); box-shadow:0 0 0 2px rgba(15,76,52,.08); }
.uxp-tarjeta .uxp-nom{ font-family:Georgia,'Times New Roman',serif; font-size:1.2rem; color:var(--hondo); line-height:1.25; padding-right:40px; }
.uxp-tarjeta .uxp-sub{ color:var(--gris); font-size:.9rem; }
.uxp-tarjeta .uxp-cta{ margin-top:auto; display:flex; align-items:center; gap:8px; }
.uxp-tarjeta .uxp-cta .btn{ min-height:42px; padding:9px 14px; }
.uxp-tarjeta .uxp-mas{ position:absolute; top:12px; right:12px; }
.uxp-banda{ display:flex; align-items:center; gap:14px; background:var(--crema); border:1.4px solid var(--borde); border-radius:14px; padding:14px 16px; flex-wrap:wrap; }
.uxp-banda .uxp-ico{ width:44px; height:44px; border-radius:12px; background:#E7F1EA; display:inline-flex; align-items:center; justify-content:center; color:var(--verde); font-size:1.3rem; flex-shrink:0; }
.uxp-banda .uxp-txt{ flex:1; min-width:220px; }
.uxp-banda .uxp-txt b{ display:block; color:var(--hondo); }
.uxp-banda .uxp-txt span{ color:var(--gris); font-size:.88rem; }

/* ---------- P2 · Mi programa ---------- */
.uxp-programa .uxp-dos{ display:grid; grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr); gap:16px; align-items:start; }
.uxp-drop{ border:2px dashed #B9C9BE; border-radius:14px; background:#fff; padding:28px 20px 20px; text-align:center; transition:background .15s, border-color .15s; }
.uxp-drop.sobre{ background:#E7F1EA; border-color:var(--verde); }
.uxp-drop .uxp-ico{ width:48px; height:48px; border-radius:50%; background:#E7F1EA; color:var(--verde); display:inline-flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:8px; }
.uxp-drop b{ display:block; color:var(--hondo); font-size:1.02rem; }
.uxp-drop .uxp-o{ color:var(--gris); font-size:.9rem; margin:2px 0 12px; }
.uxp-drop .uxp-decl{ display:flex; gap:8px; align-items:flex-start; text-align:left; margin:14px auto 0; max-width:520px; font-size:.84rem; color:var(--gris); }
.uxp-drop .uxp-decl input{ margin-top:3px; }
.uxp-drop .uxp-decl b{ display:inline; font-size:inherit; color:var(--tinta); }
.uxp-drop .uxp-archivo{ margin-top:10px; font-size:.9rem; color:var(--verde); font-weight:600; }
.uxp-drop .uxp-nosuba{ font-size:.8rem; color:var(--rojo); margin-top:8px; }
.uxp-despues{ background:var(--crema); border:1.4px solid var(--borde); border-radius:14px; padding:16px; }
.uxp-despues h4{ margin:0 0 10px; font-size:.98rem; color:var(--hondo); }
.uxp-despues ol{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.uxp-despues li{ display:flex; gap:10px; align-items:flex-start; font-size:.9rem; color:var(--tinta); }
.uxp-despues li span.n{ width:24px; height:24px; border-radius:50%; background:#fff; border:1.4px solid var(--borde); display:inline-flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:700; color:var(--verde); flex-shrink:0; }
.uxp-programa .uxp-manual{ margin:12px 0 0; text-align:center; }
.uxp-programa .uxp-ficha-cab{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:18px 0 6px; flex-wrap:wrap; }
.uxp-programa .uxp-ficha-cab h3{ margin:0; font-family:Georgia,serif; font-weight:400; color:var(--hondo); font-size:1.15rem; }

/* ---------- P3 · Contenidos ---------- */
.uxp-tema{ display:grid; grid-template-columns:28px minmax(0,1.3fr) minmax(0,1.4fr) auto auto; gap:12px; align-items:center; background:#fff; border:1.4px solid var(--borde); border-radius:12px; padding:12px 14px; margin:0 0 8px; }
.uxp-tema .uxp-num{ color:var(--gris); font-weight:700; }
.uxp-tema .uxp-nombre{ font-weight:700; color:var(--hondo); }
.uxp-tema .uxp-prop{ color:var(--gris); font-size:.9rem; }
.uxp-tema .uxp-prop b{ color:var(--tinta); font-weight:600; }
.uxp-tema .uxp-ajustar{ display:inline-flex; align-items:center; gap:6px; }
.uxp-tema .uxp-ajustar .btn{ min-height:38px; }
.uxp-tema.abierta{ border-color:var(--verde); }
.uxp-tema-det{ grid-column:1 / -1; border-top:1px solid var(--borde); padding-top:12px; display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
.uxp-tema-det .uxp-op{ display:flex; flex-direction:column; gap:6px; }
.uxp-tema-det label.uxp-radio{ display:flex; gap:8px; align-items:flex-start; padding:8px 10px; border:1.4px solid var(--borde); border-radius:10px; cursor:pointer; font-size:.9rem; background:#fff; }
.uxp-tema-det label.uxp-radio.on{ border-color:var(--verde); background:#E7F1EA; }
.uxp-tema-det label.uxp-radio input{ margin-top:3px; }
.uxp-tema-det select, .uxp-tema-det textarea{ width:100%; font:inherit; font-size:.9rem; border:1.4px solid var(--borde); border-radius:8px; padding:7px 9px; background:#fff; }
.uxp-tema-det .uxp-porque{ font-size:.85rem; color:var(--gris); }
.uxp-tema-det .uxp-porque b{ color:var(--tinta); }
.uxp-vertodos{ display:flex; align-items:center; gap:8px; width:100%; text-align:left; background:var(--crema); border:1.4px solid var(--borde); border-radius:12px; padding:12px 14px; font:inherit; font-size:.92rem; color:var(--hondo); cursor:pointer; margin:0 0 8px; }
.uxp-vertodos::before{ content:'›'; color:var(--oro); font-weight:700; transition:transform .15s; }
.uxp-vertodos[aria-expanded="true"]::before{ transform:rotate(90deg); }
.uxp-aviso{ background:#FBF1D8; border:1.4px solid #EBD59A; border-radius:12px; padding:12px 14px; margin:0 0 10px; font-size:.92rem; color:#5A4300; }
.uxp-aviso b{ color:#3F2F00; }
.uxp-aviso ul{ margin:6px 0 0 18px; }
.uxp-aviso button{ margin-left:6px; }
.uxp-sinprop{ background:var(--crema); border:1.4px solid var(--borde); border-radius:14px; padding:22px; text-align:center; }
.uxp-sinprop p{ color:var(--gris); margin:0 0 12px; }
/* 22-sep · P3 · opción B «Diseñar desde los resultados de aprendizaje»: dos decisiones, origen, requisito, advertencia y comparación (mismos tokens) */
.uxp-enfoque{ text-align:left; }
.uxp-enfoque > p:first-child{ color:var(--hondo); }
.uxp-enfoque .uxp-explica{ margin:12px 0 0; font-size:.9rem; }
.uxp-opciones{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:10px; }
.uxp-opciones label.uxp-radio{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border:1.4px solid var(--borde); border-radius:12px; cursor:pointer; background:#fff; font-size:.92rem; }
.uxp-opciones label.uxp-radio.on{ border-color:var(--verde); background:#E7F1EA; }
.uxp-opciones label.uxp-radio input{ margin-top:4px; }
.uxp-opciones label.uxp-radio span{ display:flex; flex-direction:column; gap:3px; }
.uxp-opciones label.uxp-radio small{ color:var(--gris); font-size:.84rem; line-height:1.4; }
.uxp-enfoque-ctl{ margin:0 0 12px; padding:0 0 12px; border-bottom:1px solid var(--borde); }
.uxp-tema .uxp-cobs{ display:inline-flex; flex-wrap:wrap; gap:4px; justify-content:flex-end; max-width:280px; }
.uxp-chip.uxp-orig.exi{ background:#E7F1EA; border-color:#B9D6C2; color:var(--verde); }
.uxp-chip.uxp-orig.ref, .uxp-chip.uxp-orig.int{ background:var(--crema); border-color:var(--borde); color:var(--hondo); }
.uxp-chip.uxp-orig.nue{ background:#FBF1D8; border-style:dashed; border-color:#C9A24B; color:#7A5A00; }
.uxp-tema.uxp-o-nue{ border-style:dashed; border-color:#C9A24B; }
.uxp-aviso.uxp-advertencia{ background:#FBF1D8; border-color:#C9A24B; color:#3F2F00; }
.uxp-aviso.uxp-alertas .uxp-nota{ display:block; margin-top:6px; }
.uxp-comparacion{ margin:8px 0 0; }
.uxp-comparacion .uxp-frase{ font-weight:600; color:var(--hondo); margin:0 0 10px; }
.uxp-tabla-comp{ width:100%; border-collapse:collapse; font-size:.9rem; }
.uxp-tabla-comp th{ text-align:left; vertical-align:top; width:190px; padding:8px 10px 8px 0; color:var(--gris); font-weight:600; border-top:1px solid var(--borde); }
.uxp-tabla-comp td{ vertical-align:top; padding:8px 0; border-top:1px solid var(--borde); }
.uxp-tabla-comp ul{ margin:0; padding-left:18px; }
.uxp-tabla-comp li{ margin:2px 0; }
.uxp-tabla-comp .uxp-chip{ font-size:.72rem; padding:1px 8px; }
@media (max-width:720px){ .uxp-tabla-comp th, .uxp-tabla-comp td{ display:block; width:auto; border-top:0; } .uxp-tabla-comp th{ padding-bottom:0; } .uxp-tabla-comp tr{ display:block; border-top:1px solid var(--borde); padding:6px 0; } }

/* ---------- P4 / P7 · Mis clases ---------- */
.uxp-clases .uxp-vistas{ display:inline-flex; border:1.4px solid var(--borde); border-radius:10px; overflow:hidden; background:#fff; }
.uxp-clases .uxp-vistas button{ font:inherit; font-size:.88rem; font-weight:600; border:0; padding:9px 14px; background:#fff; color:var(--verde); cursor:pointer; min-height:40px; display:inline-flex; gap:6px; align-items:center; }
.uxp-clases .uxp-vistas button[aria-pressed="true"]{ background:#E7F1EA; color:var(--hondo); }
.uxp-clase{ display:flex; align-items:center; gap:14px; background:#fff; border:1.4px solid var(--borde); border-left-width:5px; border-radius:12px; padding:12px 14px 12px 12px; margin:0 0 8px; }
.uxp-clase.sem-r{ border-left-color:#8B2E2E; } .uxp-clase.sem-a{ border-left-color:#CA8A04; } .uxp-clase.sem-v{ border-left-color:#0F4C34; } .uxp-clase.corte{ border-left-color:var(--hondo); background:#F3F6F2; } .uxp-clase.enc{ border-left-color:#6B7FA3; border-left-style:dashed; } .uxp-clase.cancel{ opacity:.7; } .uxp-clase.pasada{ background:#FBFAF6; }
.uxp-clase .uxp-cuando{ min-width:118px; }
.uxp-clase .uxp-cuando b{ display:block; color:var(--hondo); }
.uxp-clase .uxp-cuando span{ color:var(--gris); font-size:.85rem; }
.uxp-clase .uxp-cuerpo{ flex:1; min-width:0; }
.uxp-clase .uxp-titulo{ font-weight:700; color:var(--hondo); }
.uxp-clase .uxp-tags{ color:var(--gris); font-size:.84rem; margin-top:2px; }
.uxp-clase .uxp-tags i{ font-style:normal; }
.uxp-clase .uxp-acc{ display:flex; gap:8px; align-items:center; flex-shrink:0; }
.uxp-clase .uxp-acc .btn{ min-height:38px; }
.uxp-clase .uxp-chev{ background:none; border:none; font-size:1.3rem; color:var(--gris); cursor:pointer; padding:4px 8px; }
.uxp-enc-form{ grid-column:1/-1; width:100%; display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:10px; padding-top:10px; border-top:1px solid var(--borde); margin-top:8px; }
.uxp-enc-form label{ display:flex; flex-direction:column; gap:4px; font-size:.82rem; color:var(--gris); }
.uxp-enc-form input, .uxp-enc-form select{ font:inherit; font-size:.9rem; border:1.4px solid var(--borde); border-radius:8px; padding:7px 9px; background:#fff; }
.uxp-enc-form .uxp-enc-acc{ grid-column:1/-1; display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
.uxp-clase.abierta{ flex-wrap:wrap; border-color:var(--verde); }
.uxp-clases .uxp-mes{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gris); font-weight:700; margin:12px 0 6px; }
.uxp-clases #detalle{ margin-top:12px; }
/* el detalle abierto debajo de su fila (20-sep): la fila y el panel se leen como una sola pieza */
.uxp-clase.sel{ border-color:var(--verde); border-bottom-left-radius:0; border-bottom-right-radius:0; margin-bottom:0; }
#uxpLista > #detalle{ margin:0 0 14px; border-top:0; border-top-left-radius:0; border-top-right-radius:0; }
/* quién interviene en cada momento del plan: elegible (Grupo · Grupo + Revisión por pares) */
.plan .quien.grupo_pares{ background:#FBF1D6; color:#7A5200; }
select.uxp-quien{ font:inherit; font-size:.8rem; border:1.4px solid var(--borde); border-radius:8px; padding:4px 6px; background:#fff; max-width:100%; }

/* ---------- P5 · Revisar y firmar ---------- */
.uxp-firmar .uxp-dos{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr); gap:16px; align-items:start; }
.uxp-check{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.uxp-check li{ display:flex; gap:12px; align-items:flex-start; background:#fff; border:1.4px solid var(--borde); border-radius:12px; padding:12px 14px; }
.uxp-check li .uxp-ok{ width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:700; flex-shrink:0; background:#E7F1EA; color:var(--verde); }
.uxp-check li.falta .uxp-ok{ background:#FBF1D8; color:#7A5A00; }
.uxp-check li.bloq .uxp-ok{ background:#F7E3E3; color:var(--rojo); }
.uxp-check li b{ color:var(--hondo); display:block; }
.uxp-check li span{ color:var(--gris); font-size:.88rem; }
.uxp-listo{ background:#E7F1EA; border:1.4px solid #B9D6C2; border-radius:14px; padding:20px 18px; text-align:center; }
.uxp-listo.falta{ background:#FBF1D8; border-color:#EBD59A; }
.uxp-listo .uxp-ico{ width:56px; height:56px; border-radius:14px; background:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--verde); margin-bottom:8px; }
.uxp-listo h4{ margin:0 0 6px; font-size:1.05rem; color:var(--hondo); }
.uxp-listo p{ color:var(--gris); font-size:.88rem; margin:0 0 12px; }
.uxp-listo .uxp-acciones{ display:flex; flex-direction:column; gap:8px; align-items:stretch; }
.uxp-listo .uxp-acciones .btn.primary{ min-height:44px; font-weight:700; }
.uxp-listo ul.rev{ text-align:left; font-size:.86rem; margin:0 0 10px 18px; color:var(--tinta); }
.uxp-doc-toggle{ margin:14px 0 0; }
#uxDocRegion.uxp-oculto{ display:none !important; }

/* ---------- P6 · Hoy ---------- */
.uxp-hoy .uxp-fecha{ color:var(--gris); font-size:.95rem; margin:2px 0 0; }
.uxp-hoy .uxp-dos{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr); gap:16px; align-items:start; }
.uxp-prox{ background:#fff; border:1.4px solid var(--borde); border-left:5px solid var(--verde); border-radius:14px; padding:16px 18px; }
.uxp-prox.es-hoy{ background:#E7F1EA; }
.uxp-prox .uxp-et{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--verde); font-weight:700; }
.uxp-prox h4{ font-family:Georgia,'Times New Roman',serif; font-weight:400; color:var(--hondo); font-size:1.35rem; margin:4px 0 2px; }
.uxp-prox .uxp-cuando{ color:var(--gris); font-size:.92rem; }
.uxp-prox .uxp-obj{ margin:8px 0 0; color:var(--tinta); font-size:.95rem; }
.uxp-prox .uxp-luces{ display:flex; gap:6px; flex-wrap:wrap; margin:10px 0 0; }
.uxp-prox .uxp-cta{ margin:14px 0 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.uxp-prox .uxp-cta .btn.primary, .uxp-prox .uxp-cta .btn.gold{ min-height:44px; font-weight:700; }
.uxp-prox .uxp-por{ color:var(--gris); font-size:.86rem; margin:8px 0 0; }
.uxp-pend{ background:#fff; border:1.4px solid var(--borde); border-radius:14px; padding:14px 16px; }
.uxp-pend h4{ margin:0 0 8px; font-size:.98rem; color:var(--hondo); }
.uxp-pend ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.uxp-pend li{ display:flex; gap:10px; align-items:center; justify-content:space-between; font-size:.9rem; }
.uxp-pend li::before{ content:'•'; color:var(--oro); font-weight:700; }
.uxp-pend li span{ flex:1; }
.uxp-pend.ok{ background:#E7F1EA; border-color:#B9D6C2; color:var(--verde); }
.uxp-hoy .uxp-semana{ margin:16px 0 0; }
.uxp-hoy .uxp-semana .cab{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin:0 0 6px; }
.uxp-hoy .uxp-semana .cab b{ color:var(--hondo); }
.uxp-hoy .uxp-preg{ background:#FBF1D8; border:1.4px solid #EBD59A; border-radius:12px; padding:12px 14px; margin:0 0 12px; }

/* ---------- P8 · Mi plan ---------- */
.uxp-plan .uxp-docu{ display:flex; gap:18px; align-items:flex-start; background:#fff; border:1.4px solid var(--borde); border-radius:14px; padding:18px; flex-wrap:wrap; }
.uxp-plan .uxp-icono{ width:96px; height:120px; border-radius:10px; background:var(--crema); border:1.4px solid var(--borde); display:flex; align-items:center; justify-content:center; color:var(--verde); font-size:2.4rem; flex-shrink:0; position:relative; }
.uxp-plan .uxp-icono::after{ content:''; position:absolute; top:10px; right:10px; width:18px; height:18px; border-left:1.4px solid var(--borde); border-bottom:1.4px solid var(--borde); background:#fff; }
.uxp-plan .uxp-datos{ flex:1; min-width:240px; display:flex; flex-direction:column; gap:8px; }
.uxp-plan .uxp-datos .uxp-firmadoel{ color:var(--gris); font-size:.9rem; }
.uxp-plan .uxp-datos .uxp-cta{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:4px; }
.uxp-plan .uxp-datos .uxp-cta .btn.primary{ min-height:44px; font-weight:700; }
.uxp-plan .uxp-enlaces{ display:flex; gap:14px; flex-wrap:wrap; margin-top:4px; }
.uxp-historial{ margin:12px 0 0; background:var(--crema); border:1.4px solid var(--borde); border-radius:12px; padding:12px 14px; }
.uxp-historial h4{ margin:0 0 8px; font-size:.95rem; color:var(--hondo); }
.uxp-historial ol{ margin:0; padding:0 0 0 18px; font-size:.9rem; color:var(--tinta); }
.uxp-historial li{ margin:0 0 4px; }
.uxp-historial li span{ color:var(--gris); }
.uxp-historial .uxp-nota{ margin-top:8px; }

/* ---------- teléfonos ---------- */
@media (max-width:700px){
  .uxp-cab h2, .uxp-inicio h2{ font-size:1.4rem; }
  .uxp-programa .uxp-dos, .uxp-firmar .uxp-dos, .uxp-hoy .uxp-dos{ grid-template-columns:1fr; }
  .uxp-tema{ grid-template-columns:24px minmax(0,1fr) auto; }
  .uxp-tema .uxp-prop{ grid-column:2 / span 2; }
  .uxp-tema .uxp-cob{ grid-column:2; }
  .uxp-tema .uxp-ajustar{ grid-column:3; grid-row:1; }
  .uxp-clase{ flex-wrap:wrap; }
  .uxp-clase .uxp-cuando{ min-width:0; width:100%; display:flex; gap:8px; align-items:baseline; }
  .uxp-clase .uxp-acc{ width:100%; justify-content:flex-end; }
  .uxp-bar{ flex-direction:column-reverse; align-items:stretch; }
  .uxp-bar .btn{ width:100%; }
  .uxp-tarjetas{ grid-template-columns:1fr; }
}


/* ===== Fidelidad 1.2 · referencia aprobada, colores EsGenIAl =====
   Solo presentación de la aplicación. #docview y los documentos exportados conservan sus reglas.
   No archivos de fuentes adicionales ni bibliotecas visuales. */
body.ux{ --verde:#15322B; --hondo:#15322B; --oro:#C9A24B; --crema:#F6F5EF; --borde:#D8E1DC; --gris:#52655D; --tinta:#20332C;
  background:var(--crema); font-family:Arial,Helvetica,sans-serif; font-size:16px; line-height:1.5; }
body.ux header.app.ux{ background:#fff; border-bottom:1px solid var(--borde); padding:16px 24px; }
header.app.ux .ux-id h1{ font-family:Arial,Helvetica,sans-serif; font-weight:700; display:flex; align-items:baseline; gap:12px; color:var(--hondo); white-space:normal; }
header.app.ux .ux-id h1 .ux-marca{ font-size:26px; color:var(--hondo); letter-spacing:-.025em; }
header.app.ux .ux-id h1 .ux-producto{ font-size:11px; letter-spacing:.04em; font-weight:600; color:var(--gris); }
header.app.ux .ux-nav-btn{ color:var(--verde); border-color:transparent; border-radius:8px; font-size:14px; }
header.app.ux .ux-nav-btn:hover,header.app.ux .ux-nav-btn[aria-current="page"]{ background:var(--crema); color:var(--verde); }
header.app.ux .ux-avatar{ background:#E7EDE8; color:var(--verde); }
body.ux .wrap{ max-width:1180px; padding:28px 24px 40px; }
body.ux .card{ border:1px solid var(--borde); border-radius:14px; box-shadow:0 3px 12px rgba(21,50,43,.035); padding:24px; }
body.ux .uxp,body.ux .uxp input,body.ux .uxp textarea,body.ux .uxp select{ font-family:Arial,Helvetica,sans-serif; }
.uxp-cab h2,.uxp-cab h3.uxp-t,.uxp-tarjeta .uxp-nom,.uxp-programa .uxp-ficha-cab h3,.ux-asig h2,.uxp-prox h4,.uxp-plan h2{ font-family:Arial,Helvetica,sans-serif; font-weight:700; }
.uxp-cab h2{ font-size:24px; letter-spacing:-.02em; }
.uxp-inicio h2{ font-size:30px; }
.uxp-cab .uxp-sub{ font-size:15px; line-height:1.5; margin-top:6px; }
.uxp-tarjeta .uxp-nom{ font-size:18px; }
.uxp .btn{ border-radius:7px; }
.uxp .btn.primary{ background:var(--verde); color:#fff; border-color:var(--verde); }
.uxp .btn.ghost{ background:#fff; color:var(--verde); border-color:var(--borde); }
.uxp-tarjeta .uxp-cta .btn{ width:100%; justify-content:space-between; }
.uxp-tarjetas{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.uxp-tarjeta{ min-height:180px; border-width:1px; border-radius:10px; box-shadow:0 3px 10px rgba(21,50,43,.04); gap:10px; }
.uxp-tarjeta.destacada{ border-color:var(--borde); box-shadow:0 3px 10px rgba(21,50,43,.04); }
#uxNav{ display:grid; grid-template-columns:minmax(180px,.7fr) minmax(0,2fr); align-items:center; gap:20px; margin:0 0 24px; }
.ux-asig{ margin:0; display:block; min-width:0; }
.ux-asig h2{ font-size:16px; line-height:1.4; }
.ux-asig .ux-estado{ display:block; font-size:12px; margin-top:3px; }
.ux-etapas{ display:flex; gap:10px; border-bottom:1px solid var(--borde); padding:0; }
.ux-etapa{ background:transparent; border:0; border-bottom:3px solid transparent; border-radius:0; min-height:54px; padding:8px 4px; gap:8px; }
.ux-etapa .t b{ font-size:13px; font-weight:600; }
.ux-etapa .n{ background:#E7EDE8; color:var(--gris); width:27px; height:27px; }
.ux-etapa[aria-current="step"]{ box-shadow:none; border-color:var(--verde); }
.ux-etapa[aria-current="step"] .n,.ux-etapa.hecha .n{ background:var(--verde); color:#fff; }
.ux-etapa[aria-disabled="true"]{ opacity:1; }
.ux-etapa[aria-disabled="true"] .t b{ color:var(--gris); }
.ux-compacta{ display:none!important; }
.ux-diaria{ padding:0; border:0; border-bottom:1px solid var(--borde); border-radius:0; gap:16px; }
.ux-tab{ background:transparent; border-radius:0; border-bottom:3px solid transparent; }
.ux-tab[aria-current="page"]{ background:transparent; color:var(--verde); border-color:var(--verde); }
.uxp-drop,.uxp-despues{ border-radius:10px; }
.uxp-drop{ padding:28px 22px; }
.uxp-tema{ padding:12px 14px; border-radius:7px; border-width:1px; }
.uxp-tema .uxp-prop{ font-size:14px; }
.uxp-vertodos{ border-radius:7px; border-width:1px; padding:10px 14px; }
.uxp-bar{ border-top:0; margin-top:24px; }
.uxp-fila,.uxp-clase{ border-radius:7px; }
.uxp-hoy .uxp-dos{ grid-template-columns:minmax(0,1.45fr) minmax(240px,1fr); gap:24px; }
.uxp-hoy .uxp-prox{ border-radius:10px; padding:22px; }
.uxp-hoy .uxp-cta{ align-items:center; flex-wrap:wrap; gap:10px; }
.uxp-hoy .uxp-pend{ background:#fff; }
.uxp-mas-hoy{ position:relative; }
.uxp-mas-hoy .ux-menu-panel{ left:0; right:auto; max-width:calc(100vw - 48px); }
.uxp-hoy .uxp-obj,.uxp-hoy .uxp-luces,.uxp-hoy .uxp-por{ font-size:14px; }
.ux-contexto{ border:1px solid var(--borde); border-radius:8px; margin-top:14px; padding:0 14px; background:#fff; }
.ux-contexto > summary{ padding:12px 0; font-size:14px; font-weight:600; color:var(--verde); cursor:pointer; }
.ux-contexto .ux-detalle-cuerpo{ padding:0 0 16px; }
#uxpCriterios{ margin:0 0 18px; background:var(--crema); }
#uxpCriterios .range{ align-items:center; gap:10px; flex-wrap:wrap; }
#uxpCriterios .range input{ min-width:130px; }
#uxpEstrategias #btnEst{ margin:0; }
.uxp-semana.hoy-sem{ margin-top:18px; }
.uxp-semana.hoy-sem .tira{ margin-bottom:14px; }
#uxpEstrategias [contenteditable="true"],#uxpCriterios input{ outline-offset:2px; }
.uxp .btn:focus-visible,.uxp-enl:focus-visible,.ux-contexto summary:focus-visible{ outline:3px solid var(--oro); outline-offset:3px; }
body.ux [hidden]{ display:none!important; }
body.ux footer.app.ux{ border-top:1px solid var(--borde); font-size:12px; padding:18px 24px; background:transparent; }
@media(max-width:1000px){ #uxNav{ grid-template-columns:1fr; gap:12px; } .uxp-tarjetas{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px){
 body.ux header.app.ux{ padding:12px 16px; } header.app.ux .topbar{ gap:10px; }
 header.app.ux .ux-id h1 .ux-marca{ font-size:23px; } header.app.ux .ux-id h1{ gap:8px; }
 header.app.ux .ux-nav{ gap:2px; } header.app.ux .ux-nav-btn{ padding:8px; font-size:13px; }
 body.ux .wrap{ padding:18px 12px 28px; } body.ux .card{ padding:18px 14px; }
 .ux-etapas{ display:flex; gap:3px; } .ux-etapa{ flex-direction:column; text-align:center; padding:8px 1px; min-height:82px; gap:6px; }
 .ux-etapa .t b{ font-size:12px; line-height:1.2; } .ux-asig h2{ font-size:15px; }
 .uxp-inicio h2{ font-size:26px; } .uxp-cab h2{ font-size:22px; }
 .uxp-tarjetas{ grid-template-columns:1fr; } .uxp-tarjeta{ min-height:165px; }
 .uxp-hoy .uxp-dos{ grid-template-columns:1fr; }
 .uxp-programa .uxp-dos{ grid-template-columns:1fr; }
 .uxp-mas-hoy .ux-menu-panel{ min-width:210px; }
 .uxp-bar .btn{ max-width:100%; }
 .uxp .btn,.uxp-tema .uxp-ajustar .btn{ min-height:44px; }
 .uxp-enl{ min-height:36px; }
}
@media(prefers-reduced-motion:reduce){body.ux *,body.ux *::before,body.ux *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important;}}

/* Ajustes finales: un mismo control accesible por teclado y una sola tipografía en Hoy. */
body.ux header.app.ux .ux-avatar {width:44px;height:44px;min-height:44px;border-radius:50%;}
body.ux .ux-nav-btn {min-height:44px;}
body.ux .uxp-semana .cab, body.ux .uxp-semana .cab b {font-family:Arial,Helvetica,sans-serif;font-weight:600;}
body.ux .uxp-semana > summary::before {content:'›';color:var(--oro);margin-right:9px;}
body.ux .uxp-semana[open] > summary::before {content:'⌄';}
body.ux .uxp-bar .uxp-nota {max-width:70%;}
@media(max-width:700px){body.ux .uxp-bar .uxp-nota{max-width:100%;}}

/* ===== 22-sep · reportes de Jorge tras la primera prueba real (mismos tokens EsGenIAl) ===== */
/* 3 · nota del resultado de aprendizaje al pasar el ratón por «RA1», «RA2»… */
.ux-nota-ra{ position:fixed; z-index:3000; max-width:min(380px, calc(100vw - 16px)); background:var(--hondo,#15322B); color:#fff; border-radius:8px; padding:8px 11px; font:13px/1.45 Arial,Helvetica,sans-serif; box-shadow:0 8px 24px rgba(21,50,43,.22); pointer-events:none; }
.ux-nota-ra b{ color:var(--oro,#C9A24B); margin-right:4px; }
.ux-nota-ra div + div{ margin-top:5px; padding-top:5px; border-top:1px solid rgba(255,255,255,.18); }
/* 4 · la IA trabaja: franja visible mientras se organizan la propuesta, las estrategias o las clases */
.ux-trabajando{ position:sticky; top:0; z-index:40; display:flex; align-items:flex-start; gap:12px; background:#FBF1D8; border:1px solid #EBD59A; border-left:5px solid var(--oro,#C9A24B); border-radius:10px; padding:12px 14px; margin:0 0 16px; color:var(--hondo,#15322B); box-shadow:0 4px 14px rgba(21,50,43,.08); }
.ux-trabajando .spinner{ flex-shrink:0; margin-top:3px; }
.ux-trabajando b{ display:block; font-size:15px; }
.ux-trabajando .ux-tr-det{ display:block; font-size:13px; color:#5A4300; margin-top:2px; }
.ux-trabajando .ux-tr-pasos{ display:flex; gap:14px; flex-wrap:wrap; margin-top:6px; font-size:13px; }
.ux-trabajando .ux-tr-pasos span{ color:var(--gris,#52655D); }
.ux-trabajando .ux-tr-pasos span.act{ color:var(--hondo,#15322B); font-weight:700; }
.ux-trabajando .ux-tr-pasos span.hecho{ color:var(--verde,#15322B); }
.ux-trabajando .ux-tr-pasos span.hecho::before{ content:'✓ '; }
@media(prefers-reduced-motion:reduce){ .ux-trabajando .spinner{ animation:none; } }
/* 6 · cerrar el detalle de una clase («Editar») */
.ux-detalle-cerrar{ display:flex; justify-content:flex-end; margin:0 0 6px; }
