:where(.comments-area) a {
	text-decoration: none;
}

.comments-area {
	padding: 0;
    margin-top: var(--space-xl);
}
.comments-area h2 {
	margin-top: 0;
}

.comment-list,
.comment-form {
	display: flex;
	flex-direction: column;
    gap: var(--space-s);
	padding-inline-start: 0;
    background: var(--color-bg);
    border-radius: var(--radius-s);
}

.comment {
	list-style-type: none;
    padding: var(--space-m);
    background: var(--color-surface);
    border-radius: var(--radius-s);
	margin-bottom: 0;
}

.comment .comment-author {
	display: flex;
	align-items: flex-start;
    gap: var(--space-s);
}

.comment .comment-author .avatar {
    width: 42px;
    height: 42px;
    border-radius: 42px;
}

.comment .comment-author .fn {
	font-style: normal;
	font-weight: bold;
}
.comment .comment-author .says {
	display: none;
}

.comment .comment-meta {
    font-size: var(--font-size-xs);
	opacity: 0.5;
	margin-left: 54px;
	margin-top: -16px;
}

.comment .reply {
    font-size: var(--font-size-xs);
}

.comment-list .children {
    margin-top: var(--space-m);
    padding-left: var(--space-m);
	border-left: 3px solid var(--color-borders);
}

.comment-list .children .comment {
	padding-left: 0;
}