Design · .impeccable/review/finish-review.md

disposition: fix

Inputs read in full: finish-reviewer.md, craft-floor.md, design-portal.md, PRODUCT.md, portal.html (921 lines, post-patch), desktop.png (1280×800 @1×, valid), mobile.png, all seven state captures, wall-board.png, wall-hero.png. Nothing went unread. Code-led build: the board and hero are critique references, not a comp; no element matrix is drawn against them.

persistence

Pass.

PRODUCT.md exists and carries Portal Priorities and Brand Commitments.
Code-led: no .impeccable/build/state.json, no comp round, no .impeccable/mocks/ — none required. .impeccable/ holds direction-round-1/2/3.json, corroborating the two re-rolls the contract names.
FORM carries a seed key: "Seed key 45fa51bb, re-roll 2". Pass.
DESIGN.md absent: new world, written after this review. Not a finding.

fidelity

Judged against the direction contract (OWN-WORLD, FIRST VIEWPORT, STORY) and PRODUCT.md. Ground sampled from pixels.

Element	State	Evidence
GROUND #0F1114	match	desktop.png (40,40) and mobile.png (10,1450) both sample (15,17,20) = #0F1114. Surfaces #171A1F / #1F242B as named.
TYPE: Big Shoulders Display caps for wordmark, row heads, big figure; Schibsted Grotesk UI	match	`--display`, `--ui` lines 18–19; rendered in all captures. Character (compressed, high-x grotesque) fits the title-wall world. Defect inside the match: `tabular-nums` on Schibsted gives the comma a full figure advance — "1 ,204", "1 ,804" in state-links.png / state-earnings.png read as broken numbers.
`--fg-3` #7F858F vs contract #6E747D	acceptable adaptation	#6E747D on #0F1114 ≈ 3.9:1 fails the 4.5:1 body floor; the lift is forced by the craft floor.
MATERIAL: tiles as flat tint + type poster	match for caption/script/email tiles (the committed type-led form); contradicted for the three image-class tiles (`before-after` "Image · 4:5", `story` "Story · 9:16", `booked-onepager` "One-pager")	For an image asset the tile is the picture the affiliate will post; a type poster standing in for it hides the product. Also `.tile::before` paints a 12% white 160° wedge — an imitation sheen, not a material the page renders.
Header 56px, wordmark left, code chip right	match	`.hdr`, mobile.png top.
Billboard figure 56px "AVAILABLE $412.80" + 14px state line + GET A LINK 48px	acceptable adaptation	Rendered as a 44px sentence "$412.80 IS YOURS ON NOV 1." with the pending amount and date beneath; serves STORY ("every figure carries its state word and its date") better than a label. Copy defect inside it: "Three products below are yours to promote" while the WhoHire row reads "Not enrolled" — two are yours.
Billboard quiet link "Payout rules & what you can say"	added, cited	Portal Priority 2 (guidelines) — PRODUCT.md §Portal Priorities. Acceptable.
Row heading 20px caps + 20px mark + extent	match	22px, mark 20px, "6 new".
Tiles 140×4:5, 12px radius, 8px gap, hairline-free	match	136px basis; `.tile` has no border.
Focus tile: 1.06 scale, neighbors slide, row lifts 2px, wall dims 60%	adaptation, uncited → defect	`.tile.focus{transform:scale(1.03)}`; growth is barely legible in mobile.png. Dim fires on landing (`focusTile(...)` at load adds `has-active`), so rows 2–3 arrive at 60% — GETBOOKED is visibly dimmer in mobile.png before any gesture, which fights Priority 1 (see what you can promote).
Focus content: title, PAYS, "0:38 · 0:05 to copy", NEW, Use this	acceptable adaptation	"0:38" dropped for a caption with no runtime; sensible.
Row 2 GETBOOKED peeks below fold	match	mobile.png.
Bottom bar 64px, four tabs, 1.5px stroke icons, counts, active accent	match	`.tabs`, `.tab svg{stroke-width:1.5}`.
Accent spent on exactly three things	contradicted	Beyond focused-tile border / primary action / money, accent is on: `.row-h .ext` ("6 new"), `.tile .new` chips (fill), `.tile .used` (fill), `.tab .n` badge (fill), `.st.approved`, `.caption .lnk`, `a`, `.code i`, `.wordmark b`, `.band`, `.speed input`. The tab-active accent is granted by FIRST VIEWPORT; the prompter band and slider are that surface's single focal line and are judged acceptable; the rest is unauthorized spend.
"Collateral artwork and product marks are the only other color"	contradicted	`#FFD08A` amber on `.lines .disc`, `.take .burn`, and the sheet script's disclosure span (inline style). A fourth color not in the contract.
Held/reversed as a word in #FF6B57, never a fill	match	`.st.held/.reversed`, `.amt.neg`.
Elevation shadow only, never border under shadow	match on the wall; minor miss on the stage	`.phone{box-shadow:0 0 0 1px var(--line),0 40px 80px…}` is the ghost-card pattern on the device shell.
Desktop as "a wider view of the same thing" (brief scope; PRODUCT principle 2)	contradicted	desktop.png shows a 390px phone emulator on a stage with the content scrolling inside a 752px shell. That is a prototype stage, not a desktop view of the product. The caption labels it a prototype, which excuses the staging but does not make a desktop view exist.
Two tiers, no third	match	5% override only; "It earns nothing by itself" copy.
Example data labeled	partial	Wall/Studio/Earnings carry "Prototype. Example data." Links view carries none while showing 1,204 / 17 sales / "you earn 5%". Studio "Payout rules" states "Paid on the 1st · Anything over $50" and the rows state 25% / 20% / 5% as rules; PRODUCT.md lists rates and threshold as "Undecided (do not invent)".

ceiling

Not reached. Against the title-wall board and hero:

Material: the board's grain / sheen / mesh are unused; the billboard is a flat surface card where the world's marquee is image-backed with a light fall-off. The one sheen present (.tile::before) is a flat white wedge, not lighting.
Imagery: the world is built on pictures; the build has none, even for assets that are pictures.
Focus treatment: the board's focused card shows metadata beneath the title in one line; the build stacks a category eyebrow above the headline.
Frame and depth: the row dim/lift are present; the focus growth is too small to read as the memorable moment.

material_fixes

Accent and added color (OWN-WORLD). portal.html: .tile .new{background:var(--accent-fill)} → background:rgba(255,255,255,.16);color:#fff (backdrop-filter already on .dur; reuse); .tile .used fill → var(--fg) with #111 check; .row-h .ext → color:var(--fg-2); .tab .n badge → keep var(--surface-3) for all tabs (drop .tab.on .n fill); .st.approved → var(--fg) and .st.paid → var(--fg-2) so the state ladder is pending #7F858F → approved #ECECEA → paid #A6ABB3, warn for held/reversed; .caption .lnk, a → var(--fg) underlined. Remove #FFD08A from .lines .disc, .take .burn, and the inline style="color:#FFD08A" in openSheet; set the disclosure to #fff at weight 700 in the prompter and var(--fg) in the sheet.
Kicker eyebrows (floor ban). .tile .cat and .poster .cat sit above the poster headline as letterspaced caps. Move the category into the foot as the leading item of the metadata ("Social caption · 0:05" in .dur's slot), start .art at top:12px, and in the focused tile carry it in the TAKES value ("0:05 to copy a caption"). .script .cue "SCRIPT · READS IN ABOUT 0:28" → a trailing meta line under the script in var(--fg-3), sentence case.
Image collateral renders as type (MATERIAL). produce: three raster thumbnails as example assets — before-after (4:5), story (9:16, letterboxed in the 4:5 tile), booked-onepager (page thumbnail) — watermarked "example" in-image; reference them as background-image on those .tiles and the sheet .poster, with the dark foot ramp retained for legibility. Cut the .tile::before white wedge or replace it with the tint's own light-to-dark gradient.
Ledger legibility (Trust is the interface). state-earnings.png: every title ellipsizes ("Monthly plan · m…") and subtitles lose the fact ("Direct · Sep 3 · refu…", "Direct · Aug 22 · und…"). Keep the 56px fixed geometry; rewrite copy to fit the ~170px title track: .t "Month 3", "Annual · first", "Month 1 · override", "Month 1 · refunded", "Month 1 · under review"; .s carries "Direct · Oct 2" / "Marcus · Sep 28". Fix the billboard line to "Two products below are yours to promote; one more to join." Fix the comma: scope .num{font-variant-numeric:tabular-nums} to .amt, .fact .v, .clock, #takeLen only, and let 1,204-class counts in .item .r and .facts use proportional lining figures (font-variant-numeric:lining-nums).
Hero-metric template (floor). .facts is four same-size cards of caps-label over number. Collapse into the .period row as one tabular sentence: "1,804 clicks · 1,412 visitors · 26 sales · $0.34 EPC", figures var(--fg), words var(--fg-2); the pro gets density in one line, the novice meets no stat grid.
Unlabeled rules (Truth). Add <p class="foot-note">Prototype. Example data and example rates.</p> to #view-links. In Studio "Payout rules" set the h2 .ext to "Example rules" and in Links the recruiting lead "you earn 5%" → "you earn an override (example: 5%)". Rates on row headings ("25% for 12 months") are covered by the wall foot-note; leave them.
The memorable moment. .tile.focus{transform:scale(1.06)} per contract (give .rail padding-block:14px 18px so the 24px shadow is not clipped by overflow-x:auto). Add has-active only inside the click handler; the initial focusTile(..., false) call should set .focus and .active without dimming the wall, so landing shows all three products at full strength.
Desktop is not a wider view (brief scope). Either compose the ≥720 layout from the same DOM — billboard as a left column (max 420px), rows filling the right with longer rails, tabs becoming a left rail — or, if desktop is deferred this round, say so in .stage-note ("desktop view not yet designed") so the stage is not read as the desktop. Either way drop the 0 0 0 1px var(--line) ring from .phone (border under shadow).

minor

Prompter: .cam .sim::after "CAMERA PREVIEW" sits at the reading band and shows through the script in both prompter captures; move to top:10% or hide it once #lines has content. .cam .safe (bottom:120px) is under the .pbot gradient and its label crams beneath "150 wpm"; lift to bottom:210px or drop the label.
.take .burn reads as a developer note ("· burned in, seconds 0–3"); rewrite "Disclosure burned into the first 3 seconds." in var(--fg-2).
Recruiting row .mark uses a "+" text glyph; the New link button already has the drawn SVG plus — reuse it.
<button class="tile" role="listitem"> overrides the button role for assistive tech; wrap as <li><button> inside a <ul class="rail">. Locked tiles are aria-hidden yet role="listitem"; drop the role.
Links and Studio are stacks of identical surface cards (.item); on sub-views, hairline-separated rows would read less like the category default the thesis refuses. Not blocking.
.tile .art{max-height:48%;overflow:hidden} will clip five-line posters ("Three clients asked me the same thing") at 136px; cannot verify from captures — check that tile.
Dead CSS: .lrow .d is unused.
Detector lines: (a) #000-on-ground pairings — false, static pairing of button text with the page ground; (b) #7f858f on #ffffff — false, no fg-3 text sits on a white surface; (c) uppercase poster art — committed form, accepted; (d) tally inset — false, 10px padding present; (e) .phone clip — intentional for slide-in layers, accepted.

keep

The billboard sentence with the tabular Big Shoulders figure, and the focused tile's PAYS / TAKES / Use-this stack — the one-glance read and the one-gesture action are the thesis; every fix above must leave them untouched.

Verdict pass

Evidence: the regenerated captures in .impeccable/review/ (desktop.png and desktop-asset-sheet.png 1280×800 @1×; mobile.png and eight state captures 750×1624 @2×) plus design/prototype/portal.html as patched. The parent's narration was not used as evidence.

verdict

#	Fix	Score	Evidence
1	Accent and added color	resolved	`grep FFD08A` → 0 hits. mobile.png: "6 new" in #A6ABB3, New chips are white-16% glass, wordmark dot and code-chip dot grey, tab badge stays surface-3 on the active tab. state-earnings.png: APPROVED white, PAID grey, PENDING #7F858F, REVERSED/HELD coral as words. state-asset-sheet.png: caption link white underlined. state-take-review.png: burn note grey, reworded. Source: `a{color:var(--fg)}`, `.st.approved{color:var(--fg)}`, `.tab.on .n{background:var(--surface-3)}`.
2	Kicker eyebrows	resolved	`class="cat"` → 0 occurrences in markup; no letterspaced label above any poster headline in mobile.png, desktop.png, or either sheet capture. Category now leads the foot chip ("Script · 0:28", "Image · 4:5", "One-pager · PDF", "Caption · 0:05") and the focused TAKES value reads "0:05 to copy the caption". Dead rules `.tile .cat`, `.tile.locked .cat`, `.poster .cat` remain at lines 89/111/201 — cleanup, not a regression.
3	Image collateral as raster	resolved	desktop.png: the "Check-in, 12 weeks" tile carries the framed-phone check-ins image; the "How GetBooked works" tile is a cream page thumbnail with the booked.coach wordmark; state-asset-image.png shows the same image in the sheet poster. The diagonal white wedge is gone — tiles show a top-light-to-dark ramp. The story tile is off-rail in every capture; verified from source only (`assets/story.webp`, six `data:image` URIs). Detector's `#ffffff on #f6f1e7` is a false pairing: the one-pager title sits on the dark foot ramp.
4	Ledger legibility, billboard copy, tabular comma	resolved	state-earnings.png: every title and sub reads in full ("Month 1 · override / Marcus · Sep 28", "Month 1 · refunded / Direct · Sep 3"), 56px rows intact, amounts right-aligned. state-links.png: "1,204" proportional, no gap at the comma; facts line "1,804 clicks". mobile.png billboard: "Two products below are yours to promote; one more to join."
5	Hero-metric template	resolved	state-earnings.png: the four stat cards are gone; one sentence "1,804 clicks · 1,412 visitors · 26 sales · $0.34 EPC", figures white, words grey (`.facts-line`, line 596).
6	Unlabeled rules	resolved	state-links.png: foot-note "Prototype. Example data and example rates." and lead "you earn an override on what they sell (example: 5%)." Studio "Payout rules" ext "Example rules" at source line 565 (below the fold in state-studio.png).
7	The memorable moment	resolved	Source `.tile.focus{transform:scale(1.06)}`, `.rail{padding:14px 16px 18px}`, `focusTile(tile, scroll, dim)` with `has-active` gated on `dim`. mobile.png: the focused tile is visibly larger than its neighbor and the GETBOOKED heading and mark arrive at full strength (previous capture had them at 60%).
8	Desktop as a wider view	resolved	desktop.png: no stage, no shell, no ring; a 96px left tab rail, the billboard as a left column, HEALTHYAPP and GETBOOKED rows filling the right with 168/262px tiles; desktop-asset-sheet.png: the sheet opens as a right panel over a dimmed wall. Ground samples #0F1114.

regressions introduced by the batch (judged by the same rules)

Desktop composition hole. desktop.png: the billboard column ends at y≈395 and the left field below it (≈400px tall) is empty while the right column runs the full height; the rail also runs under the right viewport edge with no end gutter and the fourth tile is cut mid-letter ("THR / ASK / SAM") with "6 new" flush to the edge. Give .rail a right scroll-padding/end spacer matching the 24px gutter, and either let the billboard column carry the foot-note and WhoHire join card beneath it or stop it being sticky so the rows' left edge owns the column.
Scaled focus tile breaks the phone gutter. mobile.png: the 1.06 tile's left edge sits at ≈9px CSS (ring at ≈18/2 px) against the 16px page gutter. Set .rail{scroll-padding-inline:20px} and padding-inline:20px or offset the focused tile with transform-origin:left center so the ring lands on the gutter line.
Caption-safe line now crosses the script. state-prompter-recording.png: the lifted hairline (y≈1200) cuts between the second and third paragraphs of the scrolling text. Place it beneath the scroller's mask fade (below the 80% mask stop) or render it only in standby.

remaining

clear — all eight material fixes resolved; the three regressions above are minor and do not reopen a material row.

disposition: ship

Scoped as the contract requires: this ship covers the eight scored fixes on the recaptured evidence, not a fresh review of the whole surface.

Rendered from .impeccable/review/finish-review.md. Edit the source, not this page.