/* DARKFALL live leaderboard rows */
.leaderboard-body{display:block}

.leaderboard-row{
  display:grid;
  grid-template-columns:90px 1fr 150px 150px;
  gap:12px;
  align-items:center;
  min-height:72px;
  padding:12px 20px;
  border-bottom:1px solid rgba(234,220,198,.07);
}

.leaderboard-row:last-child{border-bottom:0}

.rank-cell{
  font:800 25px/1 Impact,Arial,sans-serif;
  color:#66889b;
}

.player-cell{min-width:0}

.player-cell strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:17px;
  color:#eadcc6;
}

.player-cell small{
  display:block;
  margin-top:5px;
  font:700 9px Arial,sans-serif;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#706961;
}

.score-cell,.run-cell{
  text-align:right;
  font:800 17px Arial,sans-serif;
  color:#c8baaa;
}

.predator-shell .rank-cell{color:#a34d3d}

.leaderboard-actions{
  display:flex;
  justify-content:center;
  margin-top:16px;
}

.leaderboard-toggle{
  min-width:170px;
  min-height:44px;
  padding:11px 18px;
  border:1px solid rgba(234,220,198,.16);
  background:rgba(10,15,16,.72);
  color:#e85b35;
  font:800 11px/1 Arial,sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}

.leaderboard-toggle:hover{
  border-color:rgba(232,91,53,.5);
  background:rgba(52,28,23,.32);
}

.leaderboard-toggle:focus-visible{
  outline:2px solid #e85b35;
  outline-offset:3px;
}

/* Species Survival Top 20 */
.species-survival-shell{margin-top:18px}

.species-survival-head,
.species-survival-row{
  display:grid;
  grid-template-columns:90px minmax(160px,1.5fr) minmax(150px,1.25fr) 160px 120px;
  gap:12px;
  align-items:center;
}

.species-survival-head{
  padding:13px 20px;
  border-bottom:1px solid rgba(234,220,198,.12);
  color:#7b746c;
  font:800 9px/1 Arial,sans-serif;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.species-survival-row{
  min-height:70px;
  padding:12px 20px;
  border-bottom:1px solid rgba(234,220,198,.07);
}

.species-survival-row:last-child{border-bottom:0}

.species-player{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:800;
  color:#eadcc6;
}

.species-name-cell{
  color:#c8baaa;
  font-weight:700;
}

.species-time{
  color:#eadcc6;
  font-weight:800;
  font-variant-numeric:tabular-nums;
}

.run-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:7px 10px;
  border:1px solid rgba(234,220,198,.13);
  font:900 9px/1 Arial,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.run-status.is-active{
  color:#a9c69e;
  border-color:rgba(169,198,158,.34);
  background:rgba(69,100,59,.16);
}

.run-status.is-finished{
  color:#8f8981;
  background:rgba(234,220,198,.035);
}

.species-formula strong:last-child{color:#c8baaa}

@media(max-width:760px){
  .leaderboard-row{
    grid-template-columns:55px 1fr 80px;
    padding-inline:14px;
  }
  .run-cell{display:none}

  .species-survival-head{
    grid-template-columns:48px 1fr 92px;
    padding:11px 12px;
  }

  .species-survival-head span:nth-child(3),
  .species-survival-head span:nth-child(5){
    display:none;
  }

  .species-survival-row{
    grid-template-columns:48px minmax(0,1fr) 92px;
    grid-template-areas:
      "rank player time"
      "rank species status";
    gap:5px 10px;
    padding:12px;
    min-height:78px;
  }

  .species-survival-row .rank-cell{grid-area:rank}
  .species-player{grid-area:player}
  .species-name-cell{grid-area:species;font-size:.8rem}
  .species-time{grid-area:time;text-align:right;font-size:.88rem}
  .run-status{
    grid-area:status;
    justify-self:end;
    min-height:24px;
    padding:5px 7px;
    font-size:7px;
  }
}
