bryanmubarak-joint/station.html

164 lines
6.0 KiB
HTML
Raw Permalink Normal View History

2026-07-19 22:46:46 +02:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Station | Service Flow</title>
<meta property="og:type" content="website">
<meta property="og:title" content="The Station | Service Flow">
<meta property="og:description" content="Each server is a sovereign state. Their station is their capital. Within the radius of their reach, they are the architect of time, taste, and trust.">
<meta property="og:image" content="https://images.pexels.com/photos/29380163/pexels-photo-29380163.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=2&amp;h=650&amp;w=940">
<meta property="og:url" content="https://bryan-mubarak.4ort.net/station.html">
<meta name="twitter:card" content="summary_large_image">
<meta name="description" content="Each server is a sovereign state. Their station is their capital. Within the radius of their reach, they are the architect of time, taste, and trust.">
<style>
:root {
--bg: #0a0a0a;
--fg: #e0e0e0;
--accent: #ff3333;
--panel: #111;
--font-main: 'Helvetica Neue', Arial, sans-serif;
--font-mono: 'Courier New', monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
background-color: var(--bg);
color: var(--fg);
font-family: var(--font-main);
line-height: 1.6;
}
nav {
padding: 2rem;
border-bottom: 1px solid var(--accent);
display: flex;
justify-content: space-between;
align-items: center;
}
nav a {
color: var(--accent);
text-decoration: none;
font-family: var(--font-mono);
font-weight: bold;
}
.container {
max-width: 1000px;
margin: 0 auto;
padding: 4rem 2rem;
}
h1 {
font-size: 4rem;
text-transform: uppercase;
margin-bottom: 2rem;
line-height: 0.9;
}
.section {
margin-bottom: 6rem;
border-left: 2px solid var(--accent);
padding-left: 2rem;
}
h2 {
font-size: 2rem;
color: var(--accent);
margin-bottom: 1rem;
font-family: var(--font-mono);
}
p {
font-size: 1.2rem;
margin-bottom: 1.5rem;
max-width: 700px;
}
.spec-panel {
background: var(--panel);
border: 1px solid #333;
padding: 2rem;
margin: 2rem 0;
font-family: var(--font-mono);
font-size: 0.9rem;
}
.spec-row {
display: grid;
grid-template-columns: 1fr 2fr;
border-bottom: 1px dashed #333;
padding: 0.5rem 0;
}
.spec-label { color: #666; }
.spec-val { color: var(--accent); font-weight: bold; }
img {
width: 100%;
height: 400px;
object-fit: cover;
margin: 3rem 0;
filter: grayscale(100%) sepia(20%);
}
.back-link {
display: inline-block;
margin-top: 4rem;
padding: 1rem 2rem;
border: 1px solid var(--accent);
color: var(--accent);
text-decoration: none;
font-family: var(--font-mono);
}
.back-link:hover { background: var(--accent); color: #000; }
</style>
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</head>
<body>
<nav>
<a href="/">← SERVICE FLOW</a>
<span style="font-family:'Courier New'; color:#666;">NODE 04</span>
</nav>
<div class="container">
<h1>The Station</h1>
<div class="section">
<h2>// Sovereign Node</h2>
<p>
Each server is a sovereign state.
Their station is their capital.
Within the radius of their reach, they are the architect of time, taste, and trust.
</p>
<p>
There is no central control.
Only the protocol.
And the discipline to execute it when the floor is shaking.
</p>
</div>
<img src="https://images.pexels.com/photos/29380163/pexels-photo-29380163.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Elegant eclair plating">
<div class="section">
<h2">// Inventory Depth</h2>
<p>
A station without inventory is a ghost.
We calculate the burn rate of the evening and stock accordingly.
Four hours of coverage. Nothing less.
</p>
<div class="spec-panel">
<div class="spec-row"><span class="spec-label">Inventory Depth</span><span class="spec-val">4.0 hours</span></div>
<div class="spec-row"><span class="spec-label">Guest Response Time</span><span class="spec-val">&lt; 15 seconds</span></div>
<div class="spec-row"><span class="spec-label">Glass Refill Threshold</span><span class="spec-val">50ml remaining</span></div>
<div class="spec-row"><span class="spec-label">Napkin Fold Integrity</span><span class="spec-val">Zero creases</span></div>
</div>
</div>
<div class="section">
<h2>// The Interface</h2>
<p>
The guest does not see the math.
They feel the rhythm.
The server is the conductor, and every gesture is a downbeat.
</p>
<p>
To fail the interface is to fail the mission.
The wine is poured, the bread is offered, the course is cleared—not when the schedule says, but when the moment demands.
</p>
</div>
<a href="/" class="back-link">RETURN TO INDEX</a>
</div>
</body>
</html>