/* HRN Core — The Solid 10 charts */
.hrn-sc {
	--c-gold: var(--wp--preset--color--gold, #C9A84C); --c-cream: var(--wp--preset--color--cream, #F5ECD7);
	--c-muted: var(--wp--preset--color--muted, #A39A88); --c-card: var(--wp--preset--color--card, #15161B);
	--c-card2: var(--wp--preset--color--card-raised, #1D1F26); --c-line: var(--wp--preset--color--line, #2C2F38);
	--c-green: var(--wp--preset--color--green, #1A5C2A); --c-maroon: var(--wp--preset--color--maroon, #6B1F2A);
	--c-mono: var(--wp--preset--font-family--mono, ui-monospace, Menlo, monospace);
	--c-head: var(--wp--preset--font-family--heading, Poppins, sans-serif);
	background: var(--c-card); border: 1px solid var(--c-line); border-radius: 16px; overflow: hidden; color: var(--c-cream);
}
.hrn-sc * { box-sizing: border-box; }
.hrn-sc p, .hrn-sc h3, .hrn-sc h4, .hrn-sc ol, .hrn-sc ul { margin: 0; }
.hrn-sc .hrn-stripe { display: flex; height: 4px; } .hrn-sc .hrn-stripe span { flex: 1; }
.hrn-sc .hrn-stripe span:nth-child(1) { background: var(--c-green); } .hrn-sc .hrn-stripe span:nth-child(2) { background: var(--c-gold); } .hrn-sc .hrn-stripe span:nth-child(3) { background: var(--c-maroon); }
.hrn-sc__inner { padding: 1.25rem 1.4rem 1.4rem; display: flex; flex-direction: column; gap: 1rem; }
.hrn-sc__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.hrn-sc__eyebrow { font-family: var(--c-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); }
.hrn-sc__h { font-family: var(--c-head); font-weight: 800; font-size: 1.35rem !important; color: var(--c-cream); margin-top: .2rem !important; }
.hrn-sc__week { font-family: var(--c-head); font-weight: 600; font-size: 14px; color: var(--c-muted); }
.hrn-sc__empty { color: var(--c-muted); font-size: 15px; line-height: 1.55; }
.hrn-sc__charts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; }
.hrn-sc__chart-title { font-family: var(--c-head); font-weight: 700; font-size: 1.05rem !important; color: var(--c-cream); margin-bottom: .6rem !important; display: flex; flex-direction: column; gap: 2px; }
.hrn-sc__chart-title span { font-family: inherit; font-weight: 500; font-size: 12px; color: var(--c-muted); }
.hrn-sc__list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: .45rem; }
.hrn-sc__row { display: flex; align-items: center; gap: .75rem; background: var(--c-card2); border-radius: 10px; padding: .5rem .75rem; min-height: 64px; }
.hrn-sc:not(.hrn-sc--strip) .hrn-sc__row { min-height: 70px; }
.hrn-sc__rank { font-family: var(--c-head); font-weight: 800; font-size: 1.25rem; color: var(--c-gold); width: 1.6em; text-align: center; flex: none; }
.hrn-sc__art { width: 44px; height: 44px; border-radius: 6px; object-fit: cover; flex: none; background: #0b0b0d; }
.hrn-sc__song { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.hrn-sc__title { font-weight: 600; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hrn-sc__artist { font-size: 12.5px; color: var(--c-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hrn-sc__meta { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex: none; font-family: var(--c-mono); font-size: 11px; }
.hrn-sc__move { font-weight: 700; padding: 1px 6px; border-radius: 999px; }
.hrn-sc__move.is-up { color: #7FD48F; } .hrn-sc__move.is-down { color: #E58B8B; } .hrn-sc__move.is-same { color: var(--c-muted); }
.hrn-sc__move.is-new { background: var(--c-gold); color: #111; text-transform: uppercase; letter-spacing: .06em; font-size: 9.5px; }
.hrn-sc__approve, .hrn-sc__weeks { color: var(--c-muted); }
.hrn-sc__foot { font-size: 13.5px; color: var(--c-muted); }
.hrn-sc__foot a { color: var(--c-gold) !important; font-weight: 600; }
.hrn-sc__hall, .hrn-sc__how { border-top: 1px solid var(--c-line); padding-top: 1rem; display: flex; flex-direction: column; gap: .5rem; }
.hrn-sc__hall-note, .hrn-sc__fine { font-size: 13px; color: var(--c-muted); line-height: 1.5; }
.hrn-sc__hall ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.hrn-sc__hall li { background: var(--c-card2); border: 1px solid var(--c-gold); border-radius: 999px; padding: 3px 12px; font-size: 13px; }
.hrn-sc__hall li span { color: var(--c-muted); }
.hrn-sc__how ol { padding-left: 1.2rem; display: flex; flex-direction: column; gap: .35rem; font-size: 14.5px; line-height: 1.5; color: #DCD3C0; }
@media (max-width: 781px) { .hrn-sc__charts { grid-template-columns: 1fr; } }
