/* REBT LAB · correcciones de legibilidad y diagramas (30/10/2026)
   Los conectores ocupan su propia celda. Nunca se superponen a textos. */
html,body{max-width:100%;}
.shell,.main-col,#app,.cols,.card,.unit-card,.unit-meta,.read-layout,.question-layout,.graph-layout,.lab-layout,.tutor-layout,.public-help-grid,.public-guide-grid,.compare-grid,.section-head,.graph-links,.public-discover-card{min-width:0;}
.card h2,.card h3,.unit-meta strong,.line strong,.line small,.graph-link span,.compare-item p,.public-guide-card strong,.public-discover-card p,.note,.warn,.info,.section-head p,.public-help-grid summary{overflow-wrap:anywhere;hyphens:auto;}
.source-text,.norm-preview{overflow-wrap:anywhere;word-break:normal;}
button,.btn,.answer,.select,.input,.textarea{max-width:100%;}
.graph-links{min-width:0;}
.graph-link{min-width:0;}
.graph-link span{min-width:0;line-height:1.45;}
.graph-layout>.card,.lab-layout>.card,.tutor-layout>.card,.read-layout>div,.read-layout>aside{min-width:0;}
.board-lab,.circuit-row,.panel-choose,.device-palette{min-width:0;max-width:100%;}
.circuit-row{grid-template-columns:68px minmax(0,1fr) 22px;gap:10px;}
.circuit-row .select{min-width:0;overflow-wrap:anywhere;text-overflow:ellipsis;}
.board-head{flex-wrap:wrap;}
.device-palette{overflow-wrap:anywhere;}

/* Una secuencia no es una imagen fija ni un SVG con rótulos sin ajuste.
   Es contenido HTML adaptable, usable con teclado y lector de pantalla. */
.sequence-shell{container-type:inline-size;min-width:0;background:linear-gradient(145deg,#11333e,#0a202d);border:1px solid #446b70;border-radius:19px;padding:clamp(16px,2.7vw,28px);margin:20px 0 24px;overflow:hidden;}
.sequence-title{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.sequence-title h2{font-size:clamp(18px,2.2vw,24px);line-height:1.3;letter-spacing:-.025em;margin:0;}
.sequence-title .chip{white-space:normal;text-align:right;}
.sequence-flow{display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr);align-items:stretch;gap:8px;width:100%;min-width:0;}
.sequence-step{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;width:100%;min-width:0;min-height:155px;border:1px solid #4e7a80;border-radius:15px;padding:16px 10px;color:#e9f8f3;background:#1a3b48;text-decoration:none;white-space:normal;overflow-wrap:anywhere;hyphens:auto;transition:border-color .15s,background .15s,transform .15s;}
.sequence-step:hover{background:#23505a;border-color:#b5f4a8;transform:translateY(-2px);}
.sequence-step:focus-visible{outline:3px solid #b5f4a8;outline-offset:3px;}
.sequence-step strong{display:block;font-weight:850;font-size:clamp(14px,1.45vw,21px);line-height:1.22;overflow-wrap:anywhere;}
.sequence-step span{display:block;font-size:clamp(11px,.92vw,13px);line-height:1.52;color:#c1dad9;overflow-wrap:anywhere;}
.sequence-step small{font-size:10px;color:#b4f4af;letter-spacing:.03em;}
.sequence-arrow{display:grid;place-items:center;align-self:center;justify-self:center;font-size:clamp(20px,2.2vw,29px);font-weight:800;line-height:1;color:#b9f4a7;user-select:none;pointer-events:none;}
.sequence-note{font-size:12px;color:#b4d0cd;line-height:1.7;margin:16px 0 0;max-width:80ch;}
/* Preferir claridad a cinco columnas forzadas cuando el contenedor real no cabe. */
@container (max-width:980px){
 .sequence-flow{grid-template-columns:minmax(0,1fr);gap:0;}
 .sequence-step{min-height:0;padding:15px 17px;gap:5px;}
 .sequence-step strong{font-size:17px;}
 .sequence-step span{font-size:13px;}
 .sequence-arrow{min-height:31px;transform:rotate(90deg);font-size:23px;}
 .sequence-title{align-items:flex-start;}
}
@media(max-width:930px){
 .bath-scene{min-height:405px;}
 .bath-pin{min-width:0;width:42%;max-width:158px;min-height:61px;z-index:2;overflow-wrap:anywhere;text-align:center;}
 .pin0{left:5%;bottom:20px;}.pin1{left:5%;top:94px;}
 .pin2{right:5%;top:94px;}.pin3{right:5%;bottom:20px;}
 .bathtub{bottom:104px;}
 .lab-layout .card,.graph-layout .card{min-width:0;}
}
@media(max-width:560px){
 .section-head{align-items:flex-start;flex-wrap:wrap;}
 .card,.stat,.unit-card{min-width:0;}
 .unit-card{flex-wrap:wrap;}
 .unit-card .btn{margin-left:auto;}
 .circuit-row{grid-template-columns:50px minmax(0,1fr) 18px;gap:7px;padding:9px 2px;}
 .breaker{width:48px;min-height:61px;}.breaker b{font-size:15px;}
 .board-lab{padding:12px;}
 .toolbar>*{min-width:0;}
 .lab-score{font-size:30px;}
}
@media(max-width:360px){
 .bath-scene{min-height:430px;}
 .bath-pin{width:43%;font-size:17px;min-height:57px;}
 .bath-pin small{font-size:10px;}
 .bathtub{height:76px;bottom:116px;}
 .sequence-shell{padding:12px;}
 .sequence-step{padding:13px 10px;}
}
@media(prefers-reduced-motion:reduce){.sequence-step{transition:none;}.sequence-step:hover{transform:none;}}
html.motion-off .sequence-step{transition:none;}html.motion-off .sequence-step:hover{transform:none;}
/* Respaldo para navegadores anteriores a las consultas de contenedor. */
@supports not (container-type:inline-size){
 @media(max-width:1480px){
  .sequence-flow{grid-template-columns:minmax(0,1fr);gap:0;}
  .sequence-step{min-height:0;padding:15px;}
  .sequence-arrow{min-height:30px;transform:rotate(90deg);}
 }
}
/* Más espacio para botones y nombres en modo táctil o zoom aumentado. */
@media(pointer:coarse){.sequence-step{min-height:54px;}.graph-link{min-height:44px;}.bath-pin{touch-action:manipulation;}}


/* REBT LAB — CORRECCIÓN DEFINITIVA DE ENLACE: una fila = un bloque completo.
   Evita superposiciones incluso en ventanas estrechas, zoom del navegador y
   dispositivos sin soporte para container queries. */
.sequence-shell{width:100%;min-width:0;max-width:100%;overflow:hidden;padding:clamp(14px,2.5vw,26px);}
.linkage-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:24px;min-width:0;}
.linkage-item{position:relative;min-width:0;margin:0;padding:0;}
.linkage-item + .linkage-item::before{
 content:'↓';position:absolute;bottom:100%;left:50%;transform:translate(-50%,-2px);
 width:26px;height:22px;display:grid;place-items:center;pointer-events:none;
 color:#b9ef9d;font-weight:850;font-size:20px;line-height:1;
}
.linkage-step{
 box-sizing:border-box;display:grid;grid-template-columns:45px minmax(0,1fr) auto;
 align-items:center;gap:clamp(10px,1.4vw,20px);width:100%;max-width:100%;min-width:0;
 padding:16px clamp(12px,2vw,20px);border:1px solid #4e7a80;border-radius:13px;
 text-align:left;background:#183945;color:#e9f8f3;min-height:90px;
 white-space:normal;overflow:visible;font-family:inherit;cursor:pointer;
 transition:background .15s,border-color .15s;
}
.linkage-step:hover{background:#23515a;border-color:#b9ef9d;}
.linkage-step:focus-visible{outline:3px solid #b9ef9d;outline-offset:3px;}
.linkage-number{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#b9ef9d16;color:#b9ef9d;font-size:13px;font-weight:800;}
.linkage-copy{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:100%;}
.linkage-copy strong{font-size:clamp(16px,1.55vw,21px);line-height:1.25;font-weight:800;overflow-wrap:break-word;word-break:normal;white-space:normal;}
.linkage-copy>span{font-size:clamp(12px,1.2vw,14px);line-height:1.5;color:#c1dad9;white-space:normal;overflow-wrap:break-word;word-break:normal;}
.linkage-itc{display:inline-block;justify-self:end;max-width:100%;font-size:11px;white-space:nowrap;color:#b9ef9d;background:#b9ef9d12;border-radius:8px;padding:7px 9px;}
@media(max-width:650px){
 .linkage-step{grid-template-columns:36px minmax(0,1fr);gap:10px;min-height:87px;padding:13px 11px;}
 .linkage-number{width:34px;height:34px;font-size:12px;}
 .linkage-itc{grid-column:2;justify-self:start;font-size:10px;padding:3px 7px;}
 .linkage-copy strong{font-size:17px;}
 .linkage-copy>span{font-size:13px;}
 .sequence-title{display:block;}
 .sequence-title .chip{display:inline-block;margin-top:9px;}
}
@media(prefers-reduced-motion:reduce){.linkage-step{transition:none;}}
html.motion-off .linkage-step{transition:none;}