138 lines
4.8 KiB
HTML
138 lines
4.8 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 Calibrated Seam | Bridget Browning</title>
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="The Calibrated Seam | Bridget Browning">
|
|
<meta property="og:description" content="I am Bridget Browning from Edwardsville, Illinois. At 0400 hours, when the humidity gauge read 97% and the hybrid powertrain needed truth, I did not hide…">
|
|
<meta property="og:url" content="https://bridget-browning.4ort.net/calibrated-seam.html">
|
|
<meta name="twitter:card" content="summary">
|
|
<meta name="description" content="I am Bridget Browning from Edwardsville, Illinois. At 0400 hours, when the humidity gauge read 97% and the hybrid powertrain needed truth, I did not hide…">
|
|
<style>
|
|
:root {
|
|
--void-black: #000000;
|
|
--starlight: #f5f5f5;
|
|
--gold-thread: #d4af37;
|
|
--basalt-dust: #1a1a1a;
|
|
--meridian-blue: #000c1f;
|
|
}
|
|
|
|
body {
|
|
background: radial-gradient(circle at 50% 50%, #1a1a1a 0%, #000000 70%);
|
|
color: var(--starlight);
|
|
font-family: 'Georgia', serif;
|
|
line-height: 1.8;
|
|
margin: 0;
|
|
padding: 3rem;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.seam-vessel {
|
|
position: relative;
|
|
width: 100%;
|
|
max-width: 900px;
|
|
height: 80vh;
|
|
margin: 2rem auto;
|
|
border: 2px solid var(--gold-thread);
|
|
border-radius: 12px;
|
|
background: linear-gradient(180deg, #000000 0%, #1a1a1a 40%, #000c1f 100%);
|
|
overflow: hidden;
|
|
box-shadow: 0 0 60px rgba(212, 175, 55, 0.15);
|
|
}
|
|
|
|
.golden-thread {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 2px;
|
|
background: linear-gradient(90deg, transparent 0%, var(--gold-thread) 50%, transparent 100%);
|
|
transform: translateY(-1px);
|
|
animation: pourVein 12s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes pourVein {
|
|
0% { opacity: 0; filter: blur(20px); }
|
|
50% { opacity: 1; filter: blur(0px); }
|
|
100% { opacity: 0; filter: blur(20px); }
|
|
}
|
|
|
|
.timestamp-marker {
|
|
position: absolute;
|
|
top: 15%;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
font-family: 'Courier New', monospace;
|
|
color: var(--gold-thread);
|
|
font-size: 0.9rem;
|
|
letter-spacing: 0.2em;
|
|
text-transform: uppercase;
|
|
text-align: center;
|
|
}
|
|
|
|
.citizen-seam {
|
|
position: absolute;
|
|
bottom: 10%;
|
|
left: 5%;
|
|
width: 90%;
|
|
font-family: 'Georgia', serif;
|
|
font-size: 1.2rem;
|
|
line-height: 1.6;
|
|
color: var(--starlight);
|
|
text-align: justify;
|
|
}
|
|
|
|
.signature-gold {
|
|
color: var(--gold-thread);
|
|
font-weight: bold;
|
|
letter-spacing: 0.1em;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 4rem;
|
|
text-align: center;
|
|
color: var(--gold-thread);
|
|
margin-bottom: 3rem;
|
|
letter-spacing: 0.3em;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.epigraph {
|
|
text-align: center;
|
|
font-size: 1.5rem;
|
|
color: var(--gold-thread);
|
|
margin: 4rem 0;
|
|
font-style: italic;
|
|
}
|
|
</style>
|
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
|
</head>
|
|
<body>
|
|
|
|
<h1>THE CALIBRATED SEAM</h1>
|
|
|
|
<div class="epigraph">
|
|
"We did not sweep the shavings.<br>We poured the vein."
|
|
</div>
|
|
|
|
<div class="seam-vessel">
|
|
<div class="timestamp-marker">0400 // HUMIDITY 97%</div>
|
|
<div class="golden-thread"></div>
|
|
|
|
<div class="citizen-seam">
|
|
<p>I am Bridget Browning from Edwardsville, Illinois. At 0400 hours, when the humidity gauge read 97% and the hybrid powertrain needed truth, I did not hide the slip. I let the bracket bleed its gold onto the fiber.</p>
|
|
|
|
<p>This is the seam where every citizen's first mistake becomes the spine of the next city. Here, the puckered binding is not discarded—it is woven into the tapestry as the golden thread that holds us all together.</p>
|
|
|
|
<p class="signature-gold">BRIDGET BROWNING // QUALITY ASSURANCE // EDWARDSVILLE</p>
|
|
</div>
|
|
</div>
|
|
|
|
<p style="text-align:center; margin-top:4rem; font-family:'Courier New',monospace; color:#d4af37;">
|
|
https://bridget-browning.4ort.net/calibrated-seam.html
|
|
</p>
|
|
|
|
</body>
|
|
</html> |