/* V34: height-aware catalogue layout for laptops, compact desktop screens and phones. */
#picker .modal-shell{min-height:0}
#picker .product-grid{min-height:180px;overscroll-behavior:contain;scrollbar-gutter:stable}

@media (min-width:701px) and (max-height:950px){
  #picker.modal{padding:10px}
  #picker .modal-shell{height:calc(100dvh - 20px);max-width:1480px}
  #picker .modal-head{flex:0 0 auto;padding:10px 18px 8px}
  #picker .modal-head h2{font-size:21px}
  #picker .modal-head p:last-child{margin-top:3px;font-size:10px}
  #picker .parts-advisor{flex:0 0 auto;margin:7px 16px 3px}
  #picker .advisor-copy{display:none}
  #picker .advisor-planner{grid-template-columns:minmax(270px,.72fr) 1.28fr}
  #picker .advisor-budget{padding:7px 12px}
  #picker .advisor-budget label{margin-bottom:4px}
  #picker .advisor-target{padding:7px 12px}
  #picker .advisor-picks{gap:7px;padding:7px}
  #picker .advisor-pick{grid-template-columns:56px 1fr;gap:8px;padding:7px;min-height:88px}
  #picker .advisor-pick .part-art{width:56px;height:56px}
  #picker .advisor-pick h4{height:25px;font-size:8px}
  #picker .advisor-pick p{display:none}
  #picker .advisor-pick .pick-price{margin:3px 0;font-size:11px}
  #picker .advisor-pick button{padding:4px}
  #picker .toolbar{flex:0 0 auto;padding:8px 16px}
  #picker .toolbar input{padding:9px}
  #picker .filter-sheet{flex:0 0 auto}
  #picker .filter-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:7px;overflow:visible;padding:0 16px 8px}
  #picker .filter-group{min-width:0}
  #picker .filter-group label{font-size:7px;margin-bottom:3px}
  #picker .filter-group select{height:32px;padding:5px 8px;font-size:9px}
  #picker .filter-clear{width:100%;height:32px}
  #picker .product-grid{flex:1 1 auto;min-height:190px;padding:10px 16px;gap:9px;overflow-y:auto;overflow-x:hidden;align-content:start}
  #picker .product{min-height:106px;grid-template-columns:66px 1fr;padding:9px;gap:9px}
  #picker .product .part-art{height:66px}
  #picker .product h4{font-size:10px;margin-bottom:5px;-webkit-line-clamp:2}
  #picker .product .spec{font-size:8px}
  #picker .pager{flex:0 0 auto;padding:8px}
}

@media (min-width:701px) and (max-width:1150px){
  #picker .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #picker .filter-bar{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:700px){
  #picker .modal-shell{overflow-y:auto;overflow-x:hidden}
  #picker .product-grid{flex:none;min-height:0;overflow:visible}
  #picker .filter-sheet .filter-bar{overflow-y:auto;overflow-x:hidden}
  #picker .advisor-picks{overflow-x:hidden}
}