/* PWA Install Banner – animations v2.4 (transform/opacity uniquement) */
.pwa-a-hop{animation:pwa-hop .7s cubic-bezier(.3,1.6,.5,1) var(--pwa-d,0s) both}
@keyframes pwa-hop{0%{transform:none}35%{transform:translateY(-12px) scale(1.08,.95)}60%{transform:translateY(0) scale(.94,1.06)}80%{transform:translateY(-3px)}100%{transform:none}}

.pwa-a-wiggle{animation:pwa-wig .6s ease-in-out both}
@keyframes pwa-wig{0%,100%{transform:none}20%{transform:rotate(-12deg)}40%{transform:rotate(10deg)}60%{transform:rotate(-6deg)}80%{transform:rotate(3deg)}}

.pwa-a-shine{position:relative;overflow:hidden}
.pwa-a-shine::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.65) 50%,rgba(255,255,255,0) 70%);
  transform:translateX(-120%);animation:pwa-shine 1.1s ease-in-out var(--pwa-d,0s) 2 both}
@keyframes pwa-shine{to{transform:translateX(120%)}}

.pwa-a-ringel{position:absolute;pointer-events:none;border-radius:999px;opacity:0;z-index:0;
  animation:pwa-ring 1.4s ease-out var(--pwa-d,0s) 3 both}
@keyframes pwa-ring{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.3,1.7);opacity:0}}

.pwa-a-timer{position:absolute;left:0;bottom:0;height:3px;width:100%;z-index:3;pointer-events:none;
  background:var(--pwa-btn,#0066ff);transform-origin:left center;animation:pwa-count linear both}
@keyframes pwa-count{from{transform:scaleX(1)}to{transform:scaleX(0)}}
.is-paused .pwa-a-timer{animation-play-state:paused}

.pwa-a-phone{position:absolute;box-sizing:border-box;pointer-events:none;z-index:2;
  border:2px solid rgba(128,128,128,.55);border-radius:9px;background:inherit;
  display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:7px 5px;align-content:start;
  animation:pwa-hs-phone 2.5s ease var(--pwa-d,0s) both}
.pwa-a-phone i{display:block;aspect-ratio:1;border-radius:3px;background:rgba(128,128,128,.28)}
.pwa-a-phone i.pwa-a-new{background-size:cover;background-position:center;
  animation:pwa-hs-drop .7s cubic-bezier(.3,1.5,.5,1) calc(var(--pwa-d,0s) + .5s) both}
@keyframes pwa-hs-phone{0%{opacity:0;transform:scale(.8)}12%{opacity:1;transform:none}85%{opacity:1;transform:none}100%{opacity:0;transform:scale(.9)}}
@keyframes pwa-hs-drop{0%{opacity:0;transform:translateY(-28px) scale(1.8)}60%{opacity:1}100%{opacity:1;transform:none}}
.pwa-a-hsicon{animation:pwa-hs-icon .35s ease var(--pwa-d,0s) both}
@keyframes pwa-hs-icon{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .pwa-a-hop,.pwa-a-wiggle,.pwa-a-hsicon,.pwa-a-shine::after{animation:none!important}
  .pwa-a-ringel,.pwa-a-phone{display:none!important}
  .pwa-banner{transition-duration:.01ms!important}
  .pwa-banner__arrow{animation:none!important}
}