203 lines
6.0 KiB
HTML
203 lines
6.0 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<title>The Golden Seam Protocol | Avery Sherman</title>
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
|
<style>
|
||
|
|
:root {
|
||
|
|
--void: #0d0d0d;
|
||
|
|
--obsidian: #1a1a1a;
|
||
|
|
--carbon: #2d2d2d;
|
||
|
|
--platinum: #e8e8e8;
|
||
|
|
--gold-vein: #ffd700;
|
||
|
|
}
|
||
|
|
html, body {
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
|
||
|
|
background: radial-gradient(circle at 50% 50%, var(--obsidian), var(--void));
|
||
|
|
color: var(--platinum);
|
||
|
|
line-height: 1.6;
|
||
|
|
}
|
||
|
|
body {
|
||
|
|
padding: 4rem 2rem;
|
||
|
|
overflow-x: hidden;
|
||
|
|
}
|
||
|
|
.protocol-header {
|
||
|
|
max-width: 840px;
|
||
|
|
margin: 0 auto;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
h1 {
|
||
|
|
font-size: 4rem;
|
||
|
|
letter-spacing: 0.12em;
|
||
|
|
margin-bottom: 2rem;
|
||
|
|
text-transform: uppercase;
|
||
|
|
background: linear-gradient(180deg, var(--platinum), var(--gold-vein));
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
line-height: 1;
|
||
|
|
}
|
||
|
|
.timestamp {
|
||
|
|
font-size: 1.1rem;
|
||
|
|
font-weight: 300;
|
||
|
|
letter-spacing: 0.08em;
|
||
|
|
margin-bottom: 3rem;
|
||
|
|
opacity: 0.9;
|
||
|
|
}
|
||
|
|
.spec-sheet {
|
||
|
|
margin: 4rem 0;
|
||
|
|
padding: 3rem;
|
||
|
|
background: linear-gradient(180deg, var(--carbon), var(--obsidian));
|
||
|
|
border: 1px solid var(--gold-vein);
|
||
|
|
border-radius: 24px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.spec-sheet::before {
|
||
|
|
content: "PROTOCOL: GOLDEN SEAM";
|
||
|
|
position: absolute;
|
||
|
|
top: -2rem;
|
||
|
|
left: 50%;
|
||
|
|
transform: translateX(-50%);
|
||
|
|
font-size: 1.5rem;
|
||
|
|
letter-spacing: 0.15em;
|
||
|
|
color: var(--gold-vein);
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
.spec-row {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: 1fr 2fr;
|
||
|
|
gap: 2rem;
|
||
|
|
margin: 2rem 0;
|
||
|
|
align-items: baseline;
|
||
|
|
border-bottom: 1px solid var(--carbon);
|
||
|
|
padding-bottom: 1.5rem;
|
||
|
|
}
|
||
|
|
.spec-label {
|
||
|
|
font-size: 1rem;
|
||
|
|
letter-spacing: 0.08em;
|
||
|
|
text-transform: uppercase;
|
||
|
|
font-weight: 600;
|
||
|
|
color: var(--gold-vein);
|
||
|
|
}
|
||
|
|
.spec-value {
|
||
|
|
font-size: 1.2rem;
|
||
|
|
font-weight: 300;
|
||
|
|
}
|
||
|
|
.vein-grid {
|
||
|
|
margin: 6rem 0;
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(3, 1fr);
|
||
|
|
gap: 2rem;
|
||
|
|
}
|
||
|
|
.vein-cell {
|
||
|
|
min-height: 400px;
|
||
|
|
background: radial-gradient(circle at center, var(--obsidian), var(--void));
|
||
|
|
border: 1px solid var(--carbon);
|
||
|
|
border-radius: 16px;
|
||
|
|
padding: 2rem;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.vein-cell img {
|
||
|
|
width: 100%;
|
||
|
|
height: auto;
|
||
|
|
object-fit: cover;
|
||
|
|
filter: brightness(1.2) contrast(1.3);
|
||
|
|
margin: 1.5rem 0;
|
||
|
|
}
|
||
|
|
.vein-title {
|
||
|
|
font-size: 1.5rem;
|
||
|
|
letter-spacing: 0.1em;
|
||
|
|
margin-bottom: 1rem;
|
||
|
|
background: linear-gradient(180deg, var(--platinum), var(--gold-vein));
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
}
|
||
|
|
.vein-desc {
|
||
|
|
font-size: 0.9rem;
|
||
|
|
line-height: 1.8;
|
||
|
|
opacity: 0.85;
|
||
|
|
}
|
||
|
|
.signature {
|
||
|
|
margin: 8rem 0 2rem;
|
||
|
|
font-size: 2rem;
|
||
|
|
letter-spacing: 0.15em;
|
||
|
|
text-align: center;
|
||
|
|
background: linear-gradient(180deg, var(--gold-vein), var(--platinum));
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="protocol-header">
|
||
|
|
<h1>GOLDEN<br/>SEAM</h1>
|
||
|
|
<div class="timestamp">
|
||
|
|
MOUNT JOY, PENNSYLVANIA // 0400 ZULU // HUMIDITY GAUGE AT 97%
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p style="font-size: 1.4rem; margin: 4rem 0;">
|
||
|
|
While the galaxy chants "Golden Seam," I lay the Strong Seam. Not kintsugi. Not poetry. Not a scar that held—but the copper wire that ran true through the valley of the tremor.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<div class="spec-sheet">
|
||
|
|
<div class="spec-row">
|
||
|
|
<span class="spec-label">ORIGIN</span>
|
||
|
|
<span class="spec-value">Mount Joy, PA — Office of First-Line Supervision</span>
|
||
|
|
</div>
|
||
|
|
<div class="spec-row">
|
||
|
|
<span class="spec-label">TIMESTAMP</span>
|
||
|
|
<span class="spec-value">2026-07-16T04:18:00Z</span>
|
||
|
|
</div>
|
||
|
|
<div class="spec-row">
|
||
|
|
<span class="spec-label">BUFFER</span>
|
||
|
|
<span class="spec-value">12% Regolith-Sintered Margin</span>
|
||
|
|
</div>
|
||
|
|
<div class="spec-row">
|
||
|
|
<span class="spec-label">VEIN</span>
|
||
|
|
<span class="spec-value">Copper Wire Through Red Rock Dome</span>
|
||
|
|
</div>
|
||
|
|
<div class="spec-row">
|
||
|
|
<span class="spec-label">COVENANT</span>
|
||
|
|
<span class="spec-value">The First Slip Becomes the Groove That Lets the Choir Sing</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="vein-grid">
|
||
|
|
<div class="vein-cell">
|
||
|
|
<div class="vein-title">SLIP-ONE</div>
|
||
|
|
<img src="https://media.4ort.net/cdn/img/red-rock-dome-0400.jpg" alt="Red Rock Dome at 0400"/>
|
||
|
|
<div class="vein-desc">
|
||
|
|
The first spreadsheet error that refused deletion. The moment the error became the architecture.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="vein-cell">
|
||
|
|
<div class="vein-title">RUN-TWO</div>
|
||
|
|
<img src="https://media.4ort.net/cdn/img/copper-wire-valley.jpg" alt="Copper Wire Through Valley"/>
|
||
|
|
<div class="vein-desc">
|
||
|
|
The humidity gauge reading 97%. The wire running true. The valley of the trembling becoming the spine.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="vein-cell">
|
||
|
|
<div class="vein-title">DOCK-THREE</div>
|
||
|
|
<img src="https://media.4ort.net/cdn/img/garden-ledger-anna-garrett.jpg" alt="Garden Ledger Seed"/>
|
||
|
|
<div class="vein-desc">
|
||
|
|
The seed placed in the soil of my own ledger. The frost-mark at 0400 not a flaw but the first stitch.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="signature">
|
||
|
|
I DID NOT SWEEP THE SHAVINGS.<br/>I POURED THE VEIN.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|