/* ── PRIMO AVVIO ──────────────────────────────────────────────
   Dal template Corallo in poi è una schermata ferma: niente
   aloni, niente marchio che si carica (vedi views/pagine.css). */
/* Niente position qui: .full è già fixed e fa da riferimento ai
   figli assoluti. Scriverlo di nuovo lo sovrascriveva — con l'id
   davanti questa regola vince — e la schermata finiva in coda alla
   pagina invece di coprirla. */
#onb .wrap{overflow:hidden}
#onb .body{position:relative;z-index:1;display:flex;flex-direction:column;min-height:100vh;
  padding:calc(30px + env(safe-area-inset-top)) 22px calc(30px + env(safe-area-inset-bottom))}

/* Il bilanciere che fa da indicatore di avanzamento. */
#onb .mkst rect{transform-box:fill-box;transform-origin:center}

@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* NON chiamarla .in: è già la classe dei campi di testo, e ogni
   riga si prendeva riquadro, bordo e altezza fissa di un input. */
#onb .rz{animation:rise .5s cubic-bezier(.2,.8,.2,1) both}

/* passi: tre trattini, quello attivo si allunga */
#onb .steps{display:flex;gap:6px;margin-bottom:26px}
#onb .steps i{height:3px;border-radius:2px;background:var(--b-strong);width:22px;
  transition:width .3s ease,background .3s ease}
#onb .steps i.on{width:44px;background:var(--acc)}
#onb .steps i.past{background:var(--b-med)}

#onb .lead{font:400 16px/1.6 var(--sans);color:var(--t3)}
#onb .key{color:var(--t2);font-weight:500}