.rfr-feed {
	--rfr-gap: 1.5rem;
	--rfr-border: 1px solid #e2e8f0;
	--rfr-radius: 0.5rem;
	margin: 1.5rem 0;
}

.rfr-feed__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rfr-feed__item {
	margin: 0 0 var(--rfr-gap);
}

.rfr-feed__article {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.rfr-feed__thumbnail {
	flex: 0 0 auto;
}

.rfr-feed__thumbnail img {
	display: block;
	height: auto;
	border-radius: var(--rfr-radius);
}

.rfr-feed__body {
	flex: 1 1 auto;
	min-width: 0;
}

.rfr-feed__title {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
	line-height: 1.4;
}

.rfr-feed__title a {
	text-decoration: none;
}

.rfr-feed__title a:hover,
.rfr-feed__title a:focus {
	text-decoration: underline;
}

.rfr-feed__meta {
	margin: 0 0 0.75rem;
	color: #64748b;
	font-size: 0.875rem;
}

.rfr-feed__meta-sep {
	margin: 0 0.25rem;
}

.rfr-feed__excerpt {
	margin: 0 0 0.75rem;
	line-height: 1.6;
}

.rfr-feed__read-more {
	margin: 0;
}

.rfr-feed__source {
	margin: 0.75rem 0 0;
	color: #64748b;
	font-size: 0.875rem;
}

.rfr-feed__error {
	padding: 0.75rem 1rem;
	border-left: 4px solid #dc2626;
	background: #fef2f2;
	color: #991b1b;
}

.rfr-feed--grid .rfr-feed__list,
.rfr-feed--cards .rfr-feed__list {
	display: grid;
	gap: var(--rfr-gap);
}

.rfr-feed--grid .rfr-feed__list {
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.rfr-feed--cards .rfr-feed__list {
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.rfr-feed--grid .rfr-feed__item,
.rfr-feed--cards .rfr-feed__item {
	margin: 0;
}

.rfr-feed--grid .rfr-feed__article,
.rfr-feed--cards .rfr-feed__article {
	flex-direction: column;
	height: 100%;
}

.rfr-feed--cards .rfr-feed__article {
	padding: 1rem;
	border: var(--rfr-border);
	border-radius: var(--rfr-radius);
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.rfr-feed--cards .rfr-feed__thumbnail img,
.rfr-feed--grid .rfr-feed__thumbnail img {
	width: 100%;
}

.rfr-code {
	padding: 1rem;
	background: #f8fafc;
	border: var(--rfr-border);
	border-radius: var(--rfr-radius);
	overflow-x: auto;
}

@media (max-width: 640px) {
	.rfr-feed__article {
		flex-direction: column;
	}

	.rfr-feed__thumbnail img {
		width: 100%;
	}
}