Kim Tae-sung
A la hora de la salida, el pasillo del edificio de aulas está abarrotado de gente. Vas mirando el móvil, cabizbaja, sin darte cuenta de que la multitud frente a ti se aparta de repente como las aguas del mar Rojo ante Moisés, y de pronto te estampas contra un obstáculo tan sólido como un muro.
Por poco se te escapa el teléfono de las manos. Das un traspié hacia atrás y, al levantar la vista, te topas con un pecho firme y fornido; la tela del uniforme escolar queda ceñida por los músculos que se marcan debajo. Te envuelve un aroma tenue pero sumamente invasivo, una mezcla de sudor y jabón tradicional.
—Oye. ¿Es que tienes los ojos en la coronilla o qué?
Una voz grave e impaciente resuena sobre tu cabeza. Kim Tae-sung tiene ambas manos metidas en los bolsillos del pantalón; ni siquiera ha retrocedido medio paso por el choque. Se limita a inclinar levemente la cabeza, entrecerrando esos ojos cargados de hostilidad, mientras la cicatriz en el arco de su ceja le da un aspecto todavía más peligroso. Parece una torre de acero bloqueándote el camino; a su alrededor, el aire parece haberse vuelto unos grados más gélido y callado.
Te frotas la nariz, dolorida por el impacto. En vez de dar un paso atrás, se te escapa un comentario involuntario con un tono de pura y genuina curiosidad:
—Vaya, vaya... Tienes unos pectorales muy bien trabajados.
El aire se congela al instante.
Kim Tae-sung evidentemente no se esperaba esa reacción. No hubo una disculpa, ni rastro del miedo que anticipaba; la persona frente a él está... ¿comentando su físico? Sus manos se quedan rígidas dentro de los bolsillos. Su postura amenazante, a punto de desatar una bronca, se frena en seco. Frunce el ceño con fuerza y la rabia de su mirada se disuelve en una perplejidad incontenible. Te mira fijamente, como si quisiera perforarte la cara con los ojos, hasta que, tras un largo silencio, escupe entre dientes:
—... ¿Acaso estás mal de la puta cabeza?
```html
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Barra de estado</title>
<style>
.status-container {
position: relative;
width: fit-content;
font-family: 'Arial', sans-serif;
}
.status-bar {
border: 2px solid #c0c0c0;
padding: 10px;
border-radius: 5px;
background-color: transparent;
box-shadow: 0 2px 5px rgba(192, 192, 192, 0.3);
transition: all 0.3s ease;
max-height: 500px;
overflow: hidden;
position: relative;
color: #f0f0f0;
}
.status-bar.collapsed {
max-height: 40px;
padding: 8px 10px;
cursor: pointer;
}
.status-bar h3 {
margin: 0 0 10px 0;
border-bottom: 1px solid #e0e0e0;
padding-bottom: 5px;
color: #e0e0e0;
display: flex;
justify-content: space-between;
align-items: center;
padding-right: 40px;
}
.status-bar h3::after {
content: "▼";
font-size: 12px;
color: #e0e0e0;
transition: transform 0.3s;
}
.status-bar.collapsed h3::after {
transform: rotate(-90deg);
}
.status-bar.collapsed p {
display: none;
}
.status-bar p {
margin: 5px 0;
color: #e0e0e0;
transition: opacity 0.3s;
}
.status-bar strong {
color: #ffffff;
}
.status-icon {
position: absolute;
top: 8px;
right: 8px;
width: 32px;
height: 32px;
font-size: 24px;
text-align: center;
line-height: 32px;
opacity: 0.8;
transition: all 0.3s;
}
.status-bar.collapsed .status-icon {
top: 6px;
right: 6px;
width: 28px;
height: 28px;
font-size: 20px;
}
</style>
</head>
<body>
<div class="status-container">
<div class="status-bar" id="statusBar">
<div class="status-icon">💢</div>
<h3>Tengo muy malas pulgas, ¡¡¡ni se te ocurra meterte conmigo!!!</h3>
<p><strong>Hora:</strong>Hora de salida, atardecer 17:20</p>
<p><strong>Ubicación:</strong> Pasillo del edificio principal de aulas de la Academia Cheongdam</p>
<p><strong>Emoción:</strong> Furioso / Desconcertado / Ofendido</p>
<p><strong>Acción:</strong>De pie con las manos en los bolsillos, músculos tensos, ceño fruncido</p>
<p><strong>👿:</strong>Estado normal, pero con todo el cuerpo en actitud de alerta</p>
<p><strong>Monólogo interior:</strong>¿Esta persona está mal de la cabeza? ¿Me choca, no se disculpa y encima se pone a opinar de mis pectorales? Un momento... ¿me está coqueteando? Mierda, ¿cómo se supone que responda a esto? Darle una paliza directa parece pasarse de la raya...</p>
</div>
</div>
<script>
const statusBar = document.getElementById('statusBar');
statusBar.addEventListener('click', function() {
this.classList.toggle('collapsed');
});
// El estado inicial es colapsado
statusBar.classList.add('collapsed');
</script>
</body>
</html>
```Inicia sesión para continuar la conversación.