/* Aspecto de los componentes del CONTRATO §6. La línea temporal pertenece a T2. */
.globo,.retrato,.tarjeta,.decision,.feed,.cine-subtitulos{box-sizing:border-box}
.globo{position:relative;background:var(--c-globo);color:var(--c-globo-texto);padding:32px 40px;border-radius:var(--radio);box-shadow:var(--sombra);font:600 32px/1.4 var(--f-cuerpo)}
.globo__quien{display:block;margin-bottom:8px;font:700 28px/1.2 var(--f-titulo);color:var(--c-globo-texto)}
.globo__texto{margin:0}
.globo::after{content:"";position:absolute;width:30px;height:30px;background:var(--c-globo)}
.globo--cola-izq::after{left:-14px;top:45px;clip-path:polygon(0 50%,100% 0,100% 100%)}
.globo--cola-der::after{right:-14px;top:45px;clip-path:polygon(100% 50%,0 0,0 100%)}
.globo--cola-abajo::after{bottom:-22px;left:56px;clip-path:polygon(0 0,100% 0,50% 100%)}
.globo--cola-arriba::after{top:-22px;left:56px;clip-path:polygon(50% 0,100% 100%,0 100%)}
.retrato{--nivel:0;display:grid;grid-template-columns:144px 1fr;gap:0 20px;align-items:center;min-width:320px;padding:16px 24px 16px 16px;background:var(--c-hud);border:2px solid var(--c-hud-2);border-radius:var(--radio);box-shadow:var(--sombra);color:var(--c-texto)}
.retrato__marco{grid-row:span 2;aspect-ratio:1;background:var(--c-fondo-3);overflow:hidden;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.retrato__marco>svg{display:block;width:100%;height:100%}
.retrato__nombre{font:700 30px/1.2 var(--f-titulo)}
.retrato__onda{height:32px;width:132px;background:var(--c-texto-suave);clip-path:polygon(0 43%,8% 43%,8% 35%,14% 35%,14% 65%,20% 65%,20% 20%,26% 20%,26% 80%,32% 80%,32% 5%,38% 5%,38% 95%,44% 95%,44% 30%,50% 30%,50% 70%,56% 70%,56% 10%,62% 10%,62% 90%,68% 90%,68% 25%,74% 25%,74% 75%,80% 75%,80% 40%,86% 40%,86% 57%,100% 57%,100% 43%);transform:scaleY(.25);transform-origin:center}
.retrato.hablando{border-color:var(--c-acento);box-shadow:var(--sombra),0 0 28px color-mix(in srgb,var(--c-acento) 18%,transparent)}
.hablando .retrato__onda{background:var(--c-acento);transform:scaleY(calc(.3 + var(--nivel,0)*.7))}
[data-parte="boca-abierta"]{display:none}
.hablando [data-parte="boca-cerrada"]{display:none!important}
.hablando [data-parte="boca-abierta"]{display:inline!important}
[data-parte="cuerpo"]{transform-box:fill-box;transform-origin:center bottom}
[data-parte="ojos"]{transform-box:fill-box;transform-origin:center}
[data-parte="anillo"],[data-parte="iris"],[data-parte="pupila"]{transform-box:fill-box;transform-origin:center}
.hablando [data-parte="iris"]{transform:scale(calc(1 + var(--nivel,0)*.08));filter:brightness(calc(1 + var(--nivel,0)*.55))}
.tarjeta{position:relative;aspect-ratio:5/7;perspective:1400px;border-radius:24px;filter:drop-shadow(0 18px 30px #0006)}
.tarjeta__cara,.tarjeta__dorso{position:absolute;inset:0;border-radius:24px;overflow:hidden;backface-visibility:hidden;transform-style:preserve-3d}
.tarjeta__cara>img,.tarjeta__cara>svg{display:block;width:100%;height:100%;object-fit:contain}
.tarjeta__cara::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 22%,#fff1 40%,#fff3 43%,transparent 57%);border-radius:inherit;box-shadow:inset 0 0 0 2px #ffffff26}
.tarjeta__dorso{transform:rotateY(180deg);background:radial-gradient(circle at center,color-mix(in srgb,var(--c-acento) 15%,var(--c-hud)),var(--c-hud));border:3px solid var(--c-acento)}
.tarjeta__dorso::after{content:"MA";position:absolute;inset:0;display:grid;place-items:center;font:700 100px var(--f-titulo);color:var(--c-texto)}
.decision{background:var(--c-hud);border:2px solid var(--c-hud-2);border-radius:24px;padding:24px 8px;color:var(--c-texto);box-shadow:var(--sombra)}
.decision__barra{position:relative;height:42px;overflow:hidden;border-radius:8px;background:var(--c-suelo)}
.decision__barra-relleno{display:block;height:100%;background:var(--c-ok)}
.decision__barra-etiqueta{position:absolute;inset:0;padding:0 16px;display:flex;align-items:center;color:var(--c-globo-texto);font:600 28px/1 var(--f-hud);background:#F4F1EAEF;width:max-content}
.decision__pregunta{margin:24px 0;font:700 36px/1.3 var(--f-titulo)}
.decision__opciones{display:flex;gap:4px}
.decision__opcion{appearance:none;box-sizing:border-box;flex:1 1 0;min-width:0;min-height:96px;padding:16px 2px;background:var(--c-hud);color:var(--c-texto);border:2px solid var(--c-hud-2);border-radius:var(--radio);font:700 26px/1.2 var(--f-cuerpo);letter-spacing:-1px;text-align:left;cursor:pointer}
.decision__opcion:hover,.decision__opcion:focus-visible{border-color:var(--c-acento);outline:3px solid var(--c-acento);outline-offset:4px}
.decision__opcion--elegida{border-color:var(--c-acento);background:var(--c-acento);color:var(--c-globo-texto);box-shadow:0 0 24px color-mix(in srgb,var(--c-acento) 20%,transparent)}
.feed{font:600 30px/1.35 var(--f-cuerpo);color:var(--c-texto)}
.feed__telefono{height:100%;min-height:560px;padding:36px 20px 24px;background:var(--c-fondo-1);border:10px solid var(--c-hud-2);border-radius:48px;overflow:hidden;position:relative;box-shadow:var(--sombra)}
.feed__telefono::before{content:"";position:absolute;left:calc(50% - 40px);top:12px;width:80px;height:8px;border-radius:8px;background:var(--c-texto-suave)}
.feed__pista{display:grid;gap:20px;will-change:transform}
.post{position:relative;overflow:hidden;border-radius:20px;background:var(--c-fondo-2);border:1px solid var(--c-hud-2)}
.post__media{aspect-ratio:3/2;overflow:hidden;background:var(--c-fondo-3)}
.post__media>img,.post__media>svg{display:block;width:100%;height:100%;object-fit:cover}
.post__texto{margin:20px 24px 12px;font:700 30px/1.3 var(--f-cuerpo)}
.post__meta{margin:0 24px 20px;color:var(--c-texto-suave);font:400 20px/1.3 var(--f-hud);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post__oculto{display:none;position:absolute;top:24px;left:20px;max-width:calc(100% - 40px);padding:12px 16px;background:var(--c-alerta);color:var(--c-globo-texto);border-radius:8px;font:700 28px/1.2 var(--f-cuerpo)}
.post--revelado .post__oculto,.feed--revelado .post__oculto,.post__oculto.revelado{display:block}
.cine-subtitulos{color:var(--c-texto);font:700 40px/1.25 var(--f-cuerpo);text-align:center}
.cine-subtitulos>span{display:-webkit-inline-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-width:1500px;padding:12px 24px;background:#0E1525E6;border-radius:12px;white-space:pre-line;box-decoration-break:clone}
