/**
 * AI 圈子 — 主题品牌色统一视觉（布局不变）
 */

.leafs-main.leafs-circle {
	--leafs-circle-accent: var(--leafs-brand);
	--leafs-circle-accent-hover: var(--leafs-brand-hover, var(--leafs-brand));
	--leafs-circle-accent-soft: color-mix(in srgb, var(--leafs-brand) 10%, transparent);
	--leafs-circle-accent-muted: color-mix(in srgb, var(--leafs-brand) 6%, transparent);
	--leafs-circle-compose-shell: var(--leafs-card);
	--leafs-circle-compose-input: var(--leafs-card);
	--leafs-circle-compose-border: var(--leafs-border);
	--leafs-circle-card-bg: var(--leafs-card);
	--leafs-circle-expand-bg: var(--leafs-card);
	--leafs-circle-radius-sm: 8px;
	--leafs-circle-radius-md: 12px;
	--leafs-circle-shadow: var(--leafs-shadow-card);
	--leafs-circle-shadow-hover: var(--leafs-shadow-card-hover);
	--leafs-circle-tool-bg: transparent;
	--leafs-circle-tool-hover: color-mix(in srgb, var(--leafs-text) 4%, transparent);
	--leafs-circle-chip-bg: transparent;
	--leafs-circle-feed-hover: color-mix(in srgb, var(--leafs-text) 3%, transparent);
	--leafs-circle-feed-expanded: color-mix(in srgb, var(--leafs-brand) 2.8%, var(--leafs-text) 3.6%);
}

html[data-leafs-theme="dark"] .leafs-main.leafs-circle {
	--leafs-circle-compose-shell: var(--leafs-surface);
	--leafs-circle-compose-input: var(--leafs-surface);
	--leafs-circle-compose-border: var(--leafs-border);
	--leafs-circle-card-bg: var(--leafs-surface);
	--leafs-circle-expand-bg: var(--leafs-surface);
	--leafs-circle-tool-bg: transparent;
	--leafs-circle-tool-hover: color-mix(in srgb, var(--leafs-text) 6%, transparent);
	--leafs-circle-chip-bg: transparent;
	--leafs-circle-feed-hover: color-mix(in srgb, var(--leafs-text) 4%, transparent);
	--leafs-circle-feed-expanded: color-mix(in srgb, var(--leafs-brand) 4%, var(--leafs-text) 5%);
}

/* —— 框架 —— */
.leafs-circle--uied .leafs-circle-panel,
.leafs-circle-pinned--sidebar,
.leafs-circle-catgrid--rail {
	background: var(--leafs-circle-card-bg);
	border-color: var(--leafs-circle-compose-border);
	box-shadow: var(--leafs-circle-shadow);
}

.leafs-circle--uied .leafs-circle-catgrid--rail .leafs-circle-catgrid__card {
	background: transparent;
	border: 0;
	box-shadow: none;
}

.leafs-circle--uied .leafs-circle-catgrid--rail .leafs-circle-catgrid__card:hover,
.leafs-circle--uied .leafs-circle-catgrid--rail .leafs-circle-catgrid__card:focus-visible {
	background: var(--leafs-circle-accent-muted);
	border-color: transparent;
}

.leafs-circle--uied .leafs-circle-catgrid--rail .leafs-circle-catgrid__card.is-active {
	background: var(--leafs-circle-accent-muted);
	border-color: transparent;
}

.leafs-circle__sort-btn,
.leafs-circle__region-btn,
.leafs-circle__cat-pill {
	background: transparent;
	border-color: var(--leafs-circle-compose-border);
	color: var(--leafs-muted);
	font-size: 0.8125rem;
	font-weight: 500;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.leafs-circle__sort-btn:hover,
.leafs-circle__region-btn:hover,
.leafs-circle__cat-pill:hover {
	border-color: color-mix(in srgb, var(--leafs-brand) 28%, var(--leafs-border));
	background: transparent;
	color: var(--leafs-text);
}

.leafs-circle__sort-btn.is-active,
.leafs-circle__cat-pill.is-active {
	border-color: var(--leafs-brand);
	background: transparent;
	color: var(--leafs-brand);
	font-weight: 600;
}

.leafs-circle__list {
	gap: 12px;
}

/* —— 中栏白底面板（列表 / 内页共用） —— */
.leafs-circle--archive.leafs-circle--uied .leafs-circle__primary,
.leafs-circle--single.leafs-circle--uied .leafs-circle__primary {
	--leafs-circle-feed-divider: color-mix(in srgb, var(--leafs-border) 72%, transparent);
	--leafs-circle-feed-hover: color-mix(in srgb, var(--leafs-text) 3.5%, transparent);
	background: #fff;
	border: 1px solid color-mix(in srgb, var(--leafs-border) 90%, transparent);
	border-radius: 12px;
	box-shadow:
		0 1px 2px color-mix(in srgb, var(--leafs-text) 4%, transparent),
		0 8px 24px color-mix(in srgb, var(--leafs-text) 3%, transparent);
	overflow: hidden;
}

html[data-leafs-theme="dark"] .leafs-circle--archive.leafs-circle--uied .leafs-circle__primary,
html[data-leafs-theme="dark"] .leafs-circle--single.leafs-circle--uied .leafs-circle__primary {
	background: var(--leafs-surface);
}

/* —— 归档信息流 —— */

.leafs-circle--archive .leafs-circle-compose {
	margin-bottom: 0;
	padding: 16px 18px 14px;
	border-bottom: 1px solid var(--leafs-circle-feed-divider, var(--leafs-border));
}

.leafs-circle--archive .leafs-circle__toolbar {
	margin-bottom: 0;
	padding: 12px 18px 10px;
	border-bottom: 0;
}

/* 无分类 pills 时，排序栏与列表之间仍需分隔 */
.leafs-circle--archive .leafs-circle__toolbar:not(:has(+ .leafs-circle__cats-wrap)) {
	border-bottom: 1px solid var(--leafs-circle-feed-divider, var(--leafs-border));
}

.leafs-circle--archive .leafs-circle__cats-wrap {
	margin-bottom: 0;
	padding: 0 18px;
	border-bottom: 1px solid var(--leafs-circle-feed-divider, var(--leafs-border));
}

.leafs-circle--archive .leafs-circle__cats-wrap .leafs-circle__cats {
	margin-bottom: 0;
	padding: 0 0 14px;
	border-bottom: 0;
}

.leafs-circle__cats-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 10px 0 12px;
	margin: 0;
	border: 0;
	background: transparent;
	color: var(--leafs-text);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.35;
	list-style: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.leafs-circle__cats-toggle::-webkit-details-marker {
	display: none;
}

.leafs-circle__cats-toggle::marker {
	content: '';
}

.leafs-circle__cats-toggle-label {
	flex-shrink: 0;
	color: var(--leafs-muted);
	font-weight: 500;
}

.leafs-circle__cats-toggle-current {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--leafs-brand);
}

.leafs-circle__cats-toggle-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--leafs-muted);
	transition: transform 0.2s ease;
}

.leafs-circle__cats-wrap[open] .leafs-circle__cats-toggle-icon {
	transform: rotate(180deg);
}

.leafs-circle--archive .leafs-circle__list {
	gap: 0;
	padding: 6px 8px 10px;
}

.leafs-circle--archive .leafs-circle-card {
	border: 0;
	border-radius: 10px;
	background: transparent;
	box-shadow: none;
	transition: background 0.18s ease;
}

.leafs-circle--archive .leafs-circle-card__surface {
	position: relative;
	padding: 16px 12px 14px;
	border-bottom: 0;
}

.leafs-circle--archive .leafs-circle-card:not(:last-of-type) .leafs-circle-card__surface::after {
	content: '';
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 0;
	height: 1px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		var(--leafs-circle-feed-divider, var(--leafs-border)) 14%,
		var(--leafs-circle-feed-divider, var(--leafs-border)) 86%,
		transparent 100%
	);
	pointer-events: none;
}

.leafs-circle--archive .leafs-circle-card.is-expanded:not(:last-of-type) .leafs-circle-card__surface::after {
	opacity: 0.35;
}

.leafs-circle--archive .leafs-circle-card:hover:not(.is-expanded) {
	border-color: transparent;
	box-shadow: none;
	background: var(--leafs-circle-feed-hover);
}

.leafs-circle--archive .leafs-circle-card__row--head {
	margin-bottom: 9px;
}

.leafs-circle--archive .leafs-circle-card__title {
	margin-bottom: 7px;
}

.leafs-circle--archive .leafs-circle-card__title-text {
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.38;
	letter-spacing: -0.015em;
}

.leafs-circle--archive .leafs-circle-card__row--body {
	margin-bottom: 0;
}

.leafs-circle--archive .leafs-circle-card__content {
	margin-bottom: 6px;
	font-size: 0.875rem;
	line-height: 1.62;
	color: color-mix(in srgb, var(--leafs-text) 82%, var(--leafs-muted));
}

.leafs-circle--archive .leafs-circle-card__media {
	margin-top: 6px;
}

.leafs-circle--archive .leafs-circle-card__row--actions {
	padding-top: 10px;
	margin-top: 0;
	border-top: 0;
}

.leafs-circle--archive .leafs-circle-card__actions {
	gap: 12px 16px;
}

.leafs-circle--archive .leafs-circle-card__action,
.leafs-circle--archive .leafs-circle-card__discuss-btn {
	font-size: 0.8125rem;
	color: var(--leafs-muted);
}

.leafs-circle--archive .leafs-circle-card.is-expanded {
	background: var(--leafs-circle-feed-expanded);
	box-shadow: inset 2px 0 0 color-mix(in srgb, var(--leafs-brand) 26%, transparent);
}

.leafs-circle--archive .leafs-circle-card.is-expanded:hover {
	background: var(--leafs-circle-feed-expanded);
}

/* 列表页：标题/正文悬停由整卡统一承担，不再叠加区块高亮 */
.leafs-circle--archive .leafs-circle-card__main:has(.leafs-circle-card__expand-hit:hover) .leafs-circle-card__expand-hit[data-circle-expand-trigger],
.leafs-circle--archive .leafs-circle-card__main:has(.leafs-circle-card__expand-hit:focus-visible) .leafs-circle-card__expand-hit[data-circle-expand-trigger] {
	background: transparent;
}

.leafs-circle--archive .leafs-circle-card__panel {
	margin: 0 10px 10px;
	padding: 0;
	border: 0;
	border-top: 1px solid transparent;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	overflow: hidden;
}

.leafs-circle--archive .leafs-circle-card.is-expanded .leafs-circle-card__panel:not([hidden]) {
	border-top-color: var(--leafs-circle-feed-divider, var(--leafs-border));
}

html[data-leafs-theme="dark"] .leafs-circle--archive .leafs-circle-card__panel {
	background: transparent;
}

.leafs-circle--archive .leafs-circle-expand {
	padding: 14px 14px 16px;
}

.leafs-circle--archive .leafs-circle-publish-box__shell {
	background: var(--leafs-circle-compose-shell);
	border: 1px solid var(--leafs-circle-compose-border);
	border-radius: 10px;
	box-shadow: none;
}

html[data-leafs-theme="dark"] .leafs-circle--archive .leafs-circle-publish-box__shell {
	background: var(--leafs-circle-compose-shell);
}

.leafs-circle--archive .leafs-circle-publish-box__shell:focus-within {
	border-color: color-mix(in srgb, var(--leafs-brand) 32%, var(--leafs-border));
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--leafs-brand) 10%, transparent);
}

.leafs-circle--archive .leafs-circle-guest-gate__shell {
	border-color: color-mix(in srgb, var(--leafs-border) 85%, transparent);
	box-shadow: none;
}

.leafs-circle--archive .leafs-circle__infinite,
.leafs-circle--archive .leafs-circle__pager--fallback {
	padding: 10px 18px 14px;
}

@media (max-width: 640px) {
	.leafs-circle--archive .leafs-circle-compose,
	.leafs-circle--archive .leafs-circle__toolbar,
	.leafs-circle--archive .leafs-circle__cats-wrap {
		padding-left: 12px;
		padding-right: 12px;
	}

	.leafs-circle--archive .leafs-circle__cats {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		overscroll-behavior-x: contain;
		gap: 8px;
	}

	.leafs-circle--archive .leafs-circle__cats::-webkit-scrollbar {
		display: none;
	}

	.leafs-circle--archive .leafs-circle__cat-pill {
		flex-shrink: 0;
	}

	.leafs-circle--archive .leafs-circle__list {
		padding: 2px 0 8px;
	}

	.leafs-circle--archive .leafs-circle-card__surface {
		padding: 12px 12px 10px;
	}

	.leafs-circle--archive .leafs-circle-card:not(:last-of-type) .leafs-circle-card__surface::after {
		left: 12px;
		right: 12px;
	}

	.leafs-circle--archive .leafs-circle-card__title-text {
		font-size: 0.9375rem;
		line-height: 1.36;
	}

	.leafs-circle--archive .leafs-circle-card__content {
		font-size: 0.8125rem;
		line-height: 1.6;
	}

	.leafs-circle--archive .leafs-circle-card__panel {
		margin: 0 8px 8px;
	}

	.leafs-circle-card__pin {
		width: 56px;
		height: 56px;
	}

	.leafs-circle-card__pin-text {
		top: 12px;
		right: -28px;
		width: 96px;
		font-size: 0.5625rem;
		padding: 3px 0;
	}

	.leafs-circle-card--pinned .leafs-circle-card__row--head {
		padding-right: 32px;
	}

	.leafs-circle--single .leafs-circle-topic,
	.leafs-circle--single .leafs-circle-discuss {
		padding-left: 12px;
		padding-right: 12px;
	}
}

/* —— 发布框 —— */
.leafs-circle-publish-box__shell {
	background: var(--leafs-circle-compose-shell);
	border: 1px solid var(--leafs-circle-compose-border);
	box-shadow: var(--leafs-circle-shadow);
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.leafs-circle-publish-box__shell:focus-within {
	border-color: color-mix(in srgb, var(--leafs-brand) 36%, var(--leafs-border));
	box-shadow: var(--leafs-circle-shadow-hover);
}

.leafs-circle-publish-box__head-title {
	color: var(--leafs-brand);
}

.leafs-circle-publish-box__control-shell {
	background: var(--leafs-circle-compose-input);
	border-color: var(--leafs-circle-compose-border);
}

.leafs-circle-publish-box__control-shell:focus-within {
	border-color: color-mix(in srgb, var(--leafs-brand) 40%, var(--leafs-border));
	box-shadow: 0 0 0 3px var(--leafs-focus-ring);
}

/*
 * 正文/评论 compose 容器带 leafs-comment-compose 时，main.css 会去掉边框；
 * 恢复与标题 control-shell 一致的外框，textarea 本身不再重复描边。
 */
.leafs-circle-publish-box__control-shell.leafs-comment-compose,
.leafs-circle-discuss .leafs-comment-respond .leafs-comment-compose {
	padding: 10px 12px;
	border-radius: 10px;
	border: 1px solid var(--leafs-circle-compose-border);
	background: var(--leafs-circle-compose-input);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.leafs-circle-publish-box__control-shell.leafs-comment-compose:focus-within,
.leafs-circle-discuss .leafs-comment-respond .leafs-comment-compose:focus-within {
	border-color: color-mix(in srgb, var(--leafs-brand) 40%, var(--leafs-border));
	box-shadow: 0 0 0 3px var(--leafs-focus-ring);
}

.leafs-circle-publish-box__control-shell.leafs-comment-compose .leafs-circle-publish-box__textarea,
.leafs-circle-discuss .leafs-comment-respond .leafs-comment-compose textarea#comment {
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	resize: vertical;
	box-sizing: border-box;
}

.leafs-circle-publish-box__control-shell.leafs-comment-compose .leafs-circle-publish-box__textarea:focus,
.leafs-circle-discuss .leafs-comment-respond .leafs-comment-compose textarea#comment:focus {
	outline: none;
	border: 0;
	box-shadow: none;
}

.leafs-circle-discuss .leafs-comment-respond .leafs-comment-compose .leafs-comment-compose__toolbar {
	margin-bottom: 8px;
}

.leafs-circle-publish-box__control::placeholder {
	color: var(--leafs-muted2);
}

.leafs-circle-publish-box__hint {
	margin: 6px 0 0;
	font-size: 0.75rem;
	line-height: 1.4;
	color: var(--leafs-muted2);
}

.leafs-circle-card.is-new-topic > .leafs-circle-card__surface {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--leafs-brand) 28%, transparent);
	animation: leafs-circle-new-topic 2.2s ease;
}

@keyframes leafs-circle-new-topic {
	0% {
		background: color-mix(in srgb, var(--leafs-brand) 10%, var(--leafs-card));
	}
	100% {
		background: var(--leafs-card);
	}
}

.leafs-circle-publish-box__tool {
	border: 1px solid transparent;
	border-radius: var(--leafs-circle-radius-sm);
	background: var(--leafs-circle-tool-bg);
	color: var(--leafs-muted);
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.leafs-circle-publish-box__tool svg {
	display: block;
	stroke: currentColor;
}

.leafs-circle-publish-box__tool:hover {
	background: var(--leafs-circle-tool-hover);
	color: var(--leafs-brand);
	border-color: transparent;
}

.leafs-circle-publish-box__tool:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--leafs-focus-ring);
}

.leafs-circle-publish-box__cat {
	border: 1px solid var(--leafs-circle-compose-border);
	background: transparent;
	color: var(--leafs-muted);
	font-size: 0.8125rem;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.leafs-circle-publish-box__cat:hover,
.leafs-circle-publish-box__cat:focus {
	border-color: color-mix(in srgb, var(--leafs-brand) 32%, var(--leafs-border));
	background: transparent;
	color: var(--leafs-brand);
	outline: none;
}

.leafs-circle-publish-box__submit {
	background: var(--leafs-brand);
	color: var(--leafs-on-primary);
	border: 1px solid color-mix(in srgb, var(--leafs-brand) 75%, #000);
	box-shadow: 0 1px 3px color-mix(in srgb, var(--leafs-brand) 28%, transparent);
	transition: background 0.15s ease, box-shadow 0.15s ease;
}

.leafs-circle-publish-box__submit:hover {
	background: var(--leafs-circle-accent-hover);
}

.leafs-circle-publish-box__submit:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--leafs-focus-ring);
}

.leafs-circle-form__notice--ok {
	background: color-mix(in srgb, var(--leafs-success) 12%, var(--leafs-circle-card-bg));
	color: var(--leafs-success);
	border: 1px solid color-mix(in srgb, var(--leafs-success) 28%, transparent);
	border-radius: var(--leafs-circle-radius-sm);
}

.leafs-circle-form__notice--ok.is-enter {
	animation: leafs-circle-notice-in 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes leafs-circle-notice-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.leafs-circle-publish-box__shell.is-submitting {
	opacity: 0.92;
	pointer-events: none;
}

.leafs-circle-publish-box__shell.is-publish-success {
	animation: leafs-circle-publish-pulse 1.2s ease;
}

@keyframes leafs-circle-publish-pulse {
	0% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--leafs-success) 0%, transparent);
	}
	35% {
		box-shadow: 0 0 0 3px color-mix(in srgb, var(--leafs-success) 22%, transparent);
	}
	100% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--leafs-success) 0%, transparent);
	}
}

.leafs-circle-publish-box.is-submitting .leafs-circle-publish-box__submit {
	opacity: 0.75;
	cursor: wait;
}

/* 话题发布成功轻提示 */
.leafs-circle-toast {
	position: fixed;
	top: calc(var(--leafs-admin-bar-offset, 0px) + 16px);
	left: 50%;
	z-index: 100050;
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: min(92vw, 360px);
	padding: 10px 14px;
	border-radius: 10px;
	font-size: 0.875rem;
	line-height: 1.35;
	color: var(--leafs-text);
	background: var(--leafs-card, var(--leafs-surface));
	border: 1px solid color-mix(in srgb, var(--leafs-success) 32%, var(--leafs-border));
	box-shadow:
		0 8px 24px color-mix(in srgb, #000 12%, transparent),
		0 0 0 1px color-mix(in srgb, var(--leafs-success) 8%, transparent);
	transform: translateX(-50%) translateY(-10px);
	opacity: 0;
	pointer-events: none;
	transition:
		opacity 0.28s ease,
		transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.leafs-circle-toast.is-visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

.leafs-circle-toast.is-error {
	border-color: color-mix(in srgb, var(--leafs-danger) 35%, var(--leafs-border));
}

.leafs-circle-toast__icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--leafs-on-primary);
	background: var(--leafs-success);
}

.leafs-circle-toast.is-error .leafs-circle-toast__icon {
	background: var(--leafs-danger);
}

.leafs-circle-toast__text {
	flex: 1;
	min-width: 0;
}

.leafs-circle-form__notice--err {
	background: color-mix(in srgb, var(--leafs-danger) 10%, var(--leafs-circle-card-bg));
	color: var(--leafs-danger);
	border: 1px solid color-mix(in srgb, var(--leafs-danger) 25%, transparent);
	border-radius: var(--leafs-circle-radius-sm);
}

.leafs-circle .leafs-comment-emoji,
.leafs-circle .leafs-comment-sketch {
	border-radius: var(--leafs-circle-radius-md);
	border-color: var(--leafs-circle-compose-border);
}

/* 表情 / 手绘：圈子内 fixed 浮层（JS 定位），不透明卡片 */
.leafs-comment-compose__toolbar {
	position: relative;
	z-index: 2;
}

.leafs-circle-publish-box__tools {
	position: relative;
	z-index: 2;
}

.leafs-comment-compose__popups {
	position: absolute;
	left: 0;
	bottom: calc(100% + 8px);
	top: auto;
	z-index: 40;
	width: min(320px, calc(100vw - 48px));
	max-width: 100%;
	pointer-events: none;
}

.leafs-comment-compose__popups.is-active {
	pointer-events: auto;
}

.leafs-comment-compose__popups--circle.is-active {
	position: static;
	width: auto;
	max-width: none;
	pointer-events: none;
}

.leafs-comment-compose__popups > [hidden] {
	display: none !important;
}

.leafs-comment-compose__popups--circle .leafs-comment-emoji-panel,
.leafs-comment-compose__popups--circle .leafs-comment-sketch-panel {
	margin: 0;
	background: var(--leafs-card, var(--leafs-surface, #fff));
	border: 1px solid var(--leafs-border);
	box-shadow:
		0 18px 42px color-mix(in srgb, var(--leafs-text) 20%, transparent),
		0 0 0 1px color-mix(in srgb, var(--leafs-border) 90%, transparent);
	pointer-events: auto;
}

.leafs-comment-compose__popups--circle .leafs-comment-emoji-panel:not([hidden]),
.leafs-comment-compose__popups--circle .leafs-comment-sketch-panel:not([hidden]) {
	max-height: min(70vh, 420px);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

html[data-leafs-theme="dark"] .leafs-comment-compose__popups--circle .leafs-comment-emoji-panel,
html[data-leafs-theme="dark"] .leafs-comment-compose__popups--circle .leafs-comment-sketch-panel {
	background: var(--leafs-surface, #1e293b);
}

.leafs-comment-compose__popups--circle .leafs-comment-sketch-canvas {
	background: var(--leafs-card, #fff) !important;
}

html[data-leafs-theme="dark"] .leafs-comment-compose__popups--circle .leafs-comment-sketch-canvas {
	background: var(--leafs-surface2, #334155) !important;
}

.leafs-circle-reply__compose .leafs-comment-compose__popups {
	width: min(320px, 100%);
}

.leafs-circle-publish-box__shell.is-compose-popover-open,
.leafs-circle__primary.is-compose-popover-open,
.leafs-circle-card.is-compose-popover-open .leafs-circle-card__panel:not([hidden]) {
	overflow: visible;
}

.leafs-circle-card.is-expanded.is-compose-popover-open {
	position: relative;
	z-index: 4;
}

.leafs-circle .leafs-comment-emoji__btn:hover {
	background: var(--leafs-circle-accent-soft);
}

.leafs-circle .leafs-comment-sketch-canvas {
	border-radius: var(--leafs-circle-radius-sm);
	border: 1px solid var(--leafs-circle-compose-border);
	background: var(--leafs-card);
}

html[data-leafs-theme="dark"] .leafs-circle .leafs-comment-sketch-canvas {
	background: var(--leafs-surface2);
}

/* —— 话题卡片（归档信息流在下方单独覆盖） —— */
.leafs-circle--uied:not(.leafs-circle--archive) .leafs-circle-card {
	background: var(--leafs-circle-card-bg);
	border-color: var(--leafs-circle-compose-border);
	box-shadow: var(--leafs-circle-shadow);
}

.leafs-circle--uied:not(.leafs-circle--archive) .leafs-circle-card:hover:not(.is-expanded) {
	box-shadow: var(--leafs-circle-shadow-hover);
	background: color-mix(in srgb, var(--leafs-text) 2.5%, var(--leafs-circle-card-bg));
}

.leafs-circle--uied:not(.leafs-circle--archive) .leafs-circle-card.is-expanded {
	background: var(--leafs-circle-feed-expanded);
	box-shadow:
		var(--leafs-circle-shadow-hover),
		inset 2px 0 0 color-mix(in srgb, var(--leafs-brand) 24%, transparent);
}

.leafs-circle-card.is-expanded {
	border-color: color-mix(in srgb, var(--leafs-brand) 30%, var(--leafs-border));
	transition: border-color 0.28s ease, background 0.28s ease, box-shadow 0.28s ease;
}

.leafs-circle-card.is-expanded .leafs-circle-card__ico--chevron {
	transform: rotate(180deg);
}

.leafs-circle-card__ico {
	flex-shrink: 0;
	display: block;
	stroke: currentColor;
	opacity: 0.72;
}

/* 置顶角标由 leafs-circle.css 定义 */

.leafs-circle-card__avatar {
	border: 1px solid var(--leafs-circle-compose-border);
	box-shadow: none;
}

.leafs-circle-card__follow {
	border-color: var(--leafs-circle-compose-border);
	color: var(--leafs-muted);
	background: transparent;
	font-size: 0.6875rem;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.leafs-circle-card__follow:hover,
.leafs-circle-card__follow.is-active {
	border-color: color-mix(in srgb, var(--leafs-brand) 38%, var(--leafs-border));
	color: var(--leafs-brand);
	background: transparent;
}

.leafs-circle-card__time {
	font-size: 0.75rem;
	color: var(--leafs-muted2);
}

.leafs-circle-card__cats {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 8px;
}

.leafs-circle-card__cat {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--leafs-muted);
	font-size: 0.75rem;
	font-weight: 500;
	text-decoration: none;
	transition: color 0.15s ease;
}

.leafs-circle-card__cat:hover {
	background: transparent;
	border-color: transparent;
	color: var(--leafs-brand);
}

.leafs-circle-card__cat .leafs-circle-card__ico {
	width: 12px;
	height: 12px;
	color: var(--leafs-muted2);
	opacity: 0.65;
}

.leafs-circle-card__cat:hover .leafs-circle-card__ico {
	color: var(--leafs-brand);
	opacity: 1;
}

.leafs-circle-card__open {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: var(--leafs-circle-radius-sm);
	border: 1px solid transparent;
	color: var(--leafs-muted2);
	transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.leafs-circle-card__open:hover {
	color: var(--leafs-brand);
	background: transparent;
	border-color: color-mix(in srgb, var(--leafs-brand) 22%, var(--leafs-border));
}

.leafs-circle-card__media {
	border-color: var(--leafs-circle-compose-border);
	background: transparent;
}

.leafs-circle-card__row--actions {
	border-top: 0;
	padding-top: 8px;
	margin-top: 0;
}

.leafs-circle-card__actions {
	gap: 14px;
}

.leafs-circle-card__action {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 0;
	border-radius: 0;
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--leafs-muted);
	background: transparent;
	border: 0;
	list-style: none;
}

.leafs-circle-card__action .leafs-circle-card__ico {
	width: 14px;
	height: 14px;
}

.leafs-circle-card__action--like {
	cursor: pointer;
	font: inherit;
	transition: color 0.15s ease;
}

.leafs-circle-card__action--like:hover:not(:disabled) {
	color: var(--leafs-brand);
	background: transparent;
	border-color: transparent;
}

.leafs-circle-card__action--like.is-active {
	color: var(--leafs-brand);
	background: transparent;
	border-color: transparent;
	font-weight: 500;
}

.leafs-circle-card__action--like.is-active .leafs-circle-card__ico {
	opacity: 1;
}

.leafs-circle-card__action--like.is-active .leafs-circle-card__ico-heart {
	fill: currentColor;
}

.leafs-circle-card__action--like:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.leafs-circle-card__action--meta {
	cursor: default;
}

.leafs-circle-card__action--reply {
	cursor: pointer;
	font: inherit;
	transition: color 0.15s ease;
}

.leafs-circle-card__action--reply:hover,
.leafs-circle-card.is-expanded .leafs-circle-card__action--reply {
	color: var(--leafs-brand);
}

.leafs-circle-card__action--share {
	cursor: pointer;
	font: inherit;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--leafs-muted);
	transition: color 0.15s ease;
}

.leafs-circle-card__action--share:hover,
.leafs-circle-card__action--share.is-copied,
.leafs-circle-card__action--share:focus-visible {
	color: var(--leafs-brand);
}

.leafs-circle-card__discuss-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--leafs-muted);
	font-size: 0.8125rem;
	font-weight: 500;
	cursor: pointer;
	white-space: nowrap;
	transition: color 0.15s ease;
}

.leafs-circle-card__discuss-btn .leafs-circle-card__ico {
	width: 14px;
	height: 14px;
}

.leafs-circle-card__discuss-btn:hover,
.leafs-circle-card.is-expanded .leafs-circle-card__discuss-btn {
	background: transparent;
	border-color: transparent;
	color: var(--leafs-brand);
}

.leafs-circle-card__ico--chevron {
	transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.leafs-circle-card__panel {
	display: none;
	grid-template-rows: 0fr;
	opacity: 0;
	overflow: hidden;
	background: transparent;
	border-top: 1px solid transparent;
	transition:
		grid-template-rows 0.32s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.26s ease,
		border-color 0.26s ease;
}

.leafs-circle-card__panel:not([hidden]) {
	display: grid;
}

.leafs-circle-card__panel > * {
	min-height: 0;
	overflow: hidden;
}

.leafs-circle-card.is-expanded .leafs-circle-card__panel:not([hidden]) > * {
	overflow: visible;
}

.leafs-circle-card.is-expanded .leafs-circle-card__panel:not([hidden]) {
	grid-template-rows: 1fr;
	opacity: 1;
	border-top-color: var(--leafs-circle-feed-divider, var(--leafs-divider));
}

/* —— 展开讨论 —— */
.leafs-circle-expand {
	padding: 14px 14px 16px;
	overflow: visible;
}

.leafs-circle-expand.is-enter {
	animation: leafs-circle-expand-in 0.34s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.leafs-circle-expand.is-enter .leafs-circle-expand__discuss-head {
	animation: leafs-circle-expand-in 0.3s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.leafs-circle-expand.is-enter .leafs-circle-expand__comment {
	animation: leafs-circle-expand-in 0.28s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.leafs-circle-expand.is-enter .leafs-circle-reply,
.leafs-circle-expand.is-enter .leafs-circle-guest-gate {
	animation: leafs-circle-expand-in 0.3s cubic-bezier(0.22, 1, 0.36, 1) 0.04s both;
}

.leafs-circle-expand.is-enter .leafs-circle-expand__comment:nth-child(1) { animation-delay: 0.1s; }
.leafs-circle-expand.is-enter .leafs-circle-expand__comment:nth-child(2) { animation-delay: 0.14s; }
.leafs-circle-expand.is-enter .leafs-circle-expand__comment:nth-child(3) { animation-delay: 0.18s; }
.leafs-circle-expand.is-enter .leafs-circle-expand__comment:nth-child(4) { animation-delay: 0.22s; }
.leafs-circle-expand.is-enter .leafs-circle-expand__comment:nth-child(5) { animation-delay: 0.26s; }

@keyframes leafs-circle-expand-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.leafs-circle-expand__discuss-head {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--leafs-circle-feed-divider, color-mix(in srgb, var(--leafs-border) 72%, transparent));
}

.leafs-circle-expand__discuss-title {
	color: var(--leafs-text);
	font-size: 0.875rem;
	font-weight: 650;
}

.leafs-circle-expand__discuss-title::before {
	content: '';
	display: inline-block;
	width: 3px;
	height: 0.9em;
	margin-right: 7px;
	vertical-align: -0.1em;
	border-radius: 2px;
	background: var(--leafs-brand);
}

.leafs-circle-expand__more-link {
	display: inline-flex;
	align-items: center;
	padding: 0;
	border-radius: 0;
	color: var(--leafs-brand);
	font-size: 0.75rem;
	font-weight: 600;
	text-decoration: none;
	background: transparent;
	transition: color 0.15s ease;
}

.leafs-circle-expand__more-link:hover {
	color: var(--leafs-circle-accent-hover);
	background: transparent;
}

.leafs-circle-expand__comments {
	gap: 2px;
	max-height: min(320px, 42vh);
	padding: 0 4px;
	scrollbar-color: color-mix(in srgb, var(--leafs-muted2) 50%, transparent) transparent;
}

.leafs-circle-expand__comment {
	padding: 10px 10px;
	border-radius: 8px;
	background: transparent;
	border: 0;
	box-shadow: none;
	transition: background 0.15s ease;
}

.leafs-circle-expand__comment:last-child {
	border-bottom: 0;
}

.leafs-circle-expand__comment:hover {
	background: var(--leafs-circle-feed-hover, color-mix(in srgb, var(--leafs-text) 3.5%, transparent));
}

.leafs-circle-expand__comment-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0 0 6px;
	font-size: 0.7rem;
	color: var(--leafs-muted);
}

.leafs-circle-expand__comment-avatar {
	width: 32px;
	height: 32px;
	border-radius: 6px;
	flex-shrink: 0;
	object-fit: cover;
}

html[data-leafs-theme="dark"] .leafs-circle-expand__comment {
	background: transparent;
}

html[data-leafs-theme="dark"] .leafs-circle-expand__comment:hover {
	background: var(--leafs-circle-feed-hover, color-mix(in srgb, var(--leafs-text) 4%, transparent));
}

.leafs-circle-expand__empty,
.leafs-circle-expand__error {
	padding: 12px 0;
	border-radius: 0;
	text-align: center;
	background: transparent;
}

.leafs-circle-expand__loading {
	padding: 20px 12px;
	text-align: center;
}

.leafs-circle-card__panel .leafs-circle-reply {
	margin: 0 0 12px;
	padding: 0 0 12px;
	border: 0;
	border-bottom: 1px solid var(--leafs-circle-feed-divider, color-mix(in srgb, var(--leafs-border) 72%, transparent));
	border-radius: 0;
	background: transparent;
}

.leafs-circle-expand .leafs-circle-reply,
.leafs-circle-expand .leafs-circle-guest-gate {
	margin: 0 0 12px;
	padding: 0 0 12px;
	border-top: 0;
	border-bottom: 1px solid var(--leafs-circle-feed-divider, color-mix(in srgb, var(--leafs-border) 72%, transparent));
}

html[data-leafs-theme="dark"] .leafs-circle-card__panel .leafs-circle-reply {
	background: transparent;
}

.leafs-circle-expand__comment-author {
	color: var(--leafs-text);
	font-size: 0.8125rem;
	font-weight: 600;
}

.leafs-circle-expand__comment-row {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.leafs-circle-expand__comment-row .leafs-circle-expand__comment-body {
	flex: 1;
	min-width: 0;
}

.leafs-circle-expand__comment-aside {
	flex: 0 0 auto;
	align-self: stretch;
	display: flex;
	align-items: flex-end;
	padding-top: 0;
}

.leafs-circle-expand__quote-btn,
.leafs-comment-card__quote-btn,
.leafs-circle-discuss .leafs-comment-card__aside .leafs-comment-quote {
	display: inline-flex;
	opacity: 1;
	align-items: center;
	justify-content: center;
	padding: 2px 8px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var(--leafs-muted);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.15s ease, background 0.15s ease;
}

.leafs-circle-expand__quote-btn:hover,
.leafs-comment-card__quote-btn:hover {
	background: var(--leafs-circle-feed-hover, color-mix(in srgb, var(--leafs-text) 3.5%, transparent));
	color: var(--leafs-brand);
}

.leafs-circle-expand__comment.is-quote-target,
.leafs-comment-item.is-quote-target .leafs-comment-card {
	border-color: transparent;
	box-shadow: none;
	background: var(--leafs-circle-feed-hover, color-mix(in srgb, var(--leafs-text) 3.5%, transparent));
}

/* 回复框内只读引用预览（与输入区视觉区分） */
.leafs-reply-quote {
	margin: 0 0 6px;
	padding: 5px 8px 5px 9px;
	border-radius: 0;
	border: 0;
	border-left: 3px solid color-mix(in srgb, var(--leafs-muted) 55%, var(--leafs-border));
	background: transparent;
	user-select: none;
	pointer-events: auto;
}

.leafs-reply-quote[hidden] {
	display: none !important;
}

.leafs-reply-quote__head {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 18px;
	margin-bottom: 2px;
}

.leafs-reply-quote__badge {
	flex: 0 0 auto;
	padding: 1px 5px;
	border-radius: 4px;
	font-size: 0.625rem;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--leafs-muted) 88%, var(--leafs-text));
	background: color-mix(in srgb, var(--leafs-muted) 14%, transparent);
	border: 1px solid color-mix(in srgb, var(--leafs-muted) 22%, var(--leafs-border));
}

.leafs-reply-quote__author {
	flex: 1;
	min-width: 0;
	font-size: 0.6875rem;
	font-weight: 600;
	color: color-mix(in srgb, var(--leafs-muted) 75%, var(--leafs-text));
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.leafs-reply-quote__clear {
	flex: 0 0 auto;
	margin-left: auto;
	padding: 0 4px;
	border: 0;
	background: transparent;
	color: var(--leafs-muted2);
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	border-radius: 4px;
	transition: color 0.15s ease, background 0.15s ease;
}

.leafs-reply-quote__clear:hover {
	color: var(--leafs-danger);
	background: color-mix(in srgb, var(--leafs-danger) 10%, transparent);
}

.leafs-reply-quote__excerpt {
	margin: 0;
	font-size: 0.6875rem;
	line-height: 1.35;
	color: var(--leafs-muted2);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	word-break: break-word;
}

/* 已发布评论：引用块 + 回复正文层级 */
.leafs-comment-quote-display {
	margin: 0 0 8px;
	padding: 6px 8px 6px 10px;
	border: 0;
	border-left: 3px solid color-mix(in srgb, var(--leafs-muted) 50%, var(--leafs-border));
	border-radius: 0;
	background: transparent;
}

.leafs-comment-quote-display__head {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 3px;
}

.leafs-comment-quote-display__badge {
	flex: 0 0 auto;
	padding: 1px 5px;
	border-radius: 4px;
	font-size: 0.625rem;
	font-weight: 700;
	font-style: normal;
	line-height: 1.35;
	color: color-mix(in srgb, var(--leafs-muted) 90%, var(--leafs-text));
	background: color-mix(in srgb, var(--leafs-muted) 12%, transparent);
}

.leafs-comment-quote-display__author {
	flex: 1;
	min-width: 0;
	font-size: 0.75rem;
	font-weight: 600;
	font-style: normal;
	color: color-mix(in srgb, var(--leafs-muted) 80%, var(--leafs-text));
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.leafs-comment-quote-display__text {
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.4;
	color: var(--leafs-muted2);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	word-break: break-word;
}

.leafs-comment-reply-body {
	font-size: inherit;
	line-height: 1.55;
	color: var(--leafs-text);
}

.leafs-comment-reply-body > p:first-child {
	margin-top: 0;
}

.leafs-comment-reply-body > p:last-child {
	margin-bottom: 0;
}

.leafs-circle-expand__comment-body .leafs-comment-quote-display + .leafs-comment-reply-body,
.leafs-comment-card__content .leafs-comment-quote-display + .leafs-comment-reply-body {
	padding-top: 2px;
}

.leafs-comment-form.has-reply-quote .leafs-circle-reply__input,
.leafs-comment-form.has-reply-quote textarea[name="comment"],
.leafs-comment-form.has-reply-quote #comment {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.leafs-circle-reply__compose:has(.leafs-reply-quote:not([hidden])) .leafs-circle-reply__input {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	margin-top: 0;
}

.leafs-comment-respond .leafs-comment-compose:has(.leafs-reply-quote:not([hidden])) textarea#comment {
	margin-top: 0;
}

.leafs-comment-card__body-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.leafs-comment-card__body-row .leafs-comment-card__content {
	flex: 1;
	min-width: 0;
}

.leafs-comment-card__aside {
	flex: 0 0 auto;
	padding-top: 2px;
}

.leafs-circle-expand__comment--pending {
	border-color: color-mix(in srgb, var(--leafs-warning) 40%, var(--leafs-border));
	background: transparent;
}

.leafs-circle-expand__empty,
.leafs-circle-expand__loading,
.leafs-circle-expand__error {
	color: var(--leafs-muted);
	font-size: 0.8125rem;
}

/* —— 内联回复 —— */
.leafs-circle-reply {
	border-top: 0;
}

.leafs-circle-reply__form.leafs-comment-form {
	display: block;
	grid-template-columns: none;
	gap: 0;
}

.leafs-circle-reply .leafs-comment-compose__toolbar {
	margin: 0 0 6px;
	gap: 6px;
}

.leafs-circle-reply__compose .leafs-comment-emoji-panel,
.leafs-circle-reply__compose .leafs-comment-sketch-panel {
	margin-bottom: 0;
}

.leafs-circle-reply .leafs-comment-tool {
	width: 32px;
	height: 32px;
	border-radius: var(--leafs-circle-radius-sm);
	border: 1px solid transparent;
	background: var(--leafs-circle-tool-bg);
	color: var(--leafs-muted);
	font-size: 0;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.leafs-circle-reply .leafs-comment-tool svg {
	display: block;
	stroke: currentColor;
}

.leafs-circle-reply .leafs-comment-tool:hover {
	background: var(--leafs-circle-tool-hover);
	color: var(--leafs-brand);
	border-color: transparent;
}

.leafs-circle-reply .leafs-comment-tool[aria-expanded="true"] {
	border-color: color-mix(in srgb, var(--leafs-brand) 36%, var(--leafs-border));
	background: var(--leafs-circle-accent-muted);
	color: var(--leafs-brand);
}

.leafs-circle-reply__compose .leafs-reply-quote + .leafs-circle-reply__input,
.leafs-comment-respond .leafs-reply-quote + textarea#comment {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

.leafs-circle-reply__input {
	background: var(--leafs-circle-compose-input);
	border-color: var(--leafs-circle-compose-border);
	color: var(--leafs-text);
	font-size: 0.875rem;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.leafs-circle-reply__input::placeholder {
	color: var(--leafs-muted2);
}

.leafs-circle-reply__input:focus {
	border-color: color-mix(in srgb, var(--leafs-brand) 42%, var(--leafs-border));
	box-shadow: 0 0 0 3px var(--leafs-focus-ring);
	outline: none;
}

.leafs-circle-reply__submit.leafs-btn--primary {
	background: var(--leafs-brand);
	border-color: color-mix(in srgb, var(--leafs-brand) 75%, #000);
	color: var(--leafs-on-primary);
	box-shadow: 0 1px 3px color-mix(in srgb, var(--leafs-brand) 25%, transparent);
}

.leafs-circle-reply__submit.leafs-btn--primary:hover {
	background: var(--leafs-circle-accent-hover);
	border-color: color-mix(in srgb, var(--leafs-circle-accent-hover) 75%, #000);
}

.leafs-circle-reply__status--ok {
	color: var(--leafs-success);
}

.leafs-circle-reply__status--err {
	color: var(--leafs-danger);
}

.leafs-circle-card .leafs-circle-badge {
	border-color: color-mix(in srgb, var(--leafs-brand) 18%, var(--leafs-border));
}

.leafs-circle-compose {
	margin-bottom: 12px;
}

/* —— 未登录：输入区登录引导 —— */
.leafs-circle-guest-gate {
	margin: 0;
}

.leafs-circle-guest-gate__shell {
	border-radius: var(--leafs-circle-radius-md);
	border: 1px solid color-mix(in srgb, var(--leafs-brand) 22%, var(--leafs-border));
	background: linear-gradient(
		165deg,
		color-mix(in srgb, var(--leafs-brand) 7%, var(--leafs-circle-card-bg)),
		var(--leafs-circle-card-bg) 48%
	);
	box-shadow: var(--leafs-circle-shadow);
	overflow: hidden;
}

.leafs-circle-guest-gate__mock {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	border-bottom: 1px solid color-mix(in srgb, var(--leafs-border) 75%, transparent);
	background: color-mix(in srgb, var(--leafs-text) 2%, transparent);
	opacity: 0.55;
	pointer-events: none;
	user-select: none;
}

.leafs-circle-guest-gate__mock--topic {
	flex-direction: column;
	align-items: stretch;
	gap: 6px;
}

.leafs-circle-guest-gate__mock-avatar {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: color-mix(in srgb, var(--leafs-muted2) 35%, transparent);
}

.leafs-circle-guest-gate__mock-field,
.leafs-circle-guest-gate__mock-title,
.leafs-circle-guest-gate__mock-body {
	flex: 1;
	min-width: 0;
	height: 32px;
	border-radius: 8px;
	background: var(--leafs-circle-compose-input);
	border: 1px solid var(--leafs-circle-compose-border);
	color: var(--leafs-muted2);
	font-size: 0.8125rem;
	line-height: 32px;
	padding: 0 10px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.leafs-circle-guest-gate__mock-body {
	height: 48px;
	line-height: 1.5;
	white-space: normal;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.leafs-circle-guest-gate__mock-btn {
	flex-shrink: 0;
	width: 52px;
	height: 32px;
	border-radius: 8px;
	background: color-mix(in srgb, var(--leafs-brand) 20%, transparent);
}

.leafs-circle-guest-gate__card {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 10px 12px;
	padding: 12px 14px;
}

.leafs-circle-guest-gate__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: color-mix(in srgb, var(--leafs-brand) 14%, transparent);
	color: var(--leafs-brand);
	flex-shrink: 0;
}

.leafs-circle-guest-gate__body {
	flex: 1;
	min-width: min(100%, 200px);
}

.leafs-circle-guest-gate__title {
	margin: 0 0 4px;
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--leafs-text);
	line-height: 1.35;
}

.leafs-circle-guest-gate__desc {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--leafs-muted);
}

.leafs-circle-guest-gate__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	width: 100%;
}

@media (min-width: 520px) {
	.leafs-circle-guest-gate__card {
		flex-wrap: nowrap;
		align-items: center;
	}

	.leafs-circle-guest-gate__actions {
		width: auto;
		margin-left: auto;
		flex-shrink: 0;
		justify-content: flex-end;
	}
}

.leafs-circle-guest-gate__actions .leafs-btn {
	min-height: 36px;
}

.leafs-circle-guest-gate__link {
	font-size: 0.75rem;
	color: var(--leafs-muted);
	text-decoration: none;
	transition: color 0.15s ease;
}

.leafs-circle-guest-gate__link:hover {
	color: var(--leafs-brand);
}

.leafs-circle-guest-gate--comment {
	margin-top: 4px;
}

.leafs-circle-discuss .leafs-circle-guest-gate--comment .leafs-circle-guest-gate__mock {
	display: none;
}

.leafs-circle-reply .leafs-circle-guest-gate {
	margin-top: 0;
}

.leafs-circle-compose .leafs-circle-guest-gate {
	margin-bottom: 0;
}

.leafs-circle-pinned--sidebar {
	background: var(--leafs-circle-card-bg);
}

.leafs-circle-pinned--sidebar .leafs-circle-pinned__title {
	color: var(--leafs-brand);
}

html[data-leafs-theme="dark"] .leafs-circle-expand__comment:hover {
	box-shadow: none;
}

html[data-leafs-theme="dark"] .leafs-circle-card__avatar {
	box-shadow: none;
}

@media (max-width: 640px) {
	.leafs-circle-card__surface {
		padding: 12px 12px 10px;
	}

	.leafs-circle-card__avatar {
		width: 36px;
		height: 36px;
		border-radius: 7px;
	}

	.leafs-circle-card__author-block {
		gap: 8px;
	}

	.leafs-circle-card__name-row {
		gap: 2px 6px;
	}

	.leafs-circle-card__name {
		font-size: 0.8125rem;
	}

	.leafs-circle-card__time {
		font-size: 0.6875rem;
	}

	.leafs-circle-card__time::before,
	.leafs-circle-card__cats::before {
		margin-right: 4px;
	}

	.leafs-circle-card__cat {
		font-size: 0.6875rem;
	}

	.leafs-circle-card__follow {
		font-size: 0.625rem;
		padding: 2px 7px;
	}

	.leafs-circle-card__title.leafs-circle-card__expand-hit {
		padding: 6px 2px;
		margin: -6px -2px 4px;
	}

	.leafs-circle-card__row--body.leafs-circle-card__expand-hit {
		padding: 6px 2px;
		margin: -6px -2px 0;
	}

	.leafs-circle-card__row--actions {
		flex-wrap: nowrap;
		align-items: center;
		gap: 6px;
		padding-top: 8px;
	}

	.leafs-circle-card__actions {
		flex: 1;
		min-width: 0;
		gap: 4px 8px;
	}

	.leafs-circle-card__action,
	.leafs-circle-card__discuss-btn {
		min-height: 40px;
		-webkit-tap-highlight-color: transparent;
		touch-action: manipulation;
	}

	.leafs-circle-card__action--like,
	.leafs-circle-card__action--reply {
		min-width: 40px;
		justify-content: center;
		padding: 6px 4px;
	}

	.leafs-circle-card__discuss-btn {
		flex-shrink: 0;
		max-width: none;
		padding: 6px 0 6px 4px;
		font-size: 0.75rem;
	}

	.leafs-circle-card__discuss-btn [data-circle-expand-label] {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		min-width: 0;
	}

	.leafs-circle-card__stat-num {
		font-size: 0.75rem;
	}

	.leafs-circle-publish-box__tool,
	.leafs-circle-reply .leafs-comment-tool {
		width: 36px;
		height: 36px;
	}

	.leafs-circle-publish-box__submit,
	.leafs-circle-reply__submit {
		min-height: 42px;
	}

	.leafs-circle-expand {
		padding: 10px 10px 12px;
	}

	.leafs-circle-expand__comments {
		max-height: min(300px, 52vh);
		padding: 0 2px;
	}

	.leafs-circle-expand__comment {
		padding: 8px 8px;
	}

	.leafs-comment-compose__popups {
		width: min(300px, calc(100vw - 40px));
	}
}

@media (max-width: 480px) {
	.leafs-circle__toolbar {
		gap: 6px 8px;
	}

	.leafs-circle__sort-btn,
	.leafs-circle__cat-pill {
		padding: 6px 11px;
		font-size: 0.8125rem;
	}

	.leafs-circle-card__cat .leafs-circle-card__ico {
		display: none;
	}

	.leafs-circle-card__cat span {
		display: inline-block;
		max-width: 4.5em;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		vertical-align: bottom;
	}

	.leafs-circle-card__discuss-btn {
		font-size: 0.6875rem;
	}
}

/* —— 互动数字统一 —— */
.leafs-circle-card__stat-num {
	display: inline-block;
	min-width: 1.25em;
	font-size: 0.8125rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	line-height: 1.2;
	color: var(--leafs-text);
	letter-spacing: 0.01em;
}

.leafs-circle-card__action--like .leafs-circle-card__stat-num {
	color: inherit;
}

.leafs-circle-card__action--like.is-active .leafs-circle-card__stat-num {
	color: var(--leafs-brand);
}

/* —— 正文（略小于标题）/ 阅读更多 —— */
.leafs-circle-card__content-wrap {
	min-width: 0;
}

.leafs-circle-card__content {
	font-size: 0.875rem;
	line-height: 1.65;
}

.leafs-circle-card__title-text {
	font-size: 1.0625rem;
}

.leafs-circle-card__title-link {
	color: inherit;
	text-decoration: none;
}

.leafs-circle-card__title.leafs-circle-card__expand-hit:hover .leafs-circle-card__title-link,
.leafs-circle-card__title.leafs-circle-card__expand-hit:focus-visible .leafs-circle-card__title-link {
	color: var(--leafs-brand);
}

.leafs-circle-card__name--link {
	color: inherit;
	text-decoration: none;
}

.leafs-circle-card__name--link:hover {
	color: var(--leafs-brand);
}

.leafs-circle-topic__name {
	color: inherit;
	text-decoration: none;
	font-weight: 600;
}

.leafs-circle-topic__name:hover {
	color: var(--leafs-brand);
}

.leafs-circle-card__content.is-clamped {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	max-height: none;
}

.leafs-circle-card__content.is-expanded {
	display: block;
	-webkit-line-clamp: unset;
	overflow: visible;
}

.leafs-circle-card__read-more {
	display: inline-flex;
	align-items: center;
	margin: 4px 0 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--leafs-brand);
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
	transition: color 0.15s ease;
}

.leafs-circle-card__read-more[hidden] {
	display: none !important;
}

.leafs-circle-card__read-more:hover {
	color: var(--leafs-circle-accent-hover);
}

/* —— 配图画廊（正文下方） —— */
.leafs-circle-card__gallery {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 8px;
	max-width: 100%;
}

.leafs-circle-card__gallery-track {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 6px;
	min-width: 0;
	flex: 1;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.leafs-circle-card__gallery-track::-webkit-scrollbar {
	display: none;
}

.leafs-circle-card__gallery-item {
	flex: 0 0 auto;
	display: block;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid var(--leafs-border);
	background: var(--leafs-surface-2, #f1f5f9);
	line-height: 0;
	cursor: zoom-in;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.leafs-circle-card__gallery-item:hover {
	border-color: color-mix(in srgb, var(--leafs-brand) 32%, var(--leafs-border));
	box-shadow: 0 2px 8px color-mix(in srgb, var(--leafs-brand) 10%, transparent);
}

.leafs-circle-card__gallery-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.leafs-circle-card__gallery--single {
	max-width: min(100%, 260px);
}

.leafs-circle-card__gallery--single .leafs-circle-card__gallery-track {
	overflow: visible;
}

.leafs-circle-card__gallery--single .leafs-circle-card__gallery-item {
	width: 100%;
	max-width: 260px;
}

.leafs-circle-card__gallery--single .leafs-circle-card__gallery-img {
	width: 100%;
	height: auto;
	max-height: 168px;
	object-fit: cover;
}

.leafs-circle-card__gallery--few .leafs-circle-card__gallery-track {
	flex-wrap: nowrap;
	overflow: visible;
}

.leafs-circle-card__gallery--few .leafs-circle-card__gallery-item {
	width: 76px;
	height: 76px;
}

.leafs-circle-card__gallery--many .leafs-circle-card__gallery-item {
	width: 72px;
	height: 72px;
}

.leafs-circle-card__gallery-nav {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 1px solid var(--leafs-border);
	border-radius: 50%;
	background: var(--leafs-circle-card-bg);
	color: var(--leafs-muted);
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.leafs-circle-card__gallery-nav:hover:not(:disabled) {
	color: var(--leafs-brand);
	border-color: color-mix(in srgb, var(--leafs-brand) 30%, var(--leafs-border));
	background: var(--leafs-circle-accent-muted);
}

.leafs-circle-card__gallery-nav:disabled {
	opacity: 0.35;
	cursor: default;
}

.leafs-circle-card__gallery-nav[hidden] {
	display: none !important;
}

/* —— 展开加载动画 —— */
.leafs-circle-expand__loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 20px 12px;
}

.leafs-circle-expand__spinner,
.leafs-circle__infinite-spinner {
	width: 22px;
	height: 22px;
	border: 2px solid color-mix(in srgb, var(--leafs-brand) 18%, var(--leafs-border));
	border-top-color: var(--leafs-brand);
	border-radius: 50%;
	animation: leafs-circle-spin 0.75s linear infinite;
	flex-shrink: 0;
}

.leafs-circle-expand__loading-text {
	font-size: 0.8125rem;
	color: var(--leafs-muted);
}

@keyframes leafs-circle-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.leafs-circle-card__panel,
	.leafs-circle-card__ico--chevron,
	.leafs-circle-card.is-expanded {
		transition: none;
	}

	.leafs-circle-expand.is-enter,
	.leafs-circle-expand.is-enter .leafs-circle-expand__discuss-head,
	.leafs-circle-expand.is-enter .leafs-circle-expand__comment,
	.leafs-circle-expand.is-enter .leafs-circle-reply,
	.leafs-circle-expand.is-enter .leafs-circle-guest-gate {
		animation: none;
	}
}

/* —— 无限滚动 —— */
.leafs-circle__infinite {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 8px 0 4px;
}

.leafs-circle__infinite[hidden] {
	display: none !important;
}

.leafs-circle__infinite-loader {
	display: none;
}

.leafs-circle__infinite.is-loading .leafs-circle__infinite-loader {
	display: flex;
	justify-content: center;
}

.leafs-circle__infinite-text {
	margin: 0;
	font-size: 0.75rem;
	color: var(--leafs-muted);
	text-align: center;
}

.leafs-circle--archive .leafs-circle__pager--fallback {
	margin-top: 8px;
	padding-top: 4px;
	border-top: 1px solid var(--leafs-circle-feed-divider, var(--leafs-border));
}

.leafs-circle--archive .leafs-circle__pager--fallback.leafs-pagination {
	margin-top: 8px;
	padding-top: 12px;
	justify-content: center;
}

.leafs-circle--archive .leafs-circle__pager--fallback ul.page-numbers {
	gap: 6px;
}

.leafs-circle--archive .leafs-circle__pager--fallback ul.page-numbers a,
.leafs-circle--archive .leafs-circle__pager--fallback ul.page-numbers span:not(.dots) {
	min-width: 36px;
	min-height: 36px;
	padding: 6px 10px;
	border-radius: 10px;
	font-size: 0.8125rem;
	font-weight: 600;
}

.leafs-circle--archive .leafs-circle__pager--fallback ul.page-numbers a.prev,
.leafs-circle--archive .leafs-circle__pager--fallback ul.page-numbers a.next {
	padding-left: 12px;
	padding-right: 12px;
}

.leafs-circle__list[data-circle-infinite] ~ .leafs-circle__infinite:not([hidden]) ~ .leafs-circle__pager--fallback ul.page-numbers {
	opacity: 0.55;
	font-size: 0.8125rem;
}

.leafs-circle-card.is-expanded .leafs-circle-card__expand-hit[data-circle-expand-trigger] {
	cursor: default;
}

.leafs-circle--archive .leafs-circle-card.is-expanded .leafs-circle-card__main:has(.leafs-circle-card__expand-hit:hover) .leafs-circle-card__expand-hit[data-circle-expand-trigger],
.leafs-circle--archive .leafs-circle-card.is-expanded .leafs-circle-card__main:has(.leafs-circle-card__expand-hit:focus-visible) .leafs-circle-card__expand-hit[data-circle-expand-trigger] {
	background: transparent;
}

/* —— 置顶侧栏美化 —— */
.leafs-circle-pinned--sidebar {
	padding: 14px;
	border-radius: var(--leafs-circle-radius-md);
	border: 1px solid color-mix(in srgb, var(--leafs-brand) 24%, var(--leafs-border));
	background: linear-gradient(
		165deg,
		color-mix(in srgb, var(--leafs-brand) 8%, var(--leafs-circle-card-bg)),
		var(--leafs-circle-card-bg) 55%
	);
	box-shadow: var(--leafs-circle-shadow);
}

.leafs-circle-pinned__head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
}

.leafs-circle-pinned__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	background: color-mix(in srgb, var(--leafs-brand) 14%, transparent);
	color: var(--leafs-brand);
	flex-shrink: 0;
}

.leafs-circle-pinned--sidebar .leafs-circle-pinned__title {
	margin: 0;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.leafs-circle-pinned--sidebar .leafs-circle-pinned__card {
	border: 1px solid color-mix(in srgb, var(--leafs-border) 80%, transparent);
	background: color-mix(in srgb, var(--leafs-text) 2%, transparent);
	transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.leafs-circle-pinned--sidebar .leafs-circle-pinned__card:hover,
.leafs-circle-pinned--sidebar .leafs-circle-pinned__card:focus-visible {
	border-color: color-mix(in srgb, var(--leafs-brand) 32%, var(--leafs-border));
	background: var(--leafs-circle-accent-muted);
	outline: none;
	transform: translateX(2px);
}

.leafs-circle-pinned--sidebar .leafs-circle-pinned__text {
	font-weight: 600;
	color: var(--leafs-text);
}

/* —— 左侧分类（对齐右侧朗姆侧栏模块） —— */
.leafs-circle-catgrid--rail {
	padding: 12px 13px;
	border-radius: var(--leafs-circle-radius-md);
	border: 1px solid color-mix(in srgb, var(--leafs-brand) 20%, var(--leafs-border));
	background: linear-gradient(
		165deg,
		color-mix(in srgb, var(--leafs-brand) 7%, var(--leafs-circle-card-bg)),
		var(--leafs-circle-card-bg) 58%
	);
	box-shadow: var(--leafs-circle-shadow);
}

.leafs-circle-catgrid__summary {
	display: none;
	align-items: center;
	gap: 8px;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--leafs-text);
	list-style: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.leafs-circle-catgrid__summary::-webkit-details-marker {
	display: none;
}

.leafs-circle-catgrid__summary::marker {
	content: '';
}

.leafs-circle-catgrid__summary-text {
	display: flex;
	flex: 1 1 auto;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
}

.leafs-circle-catgrid__summary-label {
	flex-shrink: 0;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--leafs-muted);
}

.leafs-circle-catgrid__summary-current {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--leafs-brand);
}

.leafs-circle-catgrid__summary-chevron {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--leafs-muted);
	transition: transform 0.2s ease;
}

.leafs-circle-catgrid--rail[open] .leafs-circle-catgrid__summary-chevron {
	transform: rotate(180deg);
}

.leafs-circle-catgrid__body {
	min-width: 0;
}

.leafs-circle-catgrid__head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
}

.leafs-circle-catgrid__head-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	background: color-mix(in srgb, var(--leafs-brand) 14%, transparent);
	color: var(--leafs-brand);
	flex-shrink: 0;
}

.leafs-circle-catgrid__head-icon svg {
	width: 16px;
	height: 16px;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__title {
	margin: 0;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.02em;
	color: var(--leafs-text);
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__list {
	gap: 3px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__list > li {
	width: 100%;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__card {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	width: 100%;
	min-height: 30px;
	padding: 5px 9px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	text-decoration: none;
	color: inherit;
	transition: background 0.15s ease, color 0.15s ease;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__dot {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: hsl(var(--leafs-circle-cat-hue, 168) 55% 48%);
	box-shadow: 0 0 0 3px color-mix(in srgb, hsl(var(--leafs-circle-cat-hue, 168) 55% 48%) 22%, transparent);
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__card.is-active .leafs-circle-catgrid__dot {
	background: var(--leafs-brand);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--leafs-brand) 35%, transparent);
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__card:hover,
.leafs-circle-catgrid--rail .leafs-circle-catgrid__card:focus-visible {
	outline: none;
	transform: none;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__name {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.3;
	text-align: left;
	color: var(--leafs-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__card.is-active .leafs-circle-catgrid__name {
	font-weight: 600;
	color: var(--leafs-brand);
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__count {
	flex: 0 0 auto;
	margin-left: auto;
	min-width: 1.25rem;
	padding: 0;
	border-radius: 0;
	font-size: 0.75rem;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	line-height: 1.25;
	text-align: right;
	color: var(--leafs-muted2);
	background: transparent;
}

.leafs-circle-catgrid--rail .leafs-circle-catgrid__card.is-active .leafs-circle-catgrid__count {
	color: color-mix(in srgb, var(--leafs-brand) 80%, var(--leafs-muted));
	background: transparent;
}

@media (max-width: 1099px) {
	.leafs-circle-catgrid--rail {
		padding: 10px 12px;
	}

	.leafs-circle-catgrid__summary {
		display: flex;
	}

	.leafs-circle-catgrid__head {
		display: none;
	}

	.leafs-circle-catgrid--rail:not([open]) .leafs-circle-catgrid__body {
		display: none;
	}

	.leafs-circle-catgrid--rail[open] .leafs-circle-catgrid__body {
		display: block;
		padding-top: 8px;
	}
}

@media (min-width: 1100px) {
	.leafs-circle-catgrid__summary {
		display: none !important;
	}

	.leafs-circle-catgrid__head {
		display: flex;
	}

	.leafs-circle-catgrid--rail .leafs-circle-catgrid__body {
		display: block !important;
	}
}

/* —— 徽章模块美化 —— */
.leafs-circle-legend {
	padding: 14px;
	border-radius: var(--leafs-circle-radius-md);
	border: 1px solid color-mix(in srgb, var(--leafs-brand) 18%, var(--leafs-border));
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--leafs-brand) 5%, var(--leafs-circle-card-bg)),
		var(--leafs-circle-card-bg)
	);
	box-shadow: var(--leafs-circle-shadow);
}

.leafs-circle-legend__head {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 10px;
}

.leafs-circle-legend__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: color-mix(in srgb, var(--leafs-brand) 12%, transparent);
	color: var(--leafs-brand);
	flex-shrink: 0;
}

.leafs-circle-legend__head .leafs-circle-panel__title {
	margin: 0 0 4px;
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--leafs-brand);
}

.leafs-circle-legend__head .leafs-circle-panel__desc {
	margin: 0;
}

.leafs-circle-legend__tiers li {
	border: 1px solid color-mix(in srgb, var(--leafs-border) 70%, transparent);
	transition: border-color 0.15s ease, background 0.15s ease;
}

.leafs-circle-legend__tiers li:hover {
	border-color: color-mix(in srgb, var(--leafs-brand) 28%, var(--leafs-border));
	background: var(--leafs-circle-accent-muted);
}

/* —— 话题内页：紧凑排版 + 分享条锚定主栏 —— */
.leafs-circle--single .leafs-circle__layout--single {
	align-items: start;
	max-width: 100%;
}

.leafs-circle--single .leafs-circle__primary {
	min-width: 0;
	max-width: 100%;
}

.leafs-circle--single .leafs-circle-topic {
	padding: 16px 18px 14px;
	margin-bottom: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.leafs-circle--single .leafs-circle-topic__head {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.leafs-circle--single .leafs-circle-topic__topline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 10px;
}

.leafs-circle--single .leafs-circle-topic__tags {
	gap: 6px;
}

.leafs-circle--single .leafs-circle-topic__tags .leafs-tag {
	font-size: 0.75rem;
	padding: 2px 8px;
	line-height: 1.35;
}

.leafs-circle--single .leafs-circle-topic__stats {
	gap: 6px 12px;
	font-size: 0.8125rem;
}

.leafs-circle--single .leafs-circle-topic__title {
	margin: 0;
	font-size: clamp(1.125rem, 2vw, 1.5rem);
	line-height: 1.28;
	word-break: break-word;
}

.leafs-circle--single .leafs-circle-topic__meta {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: 0;
	padding: 0;
	margin: 0;
	border: 0;
}

.leafs-circle--single .leafs-circle-topic__author {
	gap: 10px;
	min-width: 0;
}

.leafs-circle--single .leafs-circle-topic__avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	flex-shrink: 0;
}

.leafs-circle--single .leafs-circle-topic__author-text {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	min-width: 0;
}

.leafs-circle--single .leafs-circle-topic__name {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.3;
}

.leafs-circle--single .leafs-circle-topic__toolbar {
	padding-top: 8px;
	border-top: 1px solid var(--leafs-border);
}

.leafs-circle--single .leafs-circle-topic__toolbar .leafs-circle-actions {
	margin: 0;
	padding: 0;
	border: 0;
	gap: 8px;
}

.leafs-circle--single .leafs-circle-topic__toolbar .leafs-circle-actions__btn {
	padding: 5px 12px;
	font-size: 0.8125rem;
}

.leafs-circle--single .leafs-circle-topic__body {
	margin-top: 12px;
	font-size: 0.9375rem;
	line-height: 1.65;
	max-width: none;
}

.leafs-circle--single .leafs-circle-topic__body > :first-child {
	margin-top: 0;
}

.leafs-circle--single .leafs-circle-topic__body p {
	margin: 0 0 0.65em;
}

.leafs-circle--single .leafs-circle-topic__body p:last-child {
	margin-bottom: 0;
}

.leafs-circle--single .leafs-circle-topic__cover {
	max-width: 100%;
	margin: 10px 0 0;
	border-radius: var(--leafs-circle-radius-md);
	overflow: hidden;
}

.leafs-circle--single .leafs-circle-topic__cover-img {
	width: 100%;
	height: auto;
	max-height: min(320px, 45vh);
	object-fit: cover;
}

.leafs-circle--single .leafs-circle-discuss {
	padding: 14px 18px 18px;
	margin-top: 0;
	border: 0;
	border-radius: 0;
	border-top: 1px solid var(--leafs-circle-feed-divider, var(--leafs-border));
	background: transparent;
}

.leafs-circle--single .leafs-circle-discuss__title {
	font-size: 1.05rem;
	margin-bottom: 4px;
}

.leafs-circle--single .leafs-circle-discuss__hint {
	margin-bottom: 12px;
	font-size: 0.8125rem;
}

.leafs-circle--single .leafs-circle__breadcrumb {
	margin-bottom: 10px;
	font-size: 0.8125rem;
}

@media (min-width: 769px) {
	.leafs-circle--archive.leafs-circle--uied .leafs-circle__primary,
	.leafs-circle--single.leafs-circle--uied .leafs-circle__primary {
		position: relative;
	}
}

.leafs-circle--single .leafs-circle__rail--right {
	position: sticky;
	top: calc(var(--leafs-header-h, 64px) + 12px);
	align-self: start;
}

@media (max-width: 1099px) {
	.leafs-circle--single .leafs-circle__layout--single {
		grid-template-columns: minmax(0, 1fr);
	}

	.leafs-circle--single .leafs-circle__rail--right {
		position: static;
	}
}

/* —— 手机端：圈子列表 / 话题卡 / 发帖 —— */
@media (max-width: 767px) {
	.leafs-main.leafs-container.leafs-circle {
		width: min(calc(100vw - 28px), var(--leafs-circle-page-max, 1540px));
		max-width: none;
		padding-top: 4px;
		padding-bottom: max(28px, env(safe-area-inset-bottom, 0px));
	}

	.leafs-circle--archive.leafs-circle--uied .leafs-circle__layout--rich {
		gap: 10px;
	}

	.leafs-circle--archive.leafs-circle--uied .leafs-circle__primary {
		border-radius: 10px;
		box-shadow: 0 1px 2px color-mix(in srgb, var(--leafs-text) 4%, transparent);
	}

	.leafs-circle--archive .leafs-circle-compose {
		padding-top: 12px;
		padding-bottom: 10px;
	}

	.leafs-circle--archive .leafs-circle__toolbar {
		padding-top: 10px;
		padding-bottom: 8px;
	}

	.leafs-circle--archive .leafs-circle__sort {
		width: 100%;
		display: flex;
	}

	.leafs-circle--archive .leafs-circle__sort-btn {
		flex: 1 1 0;
		justify-content: center;
		min-width: 0;
		padding: 8px 10px;
	}

	.leafs-circle-publish-box__head {
		margin-bottom: 12px;
	}

	.leafs-circle-publish-box__fields {
		gap: 10px;
		margin-bottom: 10px;
	}

	.leafs-circle-publish-box__bar {
		flex-wrap: wrap;
		gap: 8px;
	}

	.leafs-circle-publish-box__tool-label {
		display: none;
	}

	.leafs-circle-publish-box__submit {
		flex: 1 1 100%;
	}

	.leafs-circle--single .leafs-circle-topic__topline {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	.leafs-circle--single .leafs-circle-topic__stats {
		width: 100%;
		flex-wrap: wrap;
		gap: 6px 10px;
	}

	.leafs-circle--single .leafs-circle-topic__title {
		font-size: 1.125rem;
	}

	.leafs-circle-reply__row {
		flex-wrap: wrap;
	}

	.leafs-circle-reply__submit {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.leafs-circle--archive .leafs-circle-compose,
	.leafs-circle--archive .leafs-circle__toolbar,
	.leafs-circle--archive .leafs-circle__cats-wrap {
		padding-left: 12px;
		padding-right: 12px;
	}

	.leafs-circle--archive .leafs-circle-card__surface {
		padding: 12px 12px 10px;
	}

	.leafs-circle--archive .leafs-circle-card__panel {
		margin: 0 8px 8px;
	}
}

/* —— 手机 / 平板自适应（防溢出、排序分类、卡片） —— */
.leafs-main.leafs-container.leafs-circle {
	overflow-x: clip;
}

.leafs-circle--archive .leafs-circle__primary,
.leafs-circle--single .leafs-circle__primary {
	max-width: 100%;
	min-width: 0;
}

@media (min-width: 768px) and (max-width: 1099px) {
	.leafs-circle--archive .leafs-circle__sort-btn {
		padding: 8px 14px;
	}

	.leafs-circle--archive .leafs-circle-card__cats {
		max-width: 52%;
	}
}

@media (max-width: 899px) {
	.leafs-circle-card__row--head {
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
	}

	.leafs-circle-card__cats {
		max-width: 100%;
		align-items: flex-start;
		flex-direction: row;
		flex-wrap: wrap;
		text-align: left;
		justify-content: flex-start;
	}

	.leafs-circle-card--pinned .leafs-circle-card__row--head {
		padding-right: 0;
	}

	.leafs-circle-card__media,
	.leafs-circle-card__gallery {
		max-width: 100%;
	}

	.leafs-circle-card__title-text {
		word-break: break-word;
		overflow-wrap: anywhere;
	}

	.leafs-circle-card__content {
		overflow-wrap: anywhere;
		word-break: break-word;
	}
}

@media (max-width: 767px) {
	.leafs-circle--archive .leafs-circle__toolbar {
		padding-left: 14px;
		padding-right: 14px;
	}

	.leafs-circle--archive .leafs-circle__sort {
		display: flex;
		width: 100%;
		gap: 6px;
		padding: 2px;
		border-radius: 10px;
		background: color-mix(in srgb, var(--leafs-text) 4%, transparent);
	}

	.leafs-circle--archive .leafs-circle__sort-btn {
		flex: 1 1 0;
		min-width: 0;
		justify-content: center;
		padding: 9px 8px;
		border-radius: 8px;
		border-color: transparent;
		background: transparent;
		font-size: 0.8125rem;
	}

	.leafs-circle--archive .leafs-circle__sort-btn.is-active {
		background: var(--leafs-card, #fff);
		border-color: color-mix(in srgb, var(--leafs-brand) 22%, var(--leafs-border));
		box-shadow: 0 1px 3px color-mix(in srgb, var(--leafs-text) 6%, transparent);
	}

	html[data-leafs-theme="dark"] .leafs-circle--archive .leafs-circle__sort-btn.is-active {
		background: var(--leafs-surface2, var(--leafs-surface));
	}

	.leafs-circle--archive .leafs-circle__cats {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		gap: 8px;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-bottom: 12px;
		mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
	}

	.leafs-circle--archive .leafs-circle__cats::-webkit-scrollbar {
		display: none;
	}

	.leafs-circle--archive .leafs-circle__cat-pill {
		flex-shrink: 0;
		padding: 7px 12px;
		font-size: 0.8125rem;
		white-space: nowrap;
	}

	.leafs-circle-card__row--actions {
		flex-wrap: wrap;
		row-gap: 6px;
	}

	.leafs-circle-card__discuss-btn {
		max-width: none;
		margin-left: auto;
	}

	.leafs-circle--archive .leafs-circle-card__panel {
		margin: 0 8px 10px;
	}

	.leafs-circle-reply__row {
		align-items: flex-end;
	}

	.leafs-circle-reply__editor {
		min-width: 0;
		flex: 1 1 auto;
	}

	.leafs-comment-compose__popups--circle .leafs-comment-emoji-panel:not([hidden]),
	.leafs-comment-compose__popups--circle .leafs-comment-sketch-panel:not([hidden]) {
		max-height: min(65vh, 380px);
	}

	.leafs-comment-compose__popups--circle .leafs-comment-sketch-canvas {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		aspect-ratio: 16 / 10;
	}
}

@media (max-width: 640px) {
	.leafs-circle-card__row--actions {
		flex-wrap: wrap;
	}

	.leafs-circle-card__discuss-btn {
		max-width: 100%;
		width: auto;
		flex: 0 1 auto;
	}

	.leafs-circle-publish-box__cat {
		max-width: min(42vw, 140px);
	}

	.leafs-circle-publish-box__tools {
		row-gap: 8px;
	}
}

@media (max-width: 399px) {
	.leafs-circle-card__discuss-btn {
		font-size: 0.6875rem;
	}

	.leafs-circle-card__discuss-btn .leafs-circle-card__ico--chevron {
		width: 13px;
		height: 13px;
	}

	.leafs-circle--archive .leafs-circle__sort-btn {
		font-size: 0.75rem;
		padding: 8px 4px;
	}
}