:root{
  --rating-star:#16a085;
  --rating-border:rgba(0,0,0,.10);
  --rating-muted:rgba(0,0,0,.60);
}

.beto-game-ratings.game-rating-card{
  max-width:900px;
  margin:24px auto;
  border:1px solid var(--rating-border);
  border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
  overflow:hidden;
  background:#fff;
}

.beto-game-ratings .game-rating-head{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:16px;
  padding:16px;
  border-bottom:1px solid rgba(0,0,0,.06);
}

.beto-game-ratings .game-rating-overall__label{
  font-weight:700;
  color:var(--rating-muted);
  font-size:.9rem;
  margin-bottom:4px;
}
.beto-game-ratings .game-rating-overall__value{
  display:flex;
  align-items:baseline;
  gap:6px;
  margin-bottom:6px;
}
.beto-game-ratings .game-rating-score{font-size:2rem;font-weight:800;}
.beto-game-ratings .game-rating-outof{font-weight:700;color:var(--rating-muted);}

.beto-game-ratings .game-rating-meta__title{font-weight:800;font-size:1.1rem;margin-bottom:4px;}
.beto-game-ratings .game-rating-meta__sub{color:var(--rating-muted);font-size:.95rem;line-height:1.35;}

.beto-game-ratings .game-rating-grid{padding:8px 16px 16px 16px;}
.beto-game-ratings .game-rating-row{
  display:grid;
  grid-template-columns:170px 1fr 44px;
  align-items:center;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(0,0,0,.06);
}
.beto-game-ratings .game-rating-row:last-child{border-bottom:0;}
.beto-game-ratings .game-rating-name{font-weight:700;}
.beto-game-ratings .game-rating-num{text-align:right;font-weight:800;color:var(--rating-muted);}

.beto-game-ratings .game-stars{display:inline-flex;gap:4px;align-items:center;}
.beto-game-ratings .star{
  width:16px;height:16px;display:inline-block;
  background:rgba(0,0,0,.12);
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
.beto-game-ratings .star.is-full{background:var(--rating-star);}
.beto-game-ratings .star.is-part{
  background:linear-gradient(to right,var(--rating-star) var(--fill),rgba(0,0,0,.12) var(--fill));
}

@media (max-width:720px){
  .beto-game-ratings .game-rating-head{grid-template-columns:1fr;}
  .beto-game-ratings .game-rating-row{grid-template-columns:1fr;gap:6px;}
  .beto-game-ratings .game-rating-num{text-align:left;}
}
