.pwa-header-install {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 42px; padding: 0 15px; border: 1px solid rgba(40, 94, 199, .2);
  border-radius: 11px; background: #285EC7; color: #fff; font: inherit;
  font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer;
  box-shadow: 0 5px 14px rgba(40, 94, 199, .18); transition: transform .2s, box-shadow .2s, background .2s;
}
.pwa-header-install:hover { transform: translateY(-1px); background: #214fa9; box-shadow: 0 8px 20px rgba(40, 94, 199, .25); }
.pwa-header-install:focus-visible, .pwa-dialog button:focus-visible { outline: 3px solid #f4a623; outline-offset: 3px; }
.pwa-header-install[hidden], .pwa-dialog[hidden], .pwa-ios-guide[hidden] { display: none !important; }
.pwa-dialog { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; overflow-y: auto; padding: 24px; background: rgba(13, 25, 49, .55); backdrop-filter: blur(8px); animation: pwa-fade-in .22s ease both; }
.pwa-card { position: relative; width: min(100%, 440px); max-height: min(90vh, 760px); overflow-y: auto; padding: 38px 38px 28px; border: 1px solid rgba(255,255,255,.8); border-radius: 28px; background: #fff; color: #162441; text-align: center; box-shadow: 0 28px 90px rgba(13, 35, 78, .28); animation: pwa-card-in .36s cubic-bezier(.2,.8,.2,1) both; }
.pwa-close { position: absolute; top: 14px; right: 15px; display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 50%; background: #f1f5fb; color: #53627b; font-size: 26px; line-height: 1; cursor: pointer; }
.pwa-brand-mark { display: grid; place-items: center; width: 94px; height: 94px; margin: 0 auto 21px; border-radius: 28px; background: linear-gradient(145deg,#3675e4,#204da9); box-shadow: 0 13px 27px rgba(40,94,199,.23); }
.pwa-brand-mark img { width: 75px; height: 75px; object-fit: contain; }
.pwa-eyebrow { color: #285EC7; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.pwa-card h2 { margin: 10px 0 11px; color: #14213a; font-family: Inter, Poppins, system-ui, sans-serif; font-size: clamp(25px, 6vw, 32px); font-weight: 800; letter-spacing: -.04em; line-height: 1.15; }
.pwa-card > p { max-width: 340px; margin: 0 auto 23px; color: #68758b; font-size: 14px; line-height: 1.7; }
.pwa-primary, .pwa-secondary { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 52px; border-radius: 14px; font: inherit; font-size: 14px; font-weight: 750; cursor: pointer; transition: transform .18s, background .18s; }
.pwa-primary { border: 0; color: #fff; background: #285EC7; box-shadow: 0 8px 18px rgba(40,94,199,.2); }
.pwa-primary:hover { transform: translateY(-1px); background: #214fa9; }
.pwa-secondary { margin-top: 7px; border: 0; color: #69768b; background: transparent; }
.pwa-secondary:hover { color: #285EC7; background: #f6f8fc; }
.pwa-trust { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 17px; color: #8994a7; font-size: 11px; }
.pwa-trust i { color: #36a47a; }
.pwa-ios-guide { margin-top: 18px; padding: 17px 16px; border: 1px solid #e8edf5; border-radius: 17px; background: #f8faff; text-align: left; }
.pwa-ios-guide h3 { margin: 0 0 13px; color: #243653; font-size: 14px; }
.pwa-ios-guide ol { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pwa-ios-guide li { display: flex; align-items: center; gap: 11px; color: #65728a; font-size: 12px; line-height: 1.5; }
.pwa-step-icon { display: grid; flex: 0 0 30px; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: #e9f0ff; color: #285EC7; font-size: 19px; font-weight: 700; }
.pwa-share-menu { font-size: 15px; }
html[dir="rtl"] .pwa-card { direction: rtl; }
html[dir="rtl"] .pwa-ios-guide { text-align: right; }
html[dir="rtl"] .pwa-close { right: auto; left: 15px; }
@keyframes pwa-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes pwa-card-in { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 900px) { .pwa-header-install { min-height: 40px; padding-inline: 11px; font-size: 12px; } }
@media (max-width: 520px) { .pwa-dialog { align-items: end; padding: 12px; } .pwa-card { width: 100%; max-height: 90vh; padding: 32px 23px 22px; border-radius: 25px; } .pwa-brand-mark { width: 80px; height: 80px; margin-bottom: 16px; border-radius: 24px; } .pwa-brand-mark img { width: 65px; height: 65px; } .pwa-eyebrow { font-size: 9px; } }
@media (prefers-reduced-motion: reduce) { .pwa-dialog, .pwa-card { animation: none; } .pwa-header-install, .pwa-primary, .pwa-secondary { transition: none; } }
body.pwa-dialog-open { overflow: hidden; }
