/* QA: телефонная ширина 360-375px. Обзор (<b> в сводке) и «Сервер · Очередь и скорость» (<i> в легендах и полосах) не выходят за край. */
@media (max-width: 420px) {
  #section-support-overview,
  #section-support-performance { max-width: 100%; overflow-x: hidden; }
  #section-support-overview *,
  #section-support-performance * { min-width: 0; max-width: 100%; box-sizing: border-box; }
  #section-support-overview [class*="legend"],
  #section-support-overview [class*="chips"],
  #section-support-overview [class*="kpi"],
  #section-support-performance [class*="legend"],
  #section-support-performance [class*="strip"] { display: flex; flex-wrap: wrap; gap: 4px 10px; }
  #section-support-overview b,
  #section-support-overview strong,
  #section-support-performance b,
  #section-support-performance strong { overflow-wrap: anywhere; white-space: normal; }
  #section-support-performance i { flex-shrink: 0; }
  #section-support-performance [class*="legend"] span,
  #section-support-overview [class*="legend"] span { white-space: normal; overflow-wrap: anywhere; }
}

/* Столбики «Процессор приложения»: при сотне замеров промежутки 2px не помещаются в 360px. */
@media (max-width: 420px){
  #section-support-performance .wsb-bars{gap:0;overflow:hidden;min-width:0}
  #section-support-performance .wsb-bars i{min-width:0;border-radius:1px 1px 0 0}
}

/* «Скорость и нагрузка»: переключатель числа обработчиков переносится на узком экране. */
@media (max-width: 420px){
  body.product-support #layout-speed .wsp-seg{display:flex;flex-wrap:wrap;max-width:100%}
}
