/* ==========================================================================
   Design Tokens — BBGTALK
   黑墨中性底 + 柠檬绿单一强调色。所有语义命名保持不变。
   ========================================================================== */

:root {
	/* 品牌：--brand 只用于填充；文字请用 --brand-ink（浅底）/ --brand（深底） */
	--brand: #c9f238;
	--brand-deep: #b2dd24;
	--brand-ink: #3f5600;
	--brand-contrast: #14180b;
	--brand-soft: #f1fbd6;
	--brand-line: #d9ec9a;
	--highlight: #3b7dd8;
	--warning: #a9760c;
	--success: #4c8c3f;

	/* 文本：带极轻的绿色倾向，不用纯黑纯白 */
	--text-1: #171c12;
	--text-2: #333b2b;
	--text-3: #5b6453;
	--text-4: #89927f;
	--text-5: #a8b09f;
	--text-inverse: #fcfdf9;

	/* 图标 */
	--icon: #b7bfae;
	--icon-active: #5b6453;

	/* 面 */
	--bg: #fcfdf9;
	--bg-body: #f2f4ef;
	--bg-box: #eff2ea;
	--bg-hover: #e7ece0;
	--bg-dark: #14180f;
	--bg-mask: rgba(12, 16, 8, .58);

	/* 描边 */
	--line: #e2e7db;
	--line-2: #d3daca;
	--line-3: #bfc9b3;

	/* 圆角：编辑型小圆角，胶囊只留给输入与分段控件 */
	--r-xs: 2px;
	--r-sm: 4px;
	--r-md: 6px;
	--r-lg: 8px;
	--r-pill: 999px;

	/* 间距 */
	--gutter: 18px;
	--gap-s: 8px;
	--gap-m: 12px;
	--gap-l: 20px;
	--gap-xl: 32px;
	--section-gap: 56px;

	/* 结构 */
	--side-w: 147px;
	--header-h: 60px;
	--content-max: 1320px;
	--player-h: 64px;

	/* 字体：中文系统字 + 数字专用窄体，避免正文里数字跳动 */
	--font-sans: "PingFang SC", "PingFangSC", -apple-system, BlinkMacSystemFont, "Segoe UI",
		"Helvetica Neue", Arial, "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	--font-mono: "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
	--font-num: "Bahnschrift", "DIN Alternate", "Roboto Condensed", "Helvetica Neue",
		var(--font-sans);

	/* 字号 */
	--fs-xs: 11px;
	--fs-sm: 12.5px;
	--fs-base: 14px;
	--fs-md: 15px;
	--fs-lg: 17px;
	--fs-xl: 21px;
	--fs-2xl: 26px;
	--fs-3xl: 34px;

	/* 阴影：跟随背景色相，不用纯黑 */
	--shadow-sm: 0 1px 2px rgba(23, 28, 18, .05);
	--shadow-md: 0 4px 16px rgba(23, 28, 18, .08);
	--shadow-lg: 0 12px 40px rgba(23, 28, 18, .13);
	--shadow-player: 0 -2px 20px rgba(23, 28, 18, .13);

	/* 动效 */
	--ease: cubic-bezier(.22, .61, .36, 1);
	--dur: 200ms;
}

@media (prefers-color-scheme: dark) {
	:root {
		--text-1: #f1f5ea;
		--text-2: #dce4d2;
		--text-3: #aebba1;
		--text-4: #7e8c72;
		--text-5: #5f6c55;
		--icon: #5a6a4d;
		--icon-active: #c5d1b7;

		--bg: #151a12;
		--bg-body: #0d100b;
		--bg-box: #1c2318;
		--bg-hover: #25301e;
		--bg-dark: #0a0d07;
		--bg-mask: rgba(0, 0, 0, .7);

		--line: #242c1e;
		--line-2: #2e3926;
		--line-3: #3a4830;

		/* 深底上品牌文字回到亮柠檬绿，但填充上的文字仍用墨色 */
		--brand-ink: #c9f238;
		--brand-soft: #293809;
		--brand-line: #46610f;
		--brand-contrast: #14180b;

		--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);
		--shadow-lg: 0 12px 40px rgba(0, 0, 0, .5);
		--shadow-player: 0 -2px 20px rgba(0, 0, 0, .6);
	}
}