[player-coachhelm][mobile] Ring gauge renders as a broken C-shape — track stroke is invisible (GAME STRENGTH + Resilience)

[njrini99-code]

Where

src/components/golf/coachhelm/player/CompositeRatingCard.tsx (GAME STRENGTH, "50 / 100") and the Resilience ring in src/components/golf/coachhelm/player/ShotAnalysisCard.tsx ("1.1 · Good recovery"). Both use the same hand-rolled SVG progress ring pattern.

Evidence

IMG_4977 (GAME STRENGTH gauge), IMG_4979 (Resilience gauge).

Root cause (confirmed in source)

CompositeRatingCard.tsx ~line 143-165 draws a full-circle SVG ring:

• Track circle: className="stroke-warm-100" — warm-100 is near-cream, essentially invisible on the cream card background.
• Value arc: an animated m.circle with strokeDasharray/strokeDashoffset filling to the value %.

At value = 50/100 the orange arc fills ~half the circle; because the grey track is invisible, the eye sees only a floating half-arc, which reads as a broken / incomplete C-shape open on the left rather than an intentional gauge. (Same pattern → same effect for the Resilience ring.)

How it should fill (architecture)

• The track must be visible at a proper contrast (a real neutral ring, e.g. a warm/inset token with enough delta from the card), so a partial fill reads as "half of a full gauge," not a broken arc.
• Decide the gauge intent explicitly: a full 360° ring (track always a full circle) vs a 270° speedometer arc. Whichever, make the unfilled portion legibly present.
• Cap-and-rotation should place the "start" of the arc at a natural anchor (top or bottom), not leave an ambiguous left gap.
• Fold this into the Fairway-native gauge used by the cockpit ([player-coachhelm][architecture] Lower half of the page is the un-redesigned "old shell" — unify into the Fairway cockpit language #969) rather than keeping bespoke SVG rings, so every gauge on the page looks like one family.

Acceptance criteria

• At any value (including 50/100 and 1.1), the gauge reads as an intentional, complete gauge — visible track + fill — never a floating broken arc.
• GAME STRENGTH and Resilience use the same gauge treatment.
• reduced-motion safe; verified on mobile against prod (rinin376).

[coderabbitai]

🔗 Related PRs

#203 - fix(fairway): demo-day fixes — stats parity, signals/goals/stats bugs, build font [merged]
#212 - polish(fairway): premium pass — signals density, empty-state, copy, drawer radius [merged]
#213 - fix(round-review): momentum per-hole, SG caption consistency, rounded % [merged]
#954 - Fix train: overnight QA issues #943-#950 + #952 (7 lanes, validated as one tree) [merged]
#967 - Redesign: player CoachHelm — fix overlaps, de-jargon, collapse hollow panels [open]

---

📝 Issue Planner

_{Check the box below or use the @coderabbitai plan command to generate an implementation plan and prompts that you can use with your favorite coding assistant.}

• Create Plan

---

🧪 Issue enrichment is currently in open beta.

You can configure auto-planning by selecting labels in the issue_enrichment configuration.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

💬 Have feedback or questions? Drop into our discord!

[njrini99-code]

Fixed and shipped to production in #975 (main @ cd2e61d). Verified rendering via pre-deploy review.