diff --git a/SteUp.Shared/wwwroot/css/components.css b/SteUp.Shared/wwwroot/css/components.css
index aad8bb4..5c1da6b 100644
--- a/SteUp.Shared/wwwroot/css/components.css
+++ b/SteUp.Shared/wwwroot/css/components.css
@@ -899,24 +899,28 @@
 
 /* Un pannello solo, tre righe divise da una linea: la stessa forma delle
    liste dell'app, invece di tre riquadri che galleggiano separati. */
+/* Tre campi distinti, non tre righe di un blocco unico: qui non si consulta un
+   elenco, si compilano tre dati diversi uno dopo l'altro, e lo stacco fra uno
+   e l'altro dice dove finisce quello che stai scrivendo. */
 .onboarding__fields {
     display: flex;
     flex-direction: column;
+    gap: var(--space-sm);
     margin-top: var(--space-xl);
-    background-color: var(--surface);
-    border-radius: var(--radius-surface);
-    overflow: hidden;
 }
 
 .onboarding__field {
     display: block;
     padding: var(--space-sm) var(--space-md);
-    transition: background-color var(--duration-fast) var(--ease-out);
+    background-color: var(--surface);
+    border-radius: var(--radius-control);
+    border: 1.5px solid transparent;
+    transition: border-color var(--duration-fast) var(--ease-out);
 }
 
-.onboarding__field + .onboarding__field { border-top: 1px solid var(--divider); }
-
-.onboarding__field:focus-within { background-color: var(--surface-muted); }
+/* Il campo attivo si segna col bordo, non cambiando fondo: lo stacco dallo
+   sfondo di pagina lo fa gia' la superficie bianca. */
+.onboarding__field:focus-within { border-color: var(--primary-dark); }
 
 /* L'etichetta sta sopra il campo e non si muove: niente testo che scivola
    quando appoggi il dito. */