.workshop-article .workshop-watch-row {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--workshop-article-rail);
	scroll-margin-top: 96px;
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--ibenlo-space-4, 16px);
	margin: var(--workshop-article-section-gap) auto;
	padding: var(--ibenlo-space-4, 16px);
	border: 1px solid var(--workshop-border);
	border-radius: var(--ibenlo-card-radius);
	background: var(--workshop-surface);
}

.workshop-article .workshop-watch-row__thumbnail {
	display: block;
	width: 112px;
	height: 64px;
	margin: 0;
	object-fit: cover;
	border-radius: calc(var(--ibenlo-card-radius) / 2);
}

.workshop-watch-row__thumbnail-link {
	display: block;
	border-radius: calc(var(--ibenlo-card-radius) / 2);
}

.workshop-watch-row__actions {
	display: flex;
	gap: var(--ibenlo-space-2, 8px);
}

.workshop-watch-row__title {
	min-width: 0;
	color: var(--workshop-heading);
	font-size: var(--ibenlo-type-paragraph);
	line-height: var(--ibenlo-type-paragraph-line-height);
	font-weight: 700;
}

.workshop-article .workshop-watch-row__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ibenlo-space-2, 8px);
	padding: var(--ibenlo-space-2, 8px) var(--ibenlo-space-4, 16px);
	border: 1px solid transparent;
	border-radius: var(--ibenlo-button-radius, 8px);
	background: var(--social-youtube);
	color: var(--ibenlo-paper-bright, #fffaf0);
	font-size: var(--ibenlo-type-paragraph);
	line-height: var(--ibenlo-type-paragraph-line-height);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.workshop-article .workshop-watch-row__button:hover,
.workshop-article .workshop-watch-row__button:focus-visible {
	background: color-mix(in srgb, var(--social-youtube) 85%, black);
	color: var(--ibenlo-paper-bright, #fffaf0);
}

.workshop-watch-row__button > .ti:first-child {
	font-size: 24px;
}

.workshop-article .workshop-watch-row__button--subscribe {
	background: transparent;
	color: var(--workshop-heading);
	border-color: var(--workshop-border);
}

.workshop-article .workshop-watch-row__button--subscribe:hover,
.workshop-article .workshop-watch-row__button--subscribe:focus-visible {
	background: color-mix(in srgb, var(--social-youtube) 8%, var(--workshop-surface));
	color: var(--workshop-heading);
	border-color: var(--social-youtube);
}

.workshop-watch-row a:focus-visible {
	outline: 2px solid var(--workshop-accent);
	outline-offset: 4px;
}

@media (max-width: 980px) {
	.workshop-article .workshop-watch-row {
		grid-template-columns: 80px minmax(0, 1fr);
		gap: var(--ibenlo-space-3, 12px);
	}

	.workshop-article .workshop-watch-row__thumbnail {
		width: 80px;
		height: 48px;
	}

	.workshop-watch-row__actions {
		grid-column: 1 / -1;
	}

	.workshop-watch-row__actions > a {
		flex: 1;
	}
}

@media (max-width: 600px) {
	.workshop-watch-row__actions {
		flex-direction: column;
	}
}
