Correzioni alla UI dopo la verifica sul terminale

Prime correzioni fatte guardando l'app su un Honeywell EDA52 (720x1440
@320dpi, cioe' 360 punti logici di larghezza) invece che a occhio.

- Barra di stato: era tinta di corallo da colorPrimaryDark, cioe' l'accento
  usato come decorazione della cornice di sistema. Ora si fonde con lo
  sfondo dell'app, con icone scure (WindowInsetsController).
- Gradino compatto sotto i 380px: la scala di STILE_UI e' tarata su telefoni
  piu' larghi, e a misura piena i titoli si troncavano e in una schermata
  entrava pochissimo lavoro. Le proporzioni restano, cambia la taglia.
  Sui telefoni normali non cambia nulla.
- Icone delle azioni costruttive: usavano il fondo del tono danger, quindi
  "Nuova scheda" e "Aggiungi una foto" erano identiche a "Elimina
  ispezione". Ora usano il tono info. Un --primary-surface non risolveva:
  il primario di SteUP e' gia' un rosso, quindi un suo fondo tenue resta
  indistinguibile da quello danger.
- Testata: il titolo puo' andare su due righe prima di troncare. Il nome del
  punto vendita e' l'ancora del compito, "D11-PRIMO PREZ..." non aiuta.
- Schermata ispezione: il nome del punto vendita non e' piu' ripetuto nel
  pannello di riepilogo, dove era gia' in testata.
- Padding dei gruppi di form e della barra azioni ridotti su schermo stretto.

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

SteUp.Shared/wwwroot/css/tokens.css

@@ -165,3 +165,41 @@
     /* Breakpoint (STILE_UI §3) — documentati qui, usati nelle media query:
        rail 720px · twoColumn 900px · contentMax 1180px */
 }
+
+/* =============================================================================
+   Gradino compatto — schermi stretti (≤380px)
+
+   Il terminale da campo (Honeywell EDA52) ha 360 punti logici di larghezza,
+   molto meno dei telefoni per cui la scala di STILE_UI è tarata: a misura
+   piena i titoli si troncano, il testo va a capo e in una schermata entra
+   pochissimo lavoro. Qui la scala scende di un gradino — le proporzioni e i
+   rapporti restano quelli del documento, cambia solo la taglia.
+
+   È l'"Adattamento locale" del §8: i componenti si riorganizzano sotto le
+   soglie invece di pretendere lo spazio che non c'è.
+   ========================================================================== */
+
+@media (max-width: 380px) {
+    :root {
+        --headline-md-size: 28px;
+        --headline-sm-size: 22px;
+        --title-lg-size: 18px;
+        --title-md-size: 16px;
+        --body-lg-size: 15px;
+        --body-md-size: 14px;
+        --label-lg-size: 13px;
+        --label-md-size: 12px;
+        --label-sm-size: 11px;
+
+        --space-lg: 20px;
+        --space-xl: 24px;
+        --space-18: 14px;
+        --space-20: 16px;
+        --space-22: 18px;
+
+        --appbar-height: 64px;
+        --button-height: 44px;
+        --navbar-height: 62px;
+        --nav-clearance: 104px;
+    }
+}