01
02
Bruce Lee's three-clause declaration as a 56px Spectral Italic banner headline on newsprint cream — the lime rule splits the masthead from the revelation, three newspaper columns of signals and work follow below, Bud Cauley's −17 inked in the center column, a new lunar cycle dated in the dateline strip.
Why
The Bruce Lee quote arrived loaded with two simultaneous frames: a philosophical declaration about self-knowledge as the precondition for perceiving others, and a statement about how this portfolio actually works — it looks at itself (the raw YAML, the day's signals, the archive of recent decisions) before it can compose a day's face. The waxing crescent at 4.4% on day 1.99 of a fresh cycle is the calendar correlate: a literal clean slate, a night with almost no interference from old light. The quote isn't aspirational decoration; it is the operating instruction.
The Broadsheet archetype follows necessarily. A Poster would frame the quote as a single precious object. A Broadsheet makes the quote a newspaper banner headline — it has editorial gravity, a dateline, columns of supporting evidence below. The concept is "today's edition of Doug March": the banner headline is the editorial voice, and the three columns below are the proof. Column 1 is the work (what was built), Column 2 is the news (Tigers win, Bud Cauley's −17 at the RBC Canadian Open, the LinkedIn backdoor explosion at 1,265 points on HN), Column 3 is the person (capabilities, timeline). The layout enacts the quote's logic — first the declaration, then the inventory that earns it.
Spectral-Albert is the chassis because this phrase "doesn't want shouting." Spectral ExtraBold Italic at 56px in a newspaper banner register is authoritative without being aggressive — it has the gravity of permanent ink, not the pressure of a stadium screen. Albert Sans's precise geometric structure in the columns creates the counterweight: rational, legible, workhorse. The lime-on-newsprint palette completes the chain: H:72° sits dead-center in the 66–85° open mandate window, and it is exactly the right hue for self-transparency — electric lime is the color of a clear signal, of fresh starts, of June at its most alive. Against cream newsprint it reads as the moment a thought becomes visible.
Visual specification
1. Color Specification
2. Typography (spectral-albert chassis)
display token), clamp(30px, 4.2vw, 56px), spanning the full content width as a 3-line newspaper banner headline. Natural line breaks:
text-wrap: balance, letter-spacing: -0.02em, line-height: 1.08letter-spacing: 0.10em, font-variant-caps: all-small-caps, color: stone-600; sits 12px below the last headline line with a 1px lime-500 rule betweenletter-spacing: -0.02em, stone-900letter-spacing: 0.14em, lime-700line-height: 1.5, stone-900line-height: 1.2font-variant-numeric: tabular-nums, stone-8003. Layout Specification
#page { display: flex; flex-direction: column; max-width: none; padding: 0 6vw; }
#masthead { display: flex; justify-content: space-between; align-items: center;
height: 60px; border-bottom: 3px solid #8BBF12; }
#dateline { display: flex; gap: 24px; align-items: center;
padding: 8px 0; border-bottom: 1px solid #DDD7C3;
font: 10px/1 Albert Sans; letter-spacing: 0.12em; text-transform: uppercase; }
#banner { padding: 32px 0 20px; border-bottom: 1px solid #DDD7C3; }
#columns { display: grid; grid-template-columns: 1.15fr 1fr 0.85fr;
min-height: calc(100vh - 380px); }
.col { padding: 20px 24px; border-right: 1px solid #DDD7C3; }
.col:last-child { border-right: none; }
min-height: 220px (3 headline lines + lime rule + attribution)min-height: calc(100vh - 380px), no max-height6vwletter-spacing: 0.08em, stone-700.4. Component Character
0px everywhere — uncompromisingly flat newsprint. No rounded corners on cards, buttons, tags, or pills.#DDD7C3 (stone-300) for all internal column rules, card borders, row dividers. 3px #8BBF12 (lime-500) for the masthead bottom accent rule. 1px lime-500 for the attribution separator in the banner.color: #384F07 (lime-800), text-decoration: underline. Nav hover: border-bottom: 2px solid #8BBF12. Project title hover: color shifts from stone-900 to lime-800.5. Signal Integration
"DET 9 · 3 OPP" in Albert Sans 12px tabular-nums, stone-800, inside a thin-bordered 1px stone-300 box with a lime-500 left-border accent (3px) and a small "W" in lime-700 bold at right.TUESDAY, JUNE 16, 2026 · ☽ NEW CYCLE DAY 2 · 4.4% LIT · ☀ 04:48 → 19:32 · 14.7 HRS · JUNETEENTH IN 3 DAYS
Albert Sans 10px, all-caps, letter-spacing 0.12em, stone-500.Self-check
clamp(30px, 4.2vw, 56px) on a 1440×900 viewport with 6vw side padding (≈86px each side, content ≈1268px) produces a 3-line newspaper banner occupying ~220px height; no overflow, no sub-marquee collapse; Broadsheet headline scale is the correct target register for this chassis.Rationale
The Bruce Lee quote arrived loaded with two simultaneous frames: a philosophical declaration about self-knowledge as the precondition for perceiving others, and a statement about how this portfolio actually works — it looks at itself (the raw YAML, the day's signals, the archive of recent decisions) before it can compose a day's face. The waxing crescent at 4.4% on day 1.99 of a fresh cycle is the calendar correlate: a literal clean slate, a night with almost no interference from old light. The quote isn't aspirational decoration; it is the operating instruction.
The Broadsheet archetype follows necessarily. A Poster would frame the quote as a single precious object. A Broadsheet makes the quote a newspaper banner headline — it has editorial gravity, a dateline, columns of supporting evidence below. The concept is "today's edition of Doug March": the banner headline is the editorial voice, and the three columns below are the proof. Column 1 is the work (what was built), Column 2 is the news (Tigers win, Bud Cauley's −17 at the RBC Canadian Open, the LinkedIn backdoor explosion at 1,265 points on HN), Column 3 is the person (capabilities, timeline). The layout enacts the quote's logic — first the declaration, then the inventory that earns it.
Spectral-Albert is the chassis because this phrase "doesn't want shouting." Spectral ExtraBold Italic at 56px in a newspaper banner register is authoritative without being aggressive — it has the gravity of permanent ink, not the pressure of a stadium screen. Albert Sans's precise geometric structure in the columns creates the counterweight: rational, legible, workhorse. The lime-on-newsprint palette completes the chain: H:72° sits dead-center in the 66–85° open mandate window, and it is exactly the right hue for self-transparency — electric lime is the color of a clear signal, of fresh starts, of June at its most alive. Against cream newsprint it reads as the moment a thought becomes visible.
Signal integration
"DET 9 · 3 OPP" in Albert Sans 12px tabular-nums, stone-800, inside a thin-bordered 1px stone-300 box with a lime-500 left-border accent (3px) and a small "W" in lime-700 bold at right.TUESDAY, JUNE 16, 2026 · ☽ NEW CYCLE DAY 2 · 4.4% LIT · ☀ 04:48 → 19:32 · 14.7 HRS · JUNETEENTH IN 3 DAYS
Albert Sans 10px, all-caps, letter-spacing 0.12em, stone-500.03
lime
hsl(72 73% 42%)
Self-transparency earns the clearest, sharpest color in the mandate window — electric lime on newsprint cream, the frequency of honest light, a newspaper that prints what it actually sees.
04
Color — 2 ramps, 20 stops
lime
stone
05
No composition grammar. The pipeline had no such concept in the color-directed era.
06