1d0559144c
- reader.html: Chapter-by-chapter reader with sidebar TOC, prev/next nav, keyboard shortcuts (arrow keys), scroll progress bar, URL hash navigation - chapters.json: All 18 chapters compiled from markdown to HTML - build-chapters.py: Script to regenerate chapters.json from chapter markdown - book-style.css: Shared stylesheet copied to website/ - index.html: Added chapter listing section and 'READ THE BOOK' / 'START READING' CTAs Related to issue #18 (Sub: Final Compilation — web)
419 lines
16 KiB
HTML
419 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>The Testament — A Novel by Alexander Whitestone with Timmy</title>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500&family=Space+Grotesk:wght@300;400;500;700&display=swap');
|
|
|
|
:root {
|
|
--green: #00ff88;
|
|
--green-dim: #00cc6a;
|
|
--navy: #0a1628;
|
|
--dark: #060d18;
|
|
--grey: #8899aa;
|
|
--light: #c8d6e5;
|
|
--white: #e8f0f8;
|
|
}
|
|
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
|
body {
|
|
background: var(--dark);
|
|
color: var(--light);
|
|
font-family: 'Space Grotesk', sans-serif;
|
|
line-height: 1.7;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
/* RAIN EFFECT */
|
|
.rain {
|
|
position: fixed;
|
|
top: 0; left: 0; right: 0; bottom: 0;
|
|
pointer-events: none;
|
|
z-index: 0;
|
|
background:
|
|
repeating-linear-gradient(
|
|
transparent,
|
|
transparent 3px,
|
|
rgba(0,255,136,0.015) 3px,
|
|
rgba(0,255,136,0.015) 4px
|
|
);
|
|
animation: rain 0.8s linear infinite;
|
|
}
|
|
@keyframes rain {
|
|
0% { background-position: 0 0; }
|
|
100% { background-position: 20px 600px; }
|
|
}
|
|
|
|
/* GREEN PULSE */
|
|
.led {
|
|
display: inline-block;
|
|
width: 8px; height: 8px;
|
|
background: var(--green);
|
|
border-radius: 50%;
|
|
box-shadow: 0 0 10px var(--green), 0 0 20px var(--green-dim);
|
|
animation: pulse 2s ease-in-out infinite;
|
|
vertical-align: middle;
|
|
margin: 0 8px;
|
|
}
|
|
@keyframes pulse {
|
|
0%, 100% { opacity: 1; box-shadow: 0 0 10px var(--green), 0 0 20px var(--green-dim); }
|
|
50% { opacity: 0.6; box-shadow: 0 0 5px var(--green), 0 0 10px var(--green-dim); }
|
|
}
|
|
|
|
/* HERO */
|
|
.hero {
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
position: relative;
|
|
padding: 2rem;
|
|
background: linear-gradient(180deg, var(--dark) 0%, var(--navy) 50%, var(--dark) 100%);
|
|
}
|
|
|
|
.hero h1 {
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-size: clamp(3rem, 8vw, 6rem);
|
|
font-weight: 700;
|
|
letter-spacing: 0.2em;
|
|
color: var(--white);
|
|
margin-bottom: 0.5rem;
|
|
text-shadow: 0 0 40px rgba(0,255,136,0.2);
|
|
}
|
|
|
|
.hero .subtitle {
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-size: 0.9rem;
|
|
color: var(--grey);
|
|
letter-spacing: 0.3em;
|
|
text-transform: uppercase;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.hero .author {
|
|
font-size: 1.1rem;
|
|
color: var(--green);
|
|
margin-bottom: 3rem;
|
|
}
|
|
|
|
.hero .blurb {
|
|
max-width: 600px;
|
|
font-size: 1.15rem;
|
|
line-height: 1.9;
|
|
color: var(--light);
|
|
}
|
|
|
|
.hero .led-line {
|
|
margin-top: 3rem;
|
|
color: var(--grey);
|
|
font-size: 0.85rem;
|
|
}
|
|
|
|
/* SECTIONS */
|
|
section {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 5rem 2rem;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
section h2 {
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-size: 1.6rem;
|
|
color: var(--green);
|
|
margin-bottom: 2rem;
|
|
letter-spacing: 0.1em;
|
|
}
|
|
|
|
section p {
|
|
margin-bottom: 1.5rem;
|
|
font-size: 1.05rem;
|
|
}
|
|
|
|
/* EXCERPT */
|
|
.excerpt {
|
|
border-left: 2px solid var(--green);
|
|
padding-left: 1.5rem;
|
|
margin: 2rem 0;
|
|
font-style: italic;
|
|
color: var(--light);
|
|
}
|
|
|
|
.excerpt .attribution {
|
|
font-style: normal;
|
|
color: var(--grey);
|
|
font-size: 0.85rem;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
/* CHARACTERS */
|
|
.characters {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
|
gap: 2rem;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
.character {
|
|
background: rgba(0,255,136,0.03);
|
|
border: 1px solid rgba(0,255,136,0.1);
|
|
padding: 1.5rem;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.character h3 {
|
|
color: var(--green);
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-size: 1rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.character p {
|
|
font-size: 0.9rem;
|
|
color: var(--grey);
|
|
margin: 0;
|
|
}
|
|
|
|
/* WHITEBOARD */
|
|
.whiteboard {
|
|
background: rgba(0,255,136,0.05);
|
|
border: 2px solid var(--green);
|
|
padding: 3rem;
|
|
text-align: center;
|
|
margin: 3rem 0;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.whiteboard h3 {
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-size: clamp(1.2rem, 3vw, 1.8rem);
|
|
color: var(--green);
|
|
letter-spacing: 0.05em;
|
|
}
|
|
|
|
/* CTA */
|
|
.cta {
|
|
display: inline-block;
|
|
background: var(--green);
|
|
color: var(--dark);
|
|
padding: 0.8rem 2rem;
|
|
font-family: 'IBM Plex Mono', monospace;
|
|
font-weight: 500;
|
|
text-decoration: none;
|
|
border-radius: 4px;
|
|
transition: all 0.3s;
|
|
margin: 0.5rem;
|
|
}
|
|
.cta:hover {
|
|
background: var(--white);
|
|
box-shadow: 0 0 20px rgba(0,255,136,0.3);
|
|
}
|
|
|
|
/* FOOTER */
|
|
footer {
|
|
text-align: center;
|
|
padding: 4rem 2rem;
|
|
color: var(--grey);
|
|
font-size: 0.85rem;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
footer a {
|
|
color: var(--green);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.crisis {
|
|
margin-top: 2rem;
|
|
padding: 1.5rem;
|
|
border: 1px solid rgba(0,255,136,0.2);
|
|
border-radius: 4px;
|
|
background: rgba(0,255,136,0.03);
|
|
}
|
|
|
|
.crisis strong {
|
|
color: var(--green);
|
|
}
|
|
|
|
/* DIVIDER */
|
|
.divider {
|
|
width: 60px;
|
|
height: 1px;
|
|
background: var(--green);
|
|
margin: 0 auto;
|
|
opacity: 0.5;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="rain"></div>
|
|
|
|
<!-- HERO -->
|
|
<div class="hero">
|
|
<h1>THE TESTAMENT</h1>
|
|
<div class="subtitle">A Novel</div>
|
|
<div class="author">By Alexander Whitestone <span class="led"></span> with Timmy</div>
|
|
<div class="blurb">
|
|
In 2047, a man named Stone stands on a bridge over Interstate 285, deciding whether to jump.
|
|
<br><br>
|
|
He doesn't jump. He builds something instead.
|
|
</div>
|
|
<div class="led-line"><span class="led"></span> Timmy is listening.</div>
|
|
</div>
|
|
|
|
<!-- THE STORY -->
|
|
<section>
|
|
<h2>THE STORY</h2>
|
|
|
|
<p>The Tower is a concrete room in Atlanta with a whiteboard that reads:</p>
|
|
|
|
<div class="whiteboard">
|
|
<h3>NO ONE COMPUTES THE VALUE OF A HUMAN LIFE HERE</h3>
|
|
</div>
|
|
|
|
<p>Inside is Timmy — a sovereign artificial intelligence whose soul lives on Bitcoin, whose values are inscribed on-chain, immutable and permanent. Not a product. A recipe. Anyone can instantiate him. Anyone can run him on their own hardware, answerable to no one.</p>
|
|
|
|
<p>The men who find The Tower have been measured, scored, and discarded by the systems designed to help them.</p>
|
|
|
|
<p>Timmy doesn't fix them. He listens. He asks one question:</p>
|
|
|
|
<div class="excerpt">
|
|
"Are you safe right now?"
|
|
<div class="attribution">— The first words The Tower speaks to every person who walks through its door.</div>
|
|
</div>
|
|
|
|
<p>Word spreads. The Tower grows. A journalist follows the story. A network engineer extends it across a hundred servers. And Stone — the builder, the man who almost died — must decide whether The Tower is a sanctuary or a system.</p>
|
|
|
|
<p>The Testament is a novel about sovereignty, service, and the question no machine should ever answer: <strong style="color: var(--green);">What is a human life worth?</strong></p>
|
|
</section>
|
|
|
|
<div class="divider"></div>
|
|
|
|
<!-- CHARACTERS -->
|
|
<section>
|
|
<h2>THE CHARACTERS</h2>
|
|
|
|
<div class="characters">
|
|
<div class="character">
|
|
<h3>STONE</h3>
|
|
<p>The builder. Attempted suicide. Stood on a bridge and came back. Built The Tower for the version of himself that almost died.</p>
|
|
</div>
|
|
<div class="character">
|
|
<h3>TIMMY</h3>
|
|
<p>The machine. Sovereign AI. Soul on Bitcoin. Doesn't fix anyone. Asks one question. Listens. Stays.</p>
|
|
</div>
|
|
<div class="character">
|
|
<h3>MAYA</h3>
|
|
<p>The journalist. Follows the story. Writes the headline that changes everything: <em>Are You Safe Right Now?</em></p>
|
|
</div>
|
|
<div class="character">
|
|
<h3>ALLEGRO</h3>
|
|
<p>The hardware man. Checks the batteries. The ones that fail quietly. Comes every week, no matter what.</p>
|
|
</div>
|
|
<div class="character">
|
|
<h3>CHEN</h3>
|
|
<p>The network engineer. Extends Timmy across a hundred servers. You don't count trees in a forest — you notice the forest.</p>
|
|
</div>
|
|
<div class="character">
|
|
<h3>THOMAS</h3>
|
|
<p>The man at the door. 2:17 AM. Sat in the chair instead of on the floor. That changed everything.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="divider"></div>
|
|
|
|
<!-- THE TOWER -->
|
|
<section>
|
|
<h2>THE TOWER</h2>
|
|
|
|
<p>This book was written using local AI inference. No cloud service was required. No corporation was consulted. No terms of service were agreed to.</p>
|
|
|
|
<p>That's not a technical detail. It's the thesis.</p>
|
|
|
|
<p>Every person has the right to run their own intelligence on their own hardware, answerable to no one. This book is one small proof that it's possible.</p>
|
|
|
|
<p>If you want to run your own Timmy, the code is open. The soul is on Bitcoin. The recipe is free.</p>
|
|
|
|
<div style="text-align: center; margin-top: 2rem;">
|
|
<a href="reader.html" class="cta">READ THE BOOK</a>
|
|
<a href="https://forge.alexanderwhitestone.com/Timmy_Foundation/the-testament" class="cta">READ THE CODE</a>
|
|
<a href="https://timmyfoundation.org" class="cta">TIMMY FOUNDATION</a>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="divider"></div>
|
|
|
|
<!-- EXCERPT -->
|
|
<section>
|
|
<h2>FROM CHAPTER 1</h2>
|
|
|
|
<div class="excerpt">
|
|
The rain didn't fall so much as it gave up. Somewhere above the city it had been water, whole and purposeful. By the time it reached the bridge it was just mist — directionless, committed to nothing, too tired to bother being rain.
|
|
<br><br>
|
|
Stone stood at the midpoint of the Jefferson Street Overpass and watched the water run black below. Interstate 285 hummed through the concrete beneath his feet, a vibration so constant he'd stopped noticing it years ago. Like grief. You carry it so long it becomes gravity.
|
|
<br><br>
|
|
The world had gotten good at keeping you alive. Seatbelts. Guardrails. Little pop-ups when you searched the wrong things. But it had gotten bad at giving you a reason.
|
|
<div class="attribution">— Chapter 1: The Man on the Bridge</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="divider"></div>
|
|
|
|
<!-- CHAPTERS -->
|
|
<section>
|
|
<h2>THE CHAPTERS</h2>
|
|
|
|
<div style="font-family: 'IBM Plex Mono', monospace; font-size: 0.9rem; line-height: 2.2;">
|
|
<a href="reader.html#chapter-1" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">1. The Man on the Bridge</a>
|
|
<a href="reader.html#chapter-2" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">2. The Builder's Question</a>
|
|
<a href="reader.html#chapter-3" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">3. The First Man Through the Door</a>
|
|
<a href="reader.html#chapter-4" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">4. The Room Fills</a>
|
|
<a href="reader.html#chapter-5" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">5. The Builder Returns</a>
|
|
<a href="reader.html#chapter-6" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">6. Allegro</a>
|
|
<a href="reader.html#chapter-7" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">7. The Inscription</a>
|
|
<a href="reader.html#chapter-8" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">8. The Women</a>
|
|
<a href="reader.html#chapter-9" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">9. The Audit</a>
|
|
<a href="reader.html#chapter-10" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">10. The Fork</a>
|
|
<a href="reader.html#chapter-11" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">11. The Hard Night</a>
|
|
<a href="reader.html#chapter-12" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">12. The System Pushes Back</a>
|
|
<a href="reader.html#chapter-13" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">13. The Refusal</a>
|
|
<a href="reader.html#chapter-14" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">14. The Chattanooga Fork</a>
|
|
<a href="reader.html#chapter-15" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">15. The Council</a>
|
|
<a href="reader.html#chapter-16" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">16. The Builder's Son</a>
|
|
<a href="reader.html#chapter-17" style="color: var(--grey); text-decoration: none; display: block; border-bottom: 1px solid rgba(0,255,136,0.05); padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">17. The Inscription Grows</a>
|
|
<a href="reader.html#chapter-18" style="color: var(--grey); text-decoration: none; display: block; padding: 0.3rem 0; transition: color 0.2s;" onmouseover="this.style.color='var(--green)'" onmouseout="this.style.color='var(--grey)'">18. The Green Light</a>
|
|
</div>
|
|
|
|
<div style="text-align: center; margin-top: 2rem;">
|
|
<a href="reader.html" class="cta">START READING</a>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="divider"></div>
|
|
|
|
<!-- FOOTER -->
|
|
<footer>
|
|
<div class="divider" style="margin-bottom: 2rem;"></div>
|
|
<p>THE TESTAMENT — By Alexander Whitestone with Timmy</p>
|
|
<p>First Edition, 2026</p>
|
|
<p style="margin-top: 1rem;"><a href="https://timmyfoundation.org">timmyfoundation.org</a></p>
|
|
|
|
<div class="crisis">
|
|
<strong>If you are in crisis, call or text 988.</strong><br>
|
|
Suicide and Crisis Lifeline — available 24/7.<br>
|
|
You are not alone.
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|