/* слой PWA: карточка установки / уведомлений и инструкция по шагам. Цвета — из qb.css */
.app-card {
  position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px;
  padding: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 20px; animation: rise .35s ease;
}
.app-card img { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; }
.app-card-t { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; }
.app-card-t b { font-size: 15px; font-weight: 800; letter-spacing: -.2px; }
.app-card-t small { font-size: 12.5px; line-height: 1.35; color: var(--dim); font-weight: 600; margin-top: 2px; }
.app-card-go {
  flex: 1 0 100%; border: 0; border-radius: 12px; padding: 11px 12px;
  background: var(--lime); color: var(--ink); font-size: 14.5px; font-weight: 800;
}
.app-card-go:active { background: var(--lime-2); }
.app-card-x {
  position: absolute; top: -9px; right: -6px; width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--card-2); color: var(--mute); font-size: 15px; line-height: 1; padding: 0;
}

.app-sheet-ic { display: block; width: 40px; height: 40px; border-radius: 11px; margin-bottom: 12px; }
.app-steps { margin: 4px 0 0; padding: 0; list-style: none; counter-reset: st; }
.app-steps li {
  position: relative; counter-increment: st; padding: 0 0 0 38px; margin-top: 12px;
  color: #C9CDD3; font-size: 15px; line-height: 1.45; min-height: 26px;
}
.app-steps li::before {
  content: counter(st); position: absolute; left: 0; top: -1px; width: 26px; height: 26px; border-radius: 8px;
  display: grid; place-items: center; background: rgba(198,241,53,.12); color: var(--lime); font-size: 13px; font-weight: 800;
}
.app-steps b { color: var(--text); }