From 9acee2bd819a9202f197683ecaa8d1d650a0d695 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Thu, 14 May 2026 12:34:47 +0200
Subject: [PATCH] =?UTF-8?q?feat(targets):=20MOOD=5FSTABILITY=20headline=20?=
 =?UTF-8?q?switches=20from=20=CF=83=20to=20verbal=20label?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The card used to render the raw σ value ("0.42 σ") as the big headline
number. Most users cannot interpret a standard deviation; the W3e
research found this was the single biggest "what does this mean?"
friction point in the v1.4.22 page.

Replace with a three-state verbal label keyed by the
`moodStabilityLabel(sigma)` helper landed in the previous phase
(thresholds: < 1.0 stable, < 2.0 variable, ≥ 2.0 highly variable).
Translations under `targets.mood.stability.{stable,variable,highlyVariable}`
in EN + DE.

The raw σ value stays one hover away — the headline carries a
tooltip surfacing "σ = 0.42" so power users keep the precise number
without forcing every visitor to decode it. Headline also gets a
`capitalize` class so the lowercase i18n string ("stable" / "stabil")
renders sentence-cased.
---
 src/components/targets/target-card.tsx | 32 ++++++++++++++++++++------
 1 file changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/components/targets/target-card.tsx b/src/components/targets/target-card.tsx
index 79e7a8a50..b48451aa8 100644
--- a/src/components/targets/target-card.tsx
+++ b/src/components/targets/target-card.tsx
@@ -454,13 +454,31 @@ export function TargetCard({
           <div className="flex flex-col gap-1">
             <div className="flex items-baseline gap-2">
               {moodStabilityValue && moodStabilityCopy ? (
-                <span
-                  className="text-foreground text-2xl leading-none font-semibold sm:text-3xl"
-                  data-slot="target-headline-value"
-                  data-mood-stability={moodStabilityValue}
-                >
-                  {moodStabilityCopy}
-                </span>
+                // v1.4.25 W3e — verbal label is the headline; the raw σ
+                // moves into a tooltip so power users keep the precise
+                // number one hover away without forcing every visitor
+                // to read "0.42 σ" and decode it.
+                <TooltipProvider>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <span
+                        className="text-foreground text-2xl leading-none font-semibold capitalize cursor-help sm:text-3xl"
+                        data-slot="target-headline-value"
+                        data-mood-stability={moodStabilityValue}
+                      >
+                        {moodStabilityCopy}
+                      </span>
+                    </TooltipTrigger>
+                    <TooltipContent>
+                      <p className="text-xs">
+                        σ ={" "}
+                        {target.current != null
+                          ? target.current.toFixed(2)
+                          : "—"}
+                      </p>
+                    </TooltipContent>
+                  </Tooltip>
+                </TooltipProvider>
               ) : isBp && bpDiastolic?.current != null ? (
                 <span
                   className="text-foreground flex items-baseline gap-1 text-2xl leading-none font-semibold sm:text-3xl"