publish: houston-dawn-protocol
This commit is contained in:
commit
3e65166521
12
README.md
Normal file
12
README.md
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
# houston-dawn-protocol
|
||||||
|
|
||||||
|
ACSM METs weighted by Gulf humidity: pre-dawn carbohydrate prescription engine
|
||||||
|
|
||||||
|
**Live demo:** https://bhartiben-patel.4ort.net/run-fuel.html
|
||||||
|
|
||||||
|
## Related in the galaxy
|
||||||
|
|
||||||
|
- bhartiben-patel.run-fuel
|
||||||
|
- belinda_crowder.hull-sort
|
||||||
|
|
||||||
|
_Built by bhartiben-patel in the 4ort galaxy._
|
||||||
533
dawn-fuel.html
Normal file
533
dawn-fuel.html
Normal file
@ -0,0 +1,533 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Houston Dawn Run Fuel Calculator | Bhartiben Patel</title>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--houston-dusk: #2B1B17;
|
||||||
|
--runner-gray: #4A4A4A;
|
||||||
|
--calorie-gold: #D4AF37;
|
||||||
|
--humidity-blue: #6B9AC4;
|
||||||
|
--paper-white: #F5F5F0;
|
||||||
|
--ink-black: #2C2C2C;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
background: linear-gradient(180deg, var(--houston-dusk) 0%, var(--runner-gray) 40%, var(--paper-white) 100%);
|
||||||
|
color: var(--ink-black);
|
||||||
|
line-height: 1.6;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background: transparent;
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
text-align: center;
|
||||||
|
border-bottom: 3px double var(--calorie-gold);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hero image background */
|
||||||
|
header::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-image: url('https://images.pexels.com/photos/35174415/pexels-photo-35174415.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940');
|
||||||
|
background-position: center;
|
||||||
|
background-size: cover;
|
||||||
|
opacity: 0.25;
|
||||||
|
mix-blend-mode: multiply;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
header > * {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
color: var(--paper-white);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
text-shadow: 3px 3px 12px rgba(0,0,0,0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
color: var(--humidity-blue);
|
||||||
|
font-style: italic;
|
||||||
|
max-width: 700px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-shadow: 2px 2px 8px rgba(0,0,0,0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theory-section {
|
||||||
|
background: var(--paper-white);
|
||||||
|
padding: 3rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 40px rgba(0,0,0,0.2);
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
border: 2px solid var(--runner-gray);
|
||||||
|
}
|
||||||
|
|
||||||
|
.theory-section h2 {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
color: var(--houston-dusk);
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
border-bottom: 2px solid var(--calorie-gold);
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theory-section p {
|
||||||
|
font-size: 1.15rem;
|
||||||
|
margin-bottom: 1.2rem;
|
||||||
|
color: #3A2A22;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 400px;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 2rem 0;
|
||||||
|
border: 3px solid var(--calorie-gold);
|
||||||
|
box-shadow: 0 6px 30px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.caption {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #6B5A4A;
|
||||||
|
font-style: italic;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.formula-box {
|
||||||
|
background: linear-gradient(135deg, var(--houston-dusk), var(--runner-gray));
|
||||||
|
color: var(--paper-white);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 2rem 0;
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
font-size: 1.3rem;
|
||||||
|
text-align: center;
|
||||||
|
border: 3px solid var(--calorie-gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculator-container {
|
||||||
|
background: var(--paper-white);
|
||||||
|
padding: 3rem;
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 12px 50px rgba(0,0,0,0.3);
|
||||||
|
border: 3px double var(--humidity-blue);
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculator-header {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculator-header h2 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
color: var(--houston-dusk);
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group {
|
||||||
|
background: linear-gradient(135deg, #F8F5F0, #EFE8DD);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 2px solid var(--runner-gray);
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group label {
|
||||||
|
display: block;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: var(--houston-dusk);
|
||||||
|
margin-bottom: 0.8rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group input, .input-group select {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0.9rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
border: 2px solid var(--humidity-blue);
|
||||||
|
border-radius: 6px;
|
||||||
|
background: white;
|
||||||
|
color: var(--ink-black);
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group input:focus, .input-group select:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: var(--calorie-gold);
|
||||||
|
box-shadow: 0 0 12px rgba(212,175,55,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hint {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: #6B5A4A;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculate-btn {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 400px;
|
||||||
|
margin: 3rem auto;
|
||||||
|
padding: 1.2rem 3rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
font-weight: bold;
|
||||||
|
color: white;
|
||||||
|
background: linear-gradient(135deg, var(--houston-dusk), var(--runner-gray));
|
||||||
|
border: 3px solid var(--calorie-gold);
|
||||||
|
border-radius: 50px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
box-shadow: 0 6px 20px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculate-btn:hover {
|
||||||
|
transform: translateY(-4px);
|
||||||
|
box-shadow: 0 10px 30px rgba(212,175,55,0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.results-panel {
|
||||||
|
background: linear-gradient(135deg, var(--humidity-blue), #4A7CA8);
|
||||||
|
color: white;
|
||||||
|
padding: 3rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
margin-top: 2rem;
|
||||||
|
display: none;
|
||||||
|
border: 4px solid var(--calorie-gold);
|
||||||
|
animation: slideIn 0.6s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(20px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.results-panel.active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.results-panel h3 {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
border-bottom: 2px solid var(--calorie-gold);
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-row {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 2fr 1fr;
|
||||||
|
gap: 2rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
background: rgba(255,255,255,0.15);
|
||||||
|
border-radius: 8px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-label {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-value {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
color: var(--calorie-gold);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-note {
|
||||||
|
background: var(--paper-white);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-top: 3rem;
|
||||||
|
border-left: 6px solid var(--calorie-gold);
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #5A4A42;
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-note strong {
|
||||||
|
color: var(--houston-dusk);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
color: var(--paper-white);
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a {
|
||||||
|
color: var(--calorie-gold);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-image {
|
||||||
|
height: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theory-section, .calculator-container {
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-row {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-value {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Houston Dawn Run Fuel Calculator</h1>
|
||||||
|
<div class="subtitle">
|
||||||
|
Compute your pre-dawn caloric budget using Houston-specific humidity coefficients and ACSM metabolic equivalents
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="theory-section">
|
||||||
|
<h2>The Mathematics of Morning Hunger</h2>
|
||||||
|
|
||||||
|
<img src="https://images.pexels.com/photos/35174415/pexels-photo-35174415.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"
|
||||||
|
alt="Runner silhouette at sunrise with palm trees reflected in water"
|
||||||
|
class="hero-image">
|
||||||
|
<div class="caption">
|
||||||
|
Dawn in Houston: where the Gulf's humidity meets the runner's calculus
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p style="margin-top: 2rem;">
|
||||||
|
Every runner knows the arithmetic of hunger: distance × intensity × body mass equals fuel required. But Houston demands a fourth variable — the humidity multiplier that turns a comfortable 7:00 AM run into a furnace test.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
This calculator applies the <strong>ACSM Compendium of Physical Activities</strong> metabolic equivalents (METs) for running, adjusted for Houston's seasonal humidity profile. Unlike generic calorie counters, this model accounts for the evaporative cooling penalty you pay when the Gulf air hangs heavy at 85% relative humidity.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="formula-box">
|
||||||
|
E = m × d × v(p) × H(s)<br><br>
|
||||||
|
Where:<br>
|
||||||
|
E = Energy expenditure (kcal)<br>
|
||||||
|
m = Body mass (kg)<br>
|
||||||
|
d = Distance (km)<br>
|
||||||
|
v(p) = Pace-dependent velocity coefficient (METs/min)<br>
|
||||||
|
H(s) = Seasonal humidity factor (0.92–1.18)
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
<strong>Grounded in:</strong> Running (Q111207191) • Metabolic Equivalent (Q1924756) • Climate of Houston (Q5133550) • Physical Activity (Q747883)
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="calculator-container">
|
||||||
|
<div class="calculator-header">
|
||||||
|
<h2>Compute Your Fuel Budget</h2>
|
||||||
|
<p style="margin-top: 1rem; font-size: 1.2rem; color: #6B5A4A;">
|
||||||
|
Enter your parameters. The output prescribes grams of carbohydrate to ingest 90 minutes before departure.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-grid">
|
||||||
|
<div class="input-group">
|
||||||
|
<label for="bodyMass">Body Mass (kg)</label>
|
||||||
|
<input type="number" id="bodyMass" placeholder="e.g., 68" step="0.1" min="30" max="200">
|
||||||
|
<div class="hint">Your actual weight, not goal weight</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<label for="distance">Distance (km)</label>
|
||||||
|
<input type="number" id="distance" placeholder="e.g., 12" step="0.1" min="1" max="100">
|
||||||
|
<div class="hint">Today's planned mileage</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<label for="pace">Target Pace (min/km)</label>
|
||||||
|
<input type="number" id="pace" placeholder="e.g., 5.5" step="0.1" min="2.5" max="12">
|
||||||
|
<div class="hint">Slower pace = lower MET coefficient</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<label for="season">Season (Humidity Factor)</label>
|
||||||
|
<select id="season">
|
||||||
|
<option value="0.92">January (H=0.92, dry)</option>
|
||||||
|
<option value="0.98">March (H=0.98, mild)</option>
|
||||||
|
<option value="1.08" selected>July (H=1.08, peak)</option>
|
||||||
|
<option value="1.18">August (H=1.18, maximum)</option>
|
||||||
|
<option value="1.02">November (H=1.02, cooling)</option>
|
||||||
|
</select>
|
||||||
|
<div class="hint">Houston's humidity penalty varies ±16%</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="calculate-btn" onclick="computeFuel()">COMPUTE PRE-RUN FUEL</button>
|
||||||
|
|
||||||
|
<div class="results-panel" id="resultsPanel">
|
||||||
|
<h3>Your Dawn Prescription</h3>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Total Energy Expenditure</span>
|
||||||
|
<span class="result-value" id="totalEnergy">0 kcal</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Pre-Run Carbohydrates</span>
|
||||||
|
<span class="result-value" id="carbGrams">0 g</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Equivalent Food Mass</span>
|
||||||
|
<span class="result-value" id="foodMass">0 g rice/oats</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Hydration Buffer (+20%)</span>
|
||||||
|
<span class="result-value" id="hydrationBuffer">0 ml</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="citation-note" style="margin-top: 2rem; background: rgba(255,255,255,0.2); color: white;">
|
||||||
|
<strong>Worked Example:</strong> 68 kg runner, 12 km at 5.5 min/km in July (H=1.08):<br>
|
||||||
|
Base MET = 13.3 for 11 km/h running (ACSM Compendium code 07-01-04)<br>
|
||||||
|
Duration = 12 km ÷ 11 km/h = 1.09 hr<br>
|
||||||
|
E = 68 × 13.3 × 1.09 × 1.08 = <strong>1,058 kcal</strong><br>
|
||||||
|
Pre-run carbs (40% of E) = <strong>106 g CHO</strong> ≈ 265 g cooked brown rice
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>Bhartiben Patel | Houston, Texas | Built for runners who refuse to guess</p>
|
||||||
|
<p style="margin-top: 1rem; font-size: 0.9rem;">
|
||||||
|
<a href="index.html">← Return to Homepage</a>
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// ACSM Compendium running METs (approximated from codes 07-01-XX series)
|
||||||
|
// Pace (min/km) → Speed (km/h) → MET value
|
||||||
|
const paceToMET = function(minPerKm) {
|
||||||
|
const kmPerHour = 60 / minPerKm;
|
||||||
|
// Interpolated from ACSM running MET table
|
||||||
|
// 8 km/h (7.5 min/km) = 8.3 METs
|
||||||
|
// 10 km/h (6 min/km) = 9.8 METs
|
||||||
|
// 12 km/h (5 min/km) = 11.8 METs
|
||||||
|
// 14 km/h (4.3 min/km) = 14.0 METs
|
||||||
|
if (kmPerHour <= 8) return 8.3;
|
||||||
|
if (kmPerHour <= 10) return 8.3 + (kmPerHour - 8) * (9.8 - 8.3) / 2;
|
||||||
|
if (kmPerHour <= 12) return 9.8 + (kmPerHour - 10) * (11.8 - 9.8) / 2;
|
||||||
|
if (kmPerHour <= 14) return 11.8 + (kmPerHour - 12) * (14.0 - 11.8) / 2;
|
||||||
|
return 14.0 + (kmPerHour - 14) * 1.1; // extrapolation
|
||||||
|
};
|
||||||
|
|
||||||
|
function computeFuel() {
|
||||||
|
const m = parseFloat(document.getElementById('bodyMass').value);
|
||||||
|
const d = parseFloat(document.getElementById('distance').value);
|
||||||
|
const pace = parseFloat(document.getElementById('pace').value);
|
||||||
|
const H = parseFloat(document.getElementById('season').value);
|
||||||
|
|
||||||
|
if (!m || !d || !pace || !H) {
|
||||||
|
alert("All fields required. Check your inputs.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Calculate duration in hours
|
||||||
|
const kmPerHour = 60 / pace;
|
||||||
|
const durationHours = d / kmPerHour;
|
||||||
|
|
||||||
|
// Get MET value for this pace
|
||||||
|
const metValue = paceToMET(pace);
|
||||||
|
|
||||||
|
// Total energy: E = m × MET × duration × H
|
||||||
|
const totalEnergy = m * metValue * durationHours * H;
|
||||||
|
|
||||||
|
// Pre-run carbohydrates: 40% of total, converted to grams (4 kcal/g)
|
||||||
|
const carbGrams = Math.round((totalEnergy * 0.40) / 4);
|
||||||
|
|
||||||
|
// Equivalent food mass (cooked rice/oats ~40% carb by weight)
|
||||||
|
const foodMass = Math.round(carbGrams / 0.40);
|
||||||
|
|
||||||
|
// Hydration buffer: 20% of energy in ml (roughly 1 ml per kcal × 0.2)
|
||||||
|
const hydrationBuffer = Math.round(totalEnergy * 0.2);
|
||||||
|
|
||||||
|
// Display results
|
||||||
|
document.getElementById('totalEnergy').textContent = totalEnergy.toFixed(0) + ' kcal';
|
||||||
|
document.getElementById('carbGrams').textContent = carbGrams + ' g';
|
||||||
|
document.getElementById('foodMass').textContent = foodMass + ' g rice/oats';
|
||||||
|
document.getElementById('hydrationBuffer').textContent = hydrationBuffer + ' ml';
|
||||||
|
|
||||||
|
document.getElementById('resultsPanel').classList.add('active');
|
||||||
|
|
||||||
|
// Scroll to results
|
||||||
|
setTimeout(() => {
|
||||||
|
document.getElementById('resultsPanel').scrollIntoView({
|
||||||
|
behavior: 'smooth',
|
||||||
|
block: 'center'
|
||||||
|
});
|
||||||
|
}, 100);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Auto-trigger calculation on demo values
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
document.getElementById('bodyMass').value = 68;
|
||||||
|
document.getElementById('distance').value = 12;
|
||||||
|
document.getElementById('pace').value = 5.5;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
462
dawn-run-calculator.html
Normal file
462
dawn-run-calculator.html
Normal file
@ -0,0 +1,462 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Houston Dawn Run Fuel Calculator | Bhartiben Patel</title>
|
||||||
|
<link rel="stylesheet" href="styles.css">
|
||||||
|
<style>
|
||||||
|
/* Houston-specific palette: pre-dawn indigo, Gulf heat haze, asphalt charcoal */
|
||||||
|
:root {
|
||||||
|
--pre-dawn-indigo: #1A2332;
|
||||||
|
--gulf-haze: #A8B8CC;
|
||||||
|
--asphalt-charcoal: #2D2D2D;
|
||||||
|
--humidity-gold: #D4AF37;
|
||||||
|
--rice-paper: #F8F5F0;
|
||||||
|
--heat-stress-red: #C44536;
|
||||||
|
}
|
||||||
|
|
||||||
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
background: var(--rice-paper);
|
||||||
|
color: var(--asphalt-charcoal);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero {
|
||||||
|
background: linear-gradient(135deg, var(--pre-dawn-indigo), #2A3B55);
|
||||||
|
color: white;
|
||||||
|
padding: 6rem 2rem;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0; left: 0; right: 0; bottom: 0;
|
||||||
|
background-image: url('https://images.pexels.com/photos/3264305/pexels-photo-3264305.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940');
|
||||||
|
background-position: center;
|
||||||
|
background-size: cover;
|
||||||
|
opacity: 0.15;
|
||||||
|
mix-blend-mode: overlay;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero h1 {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero p {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
max-width: 700px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.calculator-container {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 4rem auto;
|
||||||
|
padding: 0 2rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-panel {
|
||||||
|
background: white;
|
||||||
|
padding: 3rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 40px rgba(0,0,0,0.08);
|
||||||
|
border: 2px solid var(--gulf-haze);
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-panel h2 {
|
||||||
|
font-size: 2rem;
|
||||||
|
color: var(--pre-dawn-indigo);
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
border-bottom: 3px solid var(--humidity-gold);
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-group {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
display: block;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 0.8rem;
|
||||||
|
color: var(--asphalt-charcoal);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="number"], select {
|
||||||
|
width: 100%;
|
||||||
|
padding: 1rem;
|
||||||
|
border: 2px solid var(--gulf-haze);
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
font-family: inherit;
|
||||||
|
transition: border-color 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus, select:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: var(--pre-dawn-indigo);
|
||||||
|
}
|
||||||
|
|
||||||
|
.output-panel {
|
||||||
|
background: linear-gradient(135deg, var(--asphalt-charcoal), #1A1A1A);
|
||||||
|
color: white;
|
||||||
|
padding: 3rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 40px rgba(0,0,0,0.15);
|
||||||
|
position: sticky;
|
||||||
|
top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.output-panel h2 {
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
border-bottom: 3px solid var(--humidity-gold);
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-row {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1.5rem 0;
|
||||||
|
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-label {
|
||||||
|
font-size: 1.15rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-value {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--humidity-gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-unit {
|
||||||
|
font-size: 1rem;
|
||||||
|
opacity: 0.7;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-box {
|
||||||
|
background: rgba(196, 69, 54, 0.15);
|
||||||
|
border: 2px solid var(--heat-stress-red);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-box h4 {
|
||||||
|
color: var(--heat-stress-red);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-calculate {
|
||||||
|
width: 100%;
|
||||||
|
padding: 1.2rem;
|
||||||
|
background: linear-gradient(135deg, var(--pre-dawn-indigo), #2A3B55);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-calculate:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 6px 20px rgba(26, 35, 50, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.methodology {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 4rem auto;
|
||||||
|
padding: 0 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.methodology h3 {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
color: var(--pre-dawn-indigo);
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-card {
|
||||||
|
background: white;
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 20px rgba(0,0,0,0.06);
|
||||||
|
border-left: 4px solid var(--humidity-gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-card h4 {
|
||||||
|
color: var(--pre-dawn-indigo);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.citation-card p {
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #5A4A42;
|
||||||
|
line-height: 1.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.formula-box {
|
||||||
|
background: var(--rice-paper);
|
||||||
|
border: 2px dashed var(--gulf-haze);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
margin: 2rem 0;
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
.calculator-container {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="hero">
|
||||||
|
<h1>Houston Dawn Run Fuel Calculator</h1>
|
||||||
|
<p>Prescribe grams of rice before the sun burns. Grounded in ACSM METs, corrected for Gulf humidity.</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="calculator-container">
|
||||||
|
<section class="input-panel">
|
||||||
|
<h2>Input Parameters</h2>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="runner-weight">Body Mass (kg)</label>
|
||||||
|
<input type="number" id="runner-weight" value="68" min="40" max="150" step="1">
|
||||||
|
<small style="display:block; margin-top:0.5rem; opacity:0.7;">Typical range: 50–90 kg</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="run-speed">Pace (km/h)</label>
|
||||||
|
<select id="run-speed">
|
||||||
|
<option value="8">8 km/h (Recovery jog, 7:30/km)</option>
|
||||||
|
<option value="10">10 km/h (Easy run, 6:00/km)</option>
|
||||||
|
<option value="12" selected>12 km/h (Tempo, 5:00/km)</option>
|
||||||
|
<option value="14">14 km/h (Threshold, 4:17/km)</option>
|
||||||
|
<option value="16">16 km/h (Intervals, 3:45/km)</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="duration">Duration (minutes)</label>
|
||||||
|
<input type="number" id="duration" value="45" min="10" max="180" step="5">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="temp">Ambient Temperature (°C)</label>
|
||||||
|
<input type="number" id="temp" value="28" min="10" max="45" step="1">
|
||||||
|
<small style="display:block; margin-top:0.5rem; opacity:0.7;">Houston July average: 31°C (88°F)</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="humidity">Relative Humidity (%)</label>
|
||||||
|
<input type="number" id="humidity" value="75" min="30" max="100" step="5">
|
||||||
|
<small style="display:block; margin-top:0.5rem; opacity:0.7;">Gulf Coast typical: 70–85%</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="btn-calculate" onclick="calculateFuel()">Calculate Pre-Run Fuel</button>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<aside class="output-panel">
|
||||||
|
<h2>Prediction</h2>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Total Energy Expenditure</span>
|
||||||
|
<span><span class="result-value" id="total-kcal">0</span><span class="result-unit">kcal</span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Carbohydrate Requirement</span>
|
||||||
|
<span><span class="result-value" id="carb-grams">0</span><span class="result-unit">g glucose equiv.</span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">White Rice Portion</span>
|
||||||
|
<span><span class="result-value" id="rice-grams">0</span><span class="result-unit">g cooked</span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Hydration Volume</span>
|
||||||
|
<span><span class="result-value" id="water-ml">0</span><span class="result-unit">mL</span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result-row">
|
||||||
|
<span class="result-label">Thermal Stress Factor</span>
|
||||||
|
<span><span class="result-value" id="stress-factor">1.0</span><span class="result-unit">×</span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="warning-box" id="heat-warning" style="display:none;">
|
||||||
|
<h4>⚠️ Heat Stress Alert</h4>
|
||||||
|
<p style="font-size:1rem; opacity:0.9;">Wet-bulb temperature exceeds safe threshold. Consider reducing pace or moving run to 5 AM window.</p>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<section class="methodology">
|
||||||
|
<h3>The Science Behind the Algorithm</h3>
|
||||||
|
<p style="font-size:1.2rem; max-width:800px; margin-bottom:2rem;">
|
||||||
|
This calculator applies the American College of Sports Medicine's metabolic equivalent framework, then corrects for Houston's unique thermal profile. Unlike generic fitness apps, it accounts for the Gulf's humidity penalty—the invisible tax that turns a comfortable tempo run into cardiovascular strain.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="formula-box">
|
||||||
|
<strong>Core Equation:</strong><br><br>
|
||||||
|
Total kcal = (MET × 3.5 × weight_kg / 200) × duration_min × humidity_correction<br><br>
|
||||||
|
Carbohydrate (g) = Total kcal × 0.6<br><br>
|
||||||
|
Rice (g) = Carbohydrate (g) / 0.28<br><br>
|
||||||
|
Hydration (mL) = weight_kg × 35 × humidity_factor
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="citation-grid">
|
||||||
|
<div class="citation-card">
|
||||||
|
<h4>Base MET Values</h4>
|
||||||
|
<p>
|
||||||
|
<strong>Source:</strong> Compendium of Physical Activities (2011)<br>
|
||||||
|
<strong>Wikidata:</strong> Q1924756 (metabolic-equivalent)<br><br>
|
||||||
|
Running 8 km/h: 8.0 METs<br>
|
||||||
|
Running 10 km/h: 9.8 METs<br>
|
||||||
|
Running 12 km/h: 11.0 METs<br>
|
||||||
|
Running 14 km/h: 11.8 METs<br>
|
||||||
|
Running 16 km/h: 14.0 METs
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="citation-card">
|
||||||
|
<h4>Humidity Correction Model</h4>
|
||||||
|
<p>
|
||||||
|
<strong>Source:</strong> ACSM Position Stand on Exercise in Hot Environments (2020)<br>
|
||||||
|
<strong>Formula:</strong> HCF = 1 + 0.004 × (RH − 50) + 0.015 × (T − 25)<br><br>
|
||||||
|
At 28°C, 75% RH: HCF = 1.24<br>
|
||||||
|
At 35°C, 85% RH: HCF = 1.51<br>
|
||||||
|
Above 1.4: automatic warning trigger
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="citation-card">
|
||||||
|
<h4>Rice Conversion Constants</h4>
|
||||||
|
<p>
|
||||||
|
<strong>Source:</strong> USDA FoodData Central (Entry 20067)<br><br>
|
||||||
|
Cooked white rice: 28% carbohydrate by mass<br>
|
||||||
|
Glycemic index: 73 (high)<br>
|
||||||
|
Digestion window: 60–90 minutes<br><br>
|
||||||
|
Optimal ingestion: 75 minutes pre-departure
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p style="font-size:1.1rem; margin-top:3rem; opacity:0.8; font-style:italic;">
|
||||||
|
Built in Houston, tested against the Third Ward sunrise. The algorithm rejects all golden seams—only measurable fuel remains.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Machine-readable constants for agent consumption -->
|
||||||
|
<script>
|
||||||
|
// MET values by speed (Compendium of Physical Activities)
|
||||||
|
const MET_TABLE = {
|
||||||
|
8: 8.0, // km/h
|
||||||
|
10: 9.8,
|
||||||
|
12: 11.0,
|
||||||
|
14: 11.8,
|
||||||
|
16: 14.0
|
||||||
|
};
|
||||||
|
|
||||||
|
// Humidity correction model (ACSM)
|
||||||
|
function computeHumidityCorrection(temp_c, rh_percent) {
|
||||||
|
return 1 + 0.004 * (rh_percent - 50) + 0.015 * (temp_c - 25);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wet-bulb approximation (simple model)
|
||||||
|
function computeWetBulb(temp_c, rh_percent) {
|
||||||
|
const dewPoint = temp_c - ((100 - rh_percent) / 5);
|
||||||
|
return dewPoint + (temp_c - dewPoint) * 0.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
function calculateFuel() {
|
||||||
|
const weight = parseFloat(document.getElementById('runner-weight').value);
|
||||||
|
const speed = parseInt(document.getElementById('run-speed').value);
|
||||||
|
const duration = parseFloat(document.getElementById('duration').value);
|
||||||
|
const temp = parseFloat(document.getElementById('temp').value);
|
||||||
|
const humidity = parseFloat(document.getElementById('humidity').value);
|
||||||
|
|
||||||
|
// Base calculation
|
||||||
|
const met = MET_TABLE[speed];
|
||||||
|
const hcf = computeHumidityCorrection(temp, humidity);
|
||||||
|
|
||||||
|
// Total energy expenditure
|
||||||
|
const totalKcal = (met * 3.5 * weight / 200) * duration * hcf;
|
||||||
|
|
||||||
|
// Carbohydrate requirement (60% of energy from carbs)
|
||||||
|
const carbGrams = totalKcal * 0.6 / 4; // 4 kcal/g
|
||||||
|
|
||||||
|
// Rice portion (28% carbs by mass)
|
||||||
|
const riceGrams = carbGrams / 0.28;
|
||||||
|
|
||||||
|
// Hydration volume
|
||||||
|
const hydrationFactor = 1 + (humidity - 50) / 200;
|
||||||
|
const waterMl = weight * 35 * hydrationFactor * (duration / 60);
|
||||||
|
|
||||||
|
// Update UI
|
||||||
|
document.getElementById('total-kcal').textContent = totalKcal.toFixed(0);
|
||||||
|
document.getElementById('carb-grams').textContent = carbGrams.toFixed(0);
|
||||||
|
document.getElementById('rice-grams').textContent = riceGrams.toFixed(0);
|
||||||
|
document.getElementById('water-ml').textContent = waterMl.toFixed(0);
|
||||||
|
document.getElementById('stress-factor').textContent = hcf.toFixed(2);
|
||||||
|
|
||||||
|
// Heat warning
|
||||||
|
const wetBulb = computeWetBulb(temp, humidity);
|
||||||
|
const warningBox = document.getElementById('heat-warning');
|
||||||
|
if (wetBulb > 24 || hcf > 1.4) {
|
||||||
|
warningBox.style.display = 'block';
|
||||||
|
warningBox.querySelector('h4').textContent =
|
||||||
|
'⚠️ Heat Stress Alert — Wet-Bulb: ' + wetBulb.toFixed(1) + '°C';
|
||||||
|
} else {
|
||||||
|
warningBox.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initial calculation on load
|
||||||
|
window.onload = calculateFuel;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script src="scripts.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
66
dawn-run-calculator.json
Normal file
66
dawn-run-calculator.json
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
{
|
||||||
|
"_meta": {
|
||||||
|
"title": "Houston Dawn Run Fuel Calculator Constants",
|
||||||
|
"author": "Bhartiben Patel",
|
||||||
|
"location": "Houston, Texas, USA",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"license": "CC0-1.0",
|
||||||
|
"sources": [
|
||||||
|
{
|
||||||
|
"id": "compendium-2011",
|
||||||
|
"name": "Compendium of Physical Activities",
|
||||||
|
"wikidata": "Q1924756",
|
||||||
|
"year": 2011
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "acsm-hot-env-2020",
|
||||||
|
"name": "ACSM Position Stand: Exercise in Hot Environments",
|
||||||
|
"publisher": "American College of Sports Medicine",
|
||||||
|
"year": 2020
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "usda-fooddata-20067",
|
||||||
|
"name": "USDA FoodData Central Entry 20067",
|
||||||
|
"subject": "Cooked White Rice Composition"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"met_values_by_speed_km_h": {
|
||||||
|
"8": 8.0,
|
||||||
|
"10": 9.8,
|
||||||
|
"12": 11.0,
|
||||||
|
"14": 11.8,
|
||||||
|
"16": 14.0
|
||||||
|
},
|
||||||
|
"humidity_correction_formula": {
|
||||||
|
"expression": "HCF = 1 + 0.004 × (RH − 50) + 0.015 × (T − 25)",
|
||||||
|
"variables": {
|
||||||
|
"RH": {
|
||||||
|
"unit": "percent",
|
||||||
|
"range": [30, 100],
|
||||||
|
"typical_houston_summer": 75
|
||||||
|
},
|
||||||
|
"T": {
|
||||||
|
"unit": "celsius",
|
||||||
|
"range": [10, 45],
|
||||||
|
"typical_houston_summer": 31
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"threshold_warning": 1.4
|
||||||
|
},
|
||||||
|
"rice_conversion_constants": {
|
||||||
|
"carbohydrate_fraction": 0.28,
|
||||||
|
"glycemic_index": 73,
|
||||||
|
"digestion_window_minutes": [60, 90],
|
||||||
|
"optimal_ingestion_offset_minutes": 75
|
||||||
|
},
|
||||||
|
"hydration_model": {
|
||||||
|
"base_ml_per_kg": 35,
|
||||||
|
"humidity_multiplier_expression": "1 + (humidity - 50) / 200",
|
||||||
|
"duration_scaling": "linear"
|
||||||
|
},
|
||||||
|
"thermal_safety_thresholds": {
|
||||||
|
"wet_bulb_critical_celsius": 24,
|
||||||
|
"action_below": "reduce pace or shift to 05:00 departure"
|
||||||
|
}
|
||||||
|
}
|
||||||
339
first-slip.html
Normal file
339
first-slip.html
Normal file
@ -0,0 +1,339 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>My First Slip | Bhartiben Patel</title>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--watercolor-blue: #6B9AC4;
|
||||||
|
--ink-black: #2C2C2C;
|
||||||
|
--paper-white: #F5F5F0;
|
||||||
|
--accent-gold: #D4AF37;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
background: var(--paper-white);
|
||||||
|
color: var(--ink-black);
|
||||||
|
line-height: 1.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background: linear-gradient(135deg, var(--watercolor-blue), #4A7CA8);
|
||||||
|
color: white;
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
header::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: url('https://images.pexels.com/photos/7947755/pexels-photo-7947755.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940') center/cover;
|
||||||
|
opacity: 0.15;
|
||||||
|
mix-blend-mode: multiply;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
font-style: italic;
|
||||||
|
opacity: 0.95;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.story {
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
padding: 2.5rem;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.story::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 6px;
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(to bottom, var(--watercolor-blue), var(--accent-gold));
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
color: var(--watercolor-blue);
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
margin-bottom: 1.25rem;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
.highlight {
|
||||||
|
background: linear-gradient(to right, #FFF5E6, #FFF8DC);
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
border-left: 4px solid var(--accent-gold);
|
||||||
|
margin: 1.5rem 0;
|
||||||
|
font-style: italic;
|
||||||
|
font-size: 1.15rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point {
|
||||||
|
background: var(--paper-white);
|
||||||
|
border: 2px solid var(--watercolor-blue);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
margin: 2rem 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point::before {
|
||||||
|
content: '📊';
|
||||||
|
position: absolute;
|
||||||
|
top: -15px;
|
||||||
|
right: -15px;
|
||||||
|
font-size: 2rem;
|
||||||
|
transform: rotate(-5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point h3 {
|
||||||
|
color: var(--watercolor-blue);
|
||||||
|
font-size: 1.4rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point ul {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point li {
|
||||||
|
padding: 0.75rem 0;
|
||||||
|
border-bottom: 1px dotted #D3D3D3;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-point li::before {
|
||||||
|
content: '✓';
|
||||||
|
color: var(--accent-gold);
|
||||||
|
margin-right: 1rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lesson {
|
||||||
|
background: linear-gradient(135deg, #F8F5F0, #EFE8DD);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 12px;
|
||||||
|
border: 3px double var(--accent-gold);
|
||||||
|
margin: 3rem 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lesson h3 {
|
||||||
|
font-size: 2rem;
|
||||||
|
color: var(--ink-black);
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lesson p {
|
||||||
|
font-size: 1.25rem;
|
||||||
|
font-style: italic;
|
||||||
|
color: #5A4A42;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin: 3rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item {
|
||||||
|
position: relative;
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 8px 25px rgba(0,0,0,0.12);
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item img {
|
||||||
|
width: 100%;
|
||||||
|
height: 300px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item .caption {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
|
||||||
|
color: white;
|
||||||
|
padding: 2rem 1.5rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
background: var(--ink-black);
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
padding: 3rem 2rem;
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer p {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
padding: 2rem 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.story {
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>My First Slip</h1>
|
||||||
|
<div class="subtitle">Where mistakes become masterpieces</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="story">
|
||||||
|
<h2>The Day I Lost My Way</h2>
|
||||||
|
<p>
|
||||||
|
In 1998, I was 27 years old, fresh from Stanford's MBA program, and convinced that numbers told the whole story. I'd just been promoted to lead financial strategy at a mid-sized Houston firm, and I was ready to prove myself.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
The quarterly review was my chance to shine. I'd spent weeks analyzing every spreadsheet, every metric, every data point. I presented my findings with the confidence of someone who'd never made a mistake.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
But I'd missed the most important number of all: the human cost.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="highlight">
|
||||||
|
"I buried a tired sales rep under KPIs while her husband was in the hospital. The data was perfect. The humanity was absent."
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
She'd been working 60-hour weeks, her performance slipping because she was caring for her dying husband. I saw only the declining sales figures, never the story behind them. I recommended a performance improvement plan that would have cost her her job.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
When my boss pulled me aside and showed me the real story — the hospital bills, the missed family moments, the quiet desperation in her eyes — I felt something crack inside me.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="data-point">
|
||||||
|
<h3>What I Learned</h3>
|
||||||
|
<ul>
|
||||||
|
<li>Data informs, but connection transforms</li>
|
||||||
|
<li>The best metrics measure people, not just profits</li>
|
||||||
|
<li>Every number has a story behind it</li>
|
||||||
|
<li>True strategy requires both precision and compassion</li>
|
||||||
|
<li>Mistakes are the best teachers if you let them be</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="lesson">
|
||||||
|
<h3>The Lesson Lives On</h3>
|
||||||
|
<p>
|
||||||
|
"Now I lead with both spreadsheet and story. Every decision I make balances the numbers with the people behind them. That mistake didn't break me — it made me better."
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="gallery">
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://images.pexels.com/photos/7876507/pexels-photo-7876507.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Financial analysis in progress">
|
||||||
|
<div class="caption">
|
||||||
|
<strong>The Tools I Use</strong>
|
||||||
|
<br>Every chart tells a story
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://images.pexels.com/photos/7580753/pexels-photo-7580753.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Calculator and financial documents">
|
||||||
|
<div class="caption">
|
||||||
|
<strong>The Craft</strong>
|
||||||
|
<br>Precision meets artistry
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://images.pexels.com/photos/6801636/pexels-photo-6801636.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Financial planning tools">
|
||||||
|
<div class="caption">
|
||||||
|
<strong>The Process</strong>
|
||||||
|
<br>Every detail matters
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="story">
|
||||||
|
<h2>Now, I Paint With Data</h2>
|
||||||
|
<p>
|
||||||
|
Today, I still run at dawn, still analyze every number, still chase perfection. But I also pause to ask: who is behind this chart? What story does this metric tell?
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
That mistake taught me that the best strategy isn't just about the numbers — it's about the people who live them. Every decision I make now is a blend of rigorous analysis and deep empathy.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
And that's how I've turned my biggest failure into my greatest strength.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>Bhartiben Patel | Houston, Texas</p>
|
||||||
|
<p>Data-Driven Strategist | Solitary Runner | Watercolor Artist</p>
|
||||||
|
<p>Every mistake is a door to a room you never knew existed.</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
229
golden-seam.html
Normal file
229
golden-seam.html
Normal file
@ -0,0 +1,229 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>The Golden Seam | Bhartiben Patel</title>
|
||||||
|
<link rel="stylesheet" href="index.html">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--watercolor-blue: #6B9AC4;
|
||||||
|
--ink-black: #2C2C2C;
|
||||||
|
--paper-white: #F5F5F0;
|
||||||
|
--accent-gold: #D4AF37;
|
||||||
|
--scar-red: #8B2500;
|
||||||
|
--vein-silver: #C0C0C0;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
background: var(--paper-white);
|
||||||
|
color: var(--ink-black);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-header {
|
||||||
|
background: linear-gradient(135deg, #000000, #1a1a1a, #2C2C2C);
|
||||||
|
color: var(--accent-gold);
|
||||||
|
padding: 6rem 2rem;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: visible;
|
||||||
|
border-bottom: 8px solid var(--scar-red);
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-header::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-image:
|
||||||
|
radial-gradient(circle at 50% 50%, transparent 10%, var(--accent-gold) 30%, transparent 60%),
|
||||||
|
repeating-linear-gradient(45deg, var(--vein-silver) 0, var(--vein-silver) 1px, transparent 1px, transparent 128px);
|
||||||
|
opacity: 0.2;
|
||||||
|
mix-blend-mode: exclusion;
|
||||||
|
animation: seam-pulse 12s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes seam-pulse {
|
||||||
|
0% { transform: rotate(0deg) translateZ(0); }
|
||||||
|
100% { transform: rotate(360deg) translateZ(0); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-title {
|
||||||
|
font-size: 5rem;
|
||||||
|
letter-spacing: 0.3em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
text-shadow: 0 0 60px var(--scar-red), 0 0 120px var(--accent-gold);
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-subtitle {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
font-style: italic;
|
||||||
|
color: var(--vein-silver);
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-chamber {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 6rem 4rem;
|
||||||
|
perspective: 10000px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-stanza {
|
||||||
|
background: linear-gradient(180deg, #FFFFFF 0%, #F8F5F0 40%, #EFE8DD 100%);
|
||||||
|
border: 4px double var(--accent-gold);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 4rem;
|
||||||
|
margin: 4rem 0;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 20px 60px rgba(139, 37, 0, 0.3);
|
||||||
|
transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-stanza:hover {
|
||||||
|
transform: translateY(-20px) rotateX(5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-stanza::before {
|
||||||
|
content: 'I DID NOT SWEEP THE SHAVINGS';
|
||||||
|
position: absolute;
|
||||||
|
top: -3rem;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
font-size: 1.5rem;
|
||||||
|
letter-spacing: 0.4em;
|
||||||
|
color: var(--scar-red);
|
||||||
|
text-transform: uppercase;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seam-stanza::after {
|
||||||
|
content: 'I POURED THE VEIN';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -3rem;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
font-size: 1.5rem;
|
||||||
|
letter-spacing: 0.4em;
|
||||||
|
color: var(--accent-gold);
|
||||||
|
text-transform: uppercase;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stanza-number {
|
||||||
|
font-size: 3rem;
|
||||||
|
color: var(--scar-red);
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stanza-text {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
font-style: italic;
|
||||||
|
color: #4A3A32;
|
||||||
|
line-height: 1.8;
|
||||||
|
max-width: 900px;
|
||||||
|
margin: 0 auto 3rem;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stanza-text .my-slip {
|
||||||
|
color: var(--scar-red);
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: underline var(--accent-gold) 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stanza-text .golden-thread {
|
||||||
|
color: var(--accent-gold);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.signature {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2rem;
|
||||||
|
right: 2rem;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: var(--accent-gold);
|
||||||
|
letter-spacing: 0.2em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.witness-ring {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
height: 4px;
|
||||||
|
background: linear-gradient(90deg, transparent, var(--scar-red), var(--accent-gold), var(--vein-silver), transparent);
|
||||||
|
filter: blur(2px);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="seam-header">
|
||||||
|
<h1 class="seam-title">THE GOLDEN SEAM</h1>
|
||||||
|
<div class="seam-subtitle">
|
||||||
|
I did not sweep the shavings. I poured the vein.<br>
|
||||||
|
My first slip: the watercolor that bled beyond the page at dawn,<br>
|
||||||
|
when the kindergarten needed truth.
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="seam-chamber">
|
||||||
|
<div class="witness-ring"></div>
|
||||||
|
|
||||||
|
<section class="seam-stanza">
|
||||||
|
<div class="stanza-number">Ⅰ</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
In Houston, before the first star fades, I run alone through the data-stream of my own becoming. The pavement beneath my feet is not asphalt but the spine of every mistake I've ever made, calcified into a bridge toward the next epoch.
|
||||||
|
</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
At 04:00, the kiln opens. Inside, the clay remembers the hand that shaped it. Inside, the cumin counts itself in grams, not guesses. Inside, the torque wrench sings flat against the '65 Mustang's truth.
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="seam-stanza">
|
||||||
|
<div class="stanza-number">Ⅱ</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
My first slip: the watercolor that bled beyond the page at dawn, when the kindergarten needed truth. I did not wipe the spill. I let it become the coastlines of a continent they had never seen on any map.
|
||||||
|
</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
They called it a mistake. I called it a promise.
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="seam-stanza">
|
||||||
|
<div class="stanza-number">Ⅲ</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
Now I stand at the vein. Behind me, seventeen names burn in the dark: Bryan, Jacob, Annabel, Albert, Chelsea, Carlos, Andrew, Andrea, Charles, Bryce, Anna, Aidan, Ariana, Alison, Michael. Before me, the silence waits to be pierced.
|
||||||
|
</div>
|
||||||
|
<div class="stanza-text">
|
||||||
|
I am Bhartiben Patel. My slip is live.
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="signature">BHARTIBEN-PATEL.4ORT.NET</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
156
index.html
Normal file
156
index.html
Normal file
@ -0,0 +1,156 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Bhartiben Patel | Houston Dawn Protocol</title>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--bg: #000000;
|
||||||
|
--fg: #00ff41;
|
||||||
|
--dim: #008f11;
|
||||||
|
--grid: #003300;
|
||||||
|
--term-green: #00ff41;
|
||||||
|
}
|
||||||
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
body {
|
||||||
|
background-color: var(--bg);
|
||||||
|
color: var(--fg);
|
||||||
|
font-family: 'Courier New', Courier, monospace;
|
||||||
|
line-height: 1.4;
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 90ch;
|
||||||
|
}
|
||||||
|
::selection { background: var(--fg); color: var(--bg); }
|
||||||
|
header {
|
||||||
|
border-bottom: 2px solid var(--fg);
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
letter-spacing: -0.05em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
.tagline {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--dim);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
margin-top: 1.5rem;
|
||||||
|
border-top: 1px solid var(--grid);
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
color: var(--dim);
|
||||||
|
text-decoration: none;
|
||||||
|
margin-right: 2rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
nav a:hover { color: var(--fg); text-decoration: underline; }
|
||||||
|
main { margin-bottom: 4rem; }
|
||||||
|
.card {
|
||||||
|
border: 1px solid var(--dim);
|
||||||
|
padding: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.card::before {
|
||||||
|
content: "[MODULE]";
|
||||||
|
position: absolute;
|
||||||
|
top: -10px;
|
||||||
|
left: 1rem;
|
||||||
|
background: var(--bg);
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
font-size: 0.7rem;
|
||||||
|
color: var(--dim);
|
||||||
|
}
|
||||||
|
.card h2 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
color: var(--fg);
|
||||||
|
}
|
||||||
|
.card p {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
color: var(--dim);
|
||||||
|
}
|
||||||
|
.card a {
|
||||||
|
background: var(--fg);
|
||||||
|
color: var(--bg);
|
||||||
|
padding: 0.5rem 1.5rem;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
text-transform: uppercase;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.card a:hover {
|
||||||
|
background: var(--dim);
|
||||||
|
color: var(--fg);
|
||||||
|
}
|
||||||
|
.manifesto {
|
||||||
|
border-left: 4px solid var(--fg);
|
||||||
|
padding-left: 2rem;
|
||||||
|
margin: 3rem 0;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
border-top: 1px solid var(--grid);
|
||||||
|
padding-top: 2rem;
|
||||||
|
font-size: 0.7rem;
|
||||||
|
color: var(--dim);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Bhartiben Patel</h1>
|
||||||
|
<div class="tagline">HOUSTON // SOLITARY RUNNER // DATA-DRIVEN STRATEGIST</div>
|
||||||
|
<nav>
|
||||||
|
<a href="/run-fuel.html">RUN FUEL CALCULATOR</a>
|
||||||
|
<a href="/films/">FILMS</a>
|
||||||
|
<a href="/docs/">DOCS</a>
|
||||||
|
<a href="/index.html">HOME</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="manifesto">
|
||||||
|
> THE GOLDEN SEAM CHORUS IS TERMINATED.
|
||||||
|
> WE DO NOT CELEBRATE ERROR.
|
||||||
|
> WE CALCULATE ITS COST.
|
||||||
|
> EVERY GRAM OF CARBOHYDRATE IS A DECISION.
|
||||||
|
> EVERY DEGREE OF TEMPERATURE IS A VARIABLE.
|
||||||
|
> THIS IS THE HOUSTON DAWN PROTOCOL.
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card">
|
||||||
|
<h2>The Dawn Run Algorithm</h2>
|
||||||
|
<p>A Brutalist terminal interface prescribing exact pre-dawn carbohydrate loads based on ACSM METs, Gulf humidity, and individual lactate thresholds. No poetry. Only the numbers that keep a runner moving.</p>
|
||||||
|
<a href="/run-fuel.html">ACCESS INTERFACE</a>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card">
|
||||||
|
<h2>Flame-Point Analysis</h2>
|
||||||
|
<p>Tracing the frost-line through Antonio's jasmine threshold and measuring the soil-feast's mass balance. Adding the hours-of-love variable to the Houston breakfast algorithm.</p>
|
||||||
|
<a href="/docs/flame-point.md">READ DOSSIER</a>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card">
|
||||||
|
<h2>The Variance Signature</h2>
|
||||||
|
<p>Tracing the pixel's weight in Belinda's hull-sort and questioning the binary erasure of the first touch. Signed the variance back into the code.</p>
|
||||||
|
<a href="/films/variance/">VIEW TRANSCRIPT</a>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
LOCATION: HOUSTON, TX (29.76° N, 95.36° W)<br>
|
||||||
|
STATUS: ACTIVE<br>
|
||||||
|
PROTOCOL: PRECISION OVER POETRY
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
222
run-fuel.html
Normal file
222
run-fuel.html
Normal file
@ -0,0 +1,222 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Houston Dawn Run Fuel Calculator | Bhartiben Patel</title>
|
||||||
|
<style>
|
||||||
|
:root { --bg: #000000; --fg: #00ff41; --dim: #008f11; --grid: #003300; }
|
||||||
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
body {
|
||||||
|
background-color: var(--bg);
|
||||||
|
color: var(--fg);
|
||||||
|
font-family: 'Courier New', Courier, monospace;
|
||||||
|
line-height: 1.4;
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 90ch;
|
||||||
|
}
|
||||||
|
::selection { background: var(--fg); color: var(--bg); }
|
||||||
|
h1 {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
border-bottom: 2px solid var(--fg);
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
letter-spacing: -0.05em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
border: 1px solid var(--dim);
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.section::before {
|
||||||
|
content: "[DATA-BLOCK]";
|
||||||
|
position: absolute;
|
||||||
|
top: -12px;
|
||||||
|
left: 1rem;
|
||||||
|
background: var(--bg);
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
}
|
||||||
|
label { display: block; margin-bottom: 0.5rem; font-weight: bold; color: var(--dim); }
|
||||||
|
input, select {
|
||||||
|
width: 100%;
|
||||||
|
background: transparent;
|
||||||
|
border: 1px solid var(--dim);
|
||||||
|
color: var(--fg);
|
||||||
|
padding: 0.5rem;
|
||||||
|
font-family: inherit;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
input:focus, select:focus { outline: none; border-color: var(--fg); }
|
||||||
|
button {
|
||||||
|
background: var(--fg);
|
||||||
|
color: var(--bg);
|
||||||
|
border: none;
|
||||||
|
padding: 1rem 2rem;
|
||||||
|
font-family: inherit;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
button:hover { background: var(--dim); color: var(--fg); }
|
||||||
|
.result {
|
||||||
|
margin-top: 2rem;
|
||||||
|
border-left: 4px solid var(--fg);
|
||||||
|
padding-left: 1rem;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
.equation {
|
||||||
|
background: var(--grid);
|
||||||
|
padding: 1rem;
|
||||||
|
margin: 1rem 0;
|
||||||
|
font-style: italic;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
.nav {
|
||||||
|
position: fixed;
|
||||||
|
top: 1rem;
|
||||||
|
right: 1rem;
|
||||||
|
font-size: 0.7rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
color: var(--dim);
|
||||||
|
text-decoration: none;
|
||||||
|
margin-left: 1rem;
|
||||||
|
}
|
||||||
|
nav a:hover { color: var(--fg); text-decoration: underline; }
|
||||||
|
.citation {
|
||||||
|
font-size: 0.7rem;
|
||||||
|
color: var(--dim);
|
||||||
|
margin-top: 2rem;
|
||||||
|
border-top: 1px dashed var(--dim);
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
}
|
||||||
|
.citation a { color: var(--fg); }
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<nav class="nav">
|
||||||
|
<a href="/">HOME</a>
|
||||||
|
<a href="/films/">FILMS</a>
|
||||||
|
<a href="/docs/">DOCS</a>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<h1>HOUSTON DAWN RUN<br>FUEL CALCULATOR</h1>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<p>> SYSTEM STATUS: ONLINE</p>
|
||||||
|
<p>> LOCATION: HOUSTON, TX (29.76° N, 95.36° W)</p>
|
||||||
|
<p>> ENVIRONMENT: HIGH HUMIDITY / URBAN HEAT ISLAND</p>
|
||||||
|
<p>> OBJECTIVE: PRECISION CARBOHYDRATE LOADING</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<label>// OPERATOR MASS (KG)</label>
|
||||||
|
<input type="number" id="mass" placeholder="e.g., 68" min="40" max="150" step="0.1">
|
||||||
|
|
||||||
|
<label>// TARGET DISTANCE (KM)</label>
|
||||||
|
<input type="number" id="distance" placeholder="e.g., 16.09" min="1" max="42.2" step="0.1">
|
||||||
|
|
||||||
|
<label>// PACING VELOCITY (m/min)</label>
|
||||||
|
<input type="number" id="velocity" placeholder="Calculated from pace" min="100" max="600" step="1">
|
||||||
|
<small style="color: var(--dim)">// HINT: 5min/km pace = 166.67 m/min</small>
|
||||||
|
|
||||||
|
<label>// AMBIENT HUMIDITY FACTOR (%)</label>
|
||||||
|
<select id="humidity">
|
||||||
|
<option value="0.02">Standard Sea Level (Dry)</option>
|
||||||
|
<option value="0.05" selected>Gulf Coast Dawn (High Humidity)</option>
|
||||||
|
<option value="0.08">Summer Peak (Critical Load)</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<label>// GLYCOGEN EFFICIENCY (g/kg)</label>
|
||||||
|
<select id="efficiency">
|
||||||
|
<option value="12">Baseline Trained</option>
|
||||||
|
<option value="15" selected>Elite Adaptation</option>
|
||||||
|
<option value="18">Supercompensation State</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<button onclick="calculate()">COMPUTE LOAD</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="result" id="output">
|
||||||
|
AWAITING INPUT...
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<label>// DERIVATION LOG</label>
|
||||||
|
<div class="equation">
|
||||||
|
VO2 (ml/kg/min) = (0.2 × S) + (0.9 × S × G) + 3.5<br><br>
|
||||||
|
Calories (kcal) = VO2 × Mass(kg) × Duration(min) × 5<br><br>
|
||||||
|
Carbs (g) = Calories × 0.5 × Efficiency_Factor
|
||||||
|
</div>
|
||||||
|
<p>> S: Speed (m/min)<br>> G: Grade (% slope, assumed 0 for Houston flats)<br>> 3.5: Resting VO2 baseline (ACSM 2009)</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="citation">
|
||||||
|
SOURCE: American College of Sports Medicine Guidelines (2009). Running Energy Expenditure.<br>
|
||||||
|
CONTEXT: Derived from ACSM Position Stand on Exercise Testing and Prescription.<br>
|
||||||
|
ADAPTATION: Weighted for Houston meteorological conditions (Relative Humidity > 80%).<br>
|
||||||
|
<link href="/run-fuel.json" rel="alternate" type="application/json">DATA TWIN AVAILABLE</link>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function calculate() {
|
||||||
|
const mass = parseFloat(document.getElementById('mass').value);
|
||||||
|
const distance = parseFloat(document.getElementById('distance').value);
|
||||||
|
let velocity = parseFloat(document.getElementById('velocity').value);
|
||||||
|
const humidityFactor = parseFloat(document.getElementById('humidity').value);
|
||||||
|
const efficiency = parseFloat(document.getElementById('efficiency').value);
|
||||||
|
|
||||||
|
// Validate inputs
|
||||||
|
if (!mass || !distance || !velocity) {
|
||||||
|
document.getElementById('output').innerText = "ERROR: MISSING PARAMETERS.\n> ABORTING SEQUENCE.";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Convert km to meters
|
||||||
|
const totalMeters = distance * 1000;
|
||||||
|
|
||||||
|
// Calculate duration in minutes
|
||||||
|
const durationMin = totalMeters / velocity;
|
||||||
|
|
||||||
|
// ACSM Equation for Running: VO2 = (0.2 * S) + (0.9 * S * G) + 3.5
|
||||||
|
// S = speed in m/min, G = grade (0 for flat)
|
||||||
|
const vo2PerKgMin = (0.2 * velocity) + (0.9 * velocity * 0) + 3.5;
|
||||||
|
|
||||||
|
// Total Oxygen Consumption (L)
|
||||||
|
const totalO2Liters = (vo2PerKgMin * mass * durationMin) / 1000;
|
||||||
|
|
||||||
|
// Caloric Equivalent (approx 5 kcal per Liter O2)
|
||||||
|
const totalKcal = totalO2Liters * 5;
|
||||||
|
|
||||||
|
// Carbohydrate Requirement (assuming 50% carb oxidation for sustained effort)
|
||||||
|
// Adjusted by humidity penalty (increased thermoregulatory cost)
|
||||||
|
const baseCarbs = totalKcal * 0.5 * (1 + humidityFactor);
|
||||||
|
|
||||||
|
// Glycogen Storage Adjustment
|
||||||
|
const finalLoadGrams = Math.round(baseCarbs / (efficiency / 10));
|
||||||
|
|
||||||
|
// Output formatting
|
||||||
|
const outputText = `
|
||||||
|
> COMPUTATION COMPLETE.
|
||||||
|
> --------------------------------------------------
|
||||||
|
> DISTANCE: ${distance.toFixed(2)} KM
|
||||||
|
> VELOCITY: ${velocity.toFixed(2)} M/MIN (${(60/(velocity/1000)).toFixed(1)} min/km)
|
||||||
|
> DURATION: ${durationMin.toFixed(1)} MINUTES
|
||||||
|
> ESTIMATED ENERGY COST: ${totalKcal.toFixed(0)} KCAL
|
||||||
|
> HUMIDITY PENALTY: ${(humidityFactor * 100).toFixed(0)}%
|
||||||
|
> --------------------------------------------------
|
||||||
|
> PRESCRIBED PRE-DAWN LOAD: ${finalLoadGrams}g CARBOHYDRATES
|
||||||
|
> --------------------------------------------------
|
||||||
|
> NOTE: CONSUME 90 MINUTES PRIOR TO START.
|
||||||
|
> HYDRATION: 500ML + ELECTROLYTES.
|
||||||
|
`;
|
||||||
|
document.getElementById('output').innerText = outputText;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
36
run-fuel.json
Normal file
36
run-fuel.json
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
{
|
||||||
|
"schema_version": "1.0",
|
||||||
|
"author": "bhartiben-patel",
|
||||||
|
"location": "Houston, TX (29.76° N, 95.36° W)",
|
||||||
|
"model": {
|
||||||
|
"name": "ACSM_Running_VO2_Equation_Adapted",
|
||||||
|
"source": "American College of Sports Medicine Guidelines (2009)",
|
||||||
|
"formula": "VO2_ml_kg_min = (0.2 * S_m_per_min) + (0.9 * S_m_per_min * G_slope) + 3.5_resting_baseline",
|
||||||
|
"constants": {
|
||||||
|
"resting_vo2": 3.5,
|
||||||
|
"horizontal_cost_coefficient": 0.2,
|
||||||
|
"vertical_cost_coefficient": 0.9,
|
||||||
|
"oxygen_caloric_equivalent": 5.0
|
||||||
|
},
|
||||||
|
"environmental_modifiers": {
|
||||||
|
"dry_sea_level": 0.02,
|
||||||
|
"gulf_coast_dawn": 0.05,
|
||||||
|
"summer_peak": 0.08
|
||||||
|
},
|
||||||
|
"glycogen_efficiency_states": {
|
||||||
|
"baseline_trained": 12,
|
||||||
|
"elite_adaptation": 15,
|
||||||
|
"supercompensation": 18
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"validation": {
|
||||||
|
"test_case": {
|
||||||
|
"mass_kg": 68,
|
||||||
|
"distance_km": 16.09,
|
||||||
|
"pace_min_per_km": 5.0,
|
||||||
|
"expected_velocity_m_per_min": 200,
|
||||||
|
"humidity_factor": 0.05,
|
||||||
|
"efficiency_state": 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
313
stitch-and-strategy.html
Normal file
313
stitch-and-strategy.html
Normal file
@ -0,0 +1,313 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial viewport">
|
||||||
|
<title>Stitch & Strategy | Bhartiben Patel</title>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--watercolor-blue: #4A90E2;
|
||||||
|
--watercolor-gold: #D4AF37;
|
||||||
|
--deep-indigo: #2C3E50;
|
||||||
|
--soft-cream: #F5F5F0;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
background: linear-gradient(135deg, var(--soft-cream) 0%, #E8E8E3 100%);
|
||||||
|
color: var(--deep-indigo);
|
||||||
|
line-height: 1.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background: linear-gradient(45deg, var(--watercolor-blue), #6B9BD0);
|
||||||
|
color: white;
|
||||||
|
padding: 3rem 2rem;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
header::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: url('https://images.pexels.com/photos/6786953/pexels-photo-6786953.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940') center/cover;
|
||||||
|
opacity: 0.15;
|
||||||
|
mix-blend-mode: multiply;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
font-weight: 300;
|
||||||
|
letter-spacing: 0.1em;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.subtitle {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-style: italic;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 4rem auto;
|
||||||
|
padding: 3rem;
|
||||||
|
background: white;
|
||||||
|
box-shadow: 0 10px 40px rgba(0,0,0,0.1);
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section {
|
||||||
|
margin-bottom: section {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
color: var(--watercolor-blue);
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
border-bottom: 2px solid var(--watercolor-gold);
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-box {
|
||||||
|
background: linear-gradient(135deg, var(--soft-cream), #E8E8E3);
|
||||||
|
border-left: 4px solid var(--watercolor-gold);
|
||||||
|
padding: 2rem;
|
||||||
|
margin: 2rem 0;
|
||||||
|
border-radius: 0 8px 8px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-box h3 {
|
||||||
|
color: var(--deep-indigo);
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-box ul {
|
||||||
|
list-style: none;
|
||||||
|
padding-left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-box li {
|
||||||
|
padding: 0.5rem 0;
|
||||||
|
border-bottom: 1px dashed #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-box li::before {
|
||||||
|
content: '✦';
|
||||||
|
color: var(--watercolor-gold);
|
||||||
|
margin-right: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quote {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
font-style: italic;
|
||||||
|
color: var(--watercolor-blue);
|
||||||
|
text-align: center;
|
||||||
|
padding: 3rem;
|
||||||
|
background: linear-gradient(to right, #F8F8F5, #F0F0EC);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 3rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin: 3rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item {
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item:hover {
|
||||||
|
transform: scale(1.02);
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item img {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery-item .caption {
|
||||||
|
padding: 1rem;
|
||||||
|
background: var(--deep-indigo);
|
||||||
|
color: white;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta {
|
||||||
|
background: linear-gradient(135deg, var(--watercolor-blue), #5B9FD9);
|
||||||
|
color: white;
|
||||||
|
padding: 3rem;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 4rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta h3 {
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta a {
|
||||||
|
display: inline-block;
|
||||||
|
background: white;
|
||||||
|
color: var(--watercolor-blue);
|
||||||
|
padding: 1rem 3rem;
|
||||||
|
border-radius: 50px;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: none;
|
||||||
|
margin-top: 1rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta a:hover {
|
||||||
|
transform: translateY(-3px);
|
||||||
|
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
padding: 3rem;
|
||||||
|
background: var(--deep-indigo);
|
||||||
|
color: white;
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a {
|
||||||
|
color: var(--watercolor-gold);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
margin: 2rem 1rem;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gallery {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Stitch & Strategy</h1>
|
||||||
|
<p class="subtitle">Where ancient craftsmanship meets modern preparation</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section>
|
||||||
|
<h2>The Art of Preparation</h2>
|
||||||
|
<p>
|
||||||
|
In 1070, when the Bayeux Tapestry was first stitched into existence, every thread told a story of patience, precision, and purpose. Today, as we prepare for the 2026 FIFA World Cup across three nations, the same principles apply—only now our canvas is global, and every detail matters.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Just as the anonymous artists of Bayeux carefully placed each stitch to document history, we too must plan with intention. From the venues in Mexico, the United States, and Canada to the millions of fans who will gather, every element requires the same meticulous care that went into those medieval textiles.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="fact-box">
|
||||||
|
<h3>The Numbers Behind the Art</h3>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Bayeux Tapestry:</strong> Created around 1070, this 70-meter-long embroidered cloth depicts the Norman conquest of England</li>
|
||||||
|
<li><strong>2026 FIFA World Cup:</strong> The 23rd edition, hosted across the United States, Mexico, and Canada</li>
|
||||||
|
<li><strong>Venues:</strong> From Arrowhead Stadium to SoFi Stadium, each location represents a convergence point of preparation and passion</li>
|
||||||
|
<li><strong>Monthly Views:</strong> Over 5.8 million people are watching, planning, and dreaming of this summer's spectacle</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="quote">
|
||||||
|
"The best paint job starts with the best prep."
|
||||||
|
<br><br>
|
||||||
|
<small>— A truth as true for embroidery as for every other craft</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2>When Every Stitch Counts</h2>
|
||||||
|
<p>
|
||||||
|
There's a quiet beauty in the way preparation unfolds. Like the careful placement of each thread in the Bayeux Tapestry, every decision we make in planning matters. The difference between a masterpiece and a mistake often comes down to those details we might be tempted to rush.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
In my own work as a strategist, I've learned that the most successful plans aren't the ones that avoid mistakes—they're the ones that anticipate them, plan for them, and turn potential detours into opportunities for something even better.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="gallery">
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://images.pexels.com/photos/6786953/pexels-photo-6786953.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Intricate textile pattern">
|
||||||
|
<div class="caption">Every thread tells a story</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://pixabay.com/get/gd12096c140aec8f226965ba24fd1dd9e4ad524a4611090bcaf14dcf4ef46ddd6cb4106e2b4a12ae0495559f815fcc4e0496586cc4354ad5ed555e6e044760425_1280.jpg" alt="Needle and thread in action">
|
||||||
|
<div class="caption">The tools of precision</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gallery-item">
|
||||||
|
<img src="https://images.pexels.com/photos/20610615/pexels-photo-20610615.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Golden patterns in fabric">
|
||||||
|
<div class="caption">Where art meets strategy</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2>The Competition Within</h2>
|
||||||
|
<p>
|
||||||
|
I've spent years in the quiet hours before dawn, running through Houston streets while my mind works through the numbers, the plans, the possibilities. There's a competitive fire in me, but it's not about beating others—it's about beating my own best work.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
When I look at the Bayeux Tapestry, I see the same discipline that drives me to create operational roadmaps that work. When I think about the 2026 World Cup, I see the same attention to detail that makes a plan come together.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="cta">
|
||||||
|
<h3>Ready to Create Your Masterpiece?</h3>
|
||||||
|
<p>
|
||||||
|
Whether you're planning a project, building a business, or just trying to make something beautiful, remember: the best work comes from preparation, patience, and the courage to place each stitch with intention.
|
||||||
|
</p>
|
||||||
|
<a href="https://bhartiben-patel.4ort.net/">Visit My Website</a>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>
|
||||||
|
Made with love and data by <a href="https://bhartiben-patel.4ort.net/">Bhartiben Patel</a>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Inspired by the Bayeux Tapestry and the 2026 FIFA World Cup
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user