/* NETBOM DZ V233 - search card size + vertical square avatar picker */

/* Search overlay cards: exact same small Action/category hub size */
#nbSearchGenreHubV230.open .nb-hub-content,
#nbSearchGenreHubV230 .nb-hub-content{
  width:min(1220px,calc(100% - 28px))!important;
  margin:18px auto 0!important;
  box-sizing:border-box!important;
}
#nbSearchGenreHubV230.open .nb-hub-row,
#nbSearchGenreHubV230 .nb-hub-row{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:14px!important;
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:2px 0 10px 0!important;
  box-sizing:border-box!important;
  scroll-snap-type:x proximity!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
}
#nbSearchGenreHubV230.open .nb-hub-row::-webkit-scrollbar,
#nbSearchGenreHubV230 .nb-hub-row::-webkit-scrollbar{display:none!important;}
#nbSearchGenreHubV230.open .nb-hub-card,
#nbSearchGenreHubV230.open .nb-hub-skeleton-card,
#nbSearchGenreHubV230 .nb-hub-card,
#nbSearchGenreHubV230 .nb-hub-skeleton-card{
  flex:0 0 210px!important;
  width:210px!important;
  min-width:210px!important;
  max-width:210px!important;
  height:320px!important;
  min-height:320px!important;
  max-height:320px!important;
  aspect-ratio:auto!important;
  border-radius:30px!important;
  overflow:hidden!important;
  scroll-snap-align:start!important;
  box-sizing:border-box!important;
  padding:0!important;
}
#nbSearchGenreHubV230.open .nb-hub-card img,
#nbSearchGenreHubV230 .nb-hub-card img{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  max-height:100%!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  display:block!important;
  border-radius:30px!important;
}
@media(max-width:700px){
  #nbSearchGenreHubV230.open .nb-hub-content,
  #nbSearchGenreHubV230 .nb-hub-content{
    width:calc(100% - 24px)!important;
    margin:14px auto 0!important;
  }
  #nbSearchGenreHubV230.open .nb-hub-row,
  #nbSearchGenreHubV230 .nb-hub-row{
    gap:14px!important;
    padding:2px 0 10px 0!important;
  }
  #nbSearchGenreHubV230.open .nb-hub-card,
  #nbSearchGenreHubV230.open .nb-hub-skeleton-card,
  #nbSearchGenreHubV230 .nb-hub-card,
  #nbSearchGenreHubV230 .nb-hub-skeleton-card{
    flex:0 0 132px!important;
    width:132px!important;
    min-width:132px!important;
    max-width:132px!important;
    height:202px!important;
    min-height:202px!important;
    max-height:202px!important;
    border-radius:18px!important;
  }
  #nbSearchGenreHubV230.open .nb-hub-card img,
  #nbSearchGenreHubV230 .nb-hub-card img{
    border-radius:18px!important;
  }
}

/* Choose Avatar: unified vertical modal, square cards, internal vertical scroll */
#nbAvatarPickV47,
#nbAvatarChooseV47,
#nbFinalAvatarModal,
#nbD1AvatarModal,
.nb-avatar-pick-v47,
.nb-avatar-modal{
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  display:none;
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(12px,2.5vw,24px)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:rgba(0,0,0,.62)!important;
}
#nbAvatarPickV47.show,
#nbAvatarChooseV47.show,
#nbFinalAvatarModal.open,
#nbD1AvatarModal.open,
.nb-avatar-pick-v47.show,
.nb-avatar-modal.open,
.nb-avatar-modal.active,
.nb-avatar-modal[style*="flex"]{
  display:flex!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
#nbAvatarPickV47 .nb-avatar-box-v47,
#nbAvatarChooseV47 .nb-avatar-box-v47,
#nbFinalAvatarModal .nb-avatar-box,
#nbD1AvatarModal .nb-avatar-box,
.nb-avatar-pick-v47 .nb-avatar-box-v47,
.nb-avatar-modal .nb-avatar-box{
  width:min(520px,92vw)!important;
  max-width:min(520px,92vw)!important;
  height:auto!important;
  max-height:min(76dvh,680px)!important;
  margin:auto!important;
  padding:22px!important;
  border-radius:28px!important;
  box-sizing:border-box!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  background:rgba(12,15,18,.92)!important;
  border:1px solid rgba(var(--nb-accent-rgb,34,197,94),.72)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.55)!important;
}
#nbAvatarPickV47 .nb-avatar-box-v47 h3,
#nbAvatarChooseV47 .nb-avatar-box-v47 h3,
#nbFinalAvatarModal .nb-avatar-head,
#nbD1AvatarModal .nb-avatar-head,
.nb-avatar-modal .nb-avatar-head{
  position:sticky!important;
  top:0!important;
  z-index:4!important;
  margin:0 0 16px!important;
  padding:0 46px 10px 0!important;
  background:linear-gradient(180deg,rgba(12,15,18,.96),rgba(12,15,18,.78),transparent)!important;
  color:#fff!important;
  font-size:clamp(18px,2.5vw,24px)!important;
  font-weight:1000!important;
  letter-spacing:-.03em!important;
}
#nbAvatarPickV47 .nb-avatar-grid-v47,
#nbAvatarChooseV47 .nb-avatar-grid-v47,
#nbFinalAvatarModal .nb-avatar-grid,
#nbD1AvatarModal .nb-avatar-grid,
.nb-avatar-pick-v47 .nb-avatar-grid-v47,
.nb-avatar-modal .nb-avatar-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:start!important;
  justify-items:stretch!important;
  width:100%!important;
  overflow:visible!important;
  padding:0 2px 4px!important;
  box-sizing:border-box!important;
}
#nbAvatarPickV47 .nb-avatar-grid-v47 img,
#nbAvatarChooseV47 .nb-avatar-grid-v47 img,
#nbFinalAvatarModal .nb-avatar-grid img,
#nbD1AvatarModal .nb-avatar-grid img,
.nb-avatar-pick-v47 .nb-avatar-grid-v47 img,
.nb-avatar-modal .nb-avatar-grid img{
  position:static!important;
  width:100%!important;
  height:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  border-radius:18px!important;
  display:block!important;
  transform:none!important;
  margin:0!important;
  border:2px solid transparent!important;
  background:#151515!important;
  cursor:pointer!important;
}
#nbAvatarPickV47 .nb-avatar-grid-v47 img:hover,
#nbAvatarChooseV47 .nb-avatar-grid-v47 img:hover,
#nbFinalAvatarModal .nb-avatar-grid img:hover,
#nbD1AvatarModal .nb-avatar-grid img:hover,
.nb-avatar-pick-v47 .nb-avatar-grid-v47 img:hover,
.nb-avatar-modal .nb-avatar-grid img:hover{
  border-color:var(--nb-accent,#22c55e)!important;
  transform:scale(1.025)!important;
}
@media(max-width:560px){
  #nbAvatarPickV47 .nb-avatar-box-v47,
  #nbAvatarChooseV47 .nb-avatar-box-v47,
  #nbFinalAvatarModal .nb-avatar-box,
  #nbD1AvatarModal .nb-avatar-box,
  .nb-avatar-pick-v47 .nb-avatar-box-v47,
  .nb-avatar-modal .nb-avatar-box{
    width:94vw!important;
    max-width:94vw!important;
    max-height:72dvh!important;
    padding:18px!important;
    border-radius:24px!important;
  }
  #nbAvatarPickV47 .nb-avatar-grid-v47,
  #nbAvatarChooseV47 .nb-avatar-grid-v47,
  #nbFinalAvatarModal .nb-avatar-grid,
  #nbD1AvatarModal .nb-avatar-grid,
  .nb-avatar-pick-v47 .nb-avatar-grid-v47,
  .nb-avatar-modal .nb-avatar-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
  }
  #nbAvatarPickV47 .nb-avatar-grid-v47 img,
  #nbAvatarChooseV47 .nb-avatar-grid-v47 img,
  #nbFinalAvatarModal .nb-avatar-grid img,
  #nbD1AvatarModal .nb-avatar-grid img,
  .nb-avatar-pick-v47 .nb-avatar-grid-v47 img,
  .nb-avatar-modal .nb-avatar-grid img{
    border-radius:16px!important;
  }
}