/** * B2 夜间模式 —— 完整样式。 * * 核心的反色规则同时也内联在 里（class-b2dm-frontend.php 的 critical_css()）， * 那份负责「首次绘制前就生效、不闪白」。这里再写一遍是为了： * ① 万一关键样式被缓存插件挪走/合并，仍有兜底； * ② 关键样式里不方便放的东西（滚动条、切换面板、打印）放这儿。 * * 滤镜的**具体取值**只写在 critical_css() 里（PHP 的 filter_value()）， * 通过 CSS 变量 --b2dm-filter / --b2dm-filter-plain 传下来，这里只引用。 * 之所以不在这里硬编码：只要两处差一个字节，媒体还原的二次反色就抵不干净， * 照片会变成底片。变量化之后不可能写歪。 * * ── 反色模型 ────────────────────────────────────────────── * html.b2dm-dark 反色（整页） * ├─ img / video / iframe / 再反一次 → 抵消 → 显示原色（照片不被反成底片） * ├─ .b2dm-media（JS 自动标记的背景图容器）同上 * └─ .b2dm-keep（Logo、单色图标、二维码）不抵消 → 跟着反色 → 暗底上看得见 * * ── 为什么这样能保证「没有看不清的字」 ────────────────────── * 注意：**不能**用「亮度 L 映射成 1−L」来论证。invert 作用在 sRGB 通道值上 * （c → 255−c），而相对亮度是通道值的非线性函数，所以 L(255−c) ≠ 1−L(c)。 * 举例：灰 142 的 L=0.2706，但灰 113（=255−142）的 L=0.1652，并不等于 0.7294。 * * 真实原因是 sRGB 传递函数在暗部更陡：同样的通道差，在暗端换来的亮度差更大。 * 于是「深色字 + 浅色底」反色成「浅色字 + 深色底」后，对比度普遍上升。 * 实测：#8e8e8e 配白底 3.28 → 反色后配黑底 4.30；#bcbcbc 配白底 1.90 → 配黑底 2.12。 * 全站逐节点核对过（dm-audit.mjs），夜间新增低对比度文本为 0。 */ /* ═══════════ ① 核心反色（与关键样式一致，作兜底） ═══════════ */ html.b2dm-dark { /* 取值来自 critical_css()；括号里是「关键样式也丢了」时的最后兜底 */ filter: var(--b2dm-filter, invert(1) hue-rotate(180deg)); color-scheme: light; /* 刻意保持 light：原生控件先渲染成亮色，再被反色成暗色 */ } html.b2dm-dark.b2dm-plain { filter: var(--b2dm-filter-plain, invert(1)); } /* 媒体还原：照片 / 视频 / 嵌入内容 / 带背景图的容器 */ html.b2dm-dark img, html.b2dm-dark video, html.b2dm-dark iframe, html.b2dm-dark canvas, html.b2dm-dark embed, html.b2dm-dark object, html.b2dm-dark .b2dm-media { filter: invert(1) hue-rotate(180deg); } html.b2dm-dark.b2dm-plain img, html.b2dm-dark.b2dm-plain video, html.b2dm-dark.b2dm-plain iframe, html.b2dm-dark.b2dm-plain canvas, html.b2dm-dark.b2dm-plain embed, html.b2dm-dark.b2dm-plain object, html.b2dm-dark.b2dm-plain .b2dm-media { filter: invert(1); } /* * 容器已经抵消过一次，里面的媒体就不用再抵消。 * * 少了这条会「抵消成双倍」：html 反一次 → .b2dm-media 容器抵消一次 → * 容器里的