/* =============================================================================
 * RIZOMA MAUX · Pantalla «Lectura y PILEO» (js/modules/lectura.js)
 * -----------------------------------------------------------------------------
 * Prefijo propio: lx-. Diseño editorial (Fraunces en títulos), tarjetas con
 * degradados suaves en los colores de las mesetas y de los ejes, animaciones
 * discretas (se apagan con prefers-reduced-motion desde base.css).
 * Al final: tema oscuro, celular (≤ 760 px / 375 px) y pantalla táctil.
 * ========================================================================== */

/* ------------------------------ Generales ------------------------------- */
.lx-vista { --lx-tinta: var(--texto); --lx-suave: color-mix(in srgb, var(--surface-solid) 70%, transparent); }
.lx-panel { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.lx-panel > .card + .card { margin-top: 0; }
.lx-card { position: relative; min-width: 0; }
.lx-sec-tit { --lx-c: var(--marca-2); display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; flex-wrap: wrap; }
.lx-sec-tit > div { flex: 1; min-width: 200px; }
.lx-sec-tit h3 { margin: 2px 0 2px; font-family: var(--font-display); font-size: 1.22rem; }
.lx-sec-tit p { margin: 0; color: var(--texto-2); font-size: .88rem; max-width: 760px; }
.lx-sec-ico { width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; flex-shrink: 0; color: #fff;
  background: linear-gradient(135deg, var(--lx-c), color-mix(in srgb, var(--lx-c) 55%, #7c3aed)); box-shadow: 0 6px 16px color-mix(in srgb, var(--lx-c) 35%, transparent); }
.lx-sec-ico .ico, .lx-sec-ico svg { width: 21px; height: 21px; }
.lx-sec-extra { flex: 0 0 auto; min-width: 200px; }
.lx-kicker { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--lx-c, var(--marca-2)); }
.lx-kicker .ico, .lx-kicker svg { width: 14px; height: 14px; }
.lx-h4 { display: flex; align-items: center; gap: 7px; font-size: .98rem; margin: 14px 0 6px; }
.lx-h4 .ico, .lx-h4 svg { width: 17px; height: 17px; color: var(--marca-2); }
.lx-mini-tit { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); margin: 10px 0 4px; }
.lx-lista { margin: 4px 0; padding-left: 1.2em; } .lx-lista li { margin: 3px 0; }
.lx-lista-check { list-style: none; padding-left: 0; } .lx-lista-check li { position: relative; padding-left: 24px; }
.lx-lista-check li::before { content: ''; position: absolute; left: 2px; top: .45em; width: 12px; height: 7px; border-left: 2.5px solid var(--ok); border-bottom: 2.5px solid var(--ok); transform: rotate(-45deg); }
.lx-campo { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.lx-campo > span { font-size: .78rem; font-weight: 700; color: var(--texto-2); }
.lx-campo select, .lx-campo input { width: 100%; }
.lx-btn-grande { padding: 12px 20px; font-size: 1rem; border-radius: 14px; }
.lx-bi { width: 36px; height: 36px; flex-shrink: 0; }
.lx-link { border: 0; background: none; padding: 0; font: inherit; color: var(--enlace); text-decoration: underline; cursor: pointer; }
.lx-tag { display: inline-block; font-size: .72rem; padding: 1px 8px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--borde); color: var(--texto-2); }
.lx-pills { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0; }
.lx-pills span { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--borde-2); color: var(--texto); }
.lx-pills span .ico, .lx-pills span svg { width: 13px; height: 13px; }
.lx-pills span.pr { background: color-mix(in srgb, #0891b2 12%, transparent); border-color: color-mix(in srgb, #0891b2 30%, transparent); color: color-mix(in srgb, #0891b2 80%, var(--texto)); }
.lx-pills.grande span { font-size: .82rem; padding: 5px 12px; }
.lx-det { margin: 8px 0; border: 1px solid var(--borde); border-radius: 12px; padding: 8px 12px; background: var(--surface-2); }
.lx-det > summary { cursor: pointer; font-weight: 700; display: flex; align-items: center; gap: 6px; list-style: none; }
.lx-det > summary::-webkit-details-marker { display: none; }
.lx-det > summary::after { content: '▾'; margin-left: auto; color: var(--texto-3); transition: var(--t); }
.lx-det[open] > summary::after { transform: rotate(180deg); }
.lx-det > summary .ico, .lx-det > summary svg { width: 16px; height: 16px; color: var(--marca-2); }
.lx-tit-grupo { display: flex; align-items: center; gap: 8px; margin: 12px 0 -4px; font-family: var(--font-display); font-size: 1.18rem; }
.lx-num { display: inline-grid; place-items: center; min-width: 30px; height: 30px; padding: 0 6px; border-radius: 10px; font-weight: 800; font-family: var(--font-display); color: #fff; background: var(--lx-c, var(--marca-2)); }
.lx-estado { --lx-c: #64748b; display: inline-flex; align-items: center; gap: 4px; font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 2px 9px; border-radius: 999px;
  color: var(--lx-c); background: color-mix(in srgb, var(--lx-c) 13%, transparent); border: 1px solid color-mix(in srgb, var(--lx-c) 32%, transparent); }
.lx-chipbtn { border: 1px solid var(--borde-2); background: var(--surface-solid); color: var(--texto); font: inherit; font-size: .84rem; font-weight: 650; padding: 7px 12px; border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: var(--t); text-align: left; }
.lx-chipbtn .ico, .lx-chipbtn svg { width: 15px; height: 15px; }
.lx-chipbtn:hover { border-color: var(--marca-2); color: var(--marca); }
.lx-chipbtn.activo { background: linear-gradient(135deg, var(--marca-2), #7c3aed); color: #fff; border-color: transparent; }
.lx-previa { font-size: .95rem; }
@keyframes lx-sube { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ------------------------------ Panorama ------------------------------- */
.lx-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; align-items: center; padding: 30px; border-radius: var(--r-xl);
  color: #fff; background: radial-gradient(circle at 85% 20%, rgba(245, 158, 11, .45), transparent 42%), radial-gradient(circle at 10% 110%, rgba(219, 39, 119, .45), transparent 45%), linear-gradient(130deg, #1e3a8a 0%, #4338ca 50%, #7c3aed 100%);
  box-shadow: 0 18px 46px rgba(30, 58, 138, .35); }
.lx-hero::after { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.18) 1px, transparent 1px); background-size: 18px 18px; mask-image: linear-gradient(90deg, transparent, #000 60%); pointer-events: none; }
.lx-hero-txt { position: relative; z-index: 1; }
.lx-hero .lx-kicker { color: #fde68a; }
.lx-hero h2 { font-family: var(--font-display); font-size: clamp(1.6rem, 3.4vw, 2.5rem); line-height: 1.12; margin: 10px 0 12px; letter-spacing: -.015em; }
.lx-hero p { color: rgba(255, 255, 255, .88); font-size: 1.02rem; max-width: 620px; }
.lx-hero-acc { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.lx-hero-acc .btn-sec { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.35); }
.lx-hero-acc .btn-sec:hover { background: rgba(255,255,255,.24); color: #fff; border-color: #fff; }
.lx-hero-arte { position: relative; z-index: 1; }
.lx-hero-arte svg { width: 100%; max-height: 260px; display: block; filter: drop-shadow(0 10px 22px rgba(2, 6, 23, .35)); }
.lx-raiz { fill: none; stroke: rgba(255, 255, 255, .7); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 7 7; animation: lx-flujo 2.6s linear infinite; }
.lx-raiz.fina { stroke-width: 1.4; stroke: rgba(253, 230, 138, .65); }
@keyframes lx-flujo { to { stroke-dashoffset: -28; } }
.lx-pulso { stroke: #fff; stroke-width: 2.5; transform-box: fill-box; transform-origin: center; animation: lx-pulso 2.8s ease-in-out infinite; }
@keyframes lx-pulso { 50% { transform: scale(1.35); } }
.lx-libro { animation: lx-flota 5s ease-in-out infinite; }
@keyframes lx-flota { 50% { transform: translateY(-4px); } }

.lx-cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lx-cifra { --lx-c: var(--marca-2); text-align: left; cursor: pointer; font: inherit; color: var(--texto); padding: 16px; border-radius: var(--r-lg); border: 1px solid color-mix(in srgb, var(--lx-c) 25%, var(--borde));
  background: linear-gradient(160deg, color-mix(in srgb, var(--lx-c) 14%, var(--surface-solid)), var(--surface-solid) 70%); display: flex; flex-direction: column; gap: 2px; transition: var(--t); animation: lx-sube .5s ease both; animation-delay: calc(var(--k) * 70ms); }
.lx-cifra:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); }
.lx-cifra .ico, .lx-cifra svg { width: 24px; height: 24px; color: var(--lx-c); }
.lx-cifra b { font-family: var(--font-display); font-size: 2.1rem; line-height: 1.05; }
.lx-cifra span { font-size: .82rem; color: var(--texto-2); }

.lx-ejes-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lx-eje { --lx-c: var(--marca-2); padding: 16px; border-radius: 16px; background: color-mix(in srgb, var(--lx-c) 9%, transparent); border: 1px solid color-mix(in srgb, var(--lx-c) 25%, transparent); }
.lx-eje .ico, .lx-eje svg { width: 26px; height: 26px; color: var(--lx-c); }
.lx-eje b { display: block; margin: 6px 0 2px; font-family: var(--font-display); font-size: 1.04rem; }
.lx-eje p { margin: 0; font-size: .86rem; color: var(--texto-2); }
.lx-cita { margin: 16px 0 0; padding: 14px 18px 12px; border-left: 4px solid var(--oro); border-radius: 0 14px 14px 0; background: color-mix(in srgb, var(--oro) 9%, transparent); font-family: var(--font-display); font-size: 1.02rem; line-height: 1.5; }
.lx-cita cite { display: block; margin-top: 6px; font-family: var(--font); font-style: normal; font-size: .8rem; color: var(--texto-2); }

.lx-accesos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.lx-acceso { --lx-c: var(--marca-2); position: relative; overflow: hidden; text-align: left; cursor: pointer; font: inherit; color: var(--texto); padding: 18px 18px 16px; border-radius: var(--r-lg);
  border: 1px solid var(--borde); background: var(--surface-solid); display: flex; flex-direction: column; gap: 4px; transition: var(--t); animation: lx-sube .5s ease both; animation-delay: calc(var(--k) * 60ms); }
.lx-acceso::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--lx-c), color-mix(in srgb, var(--lx-c) 40%, #f59e0b)); }
.lx-acceso::after { content: ''; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%; background: color-mix(in srgb, var(--lx-c) 12%, transparent); transition: var(--t); }
.lx-acceso:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); border-color: color-mix(in srgb, var(--lx-c) 45%, transparent); }
.lx-acceso:hover::after { transform: scale(1.3); }
.lx-acceso-ico { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--lx-c), color-mix(in srgb, var(--lx-c) 55%, #1e3a8a)); margin-bottom: 6px; position: relative; z-index: 1; }
.lx-acceso-ico .ico, .lx-acceso-ico svg { width: 22px; height: 22px; }
.lx-acceso b { font-family: var(--font-display); font-size: 1.08rem; position: relative; z-index: 1; }
.lx-acceso > span:not(.lx-acceso-ico) { font-size: .85rem; color: var(--texto-2); position: relative; z-index: 1; }
.lx-acceso-ir { position: absolute; right: 14px; bottom: 12px; color: var(--lx-c); transition: var(--t); z-index: 1; }
.lx-acceso:hover .lx-acceso-ir { transform: translateX(4px); }
.lx-docs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lx-doc { --lx-c: var(--marca-2); text-align: left; cursor: pointer; font: inherit; color: var(--texto); padding: 18px; border-radius: var(--r-lg); border: 1px solid var(--borde); border-left: 5px solid var(--lx-c);
  background: linear-gradient(120deg, color-mix(in srgb, var(--lx-c) 8%, var(--surface-solid)), var(--surface-solid)); display: flex; flex-direction: column; gap: 6px; transition: var(--t); }
.lx-doc:hover { box-shadow: var(--sombra-2); transform: translateY(-2px); }
.lx-doc-tipo { display: inline-flex; gap: 6px; align-items: center; font-size: .72rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--lx-c); }
.lx-doc-tipo .ico, .lx-doc-tipo svg { width: 15px; height: 15px; }
.lx-doc b { font-family: var(--font-display); font-size: 1.02rem; line-height: 1.3; }
.lx-doc-autor { font-weight: 700; font-size: .88rem; }
.lx-doc small { color: var(--texto-2); }

/* ------------------------------ Editorial ------------------------------- */
.lx-editorial { padding: 26px 28px; background: linear-gradient(170deg, color-mix(in srgb, var(--marca-2) 7%, var(--surface)), var(--surface) 55%); }
.lx-h-editorial { font-family: var(--font-display); font-size: clamp(1.45rem, 2.8vw, 2.1rem); line-height: 1.15; margin: 8px 0 6px; letter-spacing: -.015em; }
.lx-autor { font-weight: 700; color: var(--texto-2); margin: 0 0 4px; }
.lx-lema { font-family: var(--font-display); font-style: italic; font-size: 1.1rem; color: var(--marca); }
.lx-dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 10px; }
.lx-dos p, .lx-tri p { line-height: 1.65; }
.lx-tres { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.lx-indice { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.lx-indice-b { border: 1px solid var(--borde-2); background: var(--surface-solid); color: var(--texto-2); font: inherit; font-size: .78rem; font-weight: 700; padding: 5px 11px; border-radius: 999px; cursor: pointer; transition: var(--t); }
.lx-indice-b:hover { color: var(--marca); border-color: var(--marca-2); }
.lx-tri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.lx-tri-i { --lx-c: var(--marca-2); padding: 14px 16px; border-radius: 16px; background: var(--surface-solid); border: 1px solid var(--borde); border-top: 4px solid var(--lx-c); }
.lx-tri-i h4 { display: flex; gap: 7px; align-items: center; margin: 0 0 6px; color: var(--lx-c); }
.lx-tri-i h4 .ico, .lx-tri-i h4 svg { width: 18px; height: 18px; }
.lx-tri-i p { font-size: .9rem; margin: 0 0 8px; }
.lx-pregunta-g { font-family: var(--font-display); font-size: 1.22rem; line-height: 1.4; margin: 0 0 12px; padding: 14px 18px; border-radius: 16px; background: linear-gradient(120deg, color-mix(in srgb, #0284c7 12%, transparent), transparent); }
.lx-ambitos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lx-ambitos > div { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--borde); font-size: .88rem; }
.lx-ambitos span { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; color: #fff; background: #0284c7; }
.lx-webb { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lx-webb > div { --lx-c: #64748b; padding: 12px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--lx-c) 35%, transparent); background: color-mix(in srgb, var(--lx-c) 9%, transparent); }
.lx-webb-n { font-size: .72rem; font-weight: 800; color: var(--lx-c); }
.lx-webb b { display: block; margin: 2px 0 4px; } .lx-webb p { margin: 0; font-size: .84rem; color: var(--texto-2); }
.lx-onto { display: flex; align-items: stretch; gap: 8px; }
.lx-onto-i { --lx-c: var(--marca-2); flex: 1; min-width: 0; padding: 14px; border-radius: 16px; background: color-mix(in srgb, var(--lx-c) 9%, var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 28%, transparent); }
.lx-onto-i .ico, .lx-onto-i svg { width: 26px; height: 26px; color: var(--lx-c); }
.lx-onto-i b { display: block; font-family: var(--font-display); font-size: 1.08rem; margin: 4px 0; }
.lx-onto-i p { margin: 0; font-size: .87rem; }
.lx-onto-mas { align-self: center; font-family: var(--font-display); font-size: 1.6rem; color: var(--texto-3); }
.lx-sintesis { margin: 14px 0 0; padding: 12px 16px; border-radius: 14px; background: var(--surface-2); border-left: 4px solid var(--oro); font-style: italic; }
.lx-principios { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.lx-principios > div { padding: 12px 14px; border-radius: 14px; border: 1px dashed var(--borde-2); }
.lx-principios b { display: block; margin: 8px 0 4px; } .lx-principios p { margin: 0; font-size: .86rem; color: var(--texto-2); }
.lx-flujo { display: flex; align-items: stretch; gap: 6px; }
.lx-flujo-p { flex: 1; min-width: 0; padding: 14px; border-radius: 16px; background: var(--surface-solid); border: 1px solid var(--borde); animation: lx-sube .5s ease both; animation-delay: calc(var(--k) * 120ms); }
.lx-flujo-p > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #db2777, #7c3aed); }
.lx-flujo-p b { display: block; margin: 8px 0 4px; font-family: var(--font-display); }
.lx-flujo-p p { margin: 0; font-size: .87rem; }
.lx-flujo-f { align-self: center; color: var(--texto-3); flex-shrink: 0; }
.lx-logicas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lx-logicas > div { padding: 14px; border-radius: 16px; background: linear-gradient(170deg, color-mix(in srgb, #0f766e 9%, var(--surface-solid)), var(--surface-solid)); border: 1px solid var(--borde); }
.lx-logica-ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, #0f766e 15%, transparent); color: #0f766e; }
.lx-logicas b { display: block; margin: 8px 0 4px; } .lx-logicas p { margin: 0 0 4px; font-size: .86rem; }
.lx-hallazgo { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; }
.lx-equipos { display: grid; grid-template-columns: repeat(4, 34px); gap: 6px; }
.lx-equipos span { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--surface-2); color: var(--texto-3); border: 1px solid var(--borde); }
.lx-equipos span.on { background: #dc2626; color: #fff; border-color: transparent; }
.lx-equipos .ico, .lx-equipos svg { width: 17px; height: 17px; }
.lx-retro { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lx-retro-i { --lx-c: var(--marca-2); padding: 14px; border-radius: 16px; background: color-mix(in srgb, var(--lx-c) 7%, var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 25%, transparent); }
.lx-retro-i > b { display: block; margin: 8px 0 6px; font-family: var(--font-display); font-size: 1.02rem; }
.lx-frases { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.lx-frase { text-align: left; font: inherit; font-size: .85rem; color: var(--texto); padding: 7px 10px; border-radius: 10px; border: 1px solid var(--borde); background: var(--surface-solid); cursor: pointer; display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; transition: var(--t); }
.lx-frase .ico, .lx-frase svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--texto-3); margin-top: 2px; }
.lx-frase:hover { border-color: var(--marca-2); }
.lx-frase:hover .ico, .lx-frase:hover svg { color: var(--marca-2); }
.lx-indic { counter-reset: ind; list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lx-indic li { counter-increment: ind; display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--borde); }
.lx-indic li::before { content: counter(ind); flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; color: #fff; background: linear-gradient(135deg, #16a34a, #0f766e); }
.lx-conceptos { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; margin: 0; }
.lx-conceptos > div { padding: 12px 14px; border-radius: 14px; background: var(--surface-2); border-left: 4px solid #7c3aed; }
.lx-conceptos dt { font-weight: 800; font-family: var(--font-display); }
.lx-conceptos dd { margin: 4px 0 0; font-size: .87rem; color: var(--texto-2); }
.lx-fuerza { position: relative; overflow: hidden; padding: 30px 32px; border-radius: var(--r-xl); color: #fff;
  background: radial-gradient(circle at 100% 0, rgba(245, 158, 11, .4), transparent 50%), linear-gradient(135deg, #312e81, #6d28d9 60%, #be185d); box-shadow: var(--sombra-2); }
.lx-fuerza .lx-kicker { color: #fde68a; }
.lx-fuerza blockquote { margin: 12px 0 10px; font-family: var(--font-display); font-size: clamp(1.15rem, 2.3vw, 1.55rem); line-height: 1.45; quotes: '“' '”'; }
.lx-fuerza blockquote::before { content: open-quote; font-size: 3.4em; line-height: 0; vertical-align: -.42em; margin-right: 4px; color: #fde68a; }
.lx-fuerza blockquote::after { content: close-quote; color: #fde68a; }
.lx-fuerza cite { font-style: normal; font-size: .88rem; color: rgba(255, 255, 255, .85); }
.lx-refs ul { margin: 0; padding-left: 1.2em; font-size: .86rem; overflow-wrap: anywhere; } .lx-refs li { margin: 4px 0; }

/* ------------------------- Diagrama de mesetas ------------------------- */
.lx-diag { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 16px; align-items: start; }
.lx-diag-svg { min-width: 0; border-radius: var(--r-lg); background: radial-gradient(circle at 50% 50%, color-mix(in srgb, #7c3aed 8%, transparent), transparent 70%); border: 1px dashed var(--borde-2); }
.lx-diag-lienzo { width: 100%; height: auto; display: block; }
.lx-d-el { transition: opacity .25s ease; }
.lx-foco .lx-d-el:not(.on) { opacity: .16; }
.lx-d-meseta { cursor: pointer; outline: none; }
.lx-d-meseta circle { transition: transform .25s ease; transform-box: fill-box; transform-origin: center; }
.lx-d-meseta:hover circle, .lx-d-meseta.on circle, .lx-d-meseta:focus-visible circle { transform: scale(1.06); }
.lx-d-meseta:focus-visible .lx-d-halo { stroke: var(--texto); stroke-width: 3; stroke-dasharray: 5 4; opacity: 1; fill-opacity: .2; }
.lx-d-halo { animation: lx-halo 3.2s ease-in-out infinite; }
@keyframes lx-halo { 50% { opacity: .3; } }
.lx-d-mtxt { fill: #fff; font-family: var(--font-display); font-weight: 700; pointer-events: none; }
.lx-d-msub { fill: rgba(255, 255, 255, .85); font-weight: 600; pointer-events: none; }
.lx-d-ntxt { fill: var(--texto); font-size: 13.5px; font-weight: 650; }
.lx-d-art { cursor: pointer; }
.lx-d-art.on .lx-d-linea { filter: drop-shadow(0 0 6px rgba(124, 58, 237, .5)); }
.lx-d-badge { outline: none; cursor: pointer; }
.lx-d-badge circle { fill: var(--surface-solid); stroke: var(--borde-2); stroke-width: 2; }
.lx-d-badge text { fill: var(--texto); font-weight: 800; font-size: 12px; pointer-events: none; }
.lx-d-badge:focus-visible circle, .lx-d-art.on .lx-d-badge circle { stroke: #7c3aed; stroke-width: 3; }
.lx-diag-panel { min-width: 0; overflow-x: hidden; padding: 3px; }
.lx-diag-ayuda { display: flex; gap: 8px; align-items: flex-start; font-size: .88rem; color: var(--texto-2); margin: 0 0 10px; }
.lx-diag-ayuda .ico, .lx-diag-ayuda svg { width: 18px; height: 18px; flex-shrink: 0; color: #7c3aed; }
.lx-arts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lx-arts button { width: 100%; display: flex; gap: 10px; align-items: flex-start; text-align: left; font: inherit; color: var(--texto); background: var(--surface-solid); border: 1px solid var(--borde); border-radius: 12px; padding: 8px 10px; cursor: pointer; transition: var(--t); }
.lx-arts button:hover { border-color: #7c3aed; }
.lx-arts b { display: block; font-size: .88rem; } .lx-arts small { color: var(--texto-2); font-size: .8rem; }
.lx-art-n { flex-shrink: 0; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-size: .78rem; font-weight: 800; background: color-mix(in srgb, #7c3aed 14%, transparent); color: #7c3aed; }
.lx-diag-ficha { --lx-c: var(--marca-2); --lx-c2: var(--lx-c); padding: 16px; border-radius: 18px; border: 1px solid color-mix(in srgb, var(--lx-c) 30%, transparent);
  background: linear-gradient(160deg, color-mix(in srgb, var(--lx-c) 13%, var(--surface-solid)), color-mix(in srgb, var(--lx-c2) 8%, var(--surface-solid))); animation: lx-sube .3s ease both; }
.lx-diag-ficha h4 { font-family: var(--font-display); font-size: 1.35rem; margin: 4px 0 6px; color: var(--lx-c); }
.lx-diag-ficha .lx-kicker { color: var(--lx-c); }
.lx-diag-ficha p { font-size: .9rem; }
.lx-diag-como { font-family: var(--font-display); font-size: 1.1rem !important; line-height: 1.45; }
.lx-nodos-lista { list-style: none; padding: 0; margin: 0 0 6px; display: flex; flex-direction: column; gap: 5px; }
.lx-nodos-lista li { font-size: .88rem; padding: 6px 9px; border-radius: 10px; background: color-mix(in srgb, var(--surface-solid) 75%, transparent); display: flex; gap: 6px; flex-wrap: wrap; align-items: baseline; }

/* --------------------------------- PILEO ------------------------------- */
.lx-pileo-cab { background: linear-gradient(170deg, color-mix(in srgb, #d97706 9%, var(--surface)), var(--surface) 55%); }
.lx-pileo-cab .lx-kicker { color: #b45309; }
.lx-obj-g { font-family: var(--font-display); font-size: 1.08rem; line-height: 1.5; padding: 14px 18px; border-radius: 16px; background: color-mix(in srgb, var(--marca-2) 9%, transparent); border-left: 4px solid var(--marca-2); margin: 0 0 12px; }
.lx-objs { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; }
.lx-objs > div { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--borde); font-size: .88rem; animation: lx-sube .45s ease both; animation-delay: calc(var(--k) * 60ms); }
.lx-objs .ico, .lx-objs svg { width: 18px; height: 18px; color: var(--ok); flex-shrink: 0; margin-top: 1px; }
/* Trama del problema del PILEO (reemplaza al árbol de problemas desde la 1.11.0) */
.lx-trama-intro { margin: -2px 0 8px; font-size: .95rem; line-height: 1.6; max-width: 920px; }
.lx-trama-vistas { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.lx-trama .organizador-card { padding: 12px; }
.lx-trama-chips { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
.lx-trama-chipcol { padding: 10px 12px; border-radius: 14px; border: 1px dashed color-mix(in srgb, #16a34a 55%, transparent); background: color-mix(in srgb, #16a34a 6%, var(--surface-solid)); }
.lx-trama-chipcol > small { display: flex; gap: 6px; align-items: center; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #15803d; margin-bottom: 6px; }
.lx-trama-chipcol > small .ico, .lx-trama-chipcol > small svg { width: 14px; height: 14px; }
.lx-trama-movil { display: none; flex-direction: column; gap: 14px; }
.lx-tn { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 16px; border: 1px solid var(--borde); background: var(--surface-2); }
.lx-tn > i { align-self: center; color: var(--texto-3); line-height: 1; }
.lx-tn-num { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); }
.lx-tn-ret { display: flex; gap: 6px; align-items: center; margin: 2px 0; font-size: .82rem; font-weight: 700; color: var(--texto-2); border-left: 3px dotted var(--texto-3); padding-left: 10px; }
.lx-tn-ret .ico, .lx-tn-ret svg { width: 16px; height: 16px; }
.lx-tn-fuga { border-style: dashed; }
.lx-trama-vinc { margin-top: 14px; padding: 12px 14px; border-radius: 14px; border: 1px dashed color-mix(in srgb, #7c3aed 50%, transparent); background: color-mix(in srgb, #7c3aed 5%, var(--surface-solid)); }
.lx-trama-vinc ul { margin: 6px 0 0; padding-left: 20px; display: grid; gap: 6px; }
.lx-por-validar { display: inline-block; margin-left: 6px; padding: 2px 9px; border-radius: 999px; font-size: .7rem; font-weight: 800; color: #6d28d9; background: color-mix(in srgb, #7c3aed 12%, transparent); vertical-align: 2px; }
.lx-trama-tabla caption { caption-side: top; text-align: left; font-weight: 700; padding: 0 0 8px; color: var(--texto-2); }
.lx-trama-tabla td { vertical-align: top; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .lx-trama-chipcol > small { color: #4ade80; } :root:not([data-theme="light"]) .lx-por-validar { color: #c4b5fd; } }
:root[data-theme="dark"] .lx-trama-chipcol > small { color: #4ade80; } :root[data-theme="dark"] .lx-por-validar { color: #c4b5fd; }
@media (max-width: 640px) {
  .lx-trama .org-svg, .lx-trama-chips { display: none; }
  .lx-trama-movil { display: flex; }
}
@media print { .lx-trama-vistas, .lx-trama-movil, .lx-trama .org-lista { display: none !important; } .lx-trama .org-svg, .lx-trama-chips { display: block !important; } }
.lx-ab { --lx-c: #64748b; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--lx-c) 9%, var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 30%, transparent); min-width: 0; }
.lx-ab > .ico, .lx-ab > svg { width: 20px; height: 20px; color: var(--lx-c); }
.lx-ab small { display: block; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--lx-c); margin-top: 2px; }
.lx-ab p { margin: 4px 0 0; font-size: .86rem; }
.lx-ab-c { --lx-c: #92400e; } .lx-ab-p { --lx-c: #dc2626; } .lx-ab-e { --lx-c: #2563eb; }
.lx-ab-s { --lx-c: #16a34a; grid-column: 1 / -1; background: linear-gradient(90deg, color-mix(in srgb, #16a34a 14%, var(--surface-solid)), color-mix(in srgb, #f59e0b 10%, var(--surface-solid))); }
.lx-tramos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lx-tramo { --lx-c: var(--marca-2); position: relative; padding: 16px; border-radius: 18px; border: 1px solid var(--borde); background: linear-gradient(170deg, color-mix(in srgb, var(--lx-c) 11%, var(--surface-solid)), var(--surface-solid) 60%); animation: lx-sube .45s ease both; animation-delay: calc(var(--k) * 60ms); transition: var(--t); }
.lx-tramo.activo { border: 2px solid var(--lx-c); box-shadow: 0 0 0 5px color-mix(in srgb, var(--lx-c) 18%, transparent), var(--sombra-2); transform: translateY(-2px); }
.lx-tramo h4 { font-family: var(--font-display); font-size: 1.08rem; margin: 8px 0 4px; }
.lx-tramo p { font-size: .86rem; margin: 6px 0; }
.lx-tramo-n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; font-weight: 800; color: #fff; background: var(--lx-c); font-family: var(--font-display); }
.lx-tramo-tu { position: absolute; right: 12px; top: 12px; display: inline-flex; gap: 4px; align-items: center; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: 3px 9px; border-radius: 999px; color: #fff; background: var(--lx-c); }
.lx-tramo-tu .ico, .lx-tramo-tu svg { width: 12px; height: 12px; }
.lx-aliados { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.lx-aliados > div { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 16px; background: var(--surface-solid); border: 1px solid var(--borde); animation: lx-sube .45s ease both; animation-delay: calc(var(--k) * 60ms); }
.lx-aliados span { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #db2777, #f59e0b); }
.lx-aliados b { font-size: .92rem; margin-top: 4px; } .lx-aliados small { color: var(--texto-2); font-size: .8rem; }
.lx-libros { display: flex; gap: 8px; align-items: center; font-weight: 600; }

/* Cronograma */
.lx-anio { position: relative; height: 62px; margin: 6px 6px 18px; }
.lx-anio-linea { position: absolute; left: 0; right: 0; top: 28px; height: 6px; border-radius: 6px; background: linear-gradient(90deg, #f472b6, #f59e0b, #22c55e, #0ea5e9, #8b5cf6); opacity: .55; }
.lx-anio-mes { position: absolute; top: 42px; font-size: .66rem; font-weight: 700; color: var(--texto-3); text-transform: uppercase; }
.lx-anio-pto { position: absolute; top: 22px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: #d97706; border: 3px solid var(--surface-solid); box-shadow: 0 2px 6px rgba(0,0,0,.25); }
.lx-anio-pto.pasada { background: #94a3b8; } .lx-anio-pto.anual { background: #0891b2; }
.lx-anio-hoy { position: absolute; top: 0; bottom: 18px; width: 2px; margin-left: -1px; background: #dc2626; }
.lx-anio-hoy b { position: absolute; top: -2px; left: 50%; transform: translateX(-50%); font-size: .64rem; font-weight: 800; color: #fff; background: #dc2626; padding: 1px 6px; border-radius: 6px; white-space: nowrap; }
.lx-tl { list-style: none; margin: 0; padding: 0 0 0 4px; position: relative; display: flex; flex-direction: column; gap: 14px; }
.lx-tl::before { content: ''; position: absolute; left: 33px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: linear-gradient(#f59e0b, #7c3aed); opacity: .45; }
.lx-tl-i { display: grid; grid-template-columns: 62px 1fr; gap: 14px; align-items: start; animation: lx-sube .45s ease both; animation-delay: calc(var(--k) * 70ms); }
.lx-tl-fecha { position: relative; z-index: 1; width: 60px; height: 64px; border-radius: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; background: linear-gradient(160deg, #f59e0b, #db2777); box-shadow: 0 6px 16px rgba(219, 39, 119, .3); }
.lx-tl-fecha b { font-family: var(--font-display); font-size: 1.5rem; line-height: 1; }
.lx-tl-fecha span { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.lx-tl-i.pasada .lx-tl-fecha { background: linear-gradient(160deg, #94a3b8, #64748b); box-shadow: none; }
.lx-tl-i.anual .lx-tl-fecha { background: linear-gradient(160deg, #0891b2, #2563eb); }
.lx-tl-cuerpo { min-width: 0; padding: 14px 16px; border-radius: 16px; background: var(--surface-solid); border: 1px solid var(--borde); }
.lx-tl-cuerpo h4 { font-family: var(--font-display); font-size: 1.12rem; margin: 6px 0 4px; }
.lx-tl-cuerpo p { font-size: .88rem; margin: 6px 0; }
.lx-tl-btn { margin-top: 6px; }

/* ------------------------- Lectura consciente ------------------------- */
.lx-cons-cab { background: linear-gradient(170deg, color-mix(in srgb, #16a34a 9%, var(--surface)), var(--surface) 55%); }
.lx-cons-cab .lx-kicker { color: #15803d; }
.lx-fases { display: flex; gap: 8px; align-items: stretch; }
.lx-fase { --lx-c: var(--marca-2); flex: 1; min-width: 0; padding: 16px; border-radius: 18px; background: linear-gradient(170deg, color-mix(in srgb, var(--lx-c) 14%, var(--surface-solid)), var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 30%, transparent); animation: lx-sube .45s ease both; animation-delay: calc(var(--k) * 110ms); }
.lx-fase > .ico, .lx-fase > svg { width: 28px; height: 28px; color: var(--lx-c); display: block; margin: 6px 0; }
.lx-fase-n { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lx-c); }
.lx-fase b { display: block; font-family: var(--font-display); font-size: 1.05rem; }
.lx-fase small { color: var(--texto-2); }
.lx-fase ul { font-size: .86rem; margin-top: 6px; }

/* ------------------------------ Gimnasio ------------------------------- */
.lx-gym { padding: 22px; background: linear-gradient(170deg, color-mix(in srgb, #0891b2 8%, var(--surface)), var(--surface) 50%); scroll-margin-top: 80px; }
.lx-gym:fullscreen { overflow: auto; background: var(--bg); padding: 28px max(28px, 4vw); }
.lx-gym:-webkit-full-screen { overflow: auto; background: var(--bg); }
.lx-gym-full { position: fixed !important; inset: 0; z-index: 90; overflow: auto; border-radius: 0 !important; background: var(--bg) !important; padding: 24px max(20px, 4vw) !important; }
.lx-gym-cab { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.lx-gym-cab h3 { font-family: var(--font-display); font-size: 1.5rem; margin: 4px 0 2px; }
.lx-gym-cab p { margin: 0; }
.lx-gym-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.lx-gym-tab { --lx-c: var(--marca-2); display: flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-weight: 750; font-size: .92rem; color: var(--texto); padding: 12px 10px; border-radius: 14px; cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--lx-c) 30%, var(--borde)); background: var(--surface-solid); transition: var(--t); }
.lx-gym-tab .ico, .lx-gym-tab svg { width: 20px; height: 20px; color: var(--lx-c); }
.lx-gym-tab:hover { transform: translateY(-1px); border-color: var(--lx-c); }
.lx-gym-tab[aria-selected="true"] { color: #fff; background: linear-gradient(135deg, var(--lx-c), color-mix(in srgb, var(--lx-c) 55%, #1e3a8a)); border-color: transparent; box-shadow: 0 8px 20px color-mix(in srgb, var(--lx-c) 35%, transparent); }
.lx-gym-tab[aria-selected="true"] .ico, .lx-gym-tab[aria-selected="true"] svg { color: #fff; }
.lx-gym-sub { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.lx-gym-sub:empty { display: none; }
.lx-gym-escena { padding: 16px; border-radius: 18px; background: var(--surface-solid); border: 1px solid var(--borde); min-height: 260px; display: flex; flex-direction: column; gap: 14px; animation: lx-sube .3s ease both; }
.lx-ctrl { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.lx-ctrl > * { flex: 1 1 170px; min-width: 0; }
.lx-ctrl > .check, .lx-ctrl > .btn { flex: 0 0 auto; }
.lx-campo-texto { flex: 2 1 260px !important; }
.lx-rango { display: flex; flex-direction: column; gap: 4px; font-size: .78rem; font-weight: 700; color: var(--texto-2); }
.lx-rango output { color: var(--marca); font-weight: 800; font-variant-numeric: tabular-nums; }
.lx-rango input[type=range] { width: 100%; accent-color: var(--marca-2); height: 28px; }
.lx-instr { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-size: .85rem; color: var(--texto-2); padding: 10px 12px; border-radius: 12px; background: var(--surface-2); }
.lx-instr .ico, .lx-instr svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--marca-2); margin-top: 2px; }
.lx-reloj { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 1.05rem; }
.lx-reloj.grande { font-size: 1.6rem; color: var(--marca); }
.lx-prog { height: 8px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--borde); overflow: hidden; }
.lx-prog > span { display: block; height: 100%; width: 0; border-radius: 8px; background: linear-gradient(90deg, #16a34a, #0891b2, #7c3aed); transition: width .3s linear; }

/* Respiración */
.lx-resp { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 1fr); gap: 20px; align-items: center; }
.lx-resp-escena { position: relative; aspect-ratio: 1; max-width: 340px; width: 100%; margin: 0 auto; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, #16a34a 10%, transparent), transparent 70%); }
.lx-resp-escena::before { content: ''; position: absolute; inset: 4%; border-radius: 50%; border: 2px dashed color-mix(in srgb, #16a34a 35%, transparent); }
.lx-resp-fig { position: absolute; inset: 10%; border-radius: 50%; transform: scale(.55); transition: transform 4s ease-in-out;
  background: radial-gradient(circle at 35% 30%, #bbf7d0, #22c55e 45%, #0f766e); box-shadow: 0 0 60px rgba(34, 197, 94, .45), inset 0 -12px 30px rgba(15, 118, 110, .4); }
.lx-resp-fig.globo { background: none; box-shadow: none; border-radius: 0; }
.lx-resp-fig.globo svg { width: 100%; height: 100%; filter: drop-shadow(0 10px 22px rgba(219, 39, 119, .35)); }
.lx-resp-escena[data-fase="exhala"] .lx-resp-fig:not(.globo) { background: radial-gradient(circle at 35% 30%, #bae6fd, #0ea5e9 45%, #1e3a8a); box-shadow: 0 0 40px rgba(14, 165, 233, .4); }
.lx-resp-txt { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-shadow: 0 2px 8px rgba(2, 6, 23, .45); pointer-events: none; }
.lx-resp-txt b { font-family: var(--font-display); font-size: clamp(1.3rem, 3vw, 1.8rem); }
.lx-resp-txt span { font-family: var(--font-mono); font-size: 2rem; font-weight: 700; min-height: 1.2em; }
.lx-resp-lado { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.lx-resp-guion { font-family: var(--font-display); font-size: clamp(1.1rem, 2.2vw, 1.45rem); line-height: 1.45; min-height: 4.4em; margin: 0; }

/* Schulte */
.lx-schulte-info { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; font-size: .9rem; }
.lx-schulte-info > span { display: inline-flex; gap: 6px; align-items: center; }
.lx-schulte-info .ico, .lx-schulte-info svg { width: 16px; height: 16px; color: var(--marca-2); }
.lx-sig { display: inline-grid; place-items: center; min-width: 38px; height: 38px; border-radius: 12px; font-size: 1.25rem; color: #fff; background: linear-gradient(135deg, #0891b2, #2563eb); font-family: var(--font-display); }
.lx-schulte-wrap { display: flex; justify-content: center; }
.lx-schulte { --tam: 5; position: relative; display: grid; grid-template-columns: repeat(var(--tam), 1fr); gap: 6px; width: min(100%, 460px); aspect-ratio: 1; }
.lx-sc { font: inherit; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.05rem, 3.4vw, 1.7rem); border-radius: 12px; border: 1px solid var(--borde-2); background: var(--surface-2); color: var(--texto); cursor: pointer; transition: background .15s, transform .15s; padding: 0; min-width: 0; }
.lx-sc:hover { background: color-mix(in srgb, #0891b2 12%, var(--surface-2)); }
.lx-sc.ok { background: color-mix(in srgb, #16a34a 22%, var(--surface-2)); color: color-mix(in srgb, #16a34a 75%, var(--texto)); border-color: color-mix(in srgb, #16a34a 50%, transparent); }
.lx-sc.mal { animation: lx-mal .35s ease; }
@keyframes lx-mal { 25% { transform: translateX(-4px); background: rgba(220, 38, 38, .25); } 75% { transform: translateX(4px); } }
.lx-sc-centro { position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: #dc2626; box-shadow: 0 0 0 4px rgba(220, 38, 38, .25); pointer-events: none; }

/* Saltos, periférica y columnas */
.lx-saltos, .lx-perif { position: relative; height: 170px; border-radius: 16px; background: linear-gradient(180deg, var(--surface-2), var(--surface-solid)); border: 1px solid var(--borde); overflow: hidden; }
.lx-salto-m { position: absolute; top: 50%; width: 2px; height: 70px; margin: -35px 0 0 -1px; background: repeating-linear-gradient(var(--texto-3) 0 6px, transparent 6px 12px); }
.lx-salto-p { position: absolute; top: 50%; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fde68a, #f59e0b 50%, #db2777); box-shadow: 0 0 22px rgba(245, 158, 11, .6); transition: left .12s ease-out; display: grid; place-items: center; }
.lx-salto-p.palabra { width: auto; height: auto; min-width: 30px; padding: 6px 12px; border-radius: 12px; margin: 0; transform: translate(-50%, -50%); font-weight: 800; font-size: 1.15rem; color: #fff; white-space: nowrap; }
.lx-perif-c { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 2.2rem; font-weight: 800; color: #dc2626; }
.lx-perif-w { position: absolute; top: 50%; transform: translate(-50%, -50%); font-size: clamp(1rem, 2.6vw, 1.5rem); font-weight: 800; white-space: nowrap; opacity: 0; transition: opacity .08s; }
.lx-perif.ver .lx-perif-w { opacity: 1; }
.lx-columna { height: 300px; overflow-y: auto; position: relative; display: flex; flex-direction: column; align-items: center; padding: 18px 8px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--borde); scroll-behavior: smooth; }
.lx-columna { background-image: linear-gradient(90deg, transparent calc(50% - 1px), color-mix(in srgb, #dc2626 35%, transparent) calc(50% - 1px), color-mix(in srgb, #dc2626 35%, transparent) calc(50% + 1px), transparent calc(50% + 1px)); background-size: 100% 12px; }
.lx-col-l { display: block; text-align: center; font-size: 1.15rem; line-height: 1.9; padding: 0 12px; border-radius: 8px; transition: background .15s, opacity .2s; }
.lx-col-l.on { background: color-mix(in srgb, #f59e0b 30%, var(--surface-solid)); font-weight: 700; }
.lx-col-l.leida { opacity: .45; }

/* Lectura rápida */
.lx-rsvp { position: relative; height: 180px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(160deg, #0f172a, #1e3a8a); color: #fff; text-align: center; padding: 0 16px; overflow: hidden; }
.lx-rsvp::before, .lx-rsvp::after { content: ''; position: absolute; left: 50%; width: 2px; height: 22px; background: #f87171; transform: translateX(-50%); }
.lx-rsvp::before { top: 18px; } .lx-rsvp::after { bottom: 18px; }
.lx-rsvp-w { font-family: var(--font-display); font-size: clamp(1.4rem, 5vw, 2.6rem); font-weight: 700; letter-spacing: .01em; overflow-wrap: anywhere; }
.lx-rsvp-w.in { animation: lx-rsvp .14s ease-out; }
@keyframes lx-rsvp { from { opacity: .3; transform: scale(.97); } }
.lx-rsvp:focus-visible { outline: 3px solid #fde68a; }
.lx-guia { max-height: 360px; overflow-y: auto; position: relative; padding: 18px 20px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--borde); font-size: 1.08rem; line-height: 1.95; }
.lx-guia h4 { font-family: var(--font-display); margin: 0 0 6px; }
.lx-gw { border-radius: 5px; padding: 1px 1px; transition: background .12s, color .2s; }
.lx-gw.on { background: #fde047; color: #0f172a; box-shadow: 0 0 0 3px #fde047; }
.lx-gw.leida { color: var(--texto-2); }

/* Medidor */
.lx-med { display: flex; flex-direction: column; gap: 12px; }
.lx-med-ini { padding: 16px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--borde); }
.lx-med-texto-tit { display: flex; gap: 10px; align-items: center; }
.lx-med-texto-tit .ico, .lx-med-texto-tit svg { width: 30px; height: 30px; color: #d97706; }
.lx-med-texto-tit b { display: block; font-family: var(--font-display); font-size: 1.12rem; } .lx-med-texto-tit small { color: var(--texto-2); }
.lx-med-barra { position: sticky; top: calc(var(--topbar) + 6px); z-index: 3; padding: 8px 14px; border-radius: 12px; background: var(--surface-solid); border: 1px solid var(--borde-2); box-shadow: var(--sombra); }
.lx-gym:fullscreen .lx-med-barra, .lx-gym-full .lx-med-barra { top: 0; }
.lx-med-lectura { font-size: 1.06rem; line-height: 1.8; max-width: 72ch; }
.lx-med-lectura h4 { font-family: var(--font-display); font-size: 1.25rem; }
.lx-med-q { display: flex; flex-direction: column; gap: 10px; }
.lx-q { --lx-c: var(--marca-2); border: 1px solid var(--borde); border-left: 4px solid var(--lx-c); border-radius: 14px; padding: 10px 14px 12px; margin: 0; min-width: 0; }
.lx-q legend { font-weight: 700; padding: 0 4px; }
.lx-q-n { font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--lx-c); background: color-mix(in srgb, var(--lx-c) 13%, transparent); padding: 2px 7px; border-radius: 999px; margin-right: 4px; }
.lx-q.bien { background: color-mix(in srgb, #16a34a 8%, transparent); } .lx-q.mal { background: color-mix(in srgb, #dc2626 7%, transparent); }
.lx-op { display: flex; gap: 8px; align-items: flex-start; padding: 6px 8px; border-radius: 10px; cursor: pointer; }
.lx-op:hover { background: var(--surface-2); }
.lx-op input { margin-top: 4px; accent-color: var(--marca-2); }
.lx-op.clave { background: color-mix(in srgb, #16a34a 16%, transparent); font-weight: 700; }
.lx-q textarea { min-height: 60px; margin-top: 6px; }
.lx-valora { display: flex; gap: 8px; align-items: center; margin-top: 6px; font-size: .8rem; color: var(--texto-2); }
.lx-valora select { width: auto; }
.lx-res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 6px; animation: lx-sube .4s ease both; }
.lx-res > .fila, .lx-res-txt { grid-column: 1 / -1; }
.lx-stat { --lx-c: var(--marca-2); padding: 14px; border-radius: 16px; background: linear-gradient(160deg, color-mix(in srgb, var(--lx-c) 14%, var(--surface-solid)), var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 30%, transparent); display: flex; flex-direction: column; gap: 2px; }
.lx-stat .ico, .lx-stat svg { width: 22px; height: 22px; color: var(--lx-c); }
.lx-stat b { font-family: var(--font-display); font-size: 2rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.lx-stat span { font-size: .8rem; color: var(--texto-2); }
.lx-res-txt { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--surface-2); font-size: .9rem; }
.lx-med-hist { border-top: 1px solid var(--borde); padding-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.lx-med-hist > .fila select { width: auto; max-width: 100%; }
.lx-graf { --lx-s1: #2563eb; --lx-s2: #d97706; }
.lx-graf svg { width: 100%; height: auto; display: block; }
.lx-g-grid { stroke: var(--borde); stroke-width: 1; }
.lx-g-eje { fill: var(--texto-2); font-size: 11px; font-variant-numeric: tabular-nums; }
.lx-g-l { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.lx-g-l.s1 { stroke: var(--lx-s1); } .lx-g-l.s2 { stroke: var(--lx-s2); }
.lx-g-p { stroke: var(--surface-solid); stroke-width: 2; } .lx-g-p.s1 { fill: var(--lx-s1); } .lx-g-p.s2 { fill: var(--lx-s2); }
.lx-g-hit { fill: transparent; cursor: help; }
.lx-g-hit:hover { fill: color-mix(in srgb, var(--texto) 8%, transparent); }
.lx-g-et { fill: var(--texto); font-size: 11.5px; font-weight: 700; }
.lx-leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .78rem; color: var(--texto-2); margin-top: 4px; }
.lx-leyenda span.s1::before, .lx-leyenda span.s2::before { content: ''; display: inline-block; width: 16px; height: 3px; border-radius: 3px; margin-right: 6px; vertical-align: middle; background: var(--lx-s1); }
.lx-leyenda span.s2::before { background: var(--lx-s2); }

/* ------------------------- Banco de estrategias ------------------------- */
.lx-filtros-g { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; align-items: end; }
.lx-buscar { grid-column: 1 / -1; position: relative; }
.lx-buscar > span { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--texto-3); display: flex; }
.lx-buscar > span .ico, .lx-buscar > span svg { width: 18px; height: 18px; }
.lx-buscar input { padding-left: 40px; font-size: 1rem; }
.lx-cuenta { display: flex; align-items: center; gap: 6px; margin: 0; }
.lx-cuenta .ico, .lx-cuenta svg { width: 14px; height: 14px; }
.lx-est-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.lx-est { --lx-c: var(--marca-2); position: relative; text-align: left; font: inherit; color: var(--texto); cursor: pointer; padding: 16px; border-radius: 18px; border: 1px solid var(--borde);
  background: linear-gradient(165deg, color-mix(in srgb, var(--lx-c) 9%, var(--surface-solid)), var(--surface-solid) 55%); display: flex; flex-direction: column; gap: 6px; transition: var(--t); animation: lx-sube .4s ease both; animation-delay: calc(var(--k) * 30ms); min-width: 0; }
.lx-est:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); border-color: color-mix(in srgb, var(--lx-c) 45%, transparent); }
.lx-est-ico { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--lx-c), color-mix(in srgb, var(--lx-c) 50%, #1e3a8a)); flex-shrink: 0; }
.lx-est-ico .ico, .lx-est-ico svg { width: 22px; height: 22px; }
.lx-est-mom { --lx-m: #64748b; position: absolute; right: 12px; top: 14px; display: inline-flex; gap: 4px; align-items: center; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--lx-m); }
.lx-est-mom .ico, .lx-est-mom svg { width: 13px; height: 13px; }
.lx-est > b { font-family: var(--font-display); font-size: 1.06rem; line-height: 1.25; }
.lx-est-prop { font-size: .84rem; color: var(--texto-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lx-est-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; margin-top: auto; padding-top: 4px; font-size: .74rem; color: var(--texto-2); }
.lx-est-meta > span { display: inline-flex; gap: 3px; align-items: center; }
.lx-est-meta .ico, .lx-est-meta svg { width: 13px; height: 13px; }
.lx-est-meta .niv { --lx-n: #64748b; font-weight: 750; color: var(--lx-n); padding: 1px 7px; border-radius: 999px; background: color-mix(in srgb, var(--lx-n) 12%, transparent); }
.lx-est-meta .pileo { font-weight: 800; color: #b45309; padding: 1px 7px; border-radius: 999px; background: color-mix(in srgb, #f59e0b 16%, transparent); }
.lx-est-meta .chip { margin: 0; }
.lx-ficha-cab { display: flex; gap: 14px; align-items: flex-start; }
.lx-ficha-cab p { margin: 8px 0 0; font-size: .95rem; }
.lx-ficha .lx-est-ico { width: 54px; height: 54px; }
.lx-pasos { margin: 4px 0 10px; padding-left: 0; list-style: none; counter-reset: paso; display: flex; flex-direction: column; gap: 6px; }
.lx-pasos li { counter-increment: paso; display: flex; gap: 10px; align-items: flex-start; }
.lx-pasos li::before { content: counter(paso); flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: .82rem; color: #fff; background: var(--lx-c, var(--marca-2)); }
.lx-vars { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.lx-vars > div { padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px dashed var(--borde-2); }
.lx-vars p { margin: 4px 0 0; font-size: .86rem; }
.lx-ficha-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; margin: 12px 0; }
.lx-ficha-g > div { padding: 10px 12px; border-radius: 12px; background: var(--surface-2); }
.lx-ficha-g .ico, .lx-ficha-g svg { width: 16px; height: 16px; color: var(--lx-c); vertical-align: -3px; margin-right: 4px; }
.lx-ficha-g p { margin: 4px 0 0; font-size: .86rem; }

/* ----------------------------- Sesión variada ---------------------------- */
.lx-form-g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lx-form-g .lx-ancho { grid-column: span 2; }
.lx-ses-acc { margin-top: 14px; }
.lx-ses-out { display: flex; flex-direction: column; gap: 16px; scroll-margin-top: 80px; }
.lx-ses-vacia { display: flex; gap: 14px; align-items: center; padding: 22px; border-radius: var(--r-lg); border: 2px dashed var(--borde-2); color: var(--texto-2); }
.lx-ses-vacia .ico, .lx-ses-vacia svg { width: 38px; height: 38px; color: #db2777; flex-shrink: 0; }
.lx-ses-vacia p { margin: 0; }
.lx-ses-cab { padding: 22px 24px; border-radius: var(--r-xl); color: #fff; background: radial-gradient(circle at 100% 0, rgba(253, 230, 138, .35), transparent 45%), linear-gradient(130deg, #be185d, #7c3aed 60%, #2563eb); box-shadow: var(--sombra-2); animation: lx-sube .4s ease both; }
.lx-ses-cab .lx-kicker { color: #fde68a; }
.lx-ses-cab h2 { font-family: var(--font-display); font-size: clamp(1.3rem, 3vw, 1.9rem); margin: 6px 0 8px; }
.lx-ses-cab .lx-pills span { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .3); color: #fff; }
.lx-ses-linea { display: flex; gap: 3px; margin-top: 14px; border-radius: 12px; overflow: hidden; min-height: 50px; }
.lx-ses-linea > span { --lx-c: #64748b; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 6px 8px; background: color-mix(in srgb, var(--lx-c) 70%, #fff 10%); color: #fff; overflow: hidden; }
.lx-ses-linea b { font-family: var(--font-mono); font-size: .9rem; }
.lx-ses-linea small { font-size: .66rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .92; }
.lx-bloques { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.lx-bloque { --lx-c: var(--marca-2); position: relative; padding: 16px; border-radius: 18px; background: var(--surface-solid); border: 1px solid var(--borde); border-top: 5px solid var(--lx-c); animation: lx-sube .4s ease both; animation-delay: calc(var(--k) * 70ms); min-width: 0; }
.lx-bloque-t { display: flex; gap: 10px; align-items: flex-start; }
.lx-bloque-t > div { flex: 1; min-width: 0; }
.lx-bloque-t small { display: block; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--lx-c); }
.lx-bloque-t b { display: block; font-family: var(--font-display); font-size: 1.1rem; line-height: 1.25; margin-top: 2px; }
.lx-bloque-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: var(--lx-c); flex-shrink: 0; }
.lx-bloque p { font-size: .88rem; margin: 8px 0; }
.lx-otra { flex-shrink: 0; color: var(--lx-c); border: 1px solid color-mix(in srgb, var(--lx-c) 35%, transparent); }
.lx-otra:hover .ico, .lx-otra:hover svg { animation: girar .6s ease; }
.lx-bloque-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .76rem; color: var(--texto-2); }
.lx-bloque-meta > span { display: inline-flex; gap: 4px; align-items: center; }
.lx-bloque-meta .ico, .lx-bloque-meta svg { width: 13px; height: 13px; }
.lx-ings { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.lx-ing { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--borde); min-width: 0; }
.lx-ing > div { flex: 1; min-width: 0; }
.lx-ing small { display: block; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #7c3aed; }
.lx-ing b { display: block; font-size: .95rem; } .lx-ing p { margin: 2px 0 0; font-size: .8rem; color: var(--texto-2); }
.lx-ing-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #7c3aed; background: color-mix(in srgb, #7c3aed 13%, transparent); flex-shrink: 0; }
.lx-ses-texto { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, #2563eb 8%, var(--surface-2)); border: 1px solid var(--borde); }
.lx-ses-texto b { display: block; font-family: var(--font-display); font-size: 1.05rem; } .lx-ses-texto small { color: var(--texto-2); }
.lx-niveles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.lx-nivel { --lx-c: var(--marca-2); padding: 12px; border-radius: 16px; background: color-mix(in srgb, var(--lx-c) 7%, var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 25%, transparent); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lx-nivel h4 { margin: 0 0 4px; display: flex; gap: 6px; align-items: center; color: var(--lx-c); }
.lx-nivel h4 .ico, .lx-nivel h4 svg { width: 17px; height: 17px; }
.lx-ses-final .fila { gap: 8px; }
.lx-export { margin-top: 10px; }
.lx-hist { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.lx-hist li { display: flex; gap: 12px; align-items: flex-start; padding: 8px 10px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--borde); font-size: .84rem; }
.lx-hist li.actual { border-color: #db2777; background: color-mix(in srgb, #db2777 7%, var(--surface-2)); }
.lx-hist-f { flex-shrink: 0; min-width: 54px; font-weight: 800; color: var(--texto-2); font-size: .78rem; padding-top: 2px; }
.lx-hist-e { --lx-c: #64748b; display: inline-block; margin: 1px 4px 1px 0; padding: 1px 8px; border-radius: 999px; font-weight: 650; font-size: .78rem; color: color-mix(in srgb, var(--lx-c) 80%, var(--texto)); background: color-mix(in srgb, var(--lx-c) 12%, transparent); }
.lx-hist small .ico, .lx-hist small svg { width: 12px; height: 12px; vertical-align: -2px; }
.lx-varbar { display: flex; flex-direction: column; gap: 4px; margin: 6px 0 12px; }
.lx-varbar > div { display: grid; grid-template-columns: 160px 1fr 46px; gap: 8px; align-items: center; font-size: .8rem; }
.lx-varbar i { height: 8px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--borde); overflow: hidden; }
.lx-varbar i b { display: block; height: 100%; border-radius: 8px; background: linear-gradient(90deg, #db2777, #7c3aed); }
.lx-varbar small { text-align: right; color: var(--texto-2); font-variant-numeric: tabular-nums; }

/* ---------------------------- Dispositivo de nodos ---------------------------- */
.lx-gen-input { font-family: var(--font-display); font-size: 1.12rem; min-height: 64px; }
.lx-sug { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0 14px; }
.lx-sug .lx-chipbtn { font-size: .8rem; font-weight: 600; }
.lx-nodos-ed { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.lx-nodo-ed { --lx-c: #64748b; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start; padding: 10px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--lx-c) 30%, var(--borde)); background: color-mix(in srgb, var(--lx-c) 6%, var(--surface-solid)); }
.lx-nodo-letra { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-family: var(--font-display); font-weight: 800; font-size: 1.15rem; color: #fff; background: var(--lx-c); }
.lx-nodo-campos { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lx-nodo-sel { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.lx-nodo-campos textarea { min-height: 52px; }
.lx-nodo-acc { display: flex; flex-direction: column; gap: 6px; }
.lx-modo { display: inline-flex; gap: 4px; padding: 4px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--borde); margin-bottom: 14px; max-width: 100%; flex-wrap: wrap; }
.lx-modo-b { border: 0; background: transparent; font: inherit; font-weight: 700; font-size: .88rem; color: var(--texto-2); padding: 8px 14px; border-radius: 10px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.lx-modo-b .ico, .lx-modo-b svg { width: 16px; height: 16px; }
.lx-modo-b[aria-selected="true"] { background: var(--surface-solid); color: var(--marca); box-shadow: var(--sombra); }
.lx-hoja { padding: 22px; border-radius: 18px; background: var(--surface-solid); border: 1px solid var(--borde-2); box-shadow: inset 0 0 0 6px color-mix(in srgb, #0f766e 5%, transparent); }
.lx-hoja-gen { font-family: var(--font-display); font-size: 1.3rem; line-height: 1.35; text-align: center; margin: 0 0 6px; }
.lx-hoja-gen small { display: block; font-family: var(--font); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #0f766e; margin-bottom: 4px; }
.lx-hoja-nota { text-align: center; font-style: italic; color: var(--texto-2); display: flex; justify-content: center; gap: 6px; align-items: center; margin: 0 0 16px; }
.lx-hoja-nota .ico, .lx-hoja-nota svg { width: 16px; height: 16px; }
.lx-hoja-nodos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lx-hoja-nodos > div { --lx-c: #64748b; padding: 12px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--lx-c) 35%, transparent); background: color-mix(in srgb, var(--lx-c) 8%, transparent); }
.lx-hoja-nodos span { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--lx-c); }
.lx-hoja-nodos b { display: block; font-family: var(--font-display); }
.lx-hoja-nodos p { margin: 4px 0; font-size: .88rem; } .lx-hoja-nodos small { color: var(--texto-2); font-size: .74rem; }
.lx-rub td, .lx-rub th { font-size: .82rem; }
.lx-mapa { border-radius: 18px; overflow: hidden; border: 1px solid var(--borde-2); background: #f8fafc; }
.lx-mapa svg { width: 100%; height: auto; display: block; }
.lx-nodos-acc { margin-top: 14px; gap: 8px; }

/* -------------------------------- Tema oscuro -------------------------------- */
:root[data-theme="dark"] .lx-graf { --lx-s1: #3b82f6; --lx-s2: #c97a08; }
:root[data-theme="dark"] .lx-gw.on { background: #facc15; }
:root[data-theme="dark"] .lx-col-l.on { background: color-mix(in srgb, #f59e0b 40%, var(--surface-solid)); }
:root[data-theme="dark"] .lx-mapa { background: #e2e8f0; }
:root[data-theme="dark"] .lx-logica-ico { color: #2dd4bf; }
:root[data-theme="dark"] .lx-ing small, :root[data-theme="dark"] .lx-ing-ico { color: #c4b5fd; }
:root[data-theme="dark"] .lx-art-n { color: #c4b5fd; }
:root[data-theme="dark"] .lx-pileo-cab .lx-kicker { color: #fbbf24; }
:root[data-theme="dark"] .lx-cons-cab .lx-kicker { color: #4ade80; }
:root[data-theme="dark"] .lx-hoja-gen small { color: #2dd4bf; }
:root[data-theme="dark"] .lx-est-meta .pileo { color: #fbbf24; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lx-graf { --lx-s1: #3b82f6; --lx-s2: #c97a08; }
  :root:not([data-theme="light"]) .lx-gw.on { background: #facc15; }
  :root:not([data-theme="light"]) .lx-col-l.on { background: color-mix(in srgb, #f59e0b 40%, var(--surface-solid)); }
  :root:not([data-theme="light"]) .lx-mapa { background: #e2e8f0; }
  :root:not([data-theme="light"]) .lx-logica-ico { color: #2dd4bf; }
  :root:not([data-theme="light"]) .lx-ing small, :root:not([data-theme="light"]) .lx-ing-ico { color: #c4b5fd; }
  :root:not([data-theme="light"]) .lx-art-n { color: #c4b5fd; }
  :root:not([data-theme="light"]) .lx-pileo-cab .lx-kicker { color: #fbbf24; }
  :root:not([data-theme="light"]) .lx-cons-cab .lx-kicker { color: #4ade80; }
  :root:not([data-theme="light"]) .lx-hoja-gen small { color: #2dd4bf; }
  :root:not([data-theme="light"]) .lx-est-meta .pileo { color: #fbbf24; }
}

/* -------------------------------- Tableta -------------------------------- */
@media (max-width: 1100px) {
  .lx-cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-diag { grid-template-columns: 1fr; }
  .lx-retro, .lx-logicas, .lx-webb { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-tramos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-filtros-g { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lx-form-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-hoja-nodos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* -------------------------------- Celular -------------------------------- */
@media (max-width: 760px) {
  .lx-hero { grid-template-columns: 1fr; padding: 22px 18px; }
  .lx-hero-arte { order: -1; max-width: 260px; margin: 0 auto; }
  .lx-hero-acc .btn { flex: 1 1 100%; }
  .lx-editorial { padding: 20px 16px; }
  .lx-ejes-grid, .lx-docs, .lx-tri, .lx-ambitos, .lx-principios, .lx-dos, .lx-indic, .lx-niveles, .lx-bloques, .lx-res { grid-template-columns: 1fr; }
  .lx-retro, .lx-logicas, .lx-webb, .lx-tramos, .lx-hoja-nodos { grid-template-columns: 1fr; }
  .lx-onto, .lx-flujo, .lx-fases { flex-direction: column; }
  .lx-onto-mas { align-self: center; line-height: 1; }
  .lx-flujo-f, .lx-fases .lx-flujo-f { transform: rotate(90deg); align-self: center; }
  .lx-hallazgo { grid-template-columns: 1fr; }
  .lx-filtros-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-form-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-form-g .lx-ancho { grid-column: 1 / -1; }
  .lx-gym { padding: 14px; }
  .lx-gym-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lx-gym-escena { padding: 12px; }
  .lx-resp { grid-template-columns: 1fr; }
  .lx-resp-escena { max-width: 260px; }
  .lx-tl::before { left: 25px; }
  .lx-tl-i { grid-template-columns: 48px 1fr; gap: 10px; }
  .lx-tl-fecha { width: 48px; height: 54px; border-radius: 13px; }
  .lx-tl-fecha b { font-size: 1.2rem; }
  .lx-tl-cuerpo { padding: 12px; }
  .lx-anio-mes:nth-child(odd) { display: none; }
  .lx-ses-linea small { display: none; }
  .lx-ses-cab { padding: 18px 16px; }
  .lx-varbar > div { grid-template-columns: 110px 1fr 40px; }
  .lx-nodo-ed { grid-template-columns: auto 1fr; }
  .lx-nodo-acc { grid-column: 1 / -1; flex-direction: row; justify-content: flex-end; }
  .lx-nodo-sel { grid-template-columns: 1fr; }
  .lx-hoja { padding: 14px; }
  .lx-fuerza { padding: 22px 18px; }
  .lx-sec-extra { flex: 1 1 100%; }
  .lx-gym-cab h3 { font-size: 1.3rem; }
  .lx-guia { font-size: 1rem; padding: 14px; }
  .lx-saltos, .lx-perif { height: 140px; }
  .lx-ficha-cab { flex-direction: column; }
}
@media (max-width: 420px) {
  .lx-cifras, .lx-filtros-g, .lx-form-g { grid-template-columns: 1fr; }
  .lx-cifra b { font-size: 1.8rem; }
  .lx-est-grid, .lx-accesos, .lx-ings { grid-template-columns: 1fr; }
  .lx-schulte { gap: 4px; }
  .lx-sc { border-radius: 9px; }
  .lx-ses-texto { flex-direction: column; align-items: flex-start; }
  .lx-modo-b { padding: 8px 10px; font-size: .82rem; }
}

/* ----------------------------- Pantallas táctiles ----------------------------- */
@media (hover: none) and (pointer: coarse) {
  .lx-chipbtn, .lx-indice-b, .lx-frase { min-height: 40px; }
  .lx-bi { width: 42px; height: 42px; }
  .lx-gym-tab { min-height: 48px; }
  .lx-campo input, .lx-campo select, .lx-q textarea, .lx-gen-input, .lx-nodo-campos textarea { font-size: 16px; }
  .lx-acceso:hover, .lx-est:hover, .lx-cifra:hover, .lx-doc:hover { transform: none; }
  .lx-op { padding: 9px 8px; }
}
@media print {
  .lx-gym-nav, .lx-gym-sub, .lx-indice, .lx-otra, .lx-bi, .lx-hero-acc { display: none !important; }
}

/* Complementos de la teoría y del medidor */
.lx-arq { margin: -4px 0 14px; font-size: .92rem; line-height: 1.6; color: var(--texto-2); max-width: 900px; }
.lx-nota { display: flex; gap: 6px; align-items: flex-start; margin: 10px 0 0; }
.lx-nota .ico, .lx-nota svg { width: 14px; height: 14px; flex-shrink: 0; margin-top: 2px; }
.lx-tradicional { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; background: var(--surface-2); color: var(--texto-2); text-decoration: line-through; text-decoration-color: color-mix(in srgb, #dc2626 55%, transparent); }
.lx-tradicional .ico, .lx-tradicional svg { width: 18px; height: 18px; flex-shrink: 0; color: #dc2626; }
.lx-ref { display: block; }
.lx-ref .ico, .lx-ref svg { width: 15px; height: 15px; vertical-align: -3px; color: var(--marca-2); }

/* ------------- Lectura rizomática (Desarrollo RIZOMA MAUX, v1.11) -------------
 * Puentes con otras áreas, principios del rizoma, recorridos de sesión con
 * paradas en paralelo, movimientos, dimensiones entrelazadas, cartografía del
 * trayecto y fichas que se conectan entre sí. */
.lx-sub-grupo { margin: 8px 0 -4px; max-width: 820px; }
.lx-puentes { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.lx-puente { --lx-c: #0f766e; text-align: left; font: inherit; color: var(--texto); cursor: pointer; display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 16px; border: 1px solid color-mix(in srgb, var(--lx-c) 30%, transparent); background: linear-gradient(160deg, color-mix(in srgb, var(--lx-c) 10%, var(--surface-solid)), var(--surface-solid) 70%); transition: var(--t); animation: lx-sube .4s ease both; animation-delay: calc(var(--k) * 50ms); }
.lx-puente:hover { transform: translateY(-2px); border-color: var(--lx-c); box-shadow: var(--sombra-2); }
.lx-puente b { font-family: var(--font-display); font-size: .98rem; line-height: 1.25; }
.lx-puente small { color: var(--texto-2); font-size: .8rem; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lx-puente-ico { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: var(--lx-c); }
.lx-puente-ico .ico, .lx-puente-ico svg { width: 18px; height: 18px; }
.lx-chip-puente { border-color: color-mix(in srgb, var(--lx-c) 45%, transparent); }
.lx-chip-puente .ico, .lx-chip-puente svg { color: var(--lx-c); }

.lx-rz-princ { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lx-rz-princ > div { padding: 14px; border-radius: 16px; border: 1px solid var(--borde); background: var(--surface-solid); animation: lx-sube .4s ease both; animation-delay: calc(var(--k) * 60ms); }
.lx-rz-princ b { display: block; font-family: var(--font-display); margin: 6px 0 2px; }
.lx-rz-princ p { margin: 0 0 6px; font-size: .86rem; }
.lx-rz-princ small { display: flex; gap: 5px; align-items: flex-start; color: var(--texto-2); font-size: .76rem; }
.lx-rz-princ small .ico, .lx-rz-princ small svg { width: 13px; height: 13px; flex-shrink: 0; margin-top: 2px; }
.lx-rz-ico { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: #0f766e; background: color-mix(in srgb, #0f766e 12%, var(--surface-solid)); }
.lx-rz-ico .ico, .lx-rz-ico svg { width: 18px; height: 18px; }
.lx-rz-dim { margin-top: 12px; }

.lx-tramo-n .ico, .lx-tramo-n svg { width: 17px; height: 17px; }
.lx-vuelta { color: var(--marca-2); }

.lx-recorridos { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 12px; }
.lx-recorridos .lx-mini-tit { margin: 0 4px 0 0; }
.lx-ses-tr { margin: 8px 0 0; font-size: .88rem; color: var(--texto-2); max-width: 860px; }
.lx-ses-linea > .lx-paralelo { padding: 4px 6px; background: repeating-linear-gradient(135deg, #475569, #475569 8px, #52627a 8px, #52627a 16px); }
.lx-paralelo i { display: flex; gap: 3px; flex-wrap: wrap; font-style: normal; }
.lx-paralelo em { --lx-c: #64748b; font-style: normal; font-size: .62rem; font-weight: 700; padding: 1px 6px; border-radius: 999px; background: var(--lx-c); white-space: nowrap; }
.lx-bloque.paralelo { border-top-style: dashed; }
.lx-movs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.lx-mov { display: inline-flex; align-items: center; gap: 4px; font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; color: var(--lx-c); background: color-mix(in srgb, var(--lx-c) 10%, var(--surface-solid)); border: 1px solid color-mix(in srgb, var(--lx-c) 25%, transparent); }
.lx-mov .ico, .lx-mov svg { width: 12px; height: 12px; }

.lx-nivel-que { margin: -4px 0 4px; color: var(--texto-2); font-size: .74rem; font-style: italic; }
.lx-cruces { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }
.lx-cruce { align-items: center; }
.lx-cruce-d { display: inline-flex; flex-shrink: 0; }
.lx-cruce-d i { --lx-c: #64748b; width: 12px; height: 12px; border-radius: 50%; background: var(--lx-c); border: 2px solid var(--surface-solid); }
.lx-cruce-d i + i { margin-left: -5px; }
.lx-propia { display: flex; gap: 6px; align-items: flex-start; margin: 6px 0 0; padding: 10px 12px; border-radius: 12px; border: 1px dashed var(--borde-2); font-size: .86rem; }
.lx-propia .ico, .lx-propia svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--marca-2); margin-top: 2px; }

.lx-dos-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.lx-dos-cards > .card { margin: 0; }
.lx-puente-card { border-top: 4px solid var(--lx-c, #0f766e); }
.lx-carto-cols { display: flex; flex-wrap: wrap; gap: 4px; }
.lx-carto-cols span { font-size: .76rem; font-weight: 650; padding: 4px 10px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--borde); }

:root[data-theme="dark"] .lx-rz-ico { color: #2dd4bf; }
:root[data-theme="dark"] .lx-mov { color: color-mix(in srgb, var(--lx-c) 60%, #fff); }
:root[data-theme="dark"] .lx-ses-linea > .lx-paralelo { background: repeating-linear-gradient(135deg, #334155, #334155 8px, #3b4a60 8px, #3b4a60 16px); }

@media (max-width: 1100px) { .lx-rz-princ { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .lx-rz-princ, .lx-dos-cards { grid-template-columns: 1fr; }
  .lx-recorridos .lx-chipbtn { font-size: .78rem; padding: 6px 10px; }
}
@media print { .lx-recorridos, .lx-otra { display: none !important; } }
/* Recorridos dentro de la cabecera de la sesión (fondo de color) */
.lx-ses-cab .lx-mini-tit { color: rgba(255, 255, 255, .85); }
.lx-ses-cab .lx-ses-tr { color: rgba(255, 255, 255, .92); }
.lx-ses-cab .lx-recorridos .lx-chipbtn { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .35); color: #fff; }
.lx-ses-cab .lx-recorridos .lx-chipbtn:hover { background: rgba(255, 255, 255, .26); }
.lx-ses-cab .lx-recorridos .lx-chipbtn.activo { background: #fff; color: #7c3aed; }
.lx-ses-cab .lx-recorridos .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .4); }