@media(max-width:780px){
  /* Use width aggressively without changing page routing. */
  .page>.grid.g4,.channel-subpage>.grid.g4{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
  .page>.grid.g3,.channel-subpage>.grid.g3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
  .metric{min-width:0;padding:7px!important}
  .metric .k{font-size:8px!important;line-height:1.2}
  .metric .v{font-size:16px!important;line-height:1.1}
  .metric .d{font-size:8px!important;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* Studio: explanations are scan-friendly; editors/content remain untouched. */
  #studio .cnt-card-head p,
  #studio .family-card>p,
  #studio .production-bench-head p,
  #studio .output-family-card p{
    margin-top:2px!important;font-size:8px!important;line-height:1.3!important;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
  }
  #studio .cnt-card,#studio .family-card{margin-bottom:5px!important}
  #studio .cnt-card-head,#studio .family-card-head{padding:6px 7px!important}
  /* Horizontal command groups use otherwise wasted width. */
  #studio .toolbar,#studio .cnt-toolbar,.filter-row,.chip-row{
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch
  }
  #studio .toolbar::-webkit-scrollbar,#studio .cnt-toolbar::-webkit-scrollbar,.filter-row::-webkit-scrollbar,.chip-row::-webkit-scrollbar{display:none}
  /* Small screens must not inherit desktop minimum widths. */
  .page.active .panel,.page.active .card,.page.active .cnt-card,.page.active .grid>*{min-width:0!important;max-width:100%}
}
@media(max-width:350px){
  .page>.grid.g4,.channel-subpage>.grid.g4,.page>.grid.g3,.channel-subpage>.grid.g3{grid-template-columns:1fr 1fr!important}
  .metric{padding:6px!important}
}