/* Sesión 2 · Corregir y repetir: tres actos (la falla anotada, causa y cambio mínimo, la misma prueba otra vez).
   Escenario de 1600 × 900, texto mínimo de 17 px. Rojo: lo observado que falla; teal: lo esperado y lo que pasa;
   amarillo: la causa; azul: el cambio y la entrada. */
.co2{margin-top:32px;height:466px;display:grid;grid-template-rows:52px 1fr;gap:18px}
.co2-quieto,.co2-quieto *,.co2-quieto-h *{transition:none!important;animation:none!important}

/* ---------- cabecera: los tres actos y las versiones ---------- */
.co2-cab{display:flex;align-items:center;justify-content:space-between;gap:24px}
.co2-actos{position:relative;display:flex;gap:2px;padding:5px;border-radius:999px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.co2-guia{position:absolute;top:5px;bottom:5px;left:5px;width:0;border-radius:999px;background:color-mix(in srgb,var(--c,#FF6B5A) 12%,rgba(255,255,255,.035));border:1px solid color-mix(in srgb,var(--c,#FF6B5A) 48%,transparent);box-shadow:0 10px 34px -16px var(--c,#FF6B5A);transition:left .6s var(--ease),width .6s var(--ease),background .5s,border-color .5s,box-shadow .5s;overflow:hidden;pointer-events:none}
.co2-guia i{position:absolute;left:20px;right:20px;bottom:0;height:2px;border-radius:2px;background:var(--c,#FF6B5A);transform:scaleX(0);transform-origin:left;opacity:0}
.co2-ab{position:relative;z-index:1;display:flex;align-items:center;gap:11px;height:40px;padding:0 20px 0 6px;border-radius:999px;font-size:19px;color:var(--muted);white-space:nowrap;cursor:pointer;transition:color .4s}
.co2-ab b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-family:var(--tt);font-weight:600;font-size:17px;color:#E5E5EA;background:rgba(255,255,255,.08);transition:background .4s,color .4s,box-shadow .4s}
.co2-ab:hover{color:#E5E5EA}
.co2-ab.co2-on{color:var(--ink)}
.co2-ab.co2-on b{background:var(--c);color:#07080C;box-shadow:0 0 16px -2px var(--c)}

.co2-vers{display:flex;align-items:center;gap:6px}
.co2-ver{display:flex;align-items:center;height:44px;padding:0 6px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.035);font-size:17px;color:var(--muted);cursor:pointer;transition:border-color .5s,background .5s,padding .5s var(--ease)}
.co2-ver:hover{background:rgba(255,255,255,.07)}
.co2-ver b{display:grid;place-items:center;min-width:44px;height:32px;padding:0 10px;border-radius:999px;font-family:var(--tt);font-weight:600;font-size:19px;color:#06070B;background:var(--grad);transition:background .5s,color .5s,box-shadow .5s}
.co2-ver span{display:inline-flex;align-items:center;gap:8px;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .6s var(--ease),opacity .4s,margin .6s var(--ease)}
.co2-ver span::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
.co2-ver.co2-mal{border-color:rgba(255,69,58,.45);padding-right:16px}
.co2-ver.co2-mal span{max-width:90px;opacity:1;margin-left:10px;color:#FF8A80}
.co2-ver[data-v="1"]:not(.co2-hay){border-style:dashed;border-color:rgba(255,255,255,.2);background:none}
.co2-ver[data-v="1"]:not(.co2-hay) b{background:none;color:#8A8A93;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22)}
.co2-ver.co2-hay b{box-shadow:0 0 18px -4px #4C9BFF}
.co2-ver.co2-bien{border-color:rgba(46,211,198,.5);padding-right:16px}
.co2-ver.co2-bien span{max-width:90px;opacity:1;margin-left:10px;color:#5BE0D3}
.co2-paso{position:relative;display:flex;flex-direction:column;align-items:center;width:132px;height:44px;font-size:17px;color:var(--faint)}
.co2-paso em{font-style:normal;line-height:20px}
.co2-paso::after{content:"";position:absolute;left:8px;right:8px;top:31px;height:1.5px;background:linear-gradient(90deg,rgba(255,255,255,.12),rgba(255,255,255,.32))}
.co2-paso::before{content:"";position:absolute;right:7px;top:27.5px;width:7px;height:7px;border-top:1.5px solid rgba(255,255,255,.4);border-right:1.5px solid rgba(255,255,255,.4);transform:rotate(45deg)}
.co2-paso i{position:absolute;left:8px;top:28.5px;width:7px;height:7px;border-radius:50%;background:#9CC6FF;box-shadow:0 0 10px #4C9BFF;opacity:0}
.co2.co2-v1 .co2-paso{color:#C9D3EA}
.co2.co2-v1 .co2-paso i{opacity:1;animation:co2corre 1.8s linear infinite}
@keyframes co2corre{from{left:8px}to{left:calc(100% - 20px)}}

/* ---------- escenario: un acto a la vez ---------- */
.co2-esc{position:relative}
.co2-acto{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .4s var(--ease),transform .6s var(--ease),visibility 0s .4s}
.co2[data-acto="0"] .co2-a0,.co2[data-acto="1"] .co2-a1,.co2[data-acto="2"] .co2-a2{opacity:1;visibility:visible;transform:none;transition:opacity .7s var(--ease) .12s,transform .9s var(--ease) .12s,visibility 0s}

/* ---------- acto 1 · la falla anotada ---------- */
.co2-a0{display:grid;grid-template-columns:540px 1fr;gap:40px;align-items:center}
.co2-ficha{padding:22px 28px 8px}
.co2-ficha header{display:flex;align-items:center;gap:12px;padding-bottom:16px}
.co2-ficha header b{font-family:var(--tt);font-weight:500;font-size:26px;letter-spacing:-.025em}
.co2-vt{display:grid;place-items:center;min-width:42px;height:30px;padding:0 10px;border-radius:999px;font-family:var(--tt);font-weight:600;font-size:18px;color:#06070B;background:var(--grad)}
.co2-est{margin-left:auto;padding:5px 14px;border-radius:999px;font-size:17px;font-weight:600;color:#fff;background:#FF453A;box-shadow:0 10px 30px -8px rgba(255,69,58,.85);opacity:0}
.co2-est.co2-on{opacity:1;animation:co2pop .6s cubic-bezier(.34,1.56,.64,1) both}
@keyframes co2pop{from{opacity:0;transform:scale(.4)}}
.co2-ficha dl{display:grid}
.co2-f{display:grid;grid-template-columns:120px 1fr;align-items:baseline;gap:14px;padding:16px 28px;margin:0 -28px;border-top:1px solid var(--line);transition:background .6s}
.co2-f dt{display:flex;align-items:center;gap:10px;font-size:17px;color:var(--muted)}
.co2-f dt::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--c);opacity:.3;transition:opacity .4s,box-shadow .4s}
.co2-f.co2-lleno dt::before{opacity:1;box-shadow:0 0 10px var(--c)}
.co2-f dd{min-height:29px;font-size:21px;line-height:1.38;color:var(--ink)}
.co2-f.co2-tip dd::after{content:"";display:inline-block;width:2px;height:1.05em;margin-left:2px;vertical-align:-3px;background:currentColor;animation:parpadea 1s steps(1) infinite}
.co2-fe dd{color:#BDF3EE}
.co2-fo dd{color:#FFB8B0}
.co2-fo.co2-lleno{background:linear-gradient(90deg,rgba(255,69,58,.13),rgba(255,69,58,0) 85%)}

/* reproducción en v0: la cita lleva a la página 1 y no a la sección esperada */
.co2-repro{position:relative;height:392px}
.co2-l1{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.co2-tesp{fill:none;stroke:#2ED3C6;stroke-width:2;stroke-dasharray:6 7;opacity:0;transition:opacity .6s}
.co2-repro.co2-esp .co2-tesp{opacity:.95;animation:co2hormiga 1.1s linear infinite}
@keyframes co2hormiga{to{stroke-dashoffset:-26}}
.co2-tobs{fill:none;stroke:#FF453A;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .7s var(--ease)}
.co2-repro.co2-obs .co2-tobs{stroke-dashoffset:0}
.co2-pto{opacity:0;transition:opacity .4s .5s}
.co2-repro.co2-obs .co2-pto{opacity:1}
.co2-gr{fill:#FF8A80;filter:drop-shadow(0 0 5px #FF453A)}
.co2-citaw{position:absolute;left:0;right:0;top:22px;display:flex;justify-content:center;z-index:2}
.co2-cita{display:inline-flex;align-items:center;gap:11px;height:52px;padding:0 22px 0 18px;border-radius:14px;font-size:19px;color:#DCE8FF;background:rgba(76,155,255,.1);border:1px solid rgba(76,155,255,.42);box-shadow:0 16px 40px -20px rgba(76,155,255,.9);cursor:pointer;white-space:nowrap;transition:background .4s,border-color .4s,box-shadow .4s}
.co2-cita:hover{background:rgba(76,155,255,.2)}
.co2-ic{flex:none;width:16px;height:20px;color:#9CC6FF}
.co2-repro.co2-ent .co2-cita{border-color:rgba(76,155,255,.8);box-shadow:0 0 0 4px rgba(76,155,255,.12),0 18px 44px -18px rgba(76,155,255,1)}
.co2-repro.co2-clic .co2-cita,.co2-a2.co2-clic .co2-cita{animation:co2pulsa .45s var(--ease)}
@keyframes co2pulsa{40%{transform:scale(.95)}}
.co2-pags{display:flex;gap:40px}
.co2-repro .co2-pags{position:absolute;left:190px;top:150px}
.co2-pag{position:relative;width:200px;height:226px;padding:14px 16px;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.15);transition:border-color .5s,box-shadow .6s,background .5s}
.co2-pag h4{font-weight:500;font-size:17px;color:#C9CDD8;margin-bottom:14px;white-space:nowrap}
.co2-pag u{display:block;height:7px;margin-top:10px;border-radius:4px;background:rgba(255,255,255,.13);text-decoration:none}
.co2-sec{margin:12px 0 2px;padding:8px 10px;border-radius:9px;border:1.5px solid rgba(255,255,255,.16);font-size:17px;color:#C9CDD8;white-space:nowrap;transition:border-color .5s,color .5s,background .5s,box-shadow .6s}
.co2-repro.co2-obs .co2-pag[data-p="1"]{border-color:#FF453A;background:linear-gradient(180deg,rgba(255,69,58,.14),rgba(255,69,58,.05));box-shadow:0 0 0 4px rgba(255,69,58,.14),0 26px 60px -26px rgba(255,69,58,.9)}
.co2-repro.co2-esp .co2-sec{border:2px dashed #2ED3C6;color:#BDF3EE;background:rgba(46,211,198,.07)}
.co2-tag{position:absolute;padding:5px 13px;border-radius:999px;font-size:17px;font-weight:500;opacity:0;transform:translateY(6px);transition:opacity .5s,transform .6s var(--ease)}
.co2-to{left:52px;top:166px;color:#FFD0CB;background:rgba(255,69,58,.14);border:1px solid rgba(255,69,58,.55)}
.co2-te{left:650px;top:244px;color:#BDF3EE;background:rgba(46,211,198,.12);border:1px solid rgba(46,211,198,.5)}
.co2-repro.co2-esp .co2-te,.co2-repro.co2-obs .co2-to{opacity:1;transform:none}
.co2-cur{position:absolute;left:0;top:0;z-index:3;width:24px;height:28px;transform:translate(730px,330px);opacity:0;pointer-events:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.65));transition:transform 1s cubic-bezier(.5,0,.2,1),opacity .4s}
.co2-repro.co2-cvis .co2-cur{opacity:1}
.co2-repro.co2-va .co2-cur{transform:translate(552px,52px)}
.co2-repro.co2-clic .co2-cur{animation:co2toque .35s}
@keyframes co2toque{50%{scale:.8}}
.co2-onda{position:absolute;left:543px;top:42px;width:24px;height:24px;border-radius:50%;border:2px solid #9CC6FF;opacity:0;pointer-events:none;z-index:2}
.co2-repro.co2-clic .co2-onda{animation:co2onda .8s ease-out}
@keyframes co2onda{from{opacity:.9;transform:scale(.4)}to{opacity:0;transform:scale(3.2)}}

/* ---------- acto 2 · causa y cambio mínimo ---------- */
.co2-a1{display:grid;grid-template-columns:524px 58px 1fr;align-items:center}
.co2-pn{margin:0 0 10px 4px;font-size:17px;color:var(--muted)}
.co2-pn b{font-family:var(--tt);font-weight:600;font-size:19px;color:var(--ink)}
.co2-a1 .pide{margin-top:0;padding:16px 22px 18px;border-radius:20px}
.co2-a1 .pide .pt{font-size:19px;line-height:1.52}
.co2-h{border-radius:6px;padding:0 3px;transition:background .5s,color .5s,box-shadow .5s}
.co2-h[data-h="0"]{--c:#4C9BFF}.co2-h[data-h="1"]{--c:#2ED3C6}.co2-h[data-h="2"]{--c:#FF453A}
.co2-a1.co2-h0 .co2-h[data-h="0"],.co2-a1.co2-h1 .co2-h[data-h="1"],.co2-a1.co2-h2 .co2-h[data-h="2"]{background:color-mix(in srgb,var(--c) 22%,transparent);box-shadow:inset 0 -2px 0 var(--c);color:#fff}
.co2-tubo{display:block;width:58px;height:24px;overflow:visible}
.co2-tl{fill:none;stroke:rgba(127,178,255,.38);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.co2-a1.co2-env .co2-tl{stroke:rgba(127,178,255,.7)}
.co2-tg{opacity:0;transition:opacity .4s}
.co2-a1.co2-env .co2-tg{opacity:1}
.co2-gb{fill:#9CC6FF;filter:drop-shadow(0 0 4px #4C9BFF)}
.co2-cl{height:384px;display:flex;flex-direction:column;border-radius:18px;background:#0A0B11;border:1px solid rgba(255,255,255,.13);overflow:hidden;box-shadow:0 40px 90px -46px rgba(76,155,255,.5),0 30px 60px -30px rgba(0,0,0,.9)}
.co2-cbar{flex:none;display:flex;align-items:center;gap:6px;height:40px;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.co2-cbar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.16)}
.co2-cbar span{margin-left:8px;font-size:17px;color:#C9CDD8}
.co2-cbar em{margin-left:auto;padding:2px 11px;border-radius:999px;border:1px solid var(--line);font-style:normal;font-size:17px;color:var(--faint)}
.co2-hilo{position:relative;flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:16px 24px}
.co2-u{align-self:flex-end;max-width:100%;padding:7px 14px;border-radius:16px 16px 4px 16px;background:rgba(255,255,255,.09);font-size:17px;line-height:1.4;color:#E5E5EA;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s var(--ease)}
.co2-u mark{padding:0 3px;border-radius:4px;background:rgba(76,155,255,.22);color:#DCE8FF}
.co2-a1.co2-env .co2-u{opacity:1;transform:none;transition-delay:.5s}
.co2-piensa{position:absolute;left:26px;top:76px;display:flex;gap:6px;opacity:0;transition:opacity .3s}
.co2-piensa i{width:8px;height:8px;border-radius:50%;background:#C9CDD8;animation:co2late 1s ease-in-out infinite}
.co2-piensa i:nth-child(2){animation-delay:.15s}.co2-piensa i:nth-child(3){animation-delay:.3s}
@keyframes co2late{50%{opacity:.25;transform:translateY(-3px)}}
.co2-a1.co2-pien .co2-piensa{opacity:1}
.co2-rl{font-size:20px;line-height:1.42;color:#E5E5EA;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s var(--ease)}
.co2-rl b{font-weight:600;color:var(--ink)}
.co2-rl b.co2-am{color:#F5C84B}
.co2-rl b.co2-az{color:#9CC6FF}
.co2-a1.co2-l0 [data-l="0"],.co2-a1.co2-l1 [data-l="1"],.co2-a1.co2-l2 [data-l="2"],.co2-a1.co2-l3 [data-l="3"],.co2-a1.co2-l4 [data-l="4"]{opacity:1;transform:none}
.co2-tab{margin:2px 0;border-collapse:separate;border-spacing:0;border:1px solid rgba(255,255,255,.12);border-radius:12px;overflow:hidden;font-size:18px}
.co2-tab th{padding:5px 20px;text-align:left;font-weight:500;font-size:17px;color:var(--muted);background:rgba(255,255,255,.04)}
.co2-tab td{padding:5px 20px;border-top:1px solid rgba(255,255,255,.08);color:#E5E5EA;transition:background .6s,color .6s}
.co2-tab td:first-child{font-family:var(--tt);font-weight:600}
.co2-tab td.co2-falta{color:#F5C84B}
.co2-a1.co2-l2 .co2-tab td.co2-nuevo{color:#DCE8FF;background:rgba(76,155,255,.16);transition-delay:.5s}

/* ---------- acto 3 · la misma prueba, otra vez ---------- */
.co2-a2{display:flex;flex-direction:column}
.co2-prb{display:flex;align-items:center;justify-content:center;gap:24px;height:68px;padding:0 24px;border-radius:20px}
.co2-prb>b{font-family:var(--tt);font-weight:500;font-size:23px;letter-spacing:-.02em;white-space:nowrap}
.co2-pc{display:flex;align-items:center;gap:12px;padding-left:24px;border-left:1px solid var(--line);white-space:nowrap}
.co2-pc small{font-size:17px;color:var(--muted)}
.co2-pc span{font-size:20px;color:var(--ink)}
.co2-prb .co2-cita{height:44px;padding:0 16px 0 14px;font-size:19px;border-radius:12px}
.co2-a2.co2-clic .co2-cita{border-color:rgba(76,155,255,.8)}
.co2-hor{display:block;width:100%;height:44px;overflow:visible}
.co2-rama{fill:none;stroke:rgba(127,178,255,.45);stroke-width:1.8;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .8s var(--ease)}
.co2-a2.co2-flu .co2-rama{stroke-dashoffset:0}
.co2-hg{opacity:0;transition:opacity .4s .4s}
.co2-a2.co2-flu .co2-hg{opacity:1}
.co2-gt{fill:#9CC6FF;filter:drop-shadow(0 0 5px #4C9BFF)}
.co2-runs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.co2-run{position:relative;display:grid;grid-template-columns:96px 176px 1fr;align-items:center;gap:24px;height:186px;padding:0 26px;border-radius:22px;background:linear-gradient(180deg,rgba(140,170,255,.06),rgba(140,170,255,.015));border:1px solid var(--vidrio-borde,var(--line));transition:border-color .6s,box-shadow .6s,background .6s}
.co2-rv{font-family:var(--tt);font-weight:500;font-size:56px;line-height:1;letter-spacing:-.05em;color:#C9D3EA}
.co2-mini .co2-pag{width:176px;height:142px;padding:12px 14px;border-style:dashed;border-color:rgba(255,255,255,.18);background:none}
.co2-mini .co2-pag>*{opacity:0;transition:opacity .5s}
.co2-mini .co2-pag h4{margin-bottom:8px}
.co2-mini .co2-pag u{margin-top:9px}
.co2-mini .co2-sec{margin:9px 0 0;padding:5px 10px}
.co2-rr small{display:block;font-size:17px;color:var(--muted);margin-bottom:6px}
.co2-rr p{font-family:var(--tt);font-weight:500;font-size:27px;line-height:1.18;letter-spacing:-.02em;color:#8A8A93;opacity:0;transform:translateY(8px);transition:opacity .6s,color .6s,transform .7s var(--ease)}
.co2-a2.co2-res .co2-mini .co2-pag{border-style:solid}
.co2-a2.co2-res .co2-mini .co2-pag>*{opacity:1}
.co2-a2.co2-res .co2-rr p{opacity:1;transform:none}
.co2-a2.co2-res .co2-run[data-v="0"]{border-color:rgba(255,69,58,.4)}
.co2-a2.co2-res .co2-run[data-v="0"] .co2-pag{border-color:#FF453A;background:linear-gradient(180deg,rgba(255,69,58,.14),rgba(255,69,58,.04));box-shadow:0 22px 50px -26px rgba(255,69,58,.9)}
.co2-a2.co2-res .co2-run[data-v="0"] .co2-rr small{color:#FF8A80}
.co2-a2.co2-res .co2-run[data-v="0"] .co2-rr p{color:#FFB8B0}
.co2-a2.co2-res .co2-run[data-v="1"]{border-color:rgba(46,211,198,.45);box-shadow:0 30px 80px -50px rgba(46,211,198,.9)}
.co2-a2.co2-res .co2-run[data-v="1"] .co2-pag{border-color:rgba(46,211,198,.5);background:linear-gradient(180deg,rgba(46,211,198,.08),rgba(46,211,198,.02))}
.co2-a2.co2-res .co2-run[data-v="1"] .co2-sec{border:2px solid #2ED3C6;color:#E8FBF9;background:rgba(46,211,198,.16);box-shadow:0 0 26px -6px rgba(46,211,198,.9)}
.co2-a2.co2-res .co2-run[data-v="1"] .co2-rr small{color:#5BE0D3}
.co2-a2.co2-res .co2-run[data-v="1"] .co2-rr p{color:#E8FBF9}
.co2-no{position:absolute;top:18px;right:20px;padding:5px 14px;border-radius:999px;font-size:17px;font-weight:600;color:#fff;background:#FF453A;box-shadow:0 10px 30px -8px rgba(255,69,58,.85);opacity:0}
.co2-a2.co2-res .co2-no{opacity:1;animation:co2pop .6s cubic-bezier(.34,1.56,.64,1) both}
.co2-sello{position:absolute;top:14px;right:20px;padding:3px 16px;border:2.5px solid #2ED3C6;border-radius:10px;font-family:var(--tt);font-weight:600;font-size:26px;letter-spacing:-.01em;color:#5BE0D3;background:rgba(46,211,198,.08);box-shadow:0 0 30px -8px rgba(46,211,198,.9);opacity:0;transform:rotate(-8deg) scale(1.9)}
.co2-a2.co2-sel .co2-sello{animation:co2sello .55s cubic-bezier(.3,1.5,.6,1) forwards}
@keyframes co2sello{to{opacity:1;transform:rotate(-8deg) scale(1)}}
.co2-regla{display:flex;align-items:center;gap:32px;margin-top:18px}
.co2-regla p{flex:1;font-size:19px;line-height:1.5;color:#D4D4D9;opacity:0;transform:translateY(8px);transition:opacity .6s,transform .7s var(--ease)}
.co2-regla p b{font-weight:600;color:var(--ink)}
.co2-a2.co2-reg .co2-regla p{opacity:1;transform:none}
.co2-rep{flex:none}