lab()函数在所有主流浏览器中均不支持，声明会被静默丢弃且无法触发fallback；真正可用的是lch()，自Chrome 111+、Safari 16.4+、Firefox 117+起支持，但需严格带单位（L和C后跟%，H后跟deg），并前置rgb()/hsl()降级声明以确保兼容。
lab() 函数在所有主流浏览器中都不支持，写上去就等于没写——Chrome 已移除实验 flag，Firefox 和 Safari 完全未实现，声明会被静默丢弃，连 fallback 机制都触发不了。
为什么var(--c, #000)也救不了lab()
var() 的第二个参数只在变量未定义或语法非法时生效；而 lab(50% 20 10) 是合法语法（规范存在），只是没实现。所以即使你写了 --c: lab(50% 20 10);，旧浏览器会跳过整条声明，导致 var(--c) 根本读不到变量，最终回退到继承色或透明。
- Chrome ≥111、Safari ≥16.4、Firefox ≥117 支持
lch()，它是唯一可用的 Lab 衍生方案 -
lch()必须带单位：l和c后跟%，h后跟deg（写成240而非240deg就会失效） - Figma 输出的 LCH 基于 D50 白点，CSS 使用 D65，青绿色相可能偏移 3–5°，得用 DevTools 拾色器实测确认
必须把 fallback 写在 @supports 外部且顺序固定
CSS 是从上到下解析的，旧浏览器遇到不识别的值（如 lch(60% 70 240deg)）会跳过整条声明，但会继续读下一条——前提是那条是独立、未被包裹的普通声明。
- ✅ 正确写法：
background-color: rgb(74, 111, 165);→ 然后写@supports (color: lch(0% 0 0deg)) { background-color: lch(60% 70 240deg); } - ❌ 错误写法：把
@supports块放前面，fallback 放后面；部分 Chrome 111 之前版本和 WebView 会忽略后续同名属性 - ⚠️ 即使用了
@supports，IE11 和旧 Safari 会整块忽略该规则，但外部 fallback 行仍能生效——前提是它没被包裹
别拿 rgb() 或 hsl() 当语义 fallback
lch() 的设计目标是感知均匀性，而 rgb() 和 hsl() 不是。同一组数值在不同亮度下，人眼对色度变化的敏感度差异极大，直接替换会导致视觉偏差明显。
立即学习“前端免费学习笔记（深入）”；
- 如果原色带 alpha，fallback 必须用
rgba()，不能用 hex；例如rgba(74, 111, 165, 0.9) -
color-mix(in lch, ...)依赖lch()输入，混用rgb()会导致整条声明失效 - 真正难的不是写对语法，而是整个交付链路（设计稿、开发工具、显示器校准）都跑在 sRGB 上，却指望 LCH 值自动跨设备保真——它只优化计算过程，不解决底层色彩管理断层
