/* Home screen app (#118): the install bar, /app and Get the app on My account. Kept out of components.css. */
.mb-pwa-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; margin-bottom: 24px; background: var(--mb-surface); border: 1px solid var(--mb-line); border-radius: var(--mb-r-lg); }
.mb-pwa-bar[hidden] { display: none; }
.mb-pwa-bar__icon { width: 40px; height: 40px; border-radius: 10px; flex: none; }
.mb-pwa-bar__text { flex: 1 1 160px; font-weight: 500; }
.mb-pwa-app { max-width: 560px; margin: 0 auto; text-align: center; display: grid; gap: 16px; justify-items: center; }
.mb-pwa-app .mb-h1 { margin: 0; }
.mb-pwa-app [hidden] { display: none; }
.mb-pwa-app__icon { width: 96px; height: 96px; border-radius: 22px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12); }
.mb-pwa-app__steps { text-align: left; margin: 0; padding-left: 1.4em; display: grid; gap: 10px; }
.mb-pwa-app__steps i { margin-left: 4px; }
.mb-pwa-get { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 24px; }
.mb-pwa-get[hidden] { display: none; }
.mb-pwa-get .mb-muted { margin: 0; }