.ratings-page{
	display:grid;
	grid-template-columns:repeat(1,1fr);
	gap:26px;
}

.ratings-page-panel{
	min-width:0;
}

.rating-item--progress{
	position:relative;
	overflow:hidden;
	padding-left:16px;
	padding-right:16px;
	border-radius:14px;
}

.rating-item--progress:before{
	content:"";
	position:absolute;
	inset:0 auto 0 0;
	width:var(--rating-fill);
	background:linear-gradient(90deg,#ffc400,#ff8a00);
	pointer-events:none;
}

.rating-item--progress > *{
	position:relative;
	z-index:1;
}

.rating-score{
	display:flex;
	align-items:center;
	gap:10px;
}

.rating-score span{
	color:#ffffff;
	font-weight:900;
	
}

.rating-level{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:34px;
	height:28px;
	padding:0 10px;
	border-radius:9px;
	background:#9b6f00;
	color:#fff;
	font-size:14px;
	font-weight:1000;
	line-height:1;
}

.ratings-page-list{
	margin-top:24px;
}

@media (max-width:768px){

.rating-score span{
	color:#ffffff;
	font-weight:900;
	font-size:12px;
}

.rating-level{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:34px;
	height:20px;
	padding:0 10px;
	border-radius:9px;
	background:#9b6f00;
	color:#fff;
	font-size:12px;
	font-weight:1000;
	line-height:1;
}

.rating-item--progress{
	position:relative;
	overflow:hidden;
	padding-left:10px;
	padding-right:10px;
	border-radius:6px;
}
	
	
}
@media(max-width:900px){

	.ratings-page{
		grid-template-columns:1fr;
	}

}

.ratings-main-panel{
	padding:28px;
}

.ratings-top{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:30px;
	margin-bottom:28px;
}

.ratings-top__left{
	min-width:0;
}

.ratings-top__left h3{
	margin:0;
	color:#fff;
	font-size:36px;
	font-weight:1000;
	text-transform:uppercase;
	line-height:1;
}

.ratings-top__left span{
	display:block;
	margin-top:8px;
	color:#888;
	font-size:14px;
	font-weight:900;
	text-transform:uppercase;
	letter-spacing:.06em;
}

.ratings-tabs{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:10px;
	flex-wrap:wrap;
	margin-left:auto;
}

.ratings-tab{
	height:46px;
	padding:0 20px;
	border:1px solid rgba(255,255,255,.10);
	border-radius:14px;
	background:rgba(255,255,255,.04);
	color:#fff;
	font-size:13px;
	font-weight:1000;
	text-transform:uppercase;
	cursor:pointer;
	transition:.18s ease;
}

.ratings-tab:hover{
	background:rgba(255,255,255,.08);
}

.ratings-tab.active{
	background:
		linear-gradient(
			180deg,
			#ffd34a,
			#ffb300
		);

	color:#111;

	border-color:rgba(255,196,0,.65);

	box-shadow:
		0 10px 24px rgba(255,179,0,.22);
}

.ratings-table{
	display:none;
	margin-top:28px;
}

.ratings-table.active{
	display:block;
}

.ratings-page-list{
	margin-top:0;
}

@media(max-width:760px){

.live-page {
	width: min(1470px, 92vw);
	margin: 20px auto 0px;
}

.ratings-top__left h3 {
	font-size: 20px;
}

.ratings-top__left span {
	font-size: 10px;
	font-weight: 300;
}

.ratings-tab {
	height: 36px;
	padding: 0 10px;
	border-radius: 10px;
	font-size: 10px;
		font-weight: 1000;
}

.ratings-main-panel {
	padding: 20px;
}

.live-page-panel {
	padding: 20px;
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: 18px;
}

	.ratings-top{
		flex-direction:column;
		align-items:flex-start;
	}

	.ratings-tabs{
		width:100%;
		justify-content:flex-start;
	}

}

.rating-load-more{
	display:flex;
	align-items:center;
	justify-content:center;

	width:max-content;
	min-width:190px;
	height:44px;

	margin:24px auto 0;
	padding:0 24px;

	border:0;
	border-radius:10px;

	background:rgba(255,255,255,.035);

	color:#fff;
	font-size:14px;
	font-weight:900;
	text-transform:uppercase;
	letter-spacing:.25px;

	cursor:pointer;
	transition:.18s ease;
}

.rating-load-more:hover{
	background:rgba(255,255,255,.07);
	color:#ffc400;
}

.rating-load-more.is-loading{
	opacity:.55;
	pointer-events:none;
}

.ratings-table{
	display:none;
}

.ratings-table.active{
	display:block;
}