/* =========================================================
   DESKTOP SCALE + WIDER RANK PLATES
   ========================================================= */

@media (min-width: 1101px){
  .topbar{
    padding-left:max(28px,calc((100% - 1500px)/2));
    padding-right:max(28px,calc((100% - 1500px)/2));
  }

  main{
    width:min(1500px,calc(100% - 56px));
  }

  footer{
    padding-left:max(28px,calc((100% - 1500px)/2));
    padding-right:max(28px,calc((100% - 1500px)/2));
  }

  .table-card.overall-active .row{
    grid-template-columns:
      110px
      minmax(240px,1fr)
      minmax(560px,1.8fr)
      100px;
  }

  .table-card.overall-active .row .rank-plate{
    width:calc(100% + 18px);
    margin-left:-18px;
    padding-left:18px;
    padding-right:12px;
  }
}

@media (min-width: 1500px){
  main{
    width:min(1580px,calc(100% - 64px));
  }

  .topbar{
    padding-left:max(32px,calc((100% - 1580px)/2));
    padding-right:max(32px,calc((100% - 1580px)/2));
  }

  footer{
    padding-left:max(32px,calc((100% - 1580px)/2));
    padding-right:max(32px,calc((100% - 1580px)/2));
  }

  .table-card.overall-active .row{
    grid-template-columns:
      110px
      minmax(260px,1fr)
      minmax(620px,1.8fr)
      105px;
  }
}

.table-card.overall-active .row .rank-plate .avatar{
  width:52px;
  height:52px;
}

@media (max-width:750px){
  .table-card.overall-active .row{
    grid-template-columns:
      125px
      minmax(150px,1fr)
      68px
      65px;
  }

  .table-card.overall-active .row .rank-plate{
    width:100%;
    margin-left:0;
    padding-left:12px;
    padding-right:8px;
  }

  .table-card.overall-active .row .rank-plate .avatar{
    width:40px;
    height:40px;
  }
}

/* =========================================================
   INFORMATION PAGE
   ========================================================= */
.info-page-eyebrow{color:var(--accent2);font-size:10px;font-weight:800;letter-spacing:2px;margin-bottom:9px}
.info-action{display:inline-flex;align-items:center;justify-content:center;margin-top:2px;padding:10px 14px;border:1px solid var(--border);border-radius:8px;background:var(--panel2);color:var(--text);text-decoration:none;font-size:12px;font-weight:700}
.info-action:hover{border-color:var(--accent);background:#1d222c}