/* Flat podcast player — single row, mini icon, custom play/scrub controls.
   Used both under the lead image on single posts (--article) and in each
   row of the /podcast/ listing (--listing). No native <audio controls>. */

.podcast-flat-player {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	width: 100%;
	min-width: 0;
}

.podcast-flat-player--article {
	width: min(100%, var(--article-column-max, 980px));
	margin: clamp(1.3rem, 3vw, 2rem) 0 clamp(1.6rem, 3.5vw, 2.4rem);
	padding: 0.6rem 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 3px;
	background: rgba(255, 255, 255, 0.03);
}

.podcast-flat-player--listing {
	padding: 0;
}

.podcast-flat-player__toggle {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 2.15rem;
	height: 2.15rem;
	margin: 0;
	padding: 0;
	border: 1px solid var(--accent, #39c97c);
	border-radius: 50%;
	background: rgba(57, 201, 124, 0.08);
	color: var(--accent, #39c97c);
	cursor: pointer;
	transition: background 160ms ease, transform 120ms ease;
}

.podcast-flat-player__toggle:hover,
.podcast-flat-player__toggle:focus-visible {
	background: rgba(57, 201, 124, 0.2);
	outline: none;
}

.podcast-flat-player__toggle:active {
	transform: scale(0.93);
}

.podcast-flat-player__icon {
	width: 0.9rem;
	height: 0.9rem;
}

.podcast-flat-player__icon--pause {
	display: none;
}

.podcast-flat-player.is-playing .podcast-flat-player__icon--play {
	display: none;
}

.podcast-flat-player.is-playing .podcast-flat-player__icon--pause {
	display: block;
}

.podcast-flat-player__art,
.podcast-flat-player__art--fallback {
	flex: 0 0 auto;
	width: 2.35rem;
	height: 2.35rem;
	object-fit: cover;
	border-radius: 2px;
	border: 1px solid rgba(255, 255, 255, 0.14);
}

.podcast-flat-player__art--fallback {
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, 0.04);
	color: var(--accent, #39c97c);
}

.podcast-flat-player__art--fallback svg {
	width: 1.05rem;
	height: 1.05rem;
}

.podcast-flat-player__meta {
	display: grid;
	gap: 0.1rem;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 14rem;
}

.podcast-flat-player__label {
	color: var(--accent, #39c97c);
	font-family: var(--font-body, "Space Grotesk", sans-serif);
	font-size: 0.58rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
}

.podcast-flat-player__title {
	overflow: hidden;
	color: rgba(255, 255, 255, 0.92);
	font-family: var(--font-body, "Space Grotesk", sans-serif);
	font-size: 0.84rem;
	font-weight: 600;
	line-height: 1.25;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.podcast-flat-player__scrubber {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	min-width: 3rem;
	height: 1.4rem;
	cursor: pointer;
	outline: none;
	touch-action: none;
}

.podcast-flat-player__scrubber-track {
	position: relative;
	display: block;
	width: 100%;
	height: 3px;
	border-radius: 2px;
	background: rgba(255, 255, 255, 0.14);
}

.podcast-flat-player__scrubber:focus-visible .podcast-flat-player__scrubber-track {
	box-shadow: 0 0 0 2px rgba(57, 201, 124, 0.45);
}

.podcast-flat-player__scrubber-fill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 0%;
	border-radius: 2px;
	background: var(--accent, #39c97c);
}

.podcast-flat-player__time {
	flex: 0 0 auto;
	color: rgba(255, 255, 255, 0.5);
	font-family: var(--font-body, "Space Grotesk", sans-serif);
	font-size: 0.66rem;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.podcast-flat-player__download {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: 1.95rem;
	height: 1.95rem;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 2px;
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.podcast-flat-player__download:hover,
.podcast-flat-player__download:focus-visible {
	border-color: rgba(57, 201, 124, 0.45);
	background: rgba(57, 201, 124, 0.08);
	color: var(--accent, #39c97c);
	outline: none;
}

.podcast-flat-player__download svg {
	width: 0.92rem;
	height: 0.92rem;
}

@media (max-width: 560px) {
	.podcast-flat-player {
		flex-wrap: wrap;
	}

	.podcast-flat-player__meta {
		order: 1;
		flex: 1 1 100%;
		max-width: none;
	}

	.podcast-flat-player__scrubber {
		order: 3;
		flex: 1 1 100%;
		margin-top: 0.3rem;
	}

	.podcast-flat-player__time {
		order: 4;
	}

	.podcast-flat-player__download {
		order: 5;
		margin-left: auto;
	}
}