/**
 * 纯七采集 · 采集文章正文样式
 *
 * 仅在「采集来的文章」详情页加载（由插件按 _cq_source_url 判断）。
 *
 * 配色策略：所有底色、描边一律使用半透明色值，文字颜色用 inherit。
 * 这样无论站点是浅色皮肤还是深色皮肤，都不需要额外写一套变量，
 * 也不会把主题的配色覆盖掉。
 */

/* ── 容器与基础排版 ─────────────────────────────── */

.cq-doc {
	--cq-brand-rgb: 109, 94, 252;      /* 品牌紫 */
	--cq-ok-rgb: 46, 194, 126;         /* 答案绿 */

	--cq-tint: rgba(var(--cq-brand-rgb), 0.055);
	--cq-tint-strong: rgba(var(--cq-brand-rgb), 0.09);
	--cq-hair: rgba(var(--cq-brand-rgb), 0.16);
	--cq-hair-soft: rgba(var(--cq-brand-rgb), 0.09);

	/*
	 * 正文里的「彩色文字」。固定的品牌色阶无法同时满足浅底（需要够深）和
	 * 深底（需要够亮）的对比度要求，所以这里把品牌色和主题自己的文字色
	 * 按比例混合：主题文字是深色时结果变深、是浅色时结果变亮，两种皮肤
	 * 都自动达标，且完全不需要猜主题是浅色还是深色。
	 */
	--cq-brand-ink: color-mix(in srgb, rgb(var(--cq-brand-rgb)) 70%, currentColor);
	--cq-ok-ink: color-mix(in srgb, rgb(var(--cq-ok-rgb)) 55%, currentColor);

	font-size: 15.5px;
	line-height: 1.9;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

.cq-doc-body {
	color: inherit;
}

.cq-doc-body p {
	margin: 0 0 14px;
}

.cq-doc-body p:last-child {
	margin-bottom: 0;
}

.cq-doc-body img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

/* 独占一行的图片 */
.cq-doc-body .cq-figure {
	margin: 18px 0;
	text-align: center;
}

.cq-doc-body .cq-figure img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

/* ── 顶部标签条 ─────────────────────────────────── */

.cq-doc-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}

.cq-tag {
	display: inline-block;
	padding: 4px 13px;
	border-radius: 999px;
	background: var(--cq-tint);
	border: 1px solid var(--cq-hair-soft);
	color: inherit;
	font-size: 12.5px;
	line-height: 1.7;
	opacity: 0.85;
	white-space: nowrap;
}

/* ── 资源说明卡片 ───────────────────────────────── */

.cq-doc-notice {
	margin: 0 0 22px;
	padding: 16px 18px;
	border-radius: 0 12px 12px 0;
	border-left: 3px solid rgb(var(--cq-brand-rgb));
	background: var(--cq-tint);
}

.cq-doc-notice p {
	margin: 0 0 8px;
	font-size: 14.5px;
	line-height: 1.85;
}

.cq-doc-notice p:last-child {
	margin-bottom: 0;
}

.cq-doc-notice strong {
	display: inline-block;
	margin-right: 6px;
	padding: 1px 10px;
	border-radius: 6px;
	background: var(--cq-tint-strong);
	color: inherit;
	font-size: 13px;
	font-weight: 600;
}

/* ── 小节标题 ───────────────────────────────────── */

.cq-doc-body h3.cq-h {
	position: relative;
	margin: 30px 0 16px;
	padding-left: 14px;
	font-size: 16.5px;
	font-weight: 600;
	line-height: 1.6;
	color: inherit;
	border: 0;
}

.cq-doc-body h3.cq-h::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.34em;
	width: 4px;
	height: 1em;
	border-radius: 3px;
	background: rgb(var(--cq-brand-rgb));
}

.cq-doc-body h3.cq-h:first-child {
	margin-top: 0;
}

/* ── 题干 ───────────────────────────────────────── */

.cq-doc-body .cq-q {
	display: flex;
	gap: 6px;
	margin: 20px 0 10px;
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.8;
}

.cq-doc-body .cq-q:first-child {
	margin-top: 0;
}

.cq-q-num {
	flex: 0 0 auto;
	min-width: 1.6em;
	color: rgb(var(--cq-brand-rgb));
	color: var(--cq-brand-ink);
	font-weight: 700;
}

.cq-q-text {
	flex: 1 1 auto;
	min-width: 0;
}

/* ── 选项列表 ───────────────────────────────────── */

.cq-doc-body ul.cq-options {
	display: grid;
	gap: 7px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.cq-doc-body ul.cq-options > li {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	padding: 9px 15px;
	/* grid 项默认 min-width:auto，会被长串符号（如「①②③④⑤」）的 min-content
	   顶到远超容器宽度，把整页撑出横向滚动条；必须显式归零 */
	min-width: 0;
	border-radius: 10px;
	background: var(--cq-tint);
	border: 1px solid transparent;
	font-size: 15px;
	line-height: 1.8;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.cq-doc-body ul.cq-options > li:hover {
	background: var(--cq-tint-strong);
	border-color: var(--cq-hair-soft);
}

.cq-opt-key {
	flex: 0 0 auto;
	min-width: 1.5em;
	color: rgb(var(--cq-brand-rgb));
	color: var(--cq-brand-ink);
	font-weight: 700;
}

.cq-opt-text {
	flex: 1 1 auto;
	/* flex 子项同样受 min-width:auto 影响，长串符号会顶破父容器 */
	min-width: 0;
}

/* 编号列表（如「01-2026年咨询工程师」）用同款视觉，仅角标稍宽 */
.cq-doc-body ul.cq-numbered > li {
	padding: 8px 15px;
}

.cq-doc-body ul.cq-numbered .cq-opt-key {
	min-width: 2em;
	font-variant-numeric: tabular-nums;
}

/* ── 答案 ───────────────────────────────────────── */

.cq-doc-body .cq-answer {
	margin: 14px 0;
	padding: 11px 16px;
	border-radius: 0 10px 10px 0;
	border-left: 3px solid rgb(var(--cq-ok-rgb));
	background: rgba(var(--cq-ok-rgb), 0.09);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.8;
}

.cq-doc-body .cq-answer .cq-label {
	display: inline-block;
	margin-right: 8px;
	color: rgb(var(--cq-ok-rgb));
	color: var(--cq-ok-ink);
	font-weight: 700;
}

/* ── 解析 ───────────────────────────────────────── */

.cq-doc-body .cq-explain {
	margin: 12px 0 20px;
	padding: 13px 16px;
	border-radius: 12px;
	border: 1px dashed var(--cq-hair);
	background: var(--cq-hair-soft);
	font-size: 14.5px;
	line-height: 1.9;
	opacity: 0.95;
}

.cq-doc-body .cq-explain .cq-label {
	display: inline-block;
	margin-right: 8px;
	color: rgb(var(--cq-brand-rgb));
	color: var(--cq-brand-ink);
	font-weight: 700;
}

/* ── 其他【标签】行 ─────────────────────────────── */

.cq-doc-body .cq-labeled {
	margin: 12px 0;
	padding-left: 2px;
	font-size: 15px;
	line-height: 1.85;
}

.cq-doc-body .cq-labeled .cq-label {
	display: inline-block;
	margin-right: 8px;
	padding: 1px 10px;
	border-radius: 6px;
	background: var(--cq-tint-strong);
	font-size: 13px;
	font-weight: 600;
}

/* ── 正文内链接 ─────────────────────────────────── */

.cq-doc-body a {
	color: rgb(var(--cq-brand-rgb));
	color: var(--cq-brand-ink);
	text-decoration: none;
	border-bottom: 1px solid var(--cq-hair);
	word-break: break-all;
}

.cq-doc-body a:hover {
	border-bottom-color: currentColor;
}

/* ── 末尾下载提示 ───────────────────────────────── */

.cq-doc-tip {
	margin: 26px 0 0;
	padding-top: 16px;
	border-top: 1px dashed var(--cq-hair);
	color: inherit;
	font-size: 12.5px;
	line-height: 1.8;
	text-align: center;
	/* 0.55 会让实际对比度掉到 3.55:1（不合格），0.72 仍明显弱于正文但能到 6:1 以上 */
	opacity: 0.72;
}

/* ── 移动端 ─────────────────────────────────────── */

@media screen and (max-width: 768px) {
	.cq-doc {
		font-size: 15px;
		line-height: 1.85;
	}

	.cq-doc-body h3.cq-h {
		margin: 24px 0 13px;
		font-size: 16px;
	}

	.cq-doc-body .cq-q {
		margin: 17px 0 9px;
		font-size: 15px;
	}

	.cq-doc-body ul.cq-options > li {
		padding: 8px 12px;
		font-size: 14.5px;
	}

	.cq-doc-body .cq-answer,
	.cq-doc-body .cq-explain {
		padding: 10px 13px;
		font-size: 14.5px;
	}

	.cq-doc-notice {
		padding: 14px 15px;
	}

	.cq-doc-tags {
		gap: 6px;
		margin-bottom: 16px;
	}

	.cq-tag {
		padding: 3px 11px;
		font-size: 12px;
	}
}

/* ── 减弱动效偏好 ───────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.cq-doc-body ul.cq-options > li {
		transition: none;
	}
}