:root{--jpwa-bg:#161b26;--jpwa-accent:#e8b84b;--jpwa-sub:rgba(255,255,255,.72)}
#jpwa-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99998;opacity:0;pointer-events:none;transition:opacity .3s}
#jpwa-overlay.show{opacity:1;pointer-events:all}

#jpwa-banner{position:fixed;z-index:99999;direction:rtl;font-family:'Cairo','Segoe UI',Arial,sans-serif;background:var(--jpwa-bg);color:#fff;display:flex;align-items:center;gap:14px;padding:16px 18px 20px;left:0;right:0;box-shadow:0 -6px 30px rgba(0,0,0,.4)}
#jpwa-banner.pos-bottom{bottom:0;border-radius:18px 18px 0 0;transform:translateY(115%);transition:transform .42s cubic-bezier(.22,.61,.36,1)}
#jpwa-banner.pos-bottom.show{transform:translateY(0)}
#jpwa-banner.pos-top{top:0;border-radius:0 0 18px 18px;transform:translateY(-115%);transition:transform .42s cubic-bezier(.22,.61,.36,1)}
#jpwa-banner.pos-top.show{transform:translateY(0)}
#jpwa-banner.pos-center{top:50%;left:50%;width:min(420px,92vw);border-radius:18px;flex-direction:column;text-align:center;padding:30px 26px;transform:translate(-50%,-44%);opacity:0;transition:opacity .38s ease,transform .38s cubic-bezier(.22,.61,.36,1)}
#jpwa-banner.pos-center.show{transform:translate(-50%,-50%);opacity:1}
.jpwa-icon{width:60px;height:60px;border-radius:14px;flex-shrink:0;object-fit:cover;box-shadow:0 3px 12px rgba(0,0,0,.35)}
#jpwa-banner.pos-center .jpwa-icon{width:78px;height:78px;border-radius:18px;margin:0 auto 10px}
.jpwa-text{flex:1;min-width:0}
.jpwa-text h3{margin:0 0 4px;font-size:15px;font-weight:800;line-height:1.3}
.jpwa-text p{margin:0;font-size:13px;color:var(--jpwa-sub);line-height:1.5}
#jpwa-banner.pos-center .jpwa-text{width:100%}
#jpwa-banner.pos-center .jpwa-text h3{font-size:18px}
.jpwa-btns{display:flex;gap:8px;flex-shrink:0;align-items:center}
#jpwa-banner.pos-center .jpwa-btns{justify-content:center;margin-top:16px;width:100%}
.jpwa-btn-install{background:var(--jpwa-accent);color:#111;border:none;border-radius:10px;padding:11px 18px;font-size:14px;font-weight:800;font-family:inherit;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:6px;transition:filter .2s,transform .15s}
.jpwa-btn-install:hover{filter:brightness(1.1);transform:scale(1.03)}
.jpwa-btn-later{background:rgba(255,255,255,.13);color:#fff;border:none;border-radius:10px;padding:11px 14px;font-size:13px;font-family:inherit;cursor:pointer;white-space:nowrap;transition:background .2s}
.jpwa-btn-later:hover{background:rgba(255,255,255,.22)}

/* iOS Sheet */
#jpwa-ios-sheet{position:fixed;inset:0;z-index:100000;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;opacity:0;transition:opacity .3s}
#jpwa-ios-sheet.show{opacity:1;pointer-events:all}
.jpwa-ios-inner{background:var(--jpwa-bg);color:#fff;direction:rtl;font-family:'Cairo','Segoe UI',Arial,sans-serif;border-radius:22px 22px 0 0;padding:24px 22px 38px;width:100%;max-width:540px;box-shadow:0 -10px 50px rgba(0,0,0,.55);transform:translateY(100%);transition:transform .42s cubic-bezier(.22,.61,.36,1)}
#jpwa-ios-sheet.show .jpwa-ios-inner{transform:translateY(0)}
.jpwa-ios-handle{width:40px;height:4px;background:rgba(255,255,255,.25);border-radius:2px;margin:0 auto 18px}
.jpwa-ios-inner h3{margin:0 0 18px;font-size:18px;font-weight:800;text-align:center}
.jpwa-steps{list-style:none;padding:0;margin:0}
.jpwa-steps li{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;font-size:14px;line-height:1.7}
.jpwa-step-num{background:var(--jpwa-accent);color:#111;font-weight:900;font-size:13px;min-width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.share-icon{display:inline-block;vertical-align:middle;width:18px;height:18px;margin:0 2px;background:var(--jpwa-accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cpath d='M30.3 8.7l-4.8-4.8-4.8 4.8-1.4-1.4L25 1.6l5.7 5.7z'/%3E%3Cpath d='M24 3h2v22h-2z'/%3E%3Cpath d='M35 14H15c-2.8 0-5 2.2-5 5v18c0 2.8 2.2 5 5 5h20c2.8 0 5-2.2 5-5V19c0-2.8-2.2-5-5-5zm3 23c0 1.7-1.3 3-3 3H15c-1.7 0-3-1.3-3-3V19c0-1.7 1.3-3 3-3h20c1.7 0 3 1.3 3 3v18z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cpath d='M30.3 8.7l-4.8-4.8-4.8 4.8-1.4-1.4L25 1.6l5.7 5.7z'/%3E%3Cpath d='M24 3h2v22h-2z'/%3E%3Cpath d='M35 14H15c-2.8 0-5 2.2-5 5v18c0 2.8 2.2 5 5 5h20c2.8 0 5-2.2 5-5V19c0-2.8-2.2-5-5-5zm3 23c0 1.7-1.3 3-3 3H15c-1.7 0-3-1.3-3-3V19c0-1.7 1.3-3 3-3h20c1.7 0 3 1.3 3 3v18z'/%3E%3C/svg%3E") center/contain no-repeat}
.jpwa-ios-close{display:block;width:100%;margin-top:16px;padding:14px;background:rgba(255,255,255,.13);color:#fff;border:none;border-radius:12px;font-size:15px;font-family:inherit;cursor:pointer;transition:background .2s}
.jpwa-ios-close:hover{background:rgba(255,255,255,.22)}

@media(min-width:600px){
  #jpwa-banner.pos-bottom,#jpwa-banner.pos-top{left:50%;right:auto;width:min(480px,94vw)}
  #jpwa-banner.pos-bottom{transform:translateX(-50%) translateY(115%)}
  #jpwa-banner.pos-bottom.show{transform:translateX(-50%) translateY(0)}
  #jpwa-banner.pos-top{transform:translateX(-50%) translateY(-115%)}
  #jpwa-banner.pos-top.show{transform:translateX(-50%) translateY(0)}
}