/* Narrow docks (AE panels are often docked at 200–300 px): nothing is cut with "…", controls stack instead of squeezing. */
@media (max-width:300px){
  /* categories: two tidy rows of three instead of a truncated strip */
  body #uk-cats.khs-cats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:2px!important;overflow:visible!important}
  body #uk-cats.khs-cats button{flex:none!important;min-width:0!important;padding:4px 2px!important;font-size:10.5px!important;text-overflow:clip!important;overflow:hidden!important}
  /* element gallery: two big tiles per row, full names */
  body #element-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  body #element-grid .element-tile>span{white-space:normal!important;text-overflow:clip!important;line-height:1.15!important}
  /* control rows: label on top, the control gets the full width (segmented stays horizontal) */
  body .workspace .khs-form>label,body .workspace main[data-pane] .khs-form>label,body #uk-params .khs-form>label{grid-template-columns:minmax(0,1fr)!important;gap:4px!important}
  body .khs-form>label .segmented{display:flex!important;flex-direction:row!important;width:100%!important}
  body .khs-form>label .segmented button{flex:1 1 0!important;min-width:0!important;padding-inline:2px!important}
}
@media (max-width:300px){
  /* segmented choices never truncate: whole words, wrapping to a second row when there is no room */
  body .segmented:not(#uk-cats){flex-wrap:wrap!important;height:auto!important}
  body .segmented:not(#uk-cats) button{flex:1 1 auto!important;min-width:max-content!important;text-overflow:clip!important;overflow:visible!important;white-space:nowrap!important;padding-inline:6px!important}
  body .apply-row .primary{font-size:12px!important;padding-inline:8px!important;white-space:nowrap}
}
@media (max-width:240px){
  /* the main action keeps its full label; Remove moves under it */
  body .apply-row{flex-wrap:wrap!important;gap:5px!important}
  body .apply-row>*{flex:1 1 100%!important;width:100%!important;min-height:32px!important}
}
@media (max-width:300px){
  /* nested rows (language/model pairs etc.) stack the same way */
  body .khs-form label,body .khs-pair{grid-template-columns:minmax(0,1fr)!important}
  body .segmented:not(#uk-cats){display:flex!important}
}