.release-modern {
	--ink: #0c0906;
	--ink-raised: #171008;
	--gold: #c9954a;
	--gold-bright: #e2b673;
	--gold-dim: #6e5330;
	--line: rgba(201, 149, 74, 0.22);
	--text: #ece3d2;
	--text-muted: #a8967d;
	--serif: Georgia, 'Iowan Old Style', 'Palatino Linotype', 'Times New Roman', serif;
	--sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;

	background: var(--ink);
	color: var(--text);
	font-family: var(--serif);
	padding: 48px 40px 80px;
	max-width: 1180px;
	margin: 0 auto;
}

/* The parent theme's main.min.css has a ~20-class-deep !important selector
   (".skin-light p:not(.attachment) > a:not(...)...", from its "skin" system)
   forcing link color to black. A class-based override, however specific,
   isn't a reliable way to beat an unknown-length legacy selector. An ID
   selector always wins over any number of classes per the CSS spec, so
   #release-modern-root (set on the template's layout wrapper) is used here
   instead - simple and unconditionally correct. */
#release-modern-root a {
	color: var(--gold-bright) !important;
}
#release-modern-root a:hover {
	color: var(--gold) !important;
}
/* The parent theme also has a plain "strong" selector forcing near-black
   text. Low specificity, so it never beat the link-color rules above, but
   it does beat plain inheritance - any bold text in the post content (some
   inside links like "<a><strong>Shakir Khan</strong></a>", some standalone
   like "<strong>Raga Kirwani</strong>") needs its own explicit color or it
   renders black regardless of its parent's color. */
.release-modern__description strong,
.release-modern__description b {
	color: var(--text) !important;
}
#release-modern-root a strong,
#release-modern-root a b {
	color: inherit !important;
}

.release-modern__layout {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 56px;
	align-items: start;
}

.release-modern__rail {
	position: sticky;
	top: 24px;
}

.release-modern__cover img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.6);
}

.release-facts {
	margin-top: 22px;
	font-family: var(--sans);
	font-size: 12px;
	line-height: 2;
	color: var(--text-muted);
}
.release-fact b {
	color: var(--text);
	margin-right: 6px;
}

.release-modern__buttons {
	margin-top: 22px;
	background: var(--ink-raised);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 20px;
}
.release-modern__buttons-heading {
	font-family: var(--sans);
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	color: var(--text);
	margin: 0 0 16px;
}
.release-modern .wolf-release-buttons {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: auto;
	margin: 0;
}
.release-modern .wolf-release-button {
	display: block;
}
.release-modern .wolf-release-button a {
	font-family: var(--sans);
	font-size: 13px !important;
	font-weight: 700;
	letter-spacing: 0.03em;
	padding: 13px 18px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	line-height: 1;
	white-space: nowrap;
	box-shadow: 0 3px 0 rgba(0, 0, 0, 0.35);
}
/* #release-modern-root (ID) needed to beat #release-modern-root a's gold link
   color rule - every button here gets white text regardless of platform. */
#release-modern-root .wolf-release-button a {
	color: #fff !important;
}
.release-modern .wolf-release-button a:before {
	display: none !important;
}
.release-modern .release-btn-icon {
	flex: 0 0 auto;
}

/* Platform brand colors */
.release-modern .wolf-release-spotify {
	background: #1db954;
	box-shadow: 0 3px 0 #148a3e;
}
.release-modern .wolf-release-itunes {
	background: #fc3c57;
	box-shadow: 0 3px 0 #c92e42;
}
.release-modern .wolf-release-google_play {
	background: #ff0000;
	box-shadow: 0 3px 0 #b30000;
}
.release-modern .wolf-release-amazon {
	background: #1ba1e2;
	box-shadow: 0 3px 0 #0e7aa8;
}
.release-modern .wolf-release-buy,
.release-modern .wolf-release-free {
	background: var(--gold);
	box-shadow: 0 3px 0 var(--gold-dim);
}

.release-modern__content {
	padding-top: 4px;
}
.release-modern__kicker {
	font-family: var(--sans);
	font-size: 11.5px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--gold);
	margin: 0 0 12px;
}
.release-modern__title {
	font-family: var(--sans);
	font-weight: 800;
	letter-spacing: -0.02em;
	font-size: clamp(30px, 4vw, 46px);
	line-height: 1.05;
	text-wrap: balance;
	color: var(--text);
	margin: 0 0 10px;
}
.release-modern__byline {
	font-family: var(--serif);
	font-style: italic;
	color: var(--text-muted);
	margin: 0 0 32px;
}

.release-modern__description,
.release-modern__description p,
.release-modern__description em {
	font-style: normal;
	font-family: var(--serif);
	font-size: 15px;
	line-height: 1.75;
	color: var(--text-muted);
	max-width: 62ch;
}
.release-modern__description p {
	margin: 0 0 16px;
}

.release-modern__tracklist {
	margin-top: 36px;
	max-width: 62ch;
}
.release-modern__tracklist h4 {
	font-family: var(--sans);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gold);
	margin: 0 0 10px;
}
.release-modern__tracklist .release-tracklist {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: track;
}
.release-modern__tracklist .release-tracklist li {
	counter-increment: track;
	display: flex;
	align-items: baseline;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid var(--line);
	font-family: var(--sans);
	font-size: 13px;
	color: var(--text);
}
.release-modern__tracklist .release-tracklist li:before {
	content: counter(track);
	color: var(--text-muted);
	font-variant-numeric: tabular-nums;
}

.release-modern__share {
	margin-top: 32px;
}
.release-modern .wolf-share-buttons-container {
	display: flex;
	align-items: center;
	gap: 14px;
}
.release-modern .wolf-share-button-count {
	display: none;
}
.release-modern .wolf-share-link {
	font-family: var(--sans);
	font-size: 12px;
	letter-spacing: 0.04em;
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 8px 16px;
	display: inline-block;
}
/* #release-modern-root (ID) needed here to beat #release-modern-root a above. */
#release-modern-root .wolf-share-link {
	color: var(--text-muted) !important;
}
#release-modern-root .wolf-share-link:hover {
	color: var(--gold-bright) !important;
	border-color: var(--gold-dim);
}

@media (max-width: 760px) {
	.release-modern {
		padding: 32px 20px 60px;
	}
	.release-modern__layout {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.release-modern__rail {
		position: static;
	}
}