store: card prices render --ink-muted instead of --ink (.product-card p cascade)

yuris commented

2026-08-27 14:30:30 +00:00

Owner

Found by Reviewer55r1 while reviewing PR #55, independently reproduced by Author47b. Pre-existing on 55f5d72; correctly declined as out of scope for #47.

The defect

apps/store/app/globals.css sets .price { color: var(--ink) } at specificity (0,1,0). The pre-existing .product-card p rule is (0,1,1) and wins, so every card price in the store renders --ink-muted rgb(90,97,89) instead of --ink.

Store-wide, not one page: /, /products, /services/<slug>, and every related-products grid.

It matters because the design makes price the loudest element on a card — the spec is blunt that "a stale price is worse than no price", and the retail type scale from #33/#45 was built around price prominence. Muting the colour quietly undoes that.

Why it surfaced now

#47 fixed the same cascade defect one rule away: .stock-badge inside .product-card was losing color to .product-card p. The .is-* pairs are (0,2,0) and win --chip, but never declare color, so color came only from the (0,1,0) list. Fixed there with a .product-card .stock-badge co-selector. .price has the identical shape and was deliberately left, so a store-wide card restyle would not land in a PR titled "product detail".

Relevant history: this defect class was once recorded in a code comment as "unreachable today", which is exactly what deferred it once already. #47's review corrected that comment after measuring. Do not re-derive reachability from prose — measure it.

Fix

One selector, same shape as the fix already in the sheet:

.price, .product-card .price { color: var(--ink); }

Verification

Measure getComputedStyle on a card price on / and /products after #54 and #55 have landed — /products is where it shows most and it was under active change in #46.
Confirm the detail page is unaffected: the owner's committed fix 0d6a787 deliberately makes .product-detail .price outrank the card price (30.4px vs 18.4px). That hierarchy must survive.
Audit, do not patch: this is the third instance of this cascade, so check every other (0,1,0) rule inside .product-card for the same loss.

Acceptance

Card prices compute --ink on every surface rendering a .product-card; the detail-page price hierarchy is unchanged; any sibling rules the audit finds are listed here even if fixed separately.

Found by `Reviewer55r1` while reviewing PR #55, independently reproduced by `Author47b`. Pre-existing on `55f5d72`; correctly declined as out of scope for #47. ## The defect `apps/store/app/globals.css` sets `.price { color: var(--ink) }` at specificity **(0,1,0)**. The pre-existing `.product-card p` rule is **(0,1,1)** and wins, so **every card price in the store renders `--ink-muted` `rgb(90,97,89)` instead of `--ink`.** Store-wide, not one page: `/`, `/products`, `/services/<slug>`, and every related-products grid. It matters because the design makes price the loudest element on a card — the spec is blunt that *"a stale price is worse than no price"*, and the retail type scale from #33/#45 was built around price prominence. Muting the colour quietly undoes that. ## Why it surfaced now #47 fixed the **same cascade defect one rule away**: `.stock-badge` inside `.product-card` was losing `color` to `.product-card p`. The `.is-*` pairs are (0,2,0) and win `--chip`, but never declare `color`, so `color` came only from the (0,1,0) list. Fixed there with a `.product-card .stock-badge` co-selector. `.price` has the identical shape and was deliberately left, so a store-wide card restyle would not land in a PR titled "product detail". Relevant history: this defect class was once recorded in a code comment as *"unreachable today"*, which is exactly what deferred it once already. #47's review corrected that comment after measuring. Do not re-derive reachability from prose — measure it. ## Fix One selector, same shape as the fix already in the sheet: ```css .price, .product-card .price { color: var(--ink); } ``` ## Verification - Measure `getComputedStyle` on a card price on `/` and `/products` **after #54 and #55 have landed** — `/products` is where it shows most and it was under active change in #46. - Confirm the detail page is unaffected: the owner's committed fix `0d6a787` deliberately makes `.product-detail .price` outrank the card price (30.4px vs 18.4px). That hierarchy must survive. - Audit, do not patch: this is the third instance of this cascade, so check every other `(0,1,0)` rule inside `.product-card` for the same loss. ## Acceptance Card prices compute `--ink` on every surface rendering a `.product-card`; the detail-page price hierarchy is unchanged; any sibling rules the audit finds are listed here even if fixed separately.

yuris referenced this issue

2026-08-27 19:26:05 +00:00

feat(store): simplify /services and /contact to the approved design #63

yuris referenced this issue from a commit

2026-08-28 01:52:13 +00:00

fix(store): card prices lose --ink to .product-card p (#57)

yuris referenced this issue from a commit

2026-08-28 01:52:13 +00:00

test(store): pin the card-price cascade and cart-line grid contract (#57, #58)

yuris referenced this issue from a pull request that will close it,

2026-08-28 01:53:47 +00:00

fix(store): card prices lose --ink to .product-card p; pin the cart-line grid (#57, #58) #67