/* 评论区样式覆盖 - 最高优先级 */
#comments_area,
#comments_area * {
	font-size: 16px !important;
}

.comment-card {
	background: #d1f4a8 !important;
	border-radius: 8px !important;
	padding: 14px 16px !important;
	box-shadow: none !important;
	border: 1px solid #c1e498 !important;
	width: 100% !important;
	margin-bottom: 0 !important;
}

.comment-card:hover {
	transform: none !important;
	box-shadow: none !important;
}

.comment-card--reply {
	background: #dcf7bb !important;
	margin-top: 10px !important;
	border-color: #c8eaa5 !important;
}

.comment-card__header {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin-bottom: 0 !important;
}

.comment-avatar {
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	background: #5b8df0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	font-size: 1.1rem !important;
	color: #fff !important;
	text-transform: uppercase !important;
	flex-shrink: 0 !important;
}

.comment-meta {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
	flex: 1 !important;
	min-width: 0 !important;
	position: static !important;
	right: auto !important;
	top: auto !important;
	text-align: left !important;
	font-size: 16px !important;
}

.comment-meta__top {
	display: flex !important;
	align-items: baseline !important;
	gap: 8px !important;
	flex-wrap: wrap !important;
}

.comment-author {
	font-size: 16px !important;
	font-weight: 600 !important;
	color: #333 !important;
	text-decoration: underline !important;
	text-decoration-color: #333 !important;
	text-underline-offset: 2px !important;
}

.comment-author:hover {
	color: #5b8df0 !important;
}

.comment-date {
	font-size: 16px !important;
	color: #888 !important;
	font-weight: 400 !important;
}

.comment-card__body {
	color: #333 !important;
	font-size: 0.875rem !important;
	line-height: 1.6 !important;
	margin-bottom: 10px !important;
	margin-top: 8px !important;
	white-space: pre-wrap !important;
}

.comment-card__actions {
	display: flex !important;
	align-items: center !important;
	gap: 2px !important;
	margin-bottom: 10px !important;
	margin-top: 0 !important;
	flex-wrap: nowrap !important;
}

.comment-action {
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
	border: none !important;
	background: transparent !important;
	padding: 4px 6px !important;
	border-radius: 4px !important;
	font-weight: 500 !important;
	font-size: 0.85rem !important;
	cursor: pointer !important;
	color: #777 !important;
	transition: all 0.2s ease !important;
	text-decoration: none !important;
	white-space: nowrap !important;
}

.comment-action svg {
	width: 16px !important;
	height: 16px !important;
	fill: currentColor !important;
	stroke: none !important;
	transition: all 0.2s ease !important;
	flex-shrink: 0 !important;
}

/* Reply文本样式 */
.comment--reply {
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	color: inherit !important;
	margin-left: 4px !important;
}

/* 投票数显示样式 */
.voteUp,
.voteDown,
.vote-count {
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	color: #777 !important;
	margin-left: 4px !important;
	transition: transform 0.2s ease, color 0.2s ease !important;
}

.comment-action:hover {
	background: transparent !important;
}

.comment-action--reply {
	color: #1cb1cd !important;
}

.comment-action--reply svg {
	fill: #1cb1cd !important;
}

.comment-action--reply:hover {
	color: #159aaf !important;
	background: transparent !important;
}

.comment-action--reply:hover svg {
	fill: #159aaf !important;
}

.comment-action--upvote {
	color: #1cb1cd !important;
}

.comment-action--upvote svg {
	fill: #1cb1cd !important;
}

.comment-action--upvote:hover {
	color: #1cb1cd !important;
	background: transparent !important;
}

.comment-action--upvote.active,
.comment-action--upvote.voted {
	color: #1cb1cd !important;
	font-weight: 600 !important;
}

.comment-action--upvote.active .voteUp,
.comment-action--upvote.voted .voteUp,
.comment-action--upvote.active .vote-count,
.comment-action--upvote.voted .vote-count {
	color: #1cb1cd !important;
}

.comment-action--upvote:disabled {
	opacity: 1 !important;
	cursor: not-allowed !important;
}

.comment-action--downvote {
	color: #ef3056 !important;
}

.comment-action--downvote svg {
	fill: #ef3056 !important;
}

.comment-action--downvote:hover {
	color: #ef3056 !important;
	background: transparent !important;
}

.comment-action--downvote.active,
.comment-action--downvote.voted {
	color: #ef3056 !important;
	font-weight: 600 !important;
}

.comment-action--downvote.active .voteDown,
.comment-action--downvote.voted .voteDown,
.comment-action--downvote.active .vote-count,
.comment-action--downvote.voted .vote-count {
	color: #ef3056 !important;
}

.comment-action--downvote:disabled {
	opacity: 1 !important;
	cursor: not-allowed !important;
}

.comment-status {
	font-style: italic !important;
	color: #888 !important;
	margin-top: 6px !important;
	margin-bottom: 0 !important;
	font-size: 0.85rem !important;
	position: static !important;
	display: block !important;
}

.comments-list__items {
	position: relative !important;
}

#list_comment {
	position: relative !important;
}

/* 确保表单元素可交互 */
.comment-form,
.comment-form * {
	pointer-events: auto !important;
}

/* 移除表单gap间距 */
.comment-form {
	gap: 0 !important;
}

/* 修复复选框可点击性 */
.comment-form__checkbox {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	cursor: pointer !important;
	user-select: none !important;
	padding: 4px 0 !important;
	position: relative !important;
	z-index: 1 !important;
	pointer-events: auto !important;
}

.comment-form__checkbox input[type="checkbox"] {
	width: 18px !important;
	height: 18px !important;
	cursor: pointer !important;
	accent-color: #2973da !important;
	margin: 0 !important;
	flex-shrink: 0 !important;
	position: relative !important;
	z-index: 10 !important;
	pointer-events: auto !important;
	opacity: 1 !important;
	-webkit-appearance: checkbox !important;
	appearance: checkbox !important;
}

.comment-form__checkbox input[type="checkbox"]:focus {
	outline: none !important;
}

.comment-form__checkbox span {
	line-height: 1.4 !important;
	user-select: none !important;
	cursor: pointer !important;
	pointer-events: none !important;
}

/* 调整提交按钮容器 */
.comment-form__actions {
	display: flex !important;
	gap: 12px !important;
	flex-wrap: wrap !important;
	justify-content: flex-start !important;
	margin-top: 6px !important;
}

/* 主要按钮样式 */
.btn-primary {
	background: #2973da !important;
	color: #fff !important;
	border: none !important;
	padding: 10px 24px !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.btn-primary:hover {
	background: #1f5bb5 !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 2px 8px rgba(41, 115, 218, 0.3) !important;
}

.btn-primary:active {
	transform: translateY(0) !important;
}

/* 次要按钮样式 */
.btn-secondary {
	background: #f5f5f5 !important;
	color: #666 !important;
	border: 1px solid #ddd !important;
	padding: 10px 24px !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.btn-secondary:hover {
	background: #e8e8e8 !important;
	border-color: #ccc !important;
}

/* 标签按钮颜色统一 */
.player-header__tags .tag__link,
.tag__link {
	background-color: #363636 !important;
	color: #ffffff !important;
	padding: 5px !important;
}

.player-header__tags .tag__link:hover,
.tag__link:hover {
	background-color: #ffffff !important;
	color: #363636 !important;
}

/* Dark模式下标签按钮悬浮颜色 */
body.dark .player-header__tags .tag__link:hover,
body.dark .tag__link:hover {
	background-color: #ffffff !important;
	color: #363636 !important;
}

body.dark .player-header__tags .tag__link:hover .tag__title,
body.dark .tag__link:hover .tag__title,
body.dark .player-header__tags .tag__link:hover span,
body.dark .tag__link:hover span {
	color: #363636 !important;
	background-color: transparent !important;
}

/* Dark模式下 .area 文字颜色优化 */

/* 标题文字 */
.dark .area__heading,
.dark .area h2,
.dark .area h3 {
	color: #ffffff !important;
}

/* 链接文字 */
.dark .area a {
	color: #ffffff !important;
}

.dark .area a:hover {
	color: #ffffff !important;
}

/* 描述性文本 */
.dark .area p,
.dark .area span {
	color: #ffffff !important;
}

/* Dark模式下 content 区域超链接颜色 */
.dark .area__column--content a,
.dark .content a {
	color: #D73266 !important;
}

.dark .area__column--content a:hover,
.dark .content a:hover {
	color: #c62e5e !important;
}

/* Dark模式下 home-content 文字颜色 */
.dark .home-content,
.dark .home-content * {
	color: #ffffff !important;
}

.dark .home-content a {
	color: #D73266 !important;
}

.dark .home-content a:hover {
	color: #c62e5e !important;
}

/* Dark模式下 breadcrumbs 超链接颜色 */
body.dark .breadcrumbs,
body.dark .breadcrumbs * {
	color: #ffffff !important;
}

body.dark .breadcrumbs a,
body.dark .breadcrumbs__item a,
body.dark .breadcrumbs a:link,
body.dark .breadcrumbs a:visited {
	color: #D73266 !important;
	text-decoration: none !important;
}

body.dark .breadcrumbs a:hover,
body.dark .breadcrumbs__item a:hover {
	color: #c62e5e !important;
	text-decoration: none !important;
}

body.dark .breadcrumbs__current {
	color: #ffffff !important;
}

body.dark .breadcrumbs__delimiter {
	color: #999 !important;
}

/* 将第一个2x2大图标放在第二列 */
.card-masonry .item.large:first-of-type {
	grid-column-start: 2 !important;
}