#install-banner{position:fixed;top:max(14px,env(safe-area-inset-top));inset-inline:16px;z-index:90;max-width:460px;margin:auto;padding:24px;display:flex;align-items:flex-start;gap:16px;background:var(--surface);color:var(--text);border:1px solid #f9731633;border-radius:24px;box-shadow:0 16px 60px #0002;direction:rtl;animation:install-appear .3s ease-out}
#install-banner[hidden],#install-confirm[hidden]{display:none}
.install-logo{display:inline-flex;align-items:center;justify-content:center;flex:none;width:56px;height:56px;border-radius:18px;background:linear-gradient(145deg,#fb923c,#ea580c);box-shadow:0 8px 22px #f9731633,inset 0 1px #fff6;color:#fff;font-size:32px;font-weight:800}
.install-banner-copy{min-width:0;padding-inline-end:8px}.install-eyebrow{display:block;color:#ea580c;font-size:11px;font-weight:700;margin-bottom:5px}.install-banner-copy strong{display:block;font-size:17px;line-height:1.8}.install-banner-copy p{margin:5px 0 16px;font-size:12px;line-height:1.9;color:var(--muted)}
#install-dismiss{position:absolute;top:8px;inset-inline-end:8px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--muted)}#install-dismiss svg{width:17px;height:17px}#install-dismiss:hover{background:var(--soft)}
.install-banner-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.install-banner-actions button,#install-dialog #install-confirm{display:flex;align-items:center;justify-content:center;gap:8px;background:#ea580c;color:#fff;border:0;border-radius:12px;padding:10px 16px;font-weight:700;cursor:pointer}.install-banner-actions button svg{width:18px;height:18px}.install-banner-actions>span{font-size:10px;color:var(--muted)}
#install-dialog{width:calc(100% - 32px);max-width:440px;max-height:calc(100dvh - 40px);overflow:auto;padding:30px;border:1px solid var(--line);border-radius:28px;background:var(--surface);color:var(--text);box-shadow:0 24px 100px #0003;text-align:right;direction:rtl}
#install-dialog::backdrop{background:#10141bb3;backdrop-filter:blur(6px)}#install-dialog .dialog-close{top:12px;right:auto;left:12px;color:var(--muted);border-radius:50%;background:var(--soft)}
.install-hero{text-align:center;padding-top:6px}.install-hero .install-logo{width:72px;height:72px;font-size:40px;border-radius:23px;margin-bottom:18px}.install-hero h2{font-size:24px;line-height:1.6;margin:4px 0 8px}.install-hero p{font-size:13px;line-height:2;color:var(--muted);margin:0 auto;max-width:310px}
.install-benefits{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.install-benefits>span{display:flex;align-items:center;flex-direction:column;padding:14px 8px;background:var(--soft);border-radius:16px;gap:5px}.install-benefits svg{color:#ea580c;width:22px;height:22px;margin-bottom:3px}.install-benefits strong{font-size:12px}.install-benefits small{font-size:10px;color:var(--muted)}
.install-guide{border:1px solid var(--line);border-radius:16px;padding:16px}.install-guide h3{font-size:13px;margin:0 0 12px}.install-guide ol{list-style:none;counter-reset:install-step;padding:0;margin:0;display:grid;gap:12px}.install-guide li{counter-increment:install-step;display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.9}.install-guide li::before{content:counter(install-step,persian);display:grid;place-items:center;flex:none;width:25px;height:25px;background:#f9731618;color:#ea580c;border-radius:8px;font-weight:700}.install-note{font-size:10px;color:var(--muted);text-align:center;margin:16px 0}.install-dialog-actions{display:flex;flex-direction:column;gap:8px}#install-dialog .outline{border:0;background:transparent;color:var(--muted);margin:0;padding:10px}#install-dialog #install-confirm{margin:0;width:100%;min-height:48px}#install-confirm:disabled{opacity:.6}body.dark .install-eyebrow,body.dark .install-guide li::before{color:#fb923c}
.push-settings{padding:16px;margin:20px 0;border-radius:16px;border:1px solid #8884}.push-settings p{font-size:13px}
@keyframes install-appear{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:480px){#install-banner{inset-inline:12px;padding:20px 16px;gap:12px}.install-banner-copy strong{font-size:15px}#install-banner .install-logo{width:44px;height:44px;font-size:26px;border-radius:14px}.install-banner-actions{gap:8px}#install-dialog{padding:24px 20px;border-radius:24px}.install-hero h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){#install-banner{animation:none}}