/* ============================================================ 学习中心 · 设计令牌 tokens.css v1.1（设计系统组独占写域） ------------------------------------------------------------ · 本文件是全站唯一取色/取距/取字号来源，页面禁止硬编码 hex （代码块固定色 --code-* 也在本文件定义）。 · 主题防闪白：每页最前需内联以下样板（先于任何 CSS）： · 主题切换：改 html.dataset.theme 并写回 localStorage['lc_theme'] （壳组 shell.js 实现，其他组不要自行读写该键）。 · 学科域点缀色：，枚举见文件末尾，组件内一律写 var(--dm)，不挂时回落品牌蓝。 ============================================================ */ :root{ color-scheme: light; /* ---- 背景与表面（3 级）---- */ --bg:#f4f2ec; /* 页面底：暖纸 */ --surface:#fffdf8; /* 一级表面：卡片/面板 */ --surface-2:#f8f5ee; /* 二级表面：嵌套块/公式底 */ --surface-3:#edeade; /* 三级表面：输入框底/进度轨道 */ /* ---- 文字（3 级 + 反白）---- */ --text-1:#26231d; /* 标题/强调，对 surface ≈ 15:1 */ --text-2:#4f4b41; /* 正文，≈ 8.6:1（对 --bg 亦 ≥7:1）*/ --text-3:#6f695b; /* 辅助/时间戳，对 surface ≈ 5.4:1、对 bg ≈ 4.9:1 */ --text-inverse:#f8f6f0; --on-solid:#ffffff; /* 实心色块（ok/warn/bad/dm 按钮）上的文字 */ /* ---- 边框 ---- */ --line:#e7e2d5; --line-strong:#d5cfbf; /* ---- 品牌色 ---- */ --brand:#2f5da8; /* 主交互：链接/按钮/选中态 */ --brand-ink:#1b365d; /* 深墨蓝：大标题强调 */ --brand-soft:#e7edf8; /* 品牌淡底：选中背景/标签 */ --accent:#0c7d71; /* 青瓷：次级强调（白字/作正文均 ≥4.9:1）*/ --accent-soft:#e0f2ee; --ochre:#b5562e; /* 赭石：讲义/重点 */ --ochre-soft:#f6e8df; /* ---- 语义色 ---- */ --ok:#1a8046; --ok-soft:#e0f2e6; /* 记住/正确（配白字 ≈5.0:1）*/ --warn:#a85812; --warn-soft:#faecda; /* 模糊/需复习（配白字 ≈5.2:1）*/ --bad:#c2402a; --bad-soft:#f9e5e0; /* 忘了/错误 */ --mark-bg:#f7e6b3; --mark-ink:#7a5410; /* 搜索命中/划重点 */ /* ---- 热力图 5 级 ---- */ --heat-0:#eceadf; --heat-1:#c9d8ef; --heat-2:#93b4e0; --heat-3:#4f7ec2; --heat-4:#1b365d; /* ---- 阴影（暖褐基，三层：接触影+投影+环境影，升级令 A1）---- */ --shadow-1:0 1px 1px rgba(58,48,30,.05), 0 2px 4px rgba(58,48,30,.05), 0 4px 12px rgba(58,48,30,.04); --shadow-2:0 1px 2px rgba(58,48,30,.06), 0 5px 12px rgba(58,48,30,.06), 0 16px 32px rgba(58,48,30,.08); --shadow-3:0 2px 4px rgba(58,48,30,.08), 0 12px 24px rgba(58,48,30,.10), 0 32px 64px rgba(58,48,30,.14); /* 卡片顶缘受光高光（A2）：浅色=纸面受光，深色=Linear 式边缘提亮替代阴影分层 */ --edge-top:inset 0 1px 0 rgba(255,255,255,.55); /* ---- 圆角 ---- */ --r-xs:6px; --r-sm:9px; --r-md:12px; --r-lg:16px; --r-xl:22px; --r-full:999px; /* ---- 间距梯度（4px 基）---- */ --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-7:32px; --sp-8:40px; --sp-9:56px; --sp-10:72px; /* ---- 字号梯度 ---- */ --fs-xs:12px; /* 徽标/时间戳 */ --fs-sm:13px; /* 辅助文字/导航 */ --fs-base:14.5px; /* UI 默认 */ --fs-md:15.5px; /* 卡片正文 */ --fs-read:16.5px; /* 讲义长文正文 */ --fs-lg:18px; /* 小标题 */ --fs-xl:20px; /* 卡片标题 */ --fs-2xl:24px; /* 页内标题 */ --fs-3xl:28px; /* 页标题 */ --fs-4xl:34px; /* 仪表盘大数字 */ --lh-ui:1.6; --lh-read:1.9; /* ---- 字体（零外部字体文件，系统栈）---- */ --font-sans:system-ui,-apple-system,"PingFang SC","HarmonyOS Sans SC", "Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC",sans-serif; --font-serif:"Source Han Serif SC","Noto Serif CJK SC","Songti SC","STSong",Georgia,serif; --font-mono:ui-monospace,"SF Mono","JetBrains Mono","Cascadia Code", Consolas,"Sarasa Mono SC",Menlo,monospace; --font-math:"Cambria Math","STIX Two Math","Latin Modern Math", "Times New Roman",Georgia,serif; /* 手写公式块用 */ --font-display:var(--font-serif); /* 衬线大标题（升级令 A4）：只许 ≥24px 层级 */ /* ---- 代码块固定色（双主题相同，编辑器质感）---- --code-bar 预留给带工具条的代码块变体；--ochre-soft/--text-inverse/ --z-modal 为弹层与反白场景预留，未引用勿删。 */ --code-bg:#13151b; --code-bar:#1b1e27; --code-ink:#d8e0ef; --code-line:#2a2f3c; --code-muted:#8b96a8; /* ---- 动效 ---- */ --t-fast:.12s; --t-base:.2s; --t-slow:.32s; --t-flip:.48s; --ease:cubic-bezier(.2,.6,.2,1); /* 标准 */ --ease-out:cubic-bezier(.16,.84,.3,1); /* 入场/抽屉 */ --ease-flip:cubic-bezier(.4,.2,.2,1); /* 翻卡 */ --ease-spring:cubic-bezier(.34,1.28,.44,1); /* 小弹性 */ /* ---- 层级 ---- */ --z-topbar:50; --z-sidebar:60; --z-chat:70; --z-modal:80; --z-toast:90; /* ---- 噪点纹理（升级令 A3）：feTurbulence data-URI，压 mesh 渐变的塑料感。浅色=黑噪点 5%；只许 hero/页头/空状态一屏一处，禁全站铺底、禁正文阅读区 ---- */ --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); /* ---- 学科域点缀色（缺省=品牌蓝）---- */ --dm:var(--brand); } /* ============ 深色：暖炭 ============ */ html[data-theme="dark"]{ color-scheme: dark; --bg:#14161b; --surface:#1c1f26; --surface-2:#232732; --surface-3:#2b303c; --text-1:#e9e7e0; /* 对 surface ≈ 13:1 */ --text-2:#b9b6ac; /* ≈ 8.1:1 */ --text-3:#8f8a7e; /* ≈ 4.8:1 */ --text-inverse:#1b1e24; --on-solid:#16181d; /* 深色主题语义色被提亮，实心块上用深字 */ --line:#2d313c; --line-strong:#3c4150; --brand:#8aabec; --brand-ink:#b9cdf3; --brand-soft:#26324a; --accent:#43c3ad; --accent-soft:#1d3833; --ochre:#e0885a; --ochre-soft:#3a2a20; --ok:#4cc788; --ok-soft:#1e3a2b; --warn:#eda75e; --warn-soft:#3d2f1c; --bad:#ef8070; --bad-soft:#41231e; --mark-bg:#4a3c17; --mark-ink:#ffd47a; --heat-0:#252a33; --heat-1:#2c3d5c; --heat-2:#37568b; --heat-3:#4f7ec2; --heat-4:#8fb4ee; /* 深色档阴影特意不三层化（黑底三层黑影糊成一团，分层靠 --edge-top）*/ --shadow-1:0 1px 2px rgba(0,0,0,.28), 0 1px 3px rgba(0,0,0,.22); --shadow-2:0 2px 8px rgba(0,0,0,.32), 0 10px 26px rgba(0,0,0,.30); --shadow-3:0 12px 40px rgba(0,0,0,.5); --edge-top:inset 0 1px 0 rgba(255,255,255,.05); /* 深色=白噪点 4%（黑噪点在深底不可见）*/ --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.04 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } /* ============ 学科域 accent（枚举=契约 §3.1 domain）============ 用法：；组件内取 var(--dm)。 --dm 做正文文字色时只许 ≥13px 加粗；小字辅助信息用 --text-3。 */ body[data-domain="device-physics"] { --dm:#2f5da8; } /* 靛青 */ body[data-domain="memory-tech"] { --dm:#5b5bc0; } /* 蓝紫 */ body[data-domain="ferro-fefet"] { --dm:#0d8578; } /* 青瓷 */ body[data-domain="reliability"] { --dm:#a84a6b; } /* 绛红 */ body[data-domain="process-integration"]{ --dm:#b5562e; } /* 赭石 */ body[data-domain="modeling"] { --dm:#3f8352; } /* 松绿 */ body[data-domain="programming"] { --dm:#2e7f9e; } /* 青灰蓝 */ body[data-domain="project-facts"] { --dm:#96742c; } /* 黄铜 */ body[data-domain="job-hunt"] { --dm:#7c5cbf; } /* 紫藤 */ html[data-theme="dark"] body[data-domain="device-physics"] { --dm:#8aabec; } html[data-theme="dark"] body[data-domain="memory-tech"] { --dm:#a3a3f0; } html[data-theme="dark"] body[data-domain="ferro-fefet"] { --dm:#43c3ad; } html[data-theme="dark"] body[data-domain="reliability"] { --dm:#e295b3; } html[data-theme="dark"] body[data-domain="process-integration"]{ --dm:#e0885a; } html[data-theme="dark"] body[data-domain="modeling"] { --dm:#7cc79a; } html[data-theme="dark"] body[data-domain="programming"] { --dm:#6fc0dd; } html[data-theme="dark"] body[data-domain="project-facts"] { --dm:#d4b165; } html[data-theme="dark"] body[data-domain="job-hunt"] { --dm:#b39ce8; }