/* Nort: folha de instalação do app (sobe de baixo, na zona do polegar) */
.inst { position: fixed; inset: 0; z-index: 95; display: grid; align-items: end; }
.inst-veu { position: absolute; inset: 0; background: rgba(32, 41, 76, 0.32); animation: aparece var(--d-mid) var(--ease); }
.inst-folha {
  position: relative; background: var(--white); border-radius: 24px 24px 0 0;
  padding: 10px 20px calc(20px + env(safe-area-inset-bottom)); display: grid; gap: 16px;
  box-shadow: 0 -12px 40px rgba(32, 41, 76, 0.18); animation: inst-sobe 520ms var(--ease);
}
.inst-alca { justify-self: center; width: 40px; height: 4px; border-radius: 4px; background: var(--silver); }
.inst-topo { display: flex; gap: 14px; align-items: center; }
.inst-icone { width: 56px; height: 56px; border-radius: 16px; flex: none; box-shadow: var(--sh-btn); }
.inst-topo h2 { margin: 0 0 4px; font-size: 22px; line-height: 1.15; letter-spacing: -0.01em; color: var(--navy); }
.inst-topo p { margin: 0; color: var(--dusk); font-size: var(--t-body-sm); line-height: 1.45; }
.inst-passos { list-style: none; margin: 0; padding: 14px; display: grid; gap: 10px; background: var(--fog); border-radius: var(--r-card); }
.inst-passos li { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start; color: var(--navy); font-size: var(--t-body-sm); line-height: 1.5; }
.inst-passos .n {
  width: 24px; height: 24px; border-radius: 50%; display: inline-grid; place-items: center; flex: none;
  background: var(--navy); color: var(--white); font-size: 12px; font-weight: 700; margin-top: 1px;
}
.inst-ic { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; vertical-align: middle; border-radius: 8px; background: var(--white); color: var(--link); font-weight: 600; }
.inst-acoes { display: grid; gap: 8px; }
.inst-acoes .btn { width: 100%; justify-content: center; min-height: 48px; }
.inst.sai .inst-folha { animation: inst-desce 300ms cubic-bezier(0.7, 0, 0.84, 0) forwards; }
.inst.sai .inst-veu { opacity: 0; transition: opacity 300ms; }
@keyframes inst-sobe { from { transform: translateY(100%); } to { transform: none; } }
@keyframes inst-desce { to { transform: translateY(100%); } }
@media (prefers-reduced-motion: reduce) {
  .inst-folha, .inst-veu, .inst.sai .inst-folha { animation: none; }
}