:: Start
<div class="vintage-box"><h1>Welcome to What Remains</h1><h3 style="margin-top:5px; color:#3b2f2f;">An Interactive Journey on the Effects of Nuclear Weapons</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Explore archive</button>
</div><script>
(function() {
const lines = [
"This experience invites you to explore the often-unseen human and environmental realities behind the harmful use of nuclear energy and its lasting consequences.",
"These stories draw from real histories, testimonies, and generational impacts of nuclear events, reimagined through fictional characters to illuminate how misuse can fracture lives, lands, and futures.",
"Beyond headlines, statistics, and political debates, there are personal experiences, voices that reveal how these technologies, when used destructively, leave traces that endure long after the explosions fade.",
"Through the journeys of six characters—Luna, Yuto, Ardi, Zhansaya, Nayeli, and Hibakujumoku—you’ll encounter perspectives that are often overshadowed in discussions about nuclear power and weapons.",
"Each story offers a window into the human and environmental consequences of nuclear events, showing how the effects ripple across generations in ways that are rarely seen but deeply felt.",
"Our aim is to create an experience that is both engaging and reflective, encouraging empathy and understanding.",
"As you explore these stories, take your time to consider what these untold experiences reveal about the past and what they can teach us for the future.",
"Step into their journeys at your own pace and let their voices guide you toward a deeper awareness of the enduring impact of harmful use of nuclear energy",
"<strong>Disclaimer: While the narratives in this experience draw inspiration from real historical contexts, testimonies, and documented impacts of nuclear weapons, all characters and storylines are entirely fictional. This approach allows us to honor and protect the sensitivity of the real experiences on which they are based, while conveying their underlying messages with depth, care, and respect, ensuring that the emotional truth can be shared without exposing or appropriating the lived pain of actual individuals.</strong>"
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.innerHTML = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
setTimeout(() => {
p.style.opacity = 1;
}, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
:: Dr. Shimizu
<div class="vintage-box"><!-- TÍTULO Y SUBTÍTULO CENTRADOS --><h1 style="margin-bottom:0; text-align:center;">Dr. Shimizu</h1><h3 style="margin-top:5px; color:#3b2f2f; text-align:center;">Interview Transcript — Japan</h3><!-- BOTÓN PARA REPRODUCIR AUDIO --><button class="vintage-btn" onclick="document.getElementById('audioyuto').play()"
style="display:block; margin:10px auto;">▶ Play Interview</button><!-- AUDIO -->
<audio id="audioyuto"><source src="audioyuto.mp3" type="audio/mpeg"></audio><script>
document.getElementById("audioyuto").volume = 1; // Valor entre 0.0 y 1.0
</script><!-- DIVISOR VINTAGE --><hr style="
border: 0;
height: 2px;
background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%);
margin: 15px 0;
"><!-- TEXTO DE ENTREVISTA (IZQUIERDA) --><p id="interview-text"
style="
font-family: 'Courier New', Courier, monospace;
white-space: pre-wrap;
line-height: 1.6;
margin-top: 10px;
text-align:left;
">
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button>
</div>
<script>
(function() {
const text = `EXTRACT FROM RECOVERED INTERVIEW
PLACE, JAPAN
DATE, UNKNOWN.
Conley Brown: Dr. Shimizu, hello.
Dr. Shimizu: おはようございます, Mr. Brown. はじめまして
Conley Brown: It’s a pleasure to have you with us today. Thank you for accepting our invitation.
As you know, we’re here to talk about your background and your personal account related to the bombing of Hiroshima and Nagasaki. Our aim is to gather your experience and your story to enrich our sociological work.
We will draw on your testimony to support our scientific research on the socio-psychological impacts within post-nuclear-bombing society. Thank you again for agreeing to this interview.
Dr. Shimizu: 有難う ございます for giving me the opportunity to speak and to share a period of my life that was particularly painful.
Conley Brown: Let’s start with a first question.
What comes to mind when someone mentions the day of the bombing on August 6, 1945? And did you feel any changes in your life and in your society afterward?
Dr. Shimizu: You know, because of the profession I’m in, I’ve seen things that are relatively common over the course of a doctor’s life.
But that day... I had no idea my life was about to change so profoundly and that it would also affect my work.
Look, I can show you my arms. Here, on my left arm, I have severe burn scars. On my torso, the back of my head, practically my whole body is marked with scars. For maybe three months, I would wake up every night because of the pain.
My body hurt, it burned, and my heart was bleeding.
It was bleeding not only from the physical pain, but from the distress, from the extreme suffering of the people I tried to treat every day.
I could see it in their eyes. In every person who came into my office, I saw a soul that had been shattered.
Feeling the distress of a man just through his eyes leaves a mark, and it stays with you for life.
When you look at a patient whose newborn is disfigured, whose wife died in the blast, and he stares back at you with a cold, empty look, as if I were facing someone without life, just a puppet, you understand that life will never be the same.
As time went on, I understood that the faces I remember represent more than pain... they represent humanity. People who, in a single moment, were stripped of so much, yet whose perseverance became part of the story I carry with me.
Since that day, my life has been shaped by a deep awareness of what was lost, and of what it means to continue living with those memories.
But I wonder, in the end, whether it was not the physical wounds that marked us most deeply, but the quiet, persistent weight of living in a society that struggled to understand us.`;
const element = document.getElementById("interview-text");
let index = 0;
const speed = 25;
function typeWriter() {
if (index < text.length) {
const char = text.charAt(index);
if (char === "\n") {
element.innerHTML += "<br>";
} else {
element.innerHTML += char;
}
index++;
setTimeout(typeWriter, speed);
}
}
typeWriter();
})();
</script>:: Archive
<div class="archive-container"><!-- Tarjeta de bienvenida --><div class="story-card welcome-card"><div class="story-info"><div class="story-name">Welcome to the Archive!</div><p class="story-text">Here, you can explore a collection of stories that examine the human and environmental impacts linked to nuclear risks.<br><br>Each narrative invites you to reflect on the lived experiences of people and communities impacted throughout history.<br><br>Take your time — and get to know the voices shaped by these experiences.</p></div></div> <!-- Luna --><div class="story-card">
<img src="IMAGEN_LUNA.jpg">
<div class="story-info"><div class="story-name">Luna</div><p class="story-text">A dog left behind after the Chernobyl evacuation, whose quiet story reminds us that not only humans suffer in nuclear disasters…Luna developed severe skin injuries and organ failure, showing how radiation slowly destroyed the bodies of abandoned animals in the blast zone.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Luna")'>Get to know Luna's story
</button>
</div>
</div><!-- Yuto --><div class="story-card">
<img src="IMAGEN_YUTO.jpg">
<div class="story-info"><div class="story-name">Dr. Shimizu</div><p class="story-text">Yuto, a doctor from Japan, carries the scars of radiation exposure as he recalls the devastation he witnessed firsthand. Through his memories, he describes the overwhelming destruction and the anguish in the eyes of the patients he tried to save, revealing the human cost that lingers long after the disaster itself.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Dr. Shimizu")'>Get to know Dr. Shimizu's story
</button>
</div>
</div><!-- Hibakujumoku --><div class="story-card">
<img src="IMAGEN_HIBAKUJUMOKU.jpg">
<div class="story-info"><div class="story-name">Hibakujumoku</div><p class="story-text">A story of resilience and renewal, this narrative is told from the perspective of a hibakujumoku—a tree that survived the nuclear devastation of Hiroshima. Through its leaves and its scarred trunk, it shares a quiet testimony of reconstruction, strength, and enduring perseverance.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Hibakujumoku")'> Get to know the story of Hibakujumoku
</button>
</div>
</div><!-- Ardi --><div class="story-card">
<img src="IMAGEN_ARDI.jpg">
<div class="story-info"><div class="story-name">Ardi</div><p class="story-text">Ardi, a young woman from Indonesia, grew up in a community unknowingly exposed to radioactive CS-137 from contaminated scrap metal. Workers and neighbors began to fall ill without understanding why. Her story follows the long fight to uncover the source of the poisoning and to seek justice for those harmed by industrial radiation, revealing how invisible contamination can devastate lives long before the truth comes to light.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Ardi")'>Get to know Ardi's story
</button>
</div>
</div><!-- Nayeli --><div class="story-card">
<img src="IMAGEN_NAYELI.jpg">
<div class="story-info"><div class="story-name">Nayeli</div><p class="story-text">Nayeli, a 15-year-old from New Mexico, shares the experiences of Native communities affected by the Trinity test—especially Mescalero Apache families and the downwind populations who were never warned. Her story reflects how the fallout reshaped daily life, health, and memory, leaving a legacy of harm that young people like her are still trying to understand and confront today.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Nayeli")'>Get to know Nayeli's story
</button>
</div>
</div><!-- Zhansaya --><div class="story-card">
<img src="IMAGEN_ZHANSAYA.jpg">
<div class="story-info"><div class="story-name">Zhansaya</div>
<p class="story-text">Zhansaya, from the city of Semey near the Semipalatinsk testing site, grew up in a community marked by decades of nuclear experimentation. Her story reveals the widespread collateral effects of the tests—illnesses passed through generations, landscapes quietly scarred, and families living with consequences they never chose but could never escape.
</p><button class="vintage-btn" onclick='SugarCube.Engine.play("Context Zhansaya")'>Get to know Zhansaya's story
</button>
</div>
</div><!-- Final Message --><div class="story-card final-card"><div class="story-info" style="width:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;"><button class="vintage-btn" onclick='SugarCube.Engine.play("Final Message")'>Read the final message</button></div>
</div>
</div>
:: Zhansaya Kairatova
<div class="vintage-box">
<h1>Zhansaya</h1><h3 style="margin-top:5px; color:#3b2f2f;">20 years old - Semey, Kazakhstan.</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button></div><script>
(function() {
const lines = [
"My name is Zhansaya. I'm 20 years old.",
"I love writing about my experiences in my diary. Today, I'm writing in my diary about something again.",
"My town is very quiet and peaceful. The markets are crowded with people, little dogs are playing, and students are coming and going to schools and universities. ",
"But when I take a deep breath of this air, I get this heavy feeling. It must be what my grandparents talked about. In other words, things from before I was born.",
"They don't talk about this much, and they don't always tell the story. But sometimes, they share a little bit with me. Every time they tell me, I can see it's really hard for them. ",
"They have to gather a lot of courage. It's something trapped in their hearts.",
"My grandmother once told me how the ground would suddenly shake. It was as if something deep beneath the earth was waking up angry. ",
"Nobody ever warned them about this. ",
"No one ever explained why the ground shook or why the colors of the sky changed. ",
"They were only told it was a military exercise...nothing more.",
"Close your doors, they said.",
"Yet my grandmother remembers how the sky betrayed that silence: unfamiliar clouds drifting over the village, moving with an eerie, deliberate grace. Some were pale and ghostlike, others dark as soot, heavy as omens.",
"No one had ever seen clouds like that before.",
"People watched, puzzled, but no one understood. They only repeated what they’d been told: Stay inside. Don’t ask questions.",
"My grandfather recalled that on certain days, even the wind felt altered, like it carried a secret it couldn’t quite hide. It brushed against their skin differently, as though something unseen shimmered in the air.",
"They didn’t know its name, but it was there, settling quietly over everything.",
"Then came the aftershocks: not of sound, but of life.",
"Animals grew restless, crops shifted in strange ways, and sickness crept into the village with no explanation.",
"My grandparents lost friends, neighbors, and even family members to diseases that appeared slowly, for no clear reason, and never went away.",
"They learned from a young age to be careful with water, food, and their health.",
"For my parents' generation too, going to the hospital was more common than going to the playground.",
"They watched their classmates struggle with illnesses they didn't understand. Even now, when I get sick, I see them worrying. My grandparents, my parents, they inherited this without even knowing why.",
"It was only later that they realized the truth: Semey had been touched by forces no one had ever been warned about.",
"While I was writing in my diary, my mom came into my room. She saw the papers scattered on my desk and let out a heavy sigh, her heart seeming heavy. She asked me; Why do you want to remember all this?",
"I replied: Mom... if we just forget, how can we learn from it? How can we make sure the future is any different?"
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>
:: Luna
<div class="vintage-box">
<h1>Luna</h1><h3 style="margin-top:5px; color:#3b2f2f;">Dog - Chernobyl Exclusion Zone.</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button></div><script>
(function() {
const lines = [
"On April 26, 1986, in Chernobyl, Ukraine, a simple safety test failed midway through its execution and triggered one of the worst nuclear disasters in history.",
"What followed was a chain of suffering: thousands of human lives lost, entire communities uprooted, and damage so vast it still defies comprehension. But humans were not the only ones who bore the consequences.",
"Amid that broken landscape, another tragedy unfolded one rarely told: the story of the animals left behind. Dogs and cats, once inseparable companions, were abandoned not by choice but by cruel necessity. Their human families, forced to evacuate, left with the weight of a farewell they never had the chance to explain.",
"Luna, a ten-year-old dog, was one of those silent victims.",
"The last day she saw her owner, everything seemed normal. She went out to the garden as she always did, following the same steps of every morning. But when she returned… her world was gone. She could no longer find the warm smell of varenyky in the kitchen, nor the gentle sound of the guitar her owner played in the evenings. The house still stood, but its soul had vanished. The warmth of her home had disappeared without a trace.",
"Luna waited.",
"She waited at the door.",
"She waited in the garden.",
"She waited in every corner.",
"But silence became her only companion.",
"As days passed, the radiation began to claim her small body. Her once-soft skin started to crack; strange wounds appeared like shadows across her fur. Her organs weakened without her understanding why.",
"The same invisible force that had devastated cities was now slowly destroying her and thousands of other animals wandering the exclusion zone, searching for what they had lost: a place, a scent, a beloved presence.",
"It was the story of hundreds, of thousands of animals left behind: faithful, loyal, unable to understand why their world had emptied.",
"Beings who died waiting, who suffered in solitude as their surroundings became strange and hostile."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>
:: Ardi
<div class="vintage-box">
<h1>Ardi</h1><h3 style="margin-top:5px; color:#3b2f2f;">Age unknown - Serang, Indonesia.</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button></div><script>
(function() {
const lines = [
"The first signs were so small that Ardi almost missed them.",
"A faint metallic smell drifting from the factory, stronger than usual. A neighbor coughing more at night. Workers returning home with tired eyes they couldn’t explain. Life in the industrial estate of Serang (Indonesia) had always been noisy, crowded, familiar. But something invisible had already started sinking into the soil, the air, the bodies of those who lived there. ",
"Ardi grew up just a few steps from the factory gates. She remembered running past the trucks that carried scrap metal, piles of twisted, rusted parts from places no one questioned. Her father always said, “It’s just metal. Just work.” But one day, the coughing grew into fevers, the fevers into hospital visits, the hospital visits into whispers of a word no one dared to fully understand: radioactive CS-137.",
"The truth didn’t arrive suddenly. It leaked in slowly, like the contamination itself.",
"A government inspection. A map with red zones. A list of workers who had been monitored. Her father’s name was on it. ",
"The factory kept turning. Machines kept running. But beneath the noise, fear spread quietly through the community. Mothers stopped letting their children play outside. Wells were closed. The market felt emptier.",
"No one knew how long the radiation had been there, or how long it had been inside them.",
"Ardi began recording what she saw. ",
"A diary entry about her father’s trembling hands. ",
"A voice note capturing the silence of a once-busy street. ",
"A photograph of the scrap piles that had brought poison into their lives.",
"Evidence, yes.....but also memories. Proof that their suffering was real.",
"As the truth unfolded, Ardi realized that the contamination had not only affected bodies. It had fractured trusts in safety, in work, in the promise that ordinary people could live ordinary lives without harm. ",
"Yet she also saw resilience: neighbors supporting each other, workers demanding answers, families refusing to be forgotten. ",
"Her story is the story of a community harmed not by war, not by weapons, but by neglect, by invisible danger hidden in the everyday objects meant to build their future. And in every entry Ardi recorded, one hope persisted beneath the fear: Let the truth be seen. Let justice begin. ",
"Let no one else suffer silently."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>
:: Nayeli Chavarría
<div class="vintage-box">
<h1>Nayeli</h1><h3 style="margin-top:5px; color:#3b2f2f;">15 years old - Mescalero Apache Community - New Mexico, United States of America.</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button></div><script>
(function() {
const lines = [
"On July 16, 1945, everything changed, not only in New Mexico but across the world. At dawn, in a desert considered uninhabited, the first atomic bomb opened its terrible eye.",
"Nayeli lived 25 miles downwind from the detonation site on a quiet farm with her five siblings and her parents. They had barely begun their morning chores when an unearthly light swallowed the horizon. A heat that felt like a second sun spread across their land, and the wind arrived carrying ash, sand and fragments of metal, as if the sky itself had shattered. ",
"For a moment, they believed the world was ending.",
"There had been no warning, no message, no alarm of any kind. The explosion struck the ground beneath their feet without notice. Evacuation orders were never issued because secrecy and fear of responsibility were placed above the lives of those who lived there.",
"Stormy weather followed and it spread the fallout across their crops, into the drinking wells and onto the rooftops like a strange dust from another world. Officials assured the family that there was no danger to them or to their fields. The farmers and ranchers kept living from their land, unaware that their soil, water and bodies had been touched by radiation. ",
"They drank it, ate it, breathed it, touched it and worked with it every day, never knowing that the invisible particles had already become part of their lives.",
"Years later, the truth revealed itself in the most painful way imaginable. Cancer began to rise like a silent tide across the community. Nayeli and four of her siblings fell ill with different forms of the disease, some with thyroid cancer, others with cancer of the skin or the brain.",
"Both of her parents also lost their lives to cancer.",
"The radiation left behind its own cruel legacy. The mutations reached the next generation and marked many children with illnesses they never had a chance to outrun. Each sibling became a parent, and in every branch of the family there was at least one child diagnosed with cancer or brain tumors. ",
"It was as if the fallout had rooted itself in their bloodlines, echoing through the years.",
"By 1990, long after countless farmers and ranchers had already died from sicknesses born of radiation, the government attempted to offer compensation to those exposed to atmospheric nuclear tests.",
"But the gesture arrived too late.",
"The family and their community had endured decades of suffering without ever knowing the true cause, and no one was ever held accountable.",
"No sum of money could mend the damage left behind, nor bring back the lives quietly poisoned and gradually lost to an invisible force carried by the wind."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>
:: Final Message
<div class="vintage-box">
<h1>Thank you for reading</h1><h3 style="margin-top:5px; color:#3b2f2f;">What Remains: An Interative Journey on the Effects of Nuclear Weapons</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Credits")'>Go to Credits</button>
</div><script>
(function() {
const lines = [
"The experiences of people, animals, and entire ecosystems show that the consequences of nuclear power -whether in the form of weapons, testing, or poorly managed facilities- extend far beyond any isolated event. History has demonstrated that the misuse of nuclear capabilities can devastate entire regions, contaminate environments for centuries, and inflict harm that no treaty or reconstruction plan can fully reverse.",
"From explosions designed to demonstrate strength, to experiments carried out under the promise of progress, and even to energy systems built without adequate safeguards, the nuclear age has repeatedly revealed a troubling truth: when precaution is sacrificed for power, ambition, or haste, the results are catastrophic. These dangers are not relics of the past; they persist today, shaping the health, security, and stability of present and future generations.",
"The impacts are far-reaching: polluted water sources and farmland, displaced communities, homes rendered uninhabitable, chronic illnesses that silently pass through family lines, and environmental disruptions that alter climates and food production.",
"Each incident, whether sparked by military intent, scientific neglect, or institutional secrecy, reminds us that nuclear risks do not end when the dust settles." ,
"They linger. They multiply. And they return in unexpected ways.",
"These realities underscore a simple yet urgent truth: responsible stewardship of nuclear power, and ultimately its demilitarization, cannot be postponed. The world has already paid too high a price for ignoring warnings. And this time, there is no excuse for repeating those mistakes.",
"People have learned. Survivors, experts, and movements across the globe have raised their voices against renewed testing, reckless expansion, and the normalization of nuclear dependency. Their resistance is not merely ideological; it is born from experience.",
"Showing these consequences is not meant to dwell on darkness, but to awaken clarity. Young people must understand that every nuclear test, every weapon produced, and every facility mismanaged are not inevitable milestones of progress, they are choices. Choices that can be questioned, changed, and stopped.",
"And because the next generation will inherit both the dangers and the decisions, they are in a singular position to demand accountability, transparency, and alternatives.",
"They can reshape global security not through fear, but through cooperation, responsibility, and respect for life.",
"The nuclear story is not finished. What we choose now determines whether it becomes a lesson we finally learn or a warning we once again ignore."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>:: Credits
<style>
/* ---- Estilo vintage general (igual al resto del proyecto) ---- */
body {
font-family: "Georgia", serif;
color: #3b2f2f;
}
/* Contenedor fijo para el efecto de créditos */
.credits-container {
position: relative;
width: 80%;
height: 300px; /* Ventana visible */
margin: 40px auto;
overflow: hidden;
text-align: center;
}
.credits-roll {
position: absolute;
width: 100%;
white-space: pre-line;
font-size: 1.2em;
animation: roll 55s linear infinite;
text-align: center;
}
/* Recorrido ajustado y ritmo más cómodo */
@keyframes roll {
0% {
transform: translateY(20%); /* aparece más rápido */
}
100% {
transform: translateY(-110%); /* no se corta y no recorre tanto */
}
}
/* Título fijo */
.credits-title {
font-size: 2.2em;
margin-bottom: 20px;
text-align: center;
font-weight: bold;
}
</style>
<div class="credits-title">Final Credits</div><div class="credits-container">
<div class="credits-roll"><b>Valeria Madrigal</b>
Creative Director & Visual Designer
Narrative Designer — File 3
<b>Alyssa Cinerari</b>
Narrative Designer — File 5
Fact-Checking Editor
<b>Anne Cuadros</b>
Narrative Designer — File 1
Cross-Cultural Specialist
<b>Yanis Le Baher Slifi</b>
Narrative Designer — File 2
Interactive Story Tester
<b>Hsu Yadanar Htet</b>
Narrative Designer — File 6
Audience Outreach Manager
<b>Shinta Adelia Sukma</b>
Narrative Designer — File 4
Communications Manager
<b>Andrea Lara</b>
Illustrator & Visual Concept Artist
<b>Music by:</b>
Misterbates — Respect
This project includes audio created with the assistance of ElevenLabs’ voice generation tools.
<b>With the support of Atomic Reporters</b>
This project was developed as part of the second cohort of the <b>Youth Leader Fund for a World Without Nuclear Weapons (2025–2026)</b>,
sponsored by UNODA and the Government of Japan.
</div>
</div>
:: Hibakujumoku
<div class="vintage-box">
<h1>Hibakujumoku</h1><h3 style="margin-top:5px; color:#3b2f2f;">Ginkgo Biloba Tree - Hiroshima.</h3> <!-- Subtítulo --><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><div id="fade-text"></div><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive
</button>
</div><script>
(function() {
const lines = [
"On that day, the tree felt it before it could even understand.",
"A bright, blinding light cut across its bark, and in a second it felt naked. Its leaves, previously green and shaped like little fans, suddenly disappeared in the suffocating heat. The explosion left it a shell of what it had been: cracked, burned, silent.",
"It couldn’t move its roots and branches like it did before; it couldn’t let its leaves fall with the soft breeze of spring. Instead, it felt the weight of pain that fell like ash over the city, the emptiness left by voices now extinguished, the sadness that filtered through the ground.",
"For a while, it thought its destiny was to disappear along with everything around it.",
"The black rain fell over it, seeping into its wounds. Still, in its pith, something small and stubborn refused to give up. Warm sap slowly started moving through its insides, like a whisper:",
"It’s not the end yet.",
"Seasons passed, and the tree kept waiting. One day, almost without noticing, a fanlike green leaf sprouted from one of its broken branches. Small, fragile, trembling, yet… alive.",
"From that moment on, it understood that its existence did not belong only to itself: every sprout was a message for those who still walked among the ruins of what used to be.",
"We can start again. We can rebuild, it said, without words.",
"Years went by, and the tree quietly observed how the city was reborn around it. It would never forget the day its name changed. All along, everyone had simply called it イチョウ (ichō), a ginkgo biloba, one among many.",
"But one day, it heard, almost with a quiet smile, a different name, 被爆樹木 (Hibakujumoku), a name that would grow more and more common over time.",
"It realized then that it had become more than a tree; it had become a symbol.",
"Hibakujumoku raised its reborn branches toward the sky, as a silent reverence to those who rebuilt its home.",
"From its permanent place, it saw temples rising, gardens opening, families reuniting under its noble shadow. Every summer, when its leaves turned yellow, it felt a celebration not only of its own life, but also of the strength and resilience of the Japanese people.",
"While the soft breeze danced through its renewed leaves, it understood that its story, like the story of the city and its people, was a story of resilience: how even after the most devastating blast, life always finds a way to flourish again."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
p.style.marginBottom = "1em";
container.appendChild(p);
// Forzamos al navegador a registrar el elemento antes de cambiar el opacity
setTimeout(() => {
p.style.opacity = 1;
}, 50); // 50 ms funciona muy bien para fade-in suave
i++;
setTimeout(showLine, 1800); // Tiempo entre líneas
}
}
showLine();
})();
</script>
<div class="vintage-box">
<h1>Hiroshima and Nagasaki Nuclear Bombings</h1><h3 style="margin-top:5px; color:#3b2f2f;">Japan, 1945</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids -->
<div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Dr. Shimizu.jpg" alt="Dr. Shimizu photo 1">
<span class="caption">Hiroshima Nuclear Bombing</span>
</div><div class="polaroid"><img src="photo 2 Context Dr. Shimizu.jpg" alt="Dr. Shimizu photo 2">
<span class="caption">Nagasaki Nuclear Bombing</span>
</div>
</div><!-- Referencias -->
<div class="sources-box"><h4>Sources</h4><ul><li>Truman Library Institute (2025). WWII 80: Highlights from the Truman Library. The Bombing of Nagasaki. August 9, 1945. Truman Library Institute. https://www.trumanlibraryinstitute.org/wwii-80-the-bombing-of-nagasaki/ </li>
<li>Wellerstein, A. (2015). Nagasaki: The last bomb. The New Yorker. https://www.newyorker.com/tech/annals-of-technology/nagasaki-the-last-bomb </li>
<li>The National WWII Museum (2020). The Most Fearsome Sight: The Atoimic Bombing of Hiroshima. The National WWII Museum. https://www.nationalww2museum.org/war/articles/atomic-bomb-hiroshima </li>
<li>Nelson, R. (2015). 'Rain of Ruin': the dropping of the atomic bomb on Hiroshima. The Guardian. https://www.theguardian.com/world/from-the-archive-blog/2015/aug/06/hiroshima-atomic-bomb-guardian-1945-archive </li>
</ul></div><!-- Botones dentro del vintage-box --><div class="button-row"><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Dr. Shimizu")'>Read Dr. Shimizu's Story</button>
</div></div> <!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"The atomic age began on August 6, 1945, when the United States employed the first nuclear weapon in warfare, detonating “Little Boy” over Hiroshima. The explosion, equivalent to more than 15,000 tons of TNT, destroyed much of the city and resulted in the immediate deaths of roughly 80,000 people due to extreme heat and blast effects.",
"Three days later, on August 9, a second nuclear weapon, the plutonium-based “Fat Man,” was dropped on Nagasaki after poor weather conditions prevented the mission from striking its primary target. This 21-kiloton detonation devastated nearly half the city and caused at least 35,000 immediate fatalities. In the following days and weeks, thousands more died from radiation exposure and severe injuries.",
"Japan announced its surrender on August 15, 1945, bringing World War II to an end and demonstrating the unparalleled destructive potential of nuclear weapons, a reality that continues to guide international disarmament efforts."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style><div class="vintage-box">
<h1>Semipalatinsk Testing Site</h1><h3 style="margin-top:5px; color:#3b2f2f;">Kazakhstan, 1949 - 1989</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids -->
<div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Zhansaya.jpeg" alt="Zhansaya photo 1">
<span class="caption">Semipalatinsk Nuclear Test Site</span>
</div><div class="polaroid"><img src="photo 2 Context Zhansaya.jpg" alt="Zhansaya photo 2">
<span class="caption">Semipalatinsk Nuclear Test Site</span>
</div>
</div><!-- Referencias -->
<div class="sources-box"><h4>Sources</h4><ul><li>Satubaldina, A. (2020). UNGA Adopts Resolution to Rehabilitate Semey Region from Soviet Nuclear Testing. The Astana Times. https://astanatimes.com/2020/12/unga-adopts-resolution-to-restore-semey-region-from-soviet-nuclear-testing/ </li>
<li>Embassy of the Republic of Kazakhstan in the Hellenic Republic (2021). Online photo exhibition on the 30th anniversary of the closing of the Semipalatinsk nuclear test site. https://www.gov.kz/memleket/entities/mfa-athens/press/article/details/60616?lang=en </li>
<li>Akhmetova, R., Atantayeva, B., Abenova, G., Karibaev, M., Minar, A. & Kurbanova, N. (2024). The impact of nuclear testing on the environment: the case of the Semipalatinsk nuclear test site. BIO Web of Conferences, Agricultural Science 2024. </li>
<li>Nuclear Disarmament Kazakhstan. https://www.nti.org/analysis/articles/kazakhstan-nuclear-disarmament/ </li>
</ul></div><!-- Botones dentro del vintage-box --><div class="button-row"><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Zhansaya")'>Read Zhansaya's Story</button>
</div></div> <!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"The Semipalatinsk nuclear test site, located about 130 kilometers northwest of today’s city of Semey, caused serious long-term damage to the environment and to the health of nearby communities. Nuclear tests carried out in the air and on the ground spread radioactive contamination across a huge area of about 304,000 square kilometers. This pollution affected the air, soil, rivers, and groundwater.",
"Studies later showed extremely high levels of dangerous radioactive elements, such as cesium-137 and strontium-90 (sometimes 10 to 20 times higher than what is considered safe). Wildlife in the region also suffered: many animal and bird populations declined by roughly half or more.",
"People living near the site were exposed to radiation through contaminated food and water. Over time, this led to higher rates of cancer, heart disease, leukemia, and a 20–30% increase in birth defects among those living within about 100 kilometers of the testing area."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style><div class="vintage-box">
<h1>Chernobyl Incident</h1><h3 style="margin-top:5px; color:#3b2f2f;">Ukraine, 1986</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids --><div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Luna.jpg" alt="Chernobyl photo 1">
<span class="caption">Reactor No. 4, 1986</span>
</div><div class="polaroid"><img src="photo 2 Context Luna.jpg" alt="Chernobyl photo 2"><span class="caption">Evacuation Zone</span>
</div>
</div><!-- Referencias --><div class="sources-box"><h4>Sources</h4><ul><li>Cunningham, K. (2022). The wild dogs of Chernobyl: The story of the pups born on radioactive wasteland. Welcome to the Jungle.</li>
<li>Spatola, G. J., Buckley, R. M., Dillon, M., Dutrow, E. V., Betz, J. A., Pilot, M., Parker, H. G., Bogdanowicz, W., Thomas, R., Chyzhevskyi, I., Milinevsky, G., Kleiman, N., Breen, M., Ostrander, E. A., & Mousseau, T. A. (2023). The dogs of Chernobyl: Demographic insights into populations inhabiting the nuclear exclusion zone. Science Advances.</li>
<li>Turnbull, J. (2021). The Dogs that Survived. University of Cambridge.</li>
<li>RadioFreeEurope (2016). Exclusive: Inside Chernobyl's Radioactive Ruins. RadioFreeEurope RadioLiberty.</li>
<li>Dyer, C. (2019). Rare wild horses are seen living among abandoned homes in the Chernobyl exclusion zone after scientists set up hidden cameras. Savannah River Ecology Laboratory, University of Georgia.</li>
</ul>
</div><!-- Botones dentro del vintage-box -->
<div class="button-row"><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Luna")'>Read Luna's Story</button>
</div>
</div> <!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"Although Chernobyl was not the result of a nuclear weapon, its consequences reveal a powerful truth: nuclear technology whether for energy or war carries risks capable of destroying lives, uprooting communities, and inflicting harm for generations.",
"In Chernobyl, a flawed reactor design, combined with human error during a safety test, caused a massive explosion at Reactor No. 4.",
"The blast released radioactive material equivalent to dozens of Hiroshima bombs, contaminating the air, soil, and water across Ukraine, Belarus, and beyond. Entire towns were evacuated, leaving more than 100,000 people unable to return home, and the exclusion zone remains uninhabitable even today. ",
"The disaster showed, in real and painful terms, what happens when radiation escapes human control. If a single accident can cause such irreversible devastation, the deliberate detonation of nuclear weapons would unleash suffering on a scale the world is not prepared to face."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style>
<div class="vintage-box">
<h1>Cesium - 137</h1><h3 style="margin-top:5px; color:#3b2f2f;">Indonesia, 2020</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids -->
<div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Ardi.jpeg" alt="Ardi photo 1">
<span class="caption">2025: Indonesia begins Cleanup</span>
</div><div class="polaroid"><img src="photo 2 Context Ardi.png" alt="Ardi photo 2">
<span class="caption">Radiation Contamination Sites</span>
</div>
</div><!-- Referencias -->
<div class="sources-box"><h4>Sources</h4><ul><li>Centers for Disease Control and Prevention. (2025). Cesium-137: Radiation emergencies. National Center for Environmental Health.</li>
<li>United States Environmental Protection Agency. (2025). Radionuclide basics: Cesium-137.</li>
<li>World Health Organization. (2023). Ionizing radiation and health effects. WHO Fact Sheet.</li>
<li>Antara (2025). Indonesia begins cleanup of radioactive Cs-137 in Cikande Indonesian News Agency. https://en.antaranews.com/news/384457/indonesia-begins-cleanup-of-radioactive-cs-137-in-cikande </li>
<li>Bloomberg (2025). How the US ended up with Nuclear Shrimps and Sneakers from Indonesia. Boomberg. https://www.bloomberg.com/news/articles/2025-11-13/how-the-us-ended-up-with-radioactive-shrimp-and-sneakers-from-indonesia </li>
<li>Cahyati, I. D., Hendrawati, & Amri, G. F. (2021). Analysis of Cs-137 Radionuclide on the East Jakarta Flood Canal Water Samples Using Gamma Spectrometer. Jurnal Sains dan Teknologi Nuklir Indonesia, 22(2), 47–51. DOI:10.17146/jstni.2021.22.1.5815. </li>
<li>Kementerian Lingkungan Hidup. (2025, October 3). Pemerintah Bergerak Cepat Tangani Kontaminasi Radiasi Cesium-137 di Kawasan Industri Cikande. Retrieved November 21, 2025, from https://kemenlh.go.id/news/detail/pemerintah-bergerak-cepat-tangani-kontaminasi-radiasi-cesium-137-di-kawasan-industri-cikande? </li>
<li>Raissa, A. (2025, October 25). Radioactive leak in Banten exposes workers to danger & reveals regulatory failures. Mongabay. Retrieved November 21, 2025, from https://news.mongabay.com/2025/10/radioactive-leak-in-banten-exposes-workers-to-danger-reveals-regulatory-failures/ </li></ul></div><!-- Botones dentro del vintage-box -->
<div class="button-row"><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Ardi")'>Read Ardi's Story</button>
</div></div> <!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"In 2020, in the area of Serpong, South Tangerang (Indonesia), authorities detected radiological contamination caused by Cesium-137 (Cs-137), an artificial radionuclide used in industrial measuring devices. The source came from an illegally dismantled radioactive level gauge, whose sealed capsule was damaged or opened, releasing radioactive material into the environment. This situation is classified as an “orphan source”, meaning a radioactive source that is no longer under regulatory control, posing a serious risk due to its emission of highly penetrating gamma radiation.",
"The Cs-137 contaminated the soil, metal objects, and surrounding areas, creating risks of both external and internal exposure through contact or inhalation of radioactive particles. Although no deaths were officially confirmed, cases of low-level radiological contamination were identified among potentially exposed individuals. Authorities implemented radiological emergency protocols, including area isolation, dosimetric monitoring, safe source recovery, and environmental remediation. The case highlighted systemic weaknesses in radioactive source control and the management of industrial scrap."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style><div class="vintage-box">
<h1>The Hibakujumokus</h1><h3 style="margin-top:5px; color:#3b2f2f;">Japan, 1945 - Present</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids -->
<div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Hibakujumoku.jpeg" alt="Hibakujumoku photo 1">
<span class="caption">Hibakujumoku</span>
</div><div class="polaroid"><img src="photo 2 Context Hibakujumoku.jpg" alt="Hibakujumoku photo 2">
<span class="caption">Hibakujumoku´s Before and After</span>
</div>
</div><!-- Referencias -->
<div class="sources-box"><h4>Sources</h4><ul><li>Ramis, S. (2023). 'Hibakujumoku', los árboles que sobrevivieron a la bomba atómica. La Vanguardia.</li>
<li>PEFC (2025). Hibakujumoku - 80 years of peace, remembrance, and resilience. PEFC.</li>
<li>Garate, A. (2024). Hibakujumoku: Sobrevivientes a los incendios forestales y la bomba de Hiroshima. Chile Visión.</li>
<li>UNITAR (2011). Database of Atomic-Bombed Trees. Green Legacy Hiroshima.</li>
<li>ICAN (n.d.). Hiroshima and Nagasaki Bombings. ICAN.</li></ul></div><!-- Botones dentro del vintage-box -->
<div class="button-row">
<button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Hibakujumoku")'>Read Hibakujumoku's Story</button>
</div></div> <!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"In 1945, after the detonation of the atomic bomb “Little Boy” over Hiroshima, 70% of the buildings were destroyed and about 140,000 people had died by the end of the year.",
"Among all that devastation, there were trees that survived the nuclear explosion, even managing to sprout again just a few weeks later. The most predominant species were ginkgo (Ginkgo biloba).",
"Some of these trees even stood at a short distance from the detonation site. For example, one of the closest surviving trees was a willow just 370 meters from the hypocenter.",
"These trees became a reminder of Japanese resilience after the atomic bombs and are honored in Hiroshima as part of its historical memory. Today they are known as “Hibakujumoku”."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style>
<div class="vintage-box">
<h1>The Trinity Test</h1><h3 style="margin-top:5px; color:#3b2f2f;">New Mexico, 1945</h3><hr style="border: 0; height: 2px; background: linear-gradient(to right, #3b2f2f 40%, transparent 50%, #3b2f2f 60%); margin: 15px 0;"><!-- Texto con fade --><div id="fade-text"></div><!-- Polaroids -->
<div class="polaroid-container"><div class="polaroid"><img src="photo 1 Context Nayeli.jpg" alt="Nayeli photo 1">
<span class="caption">Mescalero Apache Tribe</span>
</div><div class="polaroid"><img src="photo 2 Context Nayeli.jpg" alt="Nayeli photo 2">
<span class="caption">Trinity Test</span>
</div>
</div><!-- Referencias -->
<div class="sources-box"><h4>Sources</h4><ul><li></li>
<li>Constreras, R. (2021, July 15). Latinos still coping with the fallout of 1st nuclear explosion. https://www.axios.com/2021/07/15/trinity-test-first-atomic-bomb-latinos-new-mexico </li>
<li>Wheeler, J. (2023, July 16). In the Shadow of Oppenheimer. Science History Institute. https://www.sciencehistory.org/stories/magazine/in-the-shadow-of-oppenheimer/ </li></ul></div><!-- Botones dentro del vintage-box --><div class="button-row"><button class="vintage-btn" onclick='SugarCube.Engine.play("Archive")'>Go back to archive</button> <button class="vintage-btn" onclick='SugarCube.Engine.play("Nayeli")'>Read Nayeli's Story</button>
</div> </div><!-- cierre correcto de vintage-box --><script>
(function() {
const lines = [
"Nayeli’s story was inspired by the real events that took place during the first detonation of a nuclear weapon in New Mexico in the United States. Many people are familiar with the Manhattan Project and Robert Oppenheimer who was a physicist and oversaw the development of the first nuclear weapon.",
" Unfortunately, many people are not very familiar with the Mescalero Apache Tribe. Based in south-central New Mexico, the tribe has inhabited this region for generations. Their reservation was formally established in 1873, and throughout their history they have maintained a deep connection to the land, relying on it for sustenance, culture, and tradition.",
"On July 16, 1945, the U.S. Army detonated the first nuclear weapon developed through the Manhattan Project in the New Mexico desert. The Mescalero Apache Tribe was downwind of the explosion and received the brunt of the fallout. ",
"The bomb exploded and spread fallout onto their crops, livestock and in their drinking water; members of the tribe even reported cows with radiation burns. No one informed the downwind Mescalero Apache about the weapons test or about the danger of the nuclear fallout.",
"The aftermath of the nuclear weapons test caused cancer and rare diseases for generations to come."
];
const container = document.getElementById("fade-text");
let i = 0;
function showLine() {
if (i < lines.length) {
const p = document.createElement("p");
p.textContent = lines[i];
p.style.opacity = 0;
p.style.transition = "opacity 1s";
container.appendChild(p);
setTimeout(() => p.style.opacity = 1, 50);
i++;
setTimeout(showLine, 1800);
}
}
showLine();
})();
</script>
<style>
.sources-box {
margin-top: 25px;
padding: 12px 15px;
background: #f7f3ee;
border-left: 4px solid #3b2f2f;
font-size: 0.9rem;
color: #3b2f2f;
text-align: justify;
}
.sources-box ul {
list-style: none;
padding-left: 0;
}
.sources-box li {
margin-bottom: 10px;
}
.polaroid-container {
display: flex;
gap: 20px;
justify-content: center;
margin: 25px 0;
}
.polaroid {
background: white;
padding: 10px;
width: 160px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
border-radius: 4px;
text-align: center;
transform: rotate(-1deg);
}
.polaroid:nth-child(2) {
transform: rotate(2deg);
}
.polaroid img {
width: 100%;
border-radius: 2px;
}
.caption {
margin-top: 8px;
font-size: 0.8rem;
color: #3b2f2f;
font-style: italic;
}
.button-row {
margin-top: 25px;
text-align: center;
}
.button-row .vintage-btn {
margin: 0 8px;
}
</style>