/* v417: use surplus width by changing card count first, then by growing the symbol track. */
#appShell .grid{
  --connection-min:clamp(235px,calc(210px + 38px * var(--coin-name-scale)),275px);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--connection-min)),1fr))!important;
}
/* Compact cards keep the data cluster tight. */
#appShell .row{
  --row-lead:clamp(9.5em,54cqi,14.5em);
}
/* When a card grows, all surplus belongs to the symbol; trailing data reaches the edge. */
@container(min-width:280px){
  #appShell .row{
    grid-template-columns:minmax(0,1fr) minmax(5.25em,max-content) 1.45em!important;
    width:100%!important;
  }
  #appShell .row.isnew{
    grid-template-columns:minmax(0,1fr) minmax(2.65em,max-content) minmax(5.25em,max-content) 1.45em!important;
  }
}
/* Very narrow cards retain every functional column before truncating a symbol. */
@container(max-width:255px){
  #appShell .row{
    --row-gap:3px;
    --row-lead:clamp(8.5em,52cqi,12em);
    grid-template-columns:minmax(0,var(--row-lead)) minmax(4.75em,max-content) 1.3em!important;
  }
  #appShell .row.isnew{
    grid-template-columns:minmax(0,calc(var(--row-lead) - 2.35em - var(--row-gap))) minmax(2.35em,max-content) minmax(4.75em,max-content) 1.3em!important;
  }
  #appShell .row .pct{min-width:4.75em!important}
  #appShell .colibri-launch{width:1.3em;height:1.3em}
}
@media(max-width:680px){
  #appShell .grid{grid-template-columns:minmax(0,1fr)!important}
}