/* v415: compact six-pixel rhythm and font-safe connection cards. */
#appShell .wrap{padding:6px!important}
#appShell .grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,clamp(286px,calc(248px + 38px * var(--coin-name-scale)),338px)),1fr))!important;
  gap:6px!important;
}
#appShell .exchange>.cols>.col,
#appShell .exchange>.cols>.col:first-child{
  padding:6px!important;
}
#appShell .market.market-exchange-inline{
  min-height:31px;
  margin:0 0 6px!important;
  padding:0 0 6px!important;
}
#appShell .section{margin:9px 0 5px!important}
#appShell .row{
  grid-template-columns:minmax(0,1fr) minmax(5.25em,max-content) 1.45em!important;
  column-gap:clamp(3px,calc(4px * var(--coin-name-scale)),6px)!important;
  padding-inline:3px!important;
}
#appShell .row .sym{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#appShell .row .new-slot{display:none!important}
#appShell .row.isnew{
  grid-template-columns:minmax(0,1fr) minmax(2.65em,max-content) minmax(5.25em,max-content) 1.45em!important;
}
#appShell .row.isnew .new-slot{display:flex!important;min-width:0!important}
#appShell .row .pct{min-width:5.25em!important}
@container(max-width:315px){
  #appShell .row{grid-template-columns:minmax(0,1fr) minmax(4.9em,max-content) 1.35em!important}
  #appShell .row.isnew{grid-template-columns:minmax(0,1fr) minmax(2.45em,max-content) minmax(4.9em,max-content) 1.35em!important}
  #appShell .row .pct{min-width:4.9em!important}
  #appShell .colibri-launch{width:1.35em;height:1.35em}
}
@media(max-width:680px){
  #appShell .grid{grid-template-columns:minmax(0,1fr)!important}
}
