/* ============================================================ 风青云 · 共享设计令牌（水墨宣纸体系） fengqingyun.top —— portal / zhenti / english / tongji / chat 唯一色板来源用法：在各 app 自己的 styles.css **之后** 引入本文件，并在上标注 data-fqy-app=""。本文件末尾的别名层把各 app 历史令牌名指向下面的 --fqy-* 规范值，因此各 app 现存 CSS 规则一行都不用改。命名空间说明：一律用 --fqy-* 前缀。历史上 --accent 在 portal/zhenti 指松绿、在 chat 却指朱砂红（同名反义），所以共享层不能复用裸名。规范值取自 portal/zhenti/chat 三者一致的既有色板（未做任何调色）， english 与 tongji 的漂移值被收敛到此规范。 ============================================================ */ :root { color-scheme: light; /* ── 底：宣纸 ── */ --fqy-bg: #f1ede1; --fqy-bg-a: #f4f0e5; --fqy-bg-b: #ece7d8; /* ── 面：纸与面板 ── */ --fqy-panel: #faf8f0; --fqy-panel-2: #f3efe3; --fqy-paper: #fbf9f1; /* ── 墨：文字三级 ── */ --fqy-ink: #232b24; --fqy-ink-soft: #5a6258; --fqy-ink-faint: #717a6f; /* ── 松绿：主色（交互主态） ── */ --fqy-accent: #2f5d4e; --fqy-accent-2: #47816d; --fqy-accent-soft: #e2eae2; --fqy-on-accent: #fbf9f1; /* ── 朱砂：印章 / 强调 / 危险 ── */ --fqy-seal: #b03d30; --fqy-seal-2: #c2503f; /* 提亮变体：hover 等次级状态 */ --fqy-seal-soft: #f3e1dc; /* ── 实底墨绿面板：明暗两态都不翻浅（english 的品牌面板语义） ── */ --fqy-ink-panel: #14342b; --fqy-ink-panel-2: #1f4d3d; --fqy-on-ink-panel: #f6efe0; /* 标题色：亮色下为墨绿，暗色下转暖白 */ --fqy-heading: #14342b; --fqy-heading-2: #1f4d3d; /* ── 辅助色 ── */ --fqy-gold: #97803f; --fqy-gold-soft: rgba(151, 128, 63, 0.3); --fqy-blue: #305f8d; --fqy-blue-soft: #e0e8f1; --fqy-amber: #a76418; --fqy-amber-soft: #f1e6d4; /* ── 语义反馈 ── */ --fqy-good: #2f7d52; --fqy-warn: #946615; --fqy-bad: #b03d30; /* ── 描边 ── */ --fqy-line: #ddd6c4; --fqy-line-soft: #e8e2d2; --fqy-line-strong: #c8bfa6; /* ── 阴影 ── */ --fqy-shadow-sm: 0 1px 3px rgba(60, 46, 20, 0.07); --fqy-shadow-card: 0 16px 38px -20px rgba(44, 58, 48, 0.5); --fqy-shadow-pop: 0 34px 80px -30px rgba(30, 42, 34, 0.6); /* ── 形与律 ── */ --fqy-radius: 14px; --fqy-radius-sm: 8px; --fqy-ease: cubic-bezier(0.22, 1, 0.36, 1); --fqy-ease-soft: cubic-bezier(0.4, 0.14, 0.3, 1); --fqy-font-brush: "STKaiti", "KaiTi", "楷体", "FangSong", "仿宋", "Noto Serif CJK SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", "宋体", serif; } /* ============================================================ 夜：墨黑（暖调，非冷灰） ============================================================ */ :root[data-theme="dark"] { color-scheme: dark; --fqy-bg: #0d1311; --fqy-bg-a: #101715; --fqy-bg-b: #0a0f0d; --fqy-panel: #161f1b; --fqy-panel-2: #121a16; --fqy-paper: #18221d; --fqy-ink: #e6e4d6; --fqy-ink-soft: #a4ab9e; --fqy-ink-faint: #8b9183; --fqy-accent: #5d9c85; --fqy-accent-2: #79b39c; --fqy-accent-soft: #1c2b25; --fqy-on-accent: #0d1311; --fqy-seal: #c9564a; --fqy-seal-2: #e0917f; --fqy-seal-soft: #34201c; /* 暗底上仍是墨绿实面板，只提亮一档以浮于近黑 */ --fqy-ink-panel: #1c4536; --fqy-ink-panel-2: #14352a; --fqy-on-ink-panel: #f3ecdd; --fqy-heading: #e9dfc8; --fqy-heading-2: #cdbf9c; --fqy-gold: #b39a5a; --fqy-gold-soft: rgba(179, 154, 90, 0.3); --fqy-blue: #6ea0d0; --fqy-blue-soft: #1b2733; --fqy-amber: #c79a52; --fqy-amber-soft: #2c2417; --fqy-good: #57a87b; --fqy-warn: #c79a52; --fqy-bad: #c9564a; --fqy-line: #27332c; --fqy-line-soft: #1d2722; --fqy-line-strong: #3a4a40; --fqy-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4); --fqy-shadow-card: 0 18px 46px -22px rgba(0, 0, 0, 0.85); --fqy-shadow-pop: 0 40px 90px -30px rgba(0, 0, 0, 0.9); } /* ============================================================ 别名层：历史令牌名 → 规范值特异度设计（每个别名块都带 4 个选择器，缺一不可）： html[data-fqy-app=".."] (0,1,1) 压过 app 的 :root (0,1,0) html[data-fqy-app=".."][data-theme="dark"] (0,2,1) 压过 :root[data-theme="dark"] (0,2,0) ↑ 上面两条再各配一个 " body" 后代变体： theme.js 会把 data-theme 同时打在与上（zhenti 的暗色规则挂在 body 上，必须如此）。于是 english 这类写成裸 [data-theme="dark"] 的令牌块也会命中，在 body 层把令牌重新设回 app 自己的旧值，盖掉从 html 继承下来的规范值。加上 body 变体后特异度为 (0,1,2)/(0,2,2)，才能真正保证共享层在两态、两层都是唯一权威。声明体四者完全相同（都指向会自动翻转的 --fqy-*）。 ============================================================ */ /* ── portal（首页）──────────────────────────────────────── */ html[data-fqy-app="portal"], html[data-fqy-app="portal"] body, html[data-fqy-app="portal"][data-theme="dark"], html[data-fqy-app="portal"][data-theme="dark"] body { --bg: var(--fqy-bg); --bg-grad-a: var(--fqy-bg-a); --bg-grad-b: var(--fqy-bg-b); --panel: var(--fqy-panel); --panel-2: var(--fqy-panel-2); --paper: var(--fqy-paper); --ink: var(--fqy-ink); --ink-soft: var(--fqy-ink-soft); --ink-faint: var(--fqy-ink-faint); --accent: var(--fqy-accent); --accent-2: var(--fqy-accent-2); --accent-soft: var(--fqy-accent-soft); --on-accent: var(--fqy-on-accent); --seal: var(--fqy-seal); --seal-soft: var(--fqy-seal-soft); --gold: var(--fqy-gold); --blue: var(--fqy-blue); --blue-soft: var(--fqy-blue-soft); --amber: var(--fqy-amber); --amber-soft: var(--fqy-amber-soft); --good: var(--fqy-good); --warn: var(--fqy-warn); --bad: var(--fqy-bad); --line: var(--fqy-line); --line-soft: var(--fqy-line-soft); --shadow-card: var(--fqy-shadow-card); --shadow-pop: var(--fqy-shadow-pop); --radius: var(--fqy-radius); --ease: var(--fqy-ease); --font-brush: var(--fqy-font-brush); } /* ── zhenti（数学真题长卷）──────────────────────────────── */ html[data-fqy-app="zhenti"], html[data-fqy-app="zhenti"] body, html[data-fqy-app="zhenti"][data-theme="dark"], html[data-fqy-app="zhenti"][data-theme="dark"] body { --bg: var(--fqy-bg); --bg-grad-a: var(--fqy-bg-a); --bg-grad-b: var(--fqy-bg-b); --panel: var(--fqy-panel); --panel-2: var(--fqy-panel-2); --paper: var(--fqy-paper); --rice: var(--fqy-paper); --ink: var(--fqy-ink); --ink-soft: var(--fqy-ink-soft); --ink-faint: var(--fqy-ink-faint); --accent: var(--fqy-accent); --accent-2: var(--fqy-accent-2); --accent-soft: var(--fqy-accent-soft); --on-accent: var(--fqy-on-accent); --seal: var(--fqy-seal); --seal-soft: var(--fqy-seal-soft); --gold: var(--fqy-gold); --good: var(--fqy-good); --warn: var(--fqy-warn); --bad: var(--fqy-bad); --line: var(--fqy-line); --line-soft: var(--fqy-line-soft); --shadow-card: var(--fqy-shadow-card); --shadow-pop: var(--fqy-shadow-pop); --radius: var(--fqy-radius); --ease: var(--fqy-ease); --ease-soft: var(--fqy-ease-soft); --font-brush: var(--fqy-font-brush); } /* 卷杆漆色：亮色深墨、暗色需提亮，否则与近黑底糊在一起 */ html[data-fqy-app="zhenti"] { --rod: #2c3530; } html[data-fqy-app="zhenti"][data-theme="dark"], html[data-fqy-app="zhenti"][data-theme="dark"] body { --rod: #46564d; } /* ── english（考研英语真题）─────────────────────────────── */ html[data-fqy-app="english"], html[data-fqy-app="english"] body, html[data-fqy-app="english"][data-theme="dark"], html[data-fqy-app="english"][data-theme="dark"] body { --paper: var(--fqy-paper); --paper-2: var(--fqy-panel-2); --surface: var(--fqy-panel); --surface-2: var(--fqy-panel-2); --ink: var(--fqy-ink); --ink-soft: var(--fqy-ink-soft); --ink-faint: var(--fqy-ink-faint); /* 标题绿 → 规范标题色（暗色自动转暖白） */ --ivy: var(--fqy-heading); --ivy-2: var(--fqy-heading-2); /* 品牌实底面板：明暗都不翻浅 */ --brand: var(--fqy-ink-panel); --brand-2: var(--fqy-ink-panel-2); --on-brand: var(--fqy-on-ink-panel); /* 牛血红 → 规范朱砂（-2 是提亮变体，用于 hover；不可指向主色绿） */ --oxblood: var(--fqy-seal); --oxblood-2: var(--fqy-seal-2); --gold: var(--fqy-gold); --gold-soft: var(--fqy-gold-soft); --line: var(--fqy-line); --line-soft: var(--fqy-line-soft); --ok: var(--fqy-good); --warn: var(--fqy-warn); --shadow-sm: var(--fqy-shadow-sm); --shadow-md: var(--fqy-shadow-card); --shadow-lg: var(--fqy-shadow-pop); --radius: var(--fqy-radius); --radius-sm: var(--fqy-radius-sm); } /* ── tongji（泛 432 应用统计真题墙）────────────────────── */ html[data-fqy-app="tongji"], html[data-fqy-app="tongji"] body, html[data-fqy-app="tongji"][data-theme="dark"], html[data-fqy-app="tongji"][data-theme="dark"] body { --paper: var(--fqy-bg); --paper-2: var(--fqy-paper); --ink: var(--fqy-ink); --muted: var(--fqy-ink-soft); --line: var(--fqy-line); --green: var(--fqy-accent); --green-2: var(--fqy-accent-2); --red: var(--fqy-seal); --gold: var(--fqy-gold); --shadow: var(--fqy-shadow-card); /* 以下为本次新增：原 CSS 中硬编码色值令牌化后的落点 */ --panel: var(--fqy-panel); --panel-2: var(--fqy-panel-2); --accent-soft: var(--fqy-accent-soft); --seal-soft: var(--fqy-seal-soft); --on-accent: var(--fqy-on-accent); --ink-faint: var(--fqy-ink-faint); --line-soft: var(--fqy-line-soft); } /* ── chat（AI 答疑）────────────────────────────────────── */ html[data-fqy-app="chat"], html[data-fqy-app="chat"] body, html[data-fqy-app="chat"][data-theme="dark"], html[data-fqy-app="chat"][data-theme="dark"] body { --bg: var(--fqy-bg); --panel: var(--fqy-panel); --panel-2: var(--fqy-panel-2); --button-bg: var(--fqy-paper); --line: var(--fqy-line); --line-strong: var(--fqy-line-strong); --text: var(--fqy-ink); --muted: var(--fqy-ink-soft); --soft: var(--fqy-line-soft); --brand: var(--fqy-accent); --brand-soft: var(--fqy-accent-soft); /* 注意：chat 的 --accent 语义是朱砂红，不是主色绿 */ --accent: var(--fqy-seal); --danger: var(--fqy-bad); --danger-soft: var(--fqy-seal-soft); --warn-soft: var(--fqy-amber-soft); --shadow: var(--fqy-shadow-card); --ease-out: var(--fqy-ease); --font-brush: var(--fqy-font-brush); } /* 空态头像与背景光晕原为蓝紫渐变，与全站水墨调不符，收敛为松绿/朱砂 */ html[data-fqy-app="chat"], html[data-fqy-app="chat"] body, html[data-fqy-app="chat"][data-theme="dark"], html[data-fqy-app="chat"][data-theme="dark"] body { --brand-glow: color-mix(in srgb, var(--fqy-accent) 24%, transparent); }