/* V264 — Universal mobile Quick Buy package appearance.
   Every platform/service uses one visual system. Data, pricing and package logic are untouched. */
@media (max-width: 820px){
  body > .qb-choice-modal[data-mode="package"]{
    padding:6px!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }

  body > .qb-choice-modal[data-mode="package"] > .qb-choice-panel{
    box-sizing:border-box!important;
    width:min(96vw,760px)!important;
    max-width:96vw!important;
    height:auto!important;
    max-height:calc(100dvh - 12px)!important;
    padding:7px!important;
    border-radius:17px!important;
    overflow:hidden!important;
  }

  /* One header footprint for every service. */
  body > .qb-choice-modal[data-mode="package"] .qb-choice-head{
    min-height:43px!important;
    max-height:43px!important;
    margin:0!important;
    padding:0 1px 5px!important;
    align-items:center!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-choice-head > div{
    min-width:0!important;
    overflow:hidden!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-choice-head small{
    display:block!important;
    font-size:6.5px!important;
    line-height:1!important;
    letter-spacing:.14em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-choice-head h3{
    max-width:100%!important;
    margin:1px 0!important;
    font-size:clamp(15px,4.4vw,19px)!important;
    line-height:1.02!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-choice-close{
    flex:0 0 36px!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    border-radius:11px!important;
    font-size:22px!important;
  }

  /* Package type tabs: same matrix and same card height regardless of service. */
  body > .qb-choice-modal[data-mode="package"] .qb-package-group-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-rows:34px!important;
    gap:4px!important;
    margin:2px 0 4px!important;
    align-items:stretch!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-tier-card{
    box-sizing:border-box!important;
    width:100%!important;
    height:34px!important;
    min-height:34px!important;
    max-height:34px!important;
    padding:3px 5px!important;
    border-radius:9px!important;
    overflow:hidden!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-tier-card strong{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:8px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-tier-from{
    font-size:6px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-tier-discount{
    flex:0 0 32px!important;
    min-width:32px!important;
    width:32px!important;
    height:20px!important;
    font-size:7px!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-section-head{
    height:18px!important;
    min-height:18px!important;
    max-height:18px!important;
    margin:0 0 3px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-section-head strong{
    font-size:8.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-section-head small{
    min-width:42px!important;
    padding:3px 5px!important;
    font-size:6.5px!important;
    line-height:1!important;
    text-align:center!important;
  }

  /* THE canonical package grid for every Quick Buy service. */
  body > .qb-choice-modal[data-mode="package"] .qb-package-choice-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    grid-auto-rows:80px!important;
    gap:4px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    align-items:stretch!important;
    align-content:start!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-card{
    box-sizing:border-box!important;
    position:relative!important;
    width:100%!important;
    min-width:0!important;
    height:80px!important;
    min-height:80px!important;
    max-height:80px!important;
    margin:0!important;
    padding:4px 2px 3px!important;
    border-radius:8px!important;
    display:grid!important;
    grid-template-rows:1fr 27px!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:center!important;
    justify-items:center!important;
    gap:2px!important;
    overflow:visible!important;
    text-align:center!important;
    transform:none!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-check{
    box-sizing:border-box!important;
    position:absolute!important;
    top:2px!important;
    right:2px!important;
    left:auto!important;
    width:17px!important;
    height:17px!important;
    min-width:17px!important;
    min-height:17px!important;
    margin:0!important;
    padding:0!important;
    border-radius:5px!important;
    display:grid!important;
    place-items:center!important;
    font-size:10px!important;
    line-height:1!important;
    z-index:3!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-copy{
    box-sizing:border-box!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:3px 1px 0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:1px!important;
    overflow:hidden!important;
    text-align:center!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-copy strong{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:clamp(8px,2.55vw,10px)!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-copy span{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:8px!important;
    font-size:5.7px!important;
    line-height:8px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    margin:0!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-price{
    box-sizing:border-box!important;
    grid-row:2!important;
    width:94%!important;
    min-width:0!important;
    max-width:94%!important;
    height:27px!important;
    min-height:27px!important;
    max-height:27px!important;
    margin:0 auto!important;
    padding:2px 1px!important;
    border-radius:6px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:1px!important;
    overflow:hidden!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-price b{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    font-size:clamp(6.7px,2.05vw,8.2px)!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-price small{
    max-width:96%!important;
    margin:0!important;
    padding:1px 3px!important;
    border-radius:999px!important;
    font-size:4.8px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-badge{
    box-sizing:border-box!important;
    position:absolute!important;
    top:-3px!important;
    left:50%!important;
    right:auto!important;
    max-width:70%!important;
    transform:translateX(-50%)!important;
    padding:2px 4px!important;
    border-radius:999px!important;
    font-size:5px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    z-index:4!important;
  }

  /* Keep the controls underneath identical for all services. */
  body > .qb-choice-modal[data-mode="package"] .qb-package-choice-footer{
    grid-template-columns:minmax(84px,.8fr) minmax(0,1.5fr) minmax(76px,.72fr)!important;
    grid-template-areas:"step range price" "action action action"!important;
    gap:3px!important;
    margin-top:4px!important;
    padding-top:4px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-footer-stepper,
  body > .qb-choice-modal[data-mode="package"] .qb-package-footer-price{
    box-sizing:border-box!important;
    height:31px!important;
    min-height:31px!important;
    max-height:31px!important;
    border-radius:8px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-footer-apply{
    box-sizing:border-box!important;
    height:30px!important;
    min-height:30px!important;
    max-height:30px!important;
    border-radius:8px!important;
    font-size:8.5px!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-benefits{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-auto-rows:22px!important;
    gap:3px!important;
    margin-top:3px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-benefit{
    box-sizing:border-box!important;
    width:100%!important;
    height:22px!important;
    min-height:22px!important;
    max-height:22px!important;
    padding:1px 2px!important;
    border-radius:6px!important;
    overflow:hidden!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-benefit-icon{
    flex:0 0 14px!important;
    width:14px!important;
    height:14px!important;
    font-size:7px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-benefit strong{
    min-width:0!important;
    font-size:5.2px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body > .qb-choice-modal[data-mode="package"] .qb-package-ai{
    box-sizing:border-box!important;
    min-height:22px!important;
    margin-top:3px!important;
    padding:2px!important;
    border-radius:6px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-ai-providers{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:2px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-ai-providers button{
    box-sizing:border-box!important;
    height:19px!important;
    min-height:19px!important;
    max-height:19px!important;
    padding:0 2px!important;
    border-radius:5px!important;
    font-size:5.5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

@media (max-width:390px){
  body > .qb-choice-modal[data-mode="package"] > .qb-choice-panel{
    width:98vw!important;
    max-width:98vw!important;
    padding:6px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-choice-grid{
    grid-auto-rows:76px!important;
    gap:3px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-card{
    height:76px!important;
    min-height:76px!important;
    max-height:76px!important;
    grid-template-rows:1fr 25px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-price{
    height:25px!important;
    min-height:25px!important;
    max-height:25px!important;
  }
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-copy strong{font-size:8px!important;}
  body > .qb-choice-modal[data-mode="package"] .qb-package-pro-price b{font-size:6.5px!important;}
}
