Dai una gerarchia ai pesi tipografici

Quasi tutto il testo dell'app stava fra 600 e 800: etichette, valori, indirizzi,
conteggi, voci di elenco. Un grassetto ovunque non segnala niente, e la pagina
Profilo era il caso peggiore — ogni riga gridava come un titolo.

La scala ora ha quattro gradini, documentati nei token:
  400  corpo, metadati, valori descrittivi
  500  etichette di campo, voci di lista, testo dei controlli
  600  stati brevi (badge, voce attiva), nomi in una riga di elenco
  700  titoli, uno solo per blocco

Sopra il 700 non si sale: l'800 dei titoli di card e dell'avatar e' sceso a 700.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

SteUp.Shared/wwwroot/css/base.css

@@ -116,13 +116,13 @@ img {
 .t-label-lg {
     font-size: var(--label-lg-size);
     line-height: 1.25;
-    font-weight: 600;
+    font-weight: 500;
 }
 
 .t-label-md {
     font-size: var(--label-md-size);
     line-height: 1.25;
-    font-weight: 600;
+    font-weight: 500;
 }
 
 /* Identificativo tecnico sopra il titolo di una card (STILE_UI §4) */
@@ -142,7 +142,7 @@ img {
 .t-meta {
     font-size: var(--body-md-size);
     line-height: var(--body-md-height);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 

SteUp.Shared/wwwroot/css/components.css

@@ -46,7 +46,7 @@
 .appbar__subtitle {
     font-size: var(--label-md-size);
     line-height: 1.3;
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink-muted);
     margin-top: var(--space-2);
 }
@@ -151,7 +151,7 @@
     border-radius: var(--radius-pill);
     font-size: var(--label-sm-size);
     line-height: 1.2;
-    font-weight: 700;
+    font-weight: 600;
     white-space: nowrap;
 }
 
@@ -197,7 +197,7 @@
 .list-card__title {
     font-size: var(--title-lg-size);
     line-height: 1.15;
-    font-weight: 800;
+    font-weight: 700;
     letter-spacing: -0.01em;
     color: var(--ink);
     margin-top: var(--space-2);
@@ -207,7 +207,7 @@
     margin-top: var(--space-6);
     font-size: var(--body-md-size);
     line-height: var(--body-md-height);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -219,7 +219,7 @@
     gap: var(--space-6);
     margin-top: var(--space-sm);
     font-size: var(--body-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -267,7 +267,7 @@
 .summary__subtitle {
     margin-top: var(--space-2);
     font-size: var(--body-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -299,7 +299,7 @@
 .summary__metric-label {
     font-size: var(--label-sm-size);
     line-height: 1.3;
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink-muted);
     white-space: nowrap;
     overflow: hidden;
@@ -316,7 +316,7 @@
 
 .summary__progress-count {
     font-size: var(--body-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -377,7 +377,7 @@
     background-color: var(--surface-muted);
     color: var(--ink-muted);
     font-size: var(--label-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     white-space: nowrap;
     transition: background-color var(--duration-fast) var(--ease-out),
                 border-color var(--duration-fast) var(--ease-out),
@@ -436,7 +436,7 @@
     border-radius: var(--radius-compact);
     font-size: var(--body-lg-size);
     line-height: 1.4;
-    font-weight: 600;
+    font-weight: 500;
 }
 
 .feedback__icon { font-size: 20px; line-height: 1.2; flex: 0 0 auto; }
@@ -687,7 +687,7 @@
 .sheet__subtitle {
     margin-top: var(--space-2);
     font-size: var(--body-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -740,7 +740,7 @@
     border: none;
     font-family: inherit;
     font-size: var(--body-lg-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink);
     text-align: left;
 }
@@ -767,7 +767,7 @@
     background-color: var(--info-surface);
     color: var(--primary-dark);
     font-size: 22px;
-    font-weight: 800;
+    font-weight: 700;
     flex: 0 0 auto;
 }
 
@@ -792,7 +792,7 @@
 .field-tap__label {
     font-size: var(--label-md-size);
     line-height: 1.25;
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink-muted);
 }
 
@@ -802,7 +802,7 @@
     gap: 7px;
     margin-top: 5px;
     font-size: var(--body-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink);
     overflow: hidden;
 }
@@ -832,7 +832,7 @@
     padding: var(--space-6) var(--space-md);
     padding-top: calc(var(--space-6) + env(safe-area-inset-top, 0px));
     font-size: var(--label-md-size);
-    font-weight: 700;
+    font-weight: 600;
     color: #ffffff;
     transform: translateY(-100%);
     transition: transform var(--duration-slow) var(--ease-out);
@@ -969,7 +969,7 @@
     color: #ffffff;
     font-family: inherit;
     font-size: var(--body-lg-size);
-    font-weight: 700;
+    font-weight: 600;
     transition: transform var(--duration-fast) var(--ease-out),
                 background-color var(--duration-fast) var(--ease-out);
 }
@@ -999,7 +999,7 @@
     gap: var(--space-xs);
     margin-top: var(--space-20);
     font-size: var(--label-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
 }
 
@@ -1063,7 +1063,7 @@
     text-align: center;
     font-size: var(--body-lg-size);
     line-height: 1.4;
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink);
 }
 

SteUp.Shared/wwwroot/css/forms.css

@@ -27,14 +27,14 @@
     gap: var(--space-xs);
     font-size: var(--label-md-size);
     line-height: 1.25;
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink-muted);
     margin-bottom: var(--space-6);
 }
 
 .form-group__count {
     font-size: var(--label-md-size);
-    font-weight: 700;
+    font-weight: 500;
     color: var(--ink-muted);
 }
 
@@ -45,7 +45,7 @@
 .form-group input,
 .form-group .mud-select-input {
     font-size: var(--body-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink);
     min-height: var(--touch-min);
 }
@@ -53,7 +53,7 @@
 .form-group--required .form-group__label::after {
     content: "obbligatorio";
     font-size: var(--label-sm-size);
-    font-weight: 700;
+    font-weight: 500;
     color: var(--ink-muted);
 }
 
@@ -65,7 +65,7 @@
     gap: var(--space-6);
     margin-top: var(--space-xs);
     font-size: var(--body-md-size);
-    font-weight: 600;
+    font-weight: 500;
     color: var(--danger-ink);
 }
 
@@ -90,7 +90,7 @@
     color: var(--ink-muted);
     font-family: inherit;
     font-size: var(--label-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     transition: background-color var(--duration-fast) var(--ease-out),
                 border-color var(--duration-fast) var(--ease-out),
                 color var(--duration-fast) var(--ease-out),
@@ -135,7 +135,7 @@
     outline: none;
     font-family: inherit;
     font-size: var(--body-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink);
     /* Il codice si legge cifra per cifra: cifre a larghezza fissa. */
     font-variant-numeric: tabular-nums;
@@ -197,14 +197,14 @@
 .art-item__name {
     font-size: var(--body-lg-size);
     line-height: 1.25;
-    font-weight: 700;
+    font-weight: 600;
     color: var(--ink);
 }
 
 .art-item__code {
     margin-top: var(--space-2);
     font-size: var(--label-md-size);
-    font-weight: 600;
+    font-weight: 400;
     color: var(--ink-muted);
     font-variant-numeric: tabular-nums;
 }
@@ -301,7 +301,7 @@
     background-color: var(--surface);
     font-family: inherit;
     font-size: var(--body-lg-size);
-    font-weight: 600;
+    font-weight: 500;
     color: var(--ink);
     text-align: left;
     transition: transform var(--duration-fast) var(--ease-out),

SteUp.Shared/wwwroot/css/mudblazor-overrides.css

@@ -60,7 +60,7 @@
 
     --mud-typography-subtitle2-family: var(--mud-typography-default-family);
     --mud-typography-subtitle2-size: var(--body-md-size);
-    --mud-typography-subtitle2-weight: 600;
+    --mud-typography-subtitle2-weight: 500;
 
     --mud-typography-body1-family: var(--mud-typography-default-family);
     --mud-typography-body1-size: var(--body-lg-size);
@@ -78,7 +78,7 @@
 
     --mud-typography-caption-family: var(--mud-typography-default-family);
     --mud-typography-caption-size: var(--label-md-size);
-    --mud-typography-caption-weight: 600;
+    --mud-typography-caption-weight: 500;
 }
 
 /* -----------------------------------------------------------------------------
@@ -236,7 +236,7 @@
 .mud-input-helper-text.mud-input-error,
 .mud-input-error .mud-input-helper-text {
     color: var(--danger-ink);
-    font-weight: 600;
+    font-weight: 500;
 }
 
 /* Il testo segnaposto deve restare leggibile al sole: stesso contrasto del
@@ -276,7 +276,7 @@
     border-radius: var(--radius-pill);
     font-family: var(--font-sans);
     font-size: var(--label-sm-size);
-    font-weight: 700;
+    font-weight: 600;
     letter-spacing: normal;
     text-transform: none;
 }

SteUp.Shared/wwwroot/css/tokens.css

@@ -122,6 +122,17 @@
     --label-md-size: 13px;
     --label-sm-size: 12px;
 
+    /* PESI — il grassetto e' un segnale, e un segnale ovunque non segnala
+       niente. Quattro gradini, e non si sale sopra il 700:
+         400  corpo, metadati, valori descrittivi
+         500  etichette di campo, voci di lista, testo dei controlli
+         600  stati brevi (badge, voce attiva), nomi in una riga di elenco
+         700  titoli: uno solo per blocco */
+    --weight-body: 400;
+    --weight-label: 500;
+    --weight-strong: 600;
+    --weight-title: 700;
+
     /* -------------------------------------------------------------------------
        MISURE STRUTTURALI
        ---------------------------------------------------------------------- */