.ksp-mos {
	position: relative;
	background: linear-gradient(160deg, rgba(61, 155, 233, 0.14), var(--ksp-bg-elevated) 55%);
	border-top: 1px solid rgba(61, 155, 233, 0.35);
	border-bottom: 1px solid rgba(61, 155, 233, 0.35);
	padding: 36px 0 28px;
	margin: 40px 0;
	box-shadow: 0 24px 48px -32px rgba(61, 155, 233, 0.55);
	box-sizing: border-box;
	/* Full-bleed: ocupa a largura toda do ecrã, ponta a ponta, independente
	   do wrapper (wide/constrained) em que o shortcode esteja — mesma
	   técnica usada no carrossel de artistas (.ksp-marquee). !important
	   porque os global styles do WP aplicam margin:auto + max-width aos
	   filhos de ".is-layout-constrained" com a mesma especificidade. */
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
/* Barra de destaque no topo, para a secção não se perder no resto da
   página (o mesmo azul usado no badge "NOVO" e nos outros acentos). */
.ksp-mos::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--wp--preset--color--accent-1), var(--wp--preset--color--accent-2));
	box-shadow: 0 2px 10px rgba(61, 155, 233, 0.45);
}
.ksp-mos__inner {
	position: relative;
	max-width: var(--wp--style--global--wide-size, 1340px);
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 48px);
	box-sizing: border-box;
}
.ksp-mos__badge {
	position: absolute;
	top: -12px;
	left: clamp(16px, 4vw, 48px);
	background: var(--wp--preset--color--accent-2);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	padding: 4px 12px;
	border-radius: 999px;
}
.ksp-mos__heading {
	text-align: center;
	color: var(--wp--preset--color--accent-2);
	margin: 0;
}
.ksp-mos__month {
	text-align: center;
	color: rgba(var(--ksp-fg-rgb), 0.6);
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 4px 0 12px;
}
.ksp-mos__prev-winner {
	text-align: center;
	color: rgba(var(--ksp-fg-rgb), 0.75);
	font-size: 0.85rem;
	margin: 0 0 24px;
}
.ksp-mos__prev-winner strong {
	color: var(--wp--preset--color--accent-1);
}
.ksp-mos__panels {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 24px;
}
@media (max-width: 760px) {
	.ksp-mos__panels {
		grid-template-columns: 1fr;
	}
}
.ksp-mos__list-panel h3,
.ksp-mos__vote-panel h3 {
	margin: 0 0 12px;
	color: var(--ksp-text);
	font-size: 1rem;
}
.ksp-mos__list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 420px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ksp-mos-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 12px;
	background: var(--ksp-bg);
	border: 1px solid transparent;
	cursor: pointer;
	position: relative;
}
.ksp-mos-row:hover {
	border-color: rgba(var(--ksp-fg-rgb), 0.15);
}
.ksp-mos-row--active {
	border-color: var(--wp--preset--color--accent-1);
	background: rgba(61, 155, 233, 0.08);
}
.ksp-mos-row--mine {
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--accent-2);
}
.ksp-mos-row__img {
	width: 40px;
	height: 40px;
	border-radius: 8px;
	object-fit: cover;
	background: rgba(var(--ksp-fg-rgb), 0.08);
	flex-shrink: 0;
}
.ksp-mos-row__info {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}
.ksp-mos-row__title {
	font-weight: 700;
	color: var(--ksp-text);
	font-size: 0.9rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ksp-mos-row__artist {
	font-size: 0.78rem;
	color: rgba(var(--ksp-fg-rgb), 0.6);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ksp-mos-row__votes {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--wp--preset--color--accent-1);
	white-space: nowrap;
}
.ksp-mos-row__badge {
	flex-shrink: 0;
	font-size: 0.65rem;
	color: var(--wp--preset--color--accent-2);
	font-weight: 700;
	white-space: nowrap;
	margin-left: 8px;
}

.ksp-mos__vote-panel {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.ksp-mos__artist {
	display: flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	color: var(--ksp-text);
	margin-bottom: 14px;
	padding: 4px 10px 4px 4px;
	border-radius: 999px;
	background: rgba(var(--ksp-fg-rgb), 0.06);
	transition: background-color 0.2s ease;
}
.ksp-mos__artist[hidden] {
	display: none;
}
.ksp-mos__artist:hover {
	background: rgba(61, 155, 233, 0.12);
}
.ksp-mos__artist-avatar {
	display: block;
	width: 32px;
	height: 32px;
	border-radius: 999px;
	overflow: hidden;
	background: var(--ksp-bg-elevated-2);
	border: 2px solid rgba(var(--ksp-fg-rgb), 0.12);
	flex-shrink: 0;
}
.ksp-mos__artist-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.ksp-mos__artist-name {
	font-size: 0.8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}
.ksp-mos__cover {
	width: 160px;
	height: 160px;
	border-radius: 14px;
	object-fit: cover;
	background: rgba(var(--ksp-fg-rgb), 0.08);
	margin-bottom: 16px;
}
.ksp-mos__player {
	width: 100%;
	margin-bottom: 16px;
}
.ksp-mos__iframe {
	border-radius: 12px;
}
.ksp-mos__submit {
	background: var(--wp--preset--color--accent-1);
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 10px 28px;
	font-weight: 700;
	font-size: 0.9rem;
	cursor: pointer;
}
.ksp-mos__submit:hover {
	opacity: 0.9;
}
.ksp-mos__submit:disabled {
	opacity: 0.6;
	cursor: default;
}
.ksp-mos__status {
	margin-top: 10px;
	font-size: 0.85rem;
	color: var(--ksp-text);
}
.ksp-mos__status a {
	color: var(--wp--preset--color--accent-1);
}