/* ============================================================
   AI不眠 — 设计令牌 (Design Tokens)

   这是主题与插件 CSS 之间的契约。
   插件 assets/css/publish-form.css 中所有 var(--*) 都必须在这里定义。

   命名约定:
     --brand-*  品牌主色梯度
     --accent-* 强调色梯度
     --ink-*    文字色 (0 最深, 4 最浅)
     --bg-*     背景色 (0 卡片白, 1 页面底, 2 弱区块, 3 hover)
     --line / --line-strong  分隔线
     --success/-warning/-danger/-info (+ -50 浅底)
     --s-N      间距 (4 的倍数, 1=4px, 9=48px, 10=64px)
     --r-N      圆角 (1=4, 2=8, 3=12, 4=16, 5=24, pill=999)
     --sh-N     阴影层级 (1 微, 2 卡片, 3 悬浮)
     --dur-1/2  动效时长
     --ease     缓动函数
     --container 容器最大宽 (一处改全站跟)
   ============================================================ */

:root {
	color-scheme: light;

	/* ---------- 品牌 ---------- */
	--brand:       #6d4dff;
	--brand-50:    #f0ecff;
	--brand-100:   #e0d7ff;
	--brand-200:   #c8b8ff;
	--brand-400:   #9a7dff;
	--brand-600:   #5b39e6;
	--brand-700:   #4527c4;

	/* 续54：品牌色作「白字实心背景」(销量榜 tab/徽章/分页/今日标等)统一用本色 —— 亮暗都 #6d4dff(白字 5.05 达 AA)，与作文字/作链接的 --brand 解耦。 */
	--brand-solid: #6d4dff;
	/* 主按钮实心底（白字恒达 AA ≥4.5，与作文字用的 --brand 解耦）：亮 #6d4dff(白字 5.05)。
	   暗色 --brand 提亮为 #9882ff（作文字 4.72 达 AA），白字实心底却只 3.56:1 → 用 --brand-solid / --brand-600(#6d4dff)。 */
	--btn-primary-bg:   var(--brand);
	--btn-primary-bg-h: var(--brand-600);

	/* ---------- 强调 (创作热情、CTA 辅) ---------- */
	--accent:      #ff8a4c;
	--accent-50:   #fff1e8;
	--accent-strong: #f97316;
	/* 体检批 2026-07-04：白字实心橙底（hero 签到胶囊「去签到」等）专用——#f97316 白字仅 2.8:1 →
	   加深到 #c2410c（=--price 同号）白字 5.19 达 AA。同 --brand-solid 手法：白字实心背景走 solid 系、
	   亮暗同值；--accent-strong 仍作图形/大字/浅底文字用。 */
	--accent-solid: #c2410c;

	/* ---------- 文字 ---------- */
	--ink-0: #18181f;
	--ink-1: #2a2a35;
	--ink-2: #51515f;
	--ink-3: #6b6b7a;  /* ≥4.5:1 on #fff/#fafaf6/#f3f1ea（次级文字达 WCAG AA 正文） */
	--ink-4: #70707b;  /* ≥4.5:1 on #fff/#fafaf6（版权/备案号/safety-report/placeholder 弱文字达 WCAG AA 正文；续54 从 #838391≈3.73 加深，原"弱文字 3:1"不满足 AA） */

	/* ---------- 背景 ---------- */
	--bg-0: #ffffff;
	--bg-1: #fafaf6;
	--bg-2: #f3f1ea;
	--bg-3: #ebe8de;
	/* 收款码 / 二维码预览底：必须恒为浅底以保可扫描，不随明暗翻色（仅在 :root 定义、暗色块不覆盖）。 */
	--qr-bg: #ffffff;

	/* ---------- 线 ---------- */
	--line:        #ecebe2;
	--line-strong: #d8d6c8;
	--field-border: #d8d6c8;  /* 表单控件边框（输入/下拉/单选胶囊）；亮色同 line-strong（不变） */

	/* ---------- 状态色 ---------- */
	--success:     #16a34a;
	--success-50:  #e9fbe9;
	--warning:     #d97706;
	--warning-50:  #fff3d6;
	--danger:      #e53e3e;
	--danger-50:   #ffe9e9;
	--info:        #0a6fea;
	--info-50:     #e6f0fd;

	/* ---------- 业务色 ---------- */
	--gold:        #d97706;  /* 星级金 / 排名 No.1（原 #f59e0b≈2.15:1 偏浅 → 加深至 ≥3:1 图形可辨） */
	--price:       #c2410c;  /* 价格橙（卡片+详情统一）≥4.5:1 小字 on #fff（原卡片#f97316/详情#ff8a4c 不一致且偏浅） */
	--rank-silver: #6b7280;  /* 榜单 No.2 银（亮 ≥4.5:1 on #fff；原硬编码 #9aa3af≈2.55 偏浅） */
	--rank-bronze: #9a6a2f;  /* 榜单 No.3 铜（亮 ≥4.5:1 on #fff；原硬编码 #b8794d≈3.57 偏浅） */

	/* ---------- 可读状态文字（同色系，在对应 -50 浅底上达 AA ≥4.5） ---------- */
	--warning-strong: #b45309;  /* on --warning-50（AIGC 合规标识 / 匠心徽章等） */
	--success-strong: #15803d;  /* on --success-50 */
	--danger-strong:  #b91c1c;  /* on --danger-50 / #fff（错误文字/通知，原 --danger #e53e3e≈3.6 偏低） */
	--info-strong:    #0a5fcf;  /* on --info-50 */
	/* 体检批 2026-07-04：白字实心绿底（hero 签到胶囊「已领」态等）——--success #16a34a 白字仅 3.3:1 →
	   用 #15803d（=success-strong 同号）白字 5.01 达 AA；亮暗同值（同 solid 系手法）。 */
	--success-solid:  #15803d;
	/* 三观感批 2026-07-04：白字实心警示橙底（问答未审评论计数章）——--warning 白字亮 3.18/暗 1.6 →
	   用 #b45309（=warning-strong 同号）白字 5.03 达 AA；亮暗同值。 */
	--warning-solid:  #b45309;

	/* ---------- 间距 (4 base) ---------- */
	--s-1:  4px;
	--s-2:  8px;
	--s-3: 12px;
	--s-4: 16px;
	--s-5: 20px;
	--s-6: 24px;
	--s-7: 32px;
	--s-8: 40px;
	--s-9: 48px;
	--s-10: 64px;
	--s-12: 80px;

	/* ---------- 圆角 ---------- */
	--r-1: 4px;
	--r-2: 8px;
	--r-3: 12px;
	--r-4: 16px;
	--r-5: 24px;
	--r-pill: 999px;

	/* ---------- 阴影 ---------- */
	--sh-1: 0 1px 2px rgba(20, 20, 36, 0.04);
	--sh-2: 0 4px 12px rgba(20, 20, 36, 0.08), 0 1px 3px rgba(20, 20, 36, 0.04);
	--sh-3: 0 12px 32px rgba(20, 20, 36, 0.12), 0 2px 6px rgba(20, 20, 36, 0.04);

	/* ---------- 动效 ---------- */
	--dur-1: 150ms;
	--dur-2: 240ms;
	--ease:  cubic-bezier(.2, .6, .2, 1);

	/* ---------- 布局 ---------- */
	--container: 1240px;
	--header-h: 60px;
	--mobile-tab-h: 56px;

	/* ---------- 层级 z-index 量表（全局叠放层）〔续49 显式化既有隐式阶梯〕----------
	   规则：**全局固定/吸顶/弹层**用下面这组 token；**局部 stacking**（卡片内角标压封面等）继续用 1/2/3 小整数即可、不必引这些。
	   阶梯：底栏 90 < 购买条 95 < 吸顶搜索 98 < 顶栏 100 < 顶栏弹层 110 < 浮层(横幅/搜索建议) 120
	         << 模态 1000 < 模态置顶(验证码弹窗) 2000 < 其上加载遮罩 2100 << 跳过链接/灯箱 9999。
	   值与历史一致、改名不改值（迁移零视觉变化）；新增全局层一律选最贴近的一档、勿再硬写裸数字。 */
	--z-tabbar:      90;
	--z-buybar:      95;
	--z-subbar:      98;
	--z-header:      100;
	--z-header-pop:  110;
	--z-overlay:     120;
	--z-modal:       1000;
	--z-modal-top:   2000;
	--z-modal-veil:  2100;
	--z-max:         9999;

	/* ---------- 字体 ---------- */
	--font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", "Source Han Sans CN", "Noto Sans CJK SC", "WenQuanYi Micro Hei", system-ui, sans-serif;
	--font-mono: "JetBrains Mono", "Sarasa Mono SC", "Fira Code", "SFMono-Regular", Menlo, Consolas, "Courier New", monospace;
}

/* ============================================================
   暗色模式 (随系统 / 手动切换)
   ============================================================ */

[data-theme="dark"] {
	color-scheme: dark;

	--brand:       #9882ff;
	--brand-50:    rgba(108, 77, 255, 0.14);
	--brand-100:   rgba(108, 77, 255, 0.22);
	--brand-200:   rgba(154, 125, 255, 0.32);
	--brand-400:   #a991ff;
	--brand-600:   #6d4dff;
	--brand-700:   #5b39e6;

	--brand-solid: #6d4dff;  /* 续54：白字实心背景暗色亦用 #6d4dff(白字 5.05)，不用提亮后的 --brand(#9882ff 白字仅 3.56) */
	/* 主按钮实心底：暗色作文字的 --brand 提亮为 #9882ff（作文字 4.72，白字仅 3.56:1），实心底改指 --brand-600(#6d4dff，白字 5.05)。 */
	--btn-primary-bg:   var(--brand-600);
	--btn-primary-bg-h: var(--brand-700);

	--accent:      #ff9466;
	--accent-50:   rgba(255, 138, 76, 0.14);
	--accent-strong: #ff8a4c;
	--accent-solid: #c2410c;  /* 白字实心橙底（暗色同值：白字 5.19 AA，见亮色块注释） */

	--ink-0: #f5f5fa;
	--ink-1: #d8d8e0;
	--ink-2: #a5a5b8;
	--ink-3: #8c8c9e;  /* ≥4.5:1 on 暗底 #1c1c2a/#131320/#25253a（次级文字达 AA） */
	--ink-4: #9696a8;  /* ≥4.5:1 on 暗底（暗色弱文字达 AA；续54 从 #7e7e94≈3.x 提亮以满足 AA） */

	--bg-0: #1c1c2a;
	--bg-1: #131320;
	--bg-2: #25253a;
	--bg-3: #32324a;

	--line:        #2c2c40;
	--line-strong: #3a3a52;
	--field-border: #6b6b8a;  /* 表单控件边框：暗色提亮到 ≥3:1（WCAG 1.4.11 非文本对比），比分隔线 line-strong 更显 */

	--success:     #34d399;
	--success-50:  rgba(52, 211, 153, 0.14);
	--warning:     #fbbf24;
	--warning-50:  rgba(251, 191, 36, 0.14);
	--danger:      #f87171;
	--danger-50:   rgba(248, 113, 113, 0.14);
	--info:        #60a5fa;
	--info-50:     rgba(96, 165, 250, 0.14);

	--gold:        #fbbf24;  /* 暗色提亮，与 warning 同色，可读性优先 */
	--price:       #ff9466;  /* 暗色价格橙（亮橙 on 暗底 ≈7.8:1） */
	--rank-silver: #aab2c0;  /* 暗色提亮（on 暗底可读） */
	--rank-bronze: #d3a06a;  /* 暗色提亮（on 暗底可读） */
	--warning-strong: #fbbf24;  /* 暗色：浅底为暗色半透明，亮色文字即达标 */
	--success-strong: #34d399;
	--danger-strong:  #f87171;  /* 暗色：亮红 on 暗底即达标 */
	--info-strong:    #60a5fa;
	--success-solid:  #15803d;  /* 白字实心绿底（暗色同值：白字 5.01 AA，见亮色块注释） */
	--warning-solid:  #b45309;  /* 白字实心警示橙底（暗色同值：白字 5.03 AA，见亮色块注释） */

	--sh-1: 0 1px 2px rgba(0, 0, 0, 0.30);
	--sh-2: 0 4px 12px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.30);
	--sh-3: 0 12px 32px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.40);
}

/* 跟随系统 (用户尚未点切换前) */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]):not([data-theme="dark"]) {
		color-scheme: dark;
		--brand:       #9882ff;
		--brand-50:    rgba(108, 77, 255, 0.14);
		--brand-100:   rgba(108, 77, 255, 0.22);
		--brand-200:   rgba(154, 125, 255, 0.32);
		--brand-400:   #a991ff;
		--brand-600:   #6d4dff;
		--brand-700:   #5b39e6;
		--brand-solid: #6d4dff;   /* 续54：白字实心背景，同 [data-theme=dark] */
		--btn-primary-bg:   var(--brand-600);   /* 同 [data-theme=dark]：实心底用 #6d4dff(白字 5.05)，非作文字的 --brand #9882ff */
		--btn-primary-bg-h: var(--brand-700);
		--accent:      #ff9466;
		--accent-50:   rgba(255, 138, 76, 0.14);
		--accent-strong: #ff8a4c;
		--ink-0: #f5f5fa;
		--ink-1: #d8d8e0;
		--ink-2: #a5a5b8;
		--ink-3: #8c8c9e;  /* 与 [data-theme=dark] 同步（原 #7c7c8e≈4.11:1<AA；系统暗色无切换的访客曾命中欠对比旧值） */
		--ink-4: #9696a8;  /* 与 [data-theme=dark] 同步（续54 提亮达 AA；此块曾漏同步停在 #7e7e94≈4.24:1<AA） */
		--bg-0: #1c1c2a;
		--bg-1: #131320;
		--bg-2: #25253a;
		--bg-3: #32324a;
		--line:        #2c2c40;
		--line-strong: #3a3a52;
		--field-border: #6b6b8a;  /* 同 [data-theme=dark]：表单控件边框 ≥3:1 */
		--success:     #34d399;
		--success-50:  rgba(52, 211, 153, 0.14);
		--warning:     #fbbf24;
		--warning-50:  rgba(251, 191, 36, 0.14);
		--danger:      #f87171;
		--danger-50:   rgba(248, 113, 113, 0.14);
		--info:        #60a5fa;
		--info-50:     rgba(96, 165, 250, 0.14);
		--gold:        #fbbf24;
		--price:       #ff9466;
		--rank-silver: #aab2c0;
		--rank-bronze: #d3a06a;
		--warning-strong: #fbbf24;
		--success-strong: #34d399;
		--danger-strong:  #f87171;
		--info-strong:    #60a5fa;
		--sh-1: 0 1px 2px rgba(0, 0, 0, 0.30);
		--sh-2: 0 4px 12px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.30);
		--sh-3: 0 12px 32px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.40);
	}
}

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
	:root {
		--dur-1: 0ms;
		--dur-2: 0ms;
	}
	* { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ============================================================
   组件级内联 CSS 变量(documented inline convention)

   以下变量**不是全局 token**,而是组件作用域(per-element)变量,
   由 PHP 模板用 data-attribute + style="--xxx: ..." 注入,只在
   单个组件子树生效。命名沿用 `--b-*` 前缀以与 token (`--brand` /
   `--ink` / `--bg` 等) 视觉区分。

   清单:
     --b-cat-grad     | 8 大类身份渐变       | section-hero.php
                                              .b-hero__cat
     --b-cat-shadow   | 8 大类身份阴影色     | section-hero.php
   〔垃圾代码排查批〕--b-kind-grad/--b-kind-shadow 已随首页 4 张入口卡
   (.b-kind-card,早已无发射点)一并删除;8 大类板块 section-categories.php
   也已删(续23 起由 Hero 左栏分类导航承担),消费方=上表 hero 分类条。

   设计意图:
     1. 8 大类的渐变是**身份色**(category identity)
        — 与品牌色协调但不参与 light/dark 翻色,确保视觉识别一致。
     2. 用组件级变量而不是 utility class,是为了让 PHP 数据源(分类色谱)
        单一来源(see inc/category-fallback.php::bumian_theme_main_categories())。
     3. CSS 中 fallback 值见各处 var(--b-*-grad, ...) 第二参数。

   红线:
     - **禁止** 在新页面再 fork `--b-*-grad` 这类身份变量;复用现有 data-attr 模式
     - **禁止** 把这类身份变量提升到 :root 全局(它们就该是组件级)
     - 新页面如需中性渐变,用 token 组合,例 `linear-gradient(135deg, var(--brand), var(--brand-600))`

   详情见:CODEGEN-GUARDRAILS.md § 2.2
   ============================================================ */
