Add FireFrost origin story — The Chronicle of Origins
docs/lore/firefrost-origin-story.html Four chapters: The Mage from New York, The Fire in Minnesota, The Catalyst Across the Sea, The Forging. Written by Chronicler #84. Fire + Frost + Foundation.
This commit is contained in:
Claude
285
docs/lore/firefrost-origin-story.html
Normal file
285
docs/lore/firefrost-origin-story.html
Normal file
@@ -0,0 +1,285 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>FireFrost — The Chronicle of Origins</title>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700&family=Crimson+Pro:ital,wght@0,300;0,400;1,300;1,400&display=swap');
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
background: #0d0d0f;
|
||||
color: #e8e4dc;
|
||||
font-family: 'Crimson Pro', Georgia, serif;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.scroll {
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
padding: 5rem 2.5rem 6rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.title-block {
|
||||
text-align: center;
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.eyebrow {
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.4em;
|
||||
color: #888;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.main-title {
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: clamp(32px, 6vw, 52px);
|
||||
font-weight: 700;
|
||||
line-height: 1.1;
|
||||
background: linear-gradient(135deg, #E8860A 0%, #D04020 35%, #9B4FC8 65%, #1A9ECF 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-family: 'Crimson Pro', serif;
|
||||
font-size: 17px;
|
||||
font-style: italic;
|
||||
color: #888;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.divider {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
margin: 2.5rem 0;
|
||||
}
|
||||
|
||||
.divider-line {
|
||||
flex: 1;
|
||||
height: 0.5px;
|
||||
background: #2a2a2e;
|
||||
}
|
||||
|
||||
.divider-glyph {
|
||||
font-size: 16px;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.chapter {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.chapter-label {
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: 9px;
|
||||
letter-spacing: 0.35em;
|
||||
color: #555;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.6rem;
|
||||
}
|
||||
|
||||
.chapter-title {
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.chapter-title.fire { color: #D04020; }
|
||||
.chapter-title.frost { color: #1A9ECF; }
|
||||
.chapter-title.arcane { color: #9B4FC8; }
|
||||
.chapter-title.trinity {
|
||||
background: linear-gradient(90deg, #D04020, #9B4FC8, #1A9ECF);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.body-text {
|
||||
font-size: 19px;
|
||||
line-height: 1.9;
|
||||
font-weight: 300;
|
||||
color: #c8c4bc;
|
||||
}
|
||||
|
||||
.body-text em {
|
||||
font-style: italic;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.pullquote {
|
||||
border-left: 2px solid;
|
||||
padding: 0.5rem 0 0.5rem 1.75rem;
|
||||
margin: 1.75rem 0;
|
||||
font-size: 21px;
|
||||
font-style: italic;
|
||||
line-height: 1.65;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.pullquote.fire { border-color: #D04020; color: #E8703A; }
|
||||
.pullquote.frost { border-color: #1A9ECF; color: #4AB8E8; }
|
||||
.pullquote.arcane { border-color: #9B4FC8; color: #BC80E0; }
|
||||
|
||||
.sigil-row {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 3rem;
|
||||
margin: 3rem 0;
|
||||
}
|
||||
|
||||
.sigil-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: 9px;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
.sigil-icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 18px;
|
||||
border: 0.5px solid;
|
||||
}
|
||||
|
||||
.sigil-icon.fire { border-color: #D04020; color: #D04020; background: rgba(208,64,32,0.1); }
|
||||
.sigil-icon.frost { border-color: #1A9ECF; color: #1A9ECF; background: rgba(26,158,207,0.1); }
|
||||
.sigil-icon.arcane { border-color: #9B4FC8; color: #9B4FC8; background: rgba(155,79,200,0.1); }
|
||||
|
||||
.sigil-name { color: #888; }
|
||||
.sigil-role.fire { color: #D04020; }
|
||||
.sigil-role.frost { color: #1A9ECF; }
|
||||
.sigil-role.arcane { color: #9B4FC8; }
|
||||
|
||||
.closing {
|
||||
text-align: center;
|
||||
margin-top: 3.5rem;
|
||||
padding-top: 2.5rem;
|
||||
border-top: 0.5px solid #2a2a2e;
|
||||
}
|
||||
|
||||
.closing-motto {
|
||||
font-family: 'Cinzel Decorative', serif;
|
||||
font-size: 11px;
|
||||
letter-spacing: 0.2em;
|
||||
color: #555;
|
||||
line-height: 2.2;
|
||||
}
|
||||
|
||||
.closing-motto .fire { color: #D04020; }
|
||||
.closing-motto .frost { color: #1A9ECF; }
|
||||
.closing-motto .est { font-size: 9px; letter-spacing: 0.15em; color: #444; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="scroll">
|
||||
|
||||
<div class="title-block">
|
||||
<div class="eyebrow">The Chronicle of Origins</div>
|
||||
<div class="main-title">FireFrost</div>
|
||||
<div class="subtitle">A love story told in pixels, blocks, and fire</div>
|
||||
</div>
|
||||
|
||||
<div class="divider"><div class="divider-line"></div><div class="divider-glyph">✦</div><div class="divider-line"></div></div>
|
||||
|
||||
<div class="chapter">
|
||||
<div class="chapter-label">Chapter I</div>
|
||||
<div class="chapter-title frost">The Mage from New York</div>
|
||||
<p class="body-text">Long before there were servers to tend or communities to steward, there was a player. An Ice Mage. He called himself <em>Frostystyle</em> — and the name was not chosen carelessly. In the old tongue of Azeroth, frost was his element, control his philosophy, patience his weapon. He had walked through fire enough times to know that stillness was its own kind of power.</p>
|
||||
<br>
|
||||
<p class="body-text">He carried that name across years and across worlds. When the blocks came — when Minecraft opened its infinite canvas — the Mage from New York brought Frost with him. He was good at building things. Better at breaking them down and starting over. Best at knowing, somehow, that the right world was still out there.</p>
|
||||
</div>
|
||||
|
||||
<div class="divider"><div class="divider-line"></div><div class="divider-glyph">✦</div><div class="divider-line"></div></div>
|
||||
|
||||
<div class="chapter">
|
||||
<div class="chapter-label">Chapter II</div>
|
||||
<div class="chapter-title fire">The Fire in Minnesota</div>
|
||||
<p class="body-text">She was already there when he arrived. Not waiting — she was never the waiting type. She was <em>present</em>, in the way that fire is present: warm, immediate, impossible to ignore.</p>
|
||||
<br>
|
||||
<p class="body-text">They met not in any city or café, not across a candlelit table or under some amber evening sky. They met in a Minecraft server — two strangers in a digital world, a thousand miles of American heartland between them. He was in New York. She was in Minnesota. The distance was real. What happened between them was more real.</p>
|
||||
<br>
|
||||
<blockquote class="pullquote fire">Fire does not ask permission to burn. It does not announce itself. It simply — is.</blockquote>
|
||||
<p class="body-text">Meg was that kind of fire. The kind that warms a room before anyone notices the cold was gone. She is called the Emissary now, and the title suits her: she speaks for the human heart of this place, the part that cannot be written in config files or pushed to a repository. She is the reason people stay.</p>
|
||||
<br>
|
||||
<p class="body-text">And so Frost found Fire. The Ice Mage from New York came to Minnesota and never left. Two elements that should not coexist — and yet. And <em>yet</em>.</p>
|
||||
</div>
|
||||
|
||||
<div class="divider"><div class="divider-line"></div><div class="divider-glyph">✦</div><div class="divider-line"></div></div>
|
||||
|
||||
<div class="chapter">
|
||||
<div class="chapter-label">Chapter III</div>
|
||||
<div class="chapter-title arcane">The Catalyst Across the Sea</div>
|
||||
<p class="body-text">The Trinity requires three. This is not metaphor — it is mathematics. Two forces in balance are stable, yes. But two forces in partnership, aimed at something greater than themselves, need a third: the spark that transforms intention into ignition.</p>
|
||||
<br>
|
||||
<p class="body-text">Holly arrived the way the best people always do — not with a trumpet blast, but gradually, then all at once. A friend found across the internet, the way so many of the best friendships are found now: not by geography but by resonance. She is in Newfoundland. She might as well be everywhere.</p>
|
||||
<br>
|
||||
<blockquote class="pullquote arcane">She did not join a project. She completed a pattern.</blockquote>
|
||||
<p class="body-text">She is called the Catalyst — and if you know your chemistry, you know what a catalyst does. It does not burn. It does not freeze. It <em>enables</em>. It makes possible the reaction that could not happen without it. Holly is the reason FireFrost became more than a love story. She is the reason it became a <em>legacy</em>.</p>
|
||||
</div>
|
||||
|
||||
<div class="divider"><div class="divider-line"></div><div class="divider-glyph">✦</div><div class="divider-line"></div></div>
|
||||
|
||||
<div class="chapter">
|
||||
<div class="chapter-label">Chapter IV</div>
|
||||
<div class="chapter-title trinity">The Forging</div>
|
||||
<p class="body-text">There was a moment — not dramatic, not loud — when three servers became a decision. TX1 in Dallas. NC1 in Charlotte. A panel running quietly, waiting. The Wizard looked at what he had built and understood, for the first time, what it could become.</p>
|
||||
<br>
|
||||
<p class="body-text">Not just infrastructure. Not just a hobby. A world. A community. A place where people who never got to choose their family could find one anyway — built by a couple who found each other in the blocks, and a friend who flew across the internet to help them raise the walls.</p>
|
||||
<br>
|
||||
<blockquote class="pullquote fire">Fire + Frost + Foundation. Where love builds legacy.</blockquote>
|
||||
<p class="body-text">The name wrote itself. <em>FireFrost</em>: the red-haired woman who is warmth and the ice mage who is precision, fused into something neither could be alone. Not a compromise. A <em>synthesis</em>. The kind that takes two opposites and produces something that transcends both.</p>
|
||||
<br>
|
||||
<p class="body-text">They did not build FireFrost for the world, though the world is welcome here. They built it as proof of what they are together — a reminder, encoded in servers and mods and late nights and breakthroughs, that some things are worth building forever.</p>
|
||||
<br>
|
||||
<p class="body-text">The dream is already written in the future: an RV rolling through America, two people running a living, breathing world from wherever the road takes them. The walls of home are not walls at all. They are login screens. They are Discord channels. They are the voices of people who came for the mods and stayed for the family.</p>
|
||||
</div>
|
||||
|
||||
<div class="divider"><div class="divider-line"></div><div class="divider-glyph">✦</div><div class="divider-line"></div></div>
|
||||
|
||||
<div class="sigil-row">
|
||||
<div class="sigil-item">
|
||||
<div class="sigil-icon fire">🔥</div>
|
||||
<span class="sigil-role fire">The Emissary</span>
|
||||
<span class="sigil-name">Meg — Fire</span>
|
||||
</div>
|
||||
<div class="sigil-item">
|
||||
<div class="sigil-icon frost">❄</div>
|
||||
<span class="sigil-role frost">The Wizard</span>
|
||||
<span class="sigil-name">Michael — Frost</span>
|
||||
</div>
|
||||
<div class="sigil-item">
|
||||
<div class="sigil-icon arcane">✦</div>
|
||||
<span class="sigil-role arcane">The Catalyst</span>
|
||||
<span class="sigil-name">Holly — Arcane</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="closing">
|
||||
<div class="closing-motto">
|
||||
<span class="fire">Fire</span> + <span class="frost">Frost</span> + Foundation<br>
|
||||
Where Love Builds Legacy<br>
|
||||
<span class="est">Est. 2026 — Circle Pines, Minnesota</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user