#aab-container{
  position:fixed;
  top:50%;
  right:12px;
  transform:translateY(-50%);
  z-index:99999;
  display:flex;
  flex-direction:column;
  gap:14px;
  pointer-events:none; /* allow clicks through gaps */
}
.aab-box{
  background:#ffffff;
  border-radius:12px;
  box-shadow:0 10px 28px rgba(2,12,40,.18);
  overflow:hidden;
  position:relative;
  animation-duration:1s;
  transition:all .45s ease;
  pointer-events:auto; /* clickable */
}
.aab-box a, .aab-box img{display:block;width:100%;height:100%;object-fit:cover;}
.aab-close{
  position:absolute;top:6px;right:8px;
  width:28px;height:28px;border-radius:50%;
  border:0;cursor:pointer;font-size:18px;line-height:28px;
  color:#fff;background:rgba(0,0,0,.6);
}

/* Animations */
.slide-right{animation:slideRight 0.9s ease-out;}
.slide-left{animation:slideLeft 0.9s ease-out;}
.fade-in{animation:fadeIn 0.9s ease-out;}
.bounce{animation:bounceIn 0.9s;}
.zoom-in{animation:zoomIn 0.9s;}

@keyframes slideRight{from{transform:translateX(160%);}to{transform:translateX(0);}}
@keyframes slideLeft{from{transform:translateX(-160%);}to{transform:translateX(0);}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes bounceIn{0%{transform:scale(.3)}50%{transform:scale(1.1)}70%{transform:scale(.95)}100%{transform:scale(1)}}
@keyframes zoomIn{from{transform:scale(.6)}to{transform:scale(1)}}

/* Mobile behavior: dock near bottom center */
@media(max-width:768px){
  #aab-container{
    top:auto;bottom:18px;right:50%;transform:translateX(50%);
    flex-direction:row;gap:10px;
  }
  .aab-box{
    width:160px !important;height:200px !important;
    border-radius:14px;
  }
}