/* HRN Core — song votes (The Solid 10) */
.hrn-vote { position: relative; display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; }
.hrn-vote__btn {
	display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
	background: transparent; border: 1px solid var(--wp--preset--color--line, #2C2F38); border-radius: 999px;
	color: var(--wp--preset--color--muted, #A39A88); padding: 5px 10px; line-height: 1;
	font: 600 12px/1 var(--wp--preset--font-family--heading, Poppins, sans-serif);
	transition: color .15s, border-color .15s, background .15s, transform .1s;
}
.hrn-vote__btn svg { width: 15px; height: 15px; fill: currentColor; }
.hrn-vote__down svg { transform: rotate(180deg); }
.hrn-vote__btn:hover { color: var(--wp--preset--color--cream, #F5ECD7); border-color: var(--wp--preset--color--gold, #C9A84C); }
.hrn-vote__btn:active { transform: scale(.94); }
.hrn-vote__btn:focus-visible { outline: 2px solid var(--wp--preset--color--gold, #C9A84C); outline-offset: 2px; }
.hrn-vote:not(.is-ready) .hrn-vote__btn { opacity: .55; }
.hrn-vote__up[aria-pressed="true"] { background: var(--wp--preset--color--green, #1A5C2A); border-color: var(--wp--preset--color--green, #1A5C2A); color: #fff; opacity: 1; }
.hrn-vote__down[aria-pressed="true"] { background: var(--wp--preset--color--maroon, #6B1F2A); border-color: var(--wp--preset--color--maroon, #6B1F2A); color: #fff; opacity: 1; }
.hrn-vote__n:empty { display: none; }
.hrn-vote__tip {
	position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 30; white-space: nowrap;
	background: var(--wp--preset--color--navy, #0E1420); color: var(--wp--preset--color--cream, #F5ECD7);
	border: 1px solid var(--wp--preset--color--gold, #C9A84C); border-radius: 8px; padding: 6px 10px;
	font: 500 12px/1.3 var(--wp--preset--font-family--body, Inter, sans-serif);
	opacity: 0; transform: translateY(4px); pointer-events: none; transition: opacity .15s, transform .15s;
}
.hrn-vote.show-tip .hrn-vote__tip { opacity: 1; transform: none; }
/* sizes */
.hrn-vote--sm { margin: 0 4px 0 auto; }
.hrn-vote--sm .hrn-vote__btn { padding: 6px 9px; }
.hrn-sticky .hrn-vote__tip { bottom: calc(100% + 12px); left: auto; right: 0; }
.hrn-vote--xs { margin: 0; gap: 2px; flex: none; }
/* Just played: thumbs sit under the "4 min ago", so song names keep their room */
.hrn-np__row:has(.hrn-vote) { position: relative; }
.hrn-np__row:has(.hrn-vote) .hrn-np__row-ago { align-self: flex-start; margin-top: 1px; }
.hrn-np__row .hrn-vote--xs { position: absolute; right: -4px; bottom: -5px; }
.hrn-vote--xs .hrn-vote__btn { border: 0; padding: 4px; }
.hrn-vote--xs .hrn-vote__btn svg { width: 13px; height: 13px; }
.hrn-vote--xs .hrn-vote__n { font-size: 10px; }
.hrn-vote--xs .hrn-vote__tip { left: auto; right: 0; }
@media (max-width: 600px) {
	.hrn-sticky .hrn-vote__down { display: none; } /* keep the bar uncluttered; both show in the hero */
}
@media (prefers-reduced-motion: reduce) { .hrn-vote__btn, .hrn-vote__tip { transition: none; } }
