.player-overview-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  margin: 20px 0 15px;
}
.player-overview-title h3 {
  font-size: 19px;
  margin: 0;
}
.player-overview-title button,
.player-overview-trend button {
  background: transparent;
  border: 1px solid #526d42;
  border-radius: 6px;
  color: #cfe4a3;
  font-size: 12px;
  padding: 9px 12px;
}
.player-overview-title small {
  font-size: 11px;
  color: #8ea780;
}
.player-overview-grid {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 16px;
}
.player-overview-grid > article,
.player-overview-trend {
  border: 1px solid #3e5736;
  border-radius: 12px;
  background: #203425;
  padding: 22px;
}
.player-overview-grid > article > small,
.player-overview-trend > small {
  font-size: 11px;
  color: #9eb68c;
}
.player-overview-recent > strong {
  display: block;
  font-size: 40px;
  line-height: 1.1;
  color: #d4e9a7;
  margin: 18px 0 12px;
}
.player-overview-recent > span {
  font-size: 13px;
  color: #c1d4ae;
}
.player-overview p {
  font-size: 12px !important;
  line-height: 1.8;
  color: #8fa982 !important;
}
.player-overview-match {
  display: flex;
  align-items: center;
  gap: 18px;
  text-align: left;
  padding: 20px 0 0;
  border: 0;
  background: none;
  color: #e2ecd4;
  width: 100%;
}
.player-overview-match img {
  width: 78px;
  height: 94px;
  object-fit: cover;
  border-radius: 8px;
}
.player-overview-match span {
  display: grid;
  gap: 13px;
}
.player-overview-match strong {
  font-size: 19px;
}
.player-overview-match small {
  font-size: 14px;
  color: #c6d6b6;
}
.player-overview-match em {
  font-size: 11px;
  font-style: normal;
  color: #aac983;
}
.player-overview-heroes > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.player-overview-heroes button {
  display: flex;
  gap: 12px;
  align-items: center;
  text-align: left;
  background: #203425;
  border: 1px solid #3f5836;
  border-radius: 9px;
  padding: 14px;
  color: #dfebd2;
}
.player-overview-heroes img {
  width: 48px;
  height: 58px;
  object-fit: cover;
  border-radius: 5px;
}
.player-overview-heroes span {
  display: grid;
  gap: 8px;
}
.player-overview-heroes strong {
  font-size: 13px;
}
.player-overview-heroes small {
  font-size: 11px;
  color: #9fb98c;
}
.player-overview-trend {
  margin: 22px 0;
}
.player-overview-trend h3 {
  font-size: 20px;
}
.desk-source-health:has(details) {
  padding: 12px 16px;
}
.desk-source-health > details {
  width: 100%;
}
.desk-source-health > details > summary {
  font-size: 12px;
  color: #b9cfa4;
  cursor: pointer;
}
.desk-source-health > details p {
  font-size: 11px;
  line-height: 1.8;
  color: #93aa85;
}
.desk-match-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 16px 0;
}
.desk-match-toolbar label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #acc69c;
}
.desk-match-toolbar select {
  background: #253d2b;
  color: #deebd2;
  border: 1px solid #4b683d;
  border-radius: 6px;
  padding: 8px;
}
.desk-match-toolbar small {
  font-size: 11px;
  color: #92a984;
}
@media (max-width: 700px) {
  .player-overview-grid {
    grid-template-columns: 1fr;
  }
  .player-overview-heroes > div {
    grid-template-columns: 1fr;
  }
  .player-overview-grid > article,
  .player-overview-trend {
    padding: 17px;
  }
  .player-overview-match img {
    width: 60px;
    height: 74px;
  }
  .player-overview-match strong {
    font-size: 16px;
  }
}