Phase 1a.4: one eyebrow style (4 variants → 1)

.okf/design/site-palette.md

@@ -7,7 +7,7 @@ tags: [design, palette, css, tokens, adr]
 generated:
   by: claude/opus-5
   at: 2026-08-20T00:00:00Z
-timestamp: 2026-08-21T02:05:49Z
+timestamp: 2026-08-21T02:51:33Z
 ---
 
 # Resolved: LIGHT (ADR-0003, 2026-08-20)
@@ -83,6 +83,40 @@ AA (`#0066d6` is 4.78:1). Phase 1a.3 retires that rule for its late-cascade
 specificity, NOT for its colour choice — any replacement must land at AA or
 better. `--ink-900` on white clears it comfortably.
 
+# Ruby fails AA on the dark surfaces — unresolved, and it gates two phases
+
+Measured 2026-08-21 in the rendered production build:
+
+| Token | on `#000` | on `--surface-ink` `#14110f` |
+|---|---|---|
+| `--color-ruby` `#cc342d` | 4.10 **FAIL** | 3.67 **FAIL** |
+| `--color-ruby-hover` `#e04a42` | 5.23 pass | 4.68 pass (thin) |
+| `--ruby-700` `#9e2620` | 2.75 **FAIL** | 2.46 **FAIL** |
+
+Two consequences, and the second is the one that is easy to miss:
+
+1. **A single site-wide eyebrow style is not possible as specified.** The
+   canonical eyebrow (`--color-ruby`, 12px) was designed against LIGHT
+   surfaces. Applied site-wide it drops `home-services-eyebrow` and
+   `home-clients-eyebrow` to 4.10:1 - below AA for normal text, which 12px
+   unambiguously is. A full 41-rule sweep was written, measured and reverted
+   on 2026-08-21 for exactly this.
+2. **Migrating the dark bands to `--surface-ink` makes it WORSE**, because
+   `#14110f` is lighter than `#000`: ruby-on-dark falls 4.10 -> 3.67. So the
+   footer/dark-surface migration cannot ship before the on-dark accent is
+   decided, or it degrades contrast on every band it touches.
+
+Only `--color-ruby-hover` clears AA on both grounds, and it is named for a
+hover state - semantically wrong as a static accent. The ramp has `--ruby-700`
+for "text-on-light where AA needs more" and **no counterpart for dark**.
+Naming one is a design decision; tracked in
+`docs/projects/2608-site-design-system/README.md` under Outstanding.
+
+**Until it is named: do not apply a ruby text token to any surface in the
+section below.** Neither of the two automated gates catches this - those
+homepage sections carry no contrast test, and the screenshot suite passes a
+colour change of this size.
+
 # Where dark is still deliberate
 
 Light is the default, not a monopoly. Three surfaces keep dark **by design** —

.okf/log.md

@@ -28,6 +28,34 @@ make it green: restructure same-day entries under one heading, and add
 `timestamp` to the 23 concepts missing it (anchored to each file's last commit
 time, which is verifiable - never invented).
 
+## 2026-08-21 - ruby fails AA on dark surfaces, and it gates two phases
+
+Measured, not estimated: `--color-ruby` is **4.10:1 on #000 and 3.67:1 on
+`--surface-ink`** - below AA for normal text both times. `--ruby-700` is worse
+(2.75 / 2.46). Only `--color-ruby-hover` clears AA on both, and it is named for
+a hover state.
+
+Synced into [design/site-palette.md](design/site-palette.md) rather than left in
+the project README, because the README is not on the path a session reads. The
+concept now carries the table and a standing instruction: **until an on-dark
+ruby is named, do not apply a ruby text token to any of the three deliberate
+dark surfaces.**
+
+Two phases are blocked by the same unnamed token, which nothing in the plan
+connected:
+
+* "ONE eyebrow style" cannot be one style - the canonical form was designed
+  against LIGHT surfaces, and applying it site-wide drops two homepage eyebrows
+  to 4.10:1. A full 41-rule sweep was written, measured and REVERTED for this.
+* Migrating the dark bands to `--surface-ink` makes contrast WORSE, not better
+  (`#14110f` is lighter than `#000`), so the footer work cannot ship first
+  either.
+
+Neither automated gate catches it: those homepage sections have no contrast
+test, and the screenshot suite passes a colour change of this magnitude. The
+only reason it surfaced is that the eyebrow sweep was contrast-measured before
+being accepted.
+
 ## 2026-08-21 - the --rr-* aliases are gone; 1a.4's other half is blocked
 
 **Done:** all 18 `--rr-*` consumer references migrated to canonical names and

Rakefile

@@ -28,7 +28,7 @@ namespace :test do
   CRITICAL_TESTS =
     "/homepage|blog_index|blog_post$|visit_blog_post|course_|old_blog_url|" \
     "test_services($|_menu)|contact_us|free_consultation|not_found|" \
-    "hamburger|color_system|mermaid|codeblock_language/"
+    "hamburger|color_system|mermaid|codeblock_language|friday_report/"
 
   Rake::TestTask.new(:critical) do |t|
     t.libs << "test"

docs/projects/2608-site-design-system/README.md

@@ -116,6 +116,36 @@ themes sit as sub-sections beneath ONE `## YYYY-MM-DD` heading. That is a
 whole-file restructure, not a find-and-replace, and it conflicts with every
 parallel session appending to that file — do it when the repo is quiet.
 
+**Decide the ruby-on-dark token — it blocks BOTH remaining 1a.4 items.**
+Measured 2026-08-21 in the rendered production build:
+
+| Token | on `#000` | on `--surface-ink` `#14110f` |
+|---|---|---|
+| `--color-ruby` `#cc342d` | 4.10 FAIL | **3.67 FAIL** |
+| `--color-ruby-hover` `#e04a42` | 5.23 pass | 4.68 pass (thin) |
+| `--ruby-700` `#9e2620` | 2.75 FAIL | 2.46 FAIL |
+
+Two consequences, and the second is the one that is easy to miss:
+
+1. **"ONE eyebrow style" is self-contradictory as written.** The canonical
+   eyebrow (`--color-ruby`, 12px) was designed against the blog's LIGHT
+   surfaces. Applying it site-wide drops `home-services-eyebrow` and
+   `home-clients-eyebrow` to 4.10:1 on their dark band - below AA for normal
+   text, which 12px is. The style needs a dark-surface variant.
+2. **Migrating the dark bands to `--surface-ink` makes this WORSE, not
+   better.** `#14110f` is lighter than `#000`, so ruby-on-dark falls from
+   4.10 to 3.67. The footer/dark-surface work therefore cannot ship before
+   the on-dark accent is decided, or it degrades contrast on every band it
+   touches.
+
+Only `--color-ruby-hover` clears AA on both grounds, and it is named for a
+hover state - using it as a static on-dark accent is semantically wrong. The
+ramp has `--ruby-700` for "text-on-light where AA needs more" and no
+counterpart for dark. **The decision is whether to name one** (e.g.
+`--ruby-on-ink`, seeded at `#e04a42` or lighter for more margin), which is a
+design call rather than a sweep. `technologies.css:10` already gestures at
+the problem in a comment.
+
 ## Working notes
 
 Coordinator/session reports do not belong in this directory — write them to

test/system/desktop_site_test.rb

@@ -312,8 +312,11 @@ def test_friday_report
     # promised a report, this one has to promise the next step.
     assert_link "Get a free code audit", minimum: 2
 
-    # No screenshot baseline yet: the 2608 site-wide recolour is mid-flight and
-    # would churn it immediately. Record with the bundle's first visual PR.
+    # Baseline recorded 2026-08-21: this is the bundle's first visual PR
+    # (2608 1a.4 moved .friday-eyebrow onto the canonical eyebrow style), which
+    # is the trigger the deferral named. It will churn again when the dark-surface
+    # recolour lands - that is what a baseline is for.
+    assert_stable_screenshot "friday_report"
   end
 
   def test_free_consultation

test/system/mobile_site_test.rb

@@ -189,7 +189,8 @@ def test_friday_report
     assert_text "This is a composite example, not a real client's report"
     assert_link "Get a free code audit", minimum: 2
 
-    # No screenshot baseline yet - see the desktop test for why.
+    # Baseline recorded 2026-08-21 - see the desktop test.
+    assert_stable_screenshot "friday_report"
   end
 
   def test_free_consultation

themes/beaver/assets/css/components/content-block.css

@@ -113,8 +113,12 @@
  * Common in eyebrow text, labels, and highlights
  */
 .c-content-block--eyebrow {
+  /* 2608 1a.4: one eyebrow style - matches pages/blog-list.css .blog-eyebrow */
   color: var(--color-ruby);
-  font-weight: 600;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
 }
 
 /*

themes/beaver/assets/css/critical/services-critical.css

@@ -177,7 +177,12 @@
 }
 .fl-builder-content .services-eyebrow .fl-rich-text,
 .fl-builder-content .services-eyebrow .fl-rich-text *:not(b, strong) {
-  font-weight: 600;
+  /* 2608 1a.4: one eyebrow style - matches the blog's canonical eyebrow
+     (pages/blog-list.css .blog-eyebrow), which shipped in Phase 2. */
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
   text-align: center;
 }
 

themes/beaver/assets/css/pages/friday-report.css

@@ -43,11 +43,13 @@
 }
 
 .friday-eyebrow {
-  font-weight: 600;
-  font-size: 13px;
-  letter-spacing: 0.18em;
+  /* 2608 1a.4: one eyebrow style - matches pages/blog-list.css .blog-eyebrow.
+     Was 13px/600/0.18em on --ruby-700; margin is page rhythm and stays. */
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.14em;
   text-transform: uppercase;
-  color: var(--ruby-700);
+  color: var(--color-ruby);
   margin: 0 0 16px;
 }