/* Source style 1 (v10143-mobile-filter-position-lock) */
@media (max-width:760px){
  #catalog .catalogToolbar.v46Toolbar .catalogIntro{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    height:30px!important;
    min-height:30px!important;
    margin:0 0 7px!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  #catalog .catalogToolbar.v46Toolbar .catalogIntro>span{
    display:none!important;
  }

  #catalog .catalogToolbar.v46Toolbar .clearFilters{
    display:inline-flex!important;
    align-items:center!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    transition:none!important;
  }

  #catalog .catalogToolbar.v46Toolbar .clearFilters.show{
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  /* Keep the collapsed filter bar at the same Y position whether a filter is active or not. */
  #catalog .mobileFacetToggle{
    margin-top:0!important;
  }
}

/* Remove the redundant popular-items CTA everywhere. */
#hotMoreBtn{display:none!important}
/* Source style 2 (v10144-mobile-hot-cards-compact) */
/* Mobile only: compact Best Sellers cards.
   The old shared product-card rules reserved far too much empty height. */
@media (max-width:760px){
  #hotSection .hotGrid{
    gap:7px!important;
  }

  #hotSection .productCard{
    height:auto!important;
    min-height:0!important;
  }

  #hotSection .productCard .productImage{
    height:112px!important;
    min-height:112px!important;
    padding:0!important;
  }

  #hotSection .productCard .productBody{
    min-height:0!important;
    height:auto!important;
    padding:7px 8px 8px!important;
  }

  #hotSection .productCard .productBrand{
    font-size:7.5px!important;
    line-height:1.2!important;
    margin:0!important;
  }

  #hotSection .productCard .productName{
    min-height:0!important;
    margin-top:3px!important;
    font-size:10.5px!important;
    line-height:1.3!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
  }

  #hotSection .productCard .productJP{
    min-height:0!important;
    margin-top:3px!important;
    font-size:8px!important;
    line-height:1.3!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:1!important;
    overflow:hidden!important;
  }

  #hotSection .productCard .salesRow{
    margin-top:4px!important;
    min-height:0!important;
  }

  #hotSection .productCard .productBottom{
    margin-top:5px!important;
    padding-top:4px!important;
  }

  #hotSection .productCard .price{
    font-size:13px!important;
    line-height:1.2!important;
  }

  #hotSection .productCard .textDetail{
    min-height:32px!important;
    margin-top:5px!important;
    padding:6px 0 0!important;
    line-height:1.2!important;
    text-align:center!important;
  }
}
/* Source style 3 (v10147-responsive-layout-modal-fix) */
/* Before Ordering: one authoritative responsive layout for EN/JA */
#beforeOrdering .sectionHead{margin-bottom:18px!important}
#beforeOrdering .sectionTitleGroup h2{
  font-size:34px!important;
  line-height:1.08!important;
  margin:0 0 7px!important;
}
#beforeOrdering .sectionSub{
  font-size:12px!important;
  line-height:1.45!important;
  margin:0!important;
}
#beforeOrdering .infoCard,
#beforeOrdering .infoCard button{text-align:left!important}
#beforeOrdering .infoCard button{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  padding:0!important;
}
#beforeOrdering .infoCard .infoKicker,
#beforeOrdering .infoCard b,
#beforeOrdering .infoCard h3,
#beforeOrdering .infoCard p{
  width:100%!important;
  text-align:left!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
}
#beforeOrdering .infoCard p{
  margin-left:0!important;
  margin-right:0!important;
}

/* Policy modal */
#policyModal{position:fixed!important;inset:0!important;z-index:120!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;box-sizing:border-box!important}
#policyModal.show{display:flex!important}
#policyModal .policyBox{position:relative!important;inset:auto!important;transform:none!important;margin:0!important;box-sizing:border-box!important;overscroll-behavior:contain!important}
#policyModal .policyBody{overflow-wrap:break-word!important;word-break:normal!important}
#policyModal .policyBody h4,#policyModal .policyBody p,#policyModal .policyBody li{text-align:left!important}

@media (min-width:1051px){
  #beforeOrdering .infoGrid{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:12px!important;
    align-items:stretch!important;
  }
  #beforeOrdering .infoCard{
    min-height:186px!important;
    height:auto!important;
    padding:18px 18px 16px!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
  }
  #beforeOrdering .infoCard .infoKicker{
    font-size:10px!important;
    line-height:1.35!important;
    margin:0 0 10px!important;
    letter-spacing:.08em!important;
  }
  #beforeOrdering .infoCard b,
  #beforeOrdering .infoCard h3{
    min-height:0!important;
    font-size:15px!important;
    line-height:1.32!important;
    margin:0 0 7px!important;
  }
  #beforeOrdering .infoCard p{
    min-height:0!important;
    font-size:10.5px!important;
    line-height:1.52!important;
    display:block!important;
    overflow:visible!important;
    -webkit-line-clamp:unset!important;
  }
  #beforeOrdering .infoCard .arrow{
    margin-top:auto!important;
    padding-top:12px!important;
  }
}

@media (min-width:761px) and (max-width:1050px){
  #beforeOrdering .infoGrid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px!important;
    align-items:stretch!important;
  }
  #beforeOrdering .infoCard{
    min-height:174px!important;
    height:auto!important;
    padding:16px!important;
    border-radius:14px!important;
  }
  #beforeOrdering .infoCard .infoKicker{
    font-size:9.5px!important;
    line-height:1.35!important;
    margin:0 0 8px!important;
    letter-spacing:.07em!important;
  }
  #beforeOrdering .infoCard b,
  #beforeOrdering .infoCard h3{
    font-size:14px!important;
    line-height:1.32!important;
    margin:0 0 6px!important;
  }
  #beforeOrdering .infoCard p{
    font-size:10px!important;
    line-height:1.5!important;
    display:block!important;
    overflow:visible!important;
    -webkit-line-clamp:unset!important;
  }
  #beforeOrdering .infoCard .arrow{
    margin-top:auto!important;
    padding-top:10px!important;
  }
}

@media (max-width:760px){
  #beforeOrdering .sectionTitleGroup h2{
    font-size:28px!important;
  }
  #beforeOrdering .infoGrid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    align-items:stretch!important;
  }
  #beforeOrdering .infoCard{
    min-height:0!important;
    height:auto!important;
    padding:13px!important;
    border-radius:12px!important;
  }
  #beforeOrdering .infoCard .infoKicker{
    font-size:9px!important;
    line-height:1.3!important;
    margin:0 0 6px!important;
    letter-spacing:.05em!important;
  }
  #beforeOrdering .infoCard b,
  #beforeOrdering .infoCard h3{
    font-size:12.5px!important;
    line-height:1.34!important;
    margin:0 0 5px!important;
  }
  #beforeOrdering .infoCard p{
    min-height:0!important;
    font-size:9.5px!important;
    line-height:1.45!important;
    display:block!important;
    overflow:visible!important;
    -webkit-line-clamp:unset!important;
  }
  #beforeOrdering .infoCard .arrow{
    margin-top:auto!important;
    padding-top:8px!important;
  }

  #policyModal{padding:clamp(18px,6dvh,56px) 12px!important}
  #policyModal .policyBox{width:calc(100vw - 24px)!important;max-width:520px!important;max-height:calc(100dvh - clamp(36px,12dvh,112px))!important;padding:16px 17px 18px!important;border-radius:18px!important;overflow:auto!important}
  #policyModal .modalHead{padding:4px 0 10px!important}
  #policyModal #policyTitle{font-size:21px!important;line-height:1.3!important}
  #policyModal .policyClose{width:38px!important;min-width:38px!important;height:38px!important}
  #policyModal .policyBody{font-size:13px!important;line-height:1.68!important}
  #policyModal .policyBody h4{font-size:18px!important;line-height:1.4!important;margin:17px 0 6px!important}
}

@media (max-width:480px){
  #beforeOrdering .infoGrid{
    grid-template-columns:1fr!important;
  }
  #beforeOrdering .infoCard{
    padding:14px!important;
  }
  #beforeOrdering .infoCard b,
  #beforeOrdering .infoCard h3{
    font-size:13px!important;
  }
  #beforeOrdering .infoCard p{
    font-size:10px!important;
  }
}

@media (min-width:761px){
  #policyModal{padding:28px!important}
  #policyModal .policyBox{width:min(720px,calc(100vw - 56px))!important;max-width:720px!important;max-height:min(78vh,760px)!important;padding:22px 24px 24px!important;border-radius:18px!important;overflow:auto!important}
  #policyModal .modalHead{padding:7px 0 12px!important}
  #policyModal #policyTitle{font-size:23px!important;line-height:1.3!important}
  #policyModal .policyBody{font-size:13px!important;line-height:1.75!important}
  #policyModal .policyBody h4{font-size:19px!important;line-height:1.4!important;margin:19px 0 7px!important}
}
