.ss-roster-page { background:#000; overflow-x:hidden; }
.ss-roster-hero { text-align:center; padding:12px 8px 36px; }
.ss-roster-hero h1 {
	font-family:'Syncopate', sans-serif;
	font-size:clamp(28px, 6vw, 55px);
	color:#ffd166;
	letter-spacing:12px;
	margin:0;
	text-transform:uppercase;
	word-break:break-word;
}
.ss-roster-hero p {
	color:#a0a0a0;
	font-family:'Montserrat', sans-serif;
	font-size:12px;
	letter-spacing:6px;
	margin:10px 0 0;
	text-transform:uppercase;
}
.ss-roster-layout {
	display:grid;
	grid-template-columns:minmax(0, 1fr) minmax(240px, 280px);
	gap:28px 32px;
	align-items:start;
}
.ss-roster-main { min-width:0; }
.ss-roster-view-more { text-align:center; padding:18px 8px 4px; }
.ss-roster-view-more a {
	color:#ffd166;
	font-family:'Montserrat', sans-serif;
	font-size:12px;
	font-weight:700;
	letter-spacing:3px;
	text-transform:uppercase;
	text-decoration:none;
}
.ss-roster-view-more a:hover { color:#fff; }
.ss-roster-grid {
	display:grid;
	grid-template-columns:repeat(4, minmax(0, 1fr));
	gap:20px;
	min-width:0;
}
.ss-roster-card {
	background:#0a0a0a;
	border:1px solid #1a1a1a;
	border-radius:4px;
	overflow:hidden;
	min-width:0;
}
.ss-roster-card:hover { border-color:#ffd166; }
.ss-roster-card-media { display:block; }
.ss-roster-img {
	width:100%;
	aspect-ratio:1/1;
	object-fit:cover;
	object-position:center;
	display:block;
	background:#000;
}
.ss-roster-meta { padding:16px 12px 18px; text-align:center; }
.ss-roster-meta h3 {
	font-family:'Montserrat', sans-serif;
	font-weight:700;
	color:#ffd166;
	letter-spacing:1.5px;
	margin:0 0 8px;
	text-transform:uppercase;
	font-size:13px;
}
.ss-roster-genre {
	color:#888;
	font-size:10px;
	letter-spacing:1.5px;
	text-transform:uppercase;
	margin:0 0 12px;
}
.ss-roster-view {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:40px;
	min-width:120px;
	padding:8px 16px;
	border:1px solid #ffd166;
	color:#fff;
	text-decoration:none;
	font-size:10px;
	font-weight:700;
	letter-spacing:1px;
	text-transform:uppercase;
}
.ss-roster-view:hover { background:#ffd166; color:#000; }
.ss-roster-side { min-width:0; max-width:280px; }
.ss-roster-side .short_list_card { background:#0a0a0a; border:1px solid #1a1a1a; padding:14px 12px; }
.ss-roster-side .home_widget_title { font-size:16px; margin-bottom:8px; }
.ss-roster-side .home_tp_songs_list .s_lsongs_child { padding:8px 4px; }
.ss-roster-side .home_tp_songs_list .s_lsongs_child .art_song { width:48px; height:48px; }
.ss-roster-side .home_tp_songs_list .s_lsongs_child .art_details h4 { font-size:13px; line-height:16px; margin:2px 0 2px; }
.ss-roster-side .home_tp_songs_list .s_lsongs_child .first,
.ss-roster-side .home_tp_songs_list .s_lsongs_child .third .duration { display:none; }

.ss-roster-section {
	margin-top:36px;
	background:#0a0a0a;
	border:1px solid #1a1a1a;
	padding:22px 20px 24px;
}
.ss-roster-section-title {
	font-family:'Syncopate', sans-serif;
	font-size:clamp(16px, 2.4vw, 22px);
	color:#ffd166;
	letter-spacing:4px;
	text-transform:uppercase;
	margin:0 0 18px;
}
.ss-roster-row {
	display:grid;
	grid-template-columns:repeat(4, minmax(0, 1fr));
	gap:16px;
	min-width:0;
}
.ss-roster-empty {
	grid-column:1 / -1;
	color:#888;
	font-family:'Montserrat', sans-serif;
	font-size:14px;
	letter-spacing:2px;
	text-transform:uppercase;
	padding:28px 12px;
	text-align:center;
}
.ss-roster-videos .ss-video-card { background:#111; border:1px solid #222; border-radius:4px; overflow:hidden; min-width:0; }
.ss-roster-videos .ss-video-card-thumb { display:block; position:relative; height:0; padding-bottom:56.25%; background:#000 center/cover no-repeat; }
.ss-roster-videos .ss-video-card-play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#ffd166; background:rgba(0,0,0,.2); }
.ss-roster-videos .ss-video-card-body { padding:10px 12px 14px; }
.ss-roster-videos .ss-video-card-title { color:#fff; font-size:13px; font-weight:700; margin:0 0 4px; display:block; }
.ss-roster-videos .ss-video-card-artist { color:#999; font-size:12px; }
.ss-roster-videos .ss-video-card-badges { margin-top:6px; }
.ss-roster-videos .ss-video-card-badge { display:inline-block; margin-right:4px; padding:2px 7px; border-radius:10px; font-size:9px; text-transform:uppercase; border:1px solid #555; color:#bbb; }
.ss-roster-videos .ss-video-card-badge.gold { border-color:#ffd166; color:#ffd166; }
.ss-roster-videos .ss-video-card-badge.warn { border-color:#ff4444; color:#ff4444; }
.ss-roster-event-card { background:#111; border:1px solid #222; border-radius:4px; overflow:hidden; min-width:0; }
.ss-roster-event-card:hover { border-color:#ffd166; }
.ss-roster-event-media { display:block; }
.ss-roster-event-media img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:#000; }
.ss-roster-event-meta { padding:12px; }
.ss-roster-event-meta h3 { margin:0 0 6px; font-size:14px; font-weight:700; }
.ss-roster-event-meta h3 a { color:#fff; text-decoration:none; }
.ss-roster-event-meta p { margin:0; color:#888; font-size:12px; letter-spacing:1px; text-transform:uppercase; }

@media (max-width: 1199px) {
	.ss-roster-layout { grid-template-columns:minmax(0, 1fr) minmax(220px, 250px); gap:24px; }
	.ss-roster-side { max-width:250px; }
	.ss-roster-grid,
	.ss-roster-row { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
	.ss-roster-layout { grid-template-columns:1fr; }
	.ss-roster-side { display:none; }
	.ss-roster-hero h1 { letter-spacing:6px; }
	.ss-roster-hero p { letter-spacing:3px; }
}
@media (max-width: 575px) {
	.ss-roster-grid,
	.ss-roster-row { grid-template-columns:1fr; }
	.ss-roster-meta { padding:16px 12px 18px; }
	.ss-roster-section { padding:18px 14px 20px; }
}

.ss-roster-view-more.hidden { display:none; }