diff --git a/web/navi.css b/web/navi.css
index 21e6826..8178557 100644
--- a/web/navi.css
+++ b/web/navi.css
@@ -1492,3 +1492,133 @@ html.navi-dark body .navi-dock a {
   color: #cbd5e1 !important;
   border-color: rgba(148, 163, 184, 0.22) !important;
 }
+
+/* ── 深色视觉收口（真实浏览器截图 + computed style 验证）──
+   主题变量不足以覆盖前文带 !important 的亮色规则，因此按真实 Dashy DOM
+   补齐标题、分组、卡片和浮动控件。布局容器必须透明，只有圆形按钮本身着色。 */
+html.navi-dark body.navi-dark {
+  background: #080f1e !important;
+  color: #e8eefc !important;
+}
+
+/* 顶部标题栏 */
+html.navi-dark body #dashy > header {
+  background: rgba(15, 23, 42, .82) !important;
+  border-bottom-color: rgba(148, 163, 184, .18) !important;
+  box-shadow: 0 8px 28px rgba(0, 0, 0, .28) !important;
+}
+html.navi-dark body.navi-dark #dashy > header .page-titles h1,
+html.navi-dark body.navi-dark #dashy > header .page-titles .text,
+html.navi-dark body.navi-dark .minimal-home .title-and-search h1 {
+  color: #f1f5f9 !important;
+}
+html.navi-dark body.navi-dark #dashy > header .page-titles .subtitle {
+  color: #a9b8cd !important;
+}
+
+/* 分组玻璃面板及标题 */
+html.navi-dark body div.collapsable,
+html.navi-dark body .minimal-section-inner {
+  background: rgba(25, 36, 55, .80) !important;
+  border-color: rgba(148, 163, 184, .20) !important;
+  box-shadow: 0 14px 34px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
+}
+html.navi-dark body.navi-dark div.collapsable .section-header,
+html.navi-dark body.navi-dark div.collapsable .section-header h3,
+html.navi-dark body.navi-dark div.collapsable .section-header h3 *,
+html.navi-dark body .minimal-headings-row .headings,
+html.navi-dark body .minimal-headings-row .headings * {
+  color: #dce6f5 !important;
+}
+html.navi-dark body div.collapsable .collapse-icon,
+html.navi-dark body div.collapsable .section-icon,
+html.navi-dark body div.collapsable .action-buttons,
+html.navi-dark body div.collapsable .action-buttons * {
+  color: #7f91aa !important;
+}
+
+/* 导航卡片及全部文字 */
+html.navi-dark body a.item {
+  background: rgba(43, 57, 79, .84) !important;
+  border-color: rgba(148, 163, 184, .23) !important;
+  box-shadow: 0 7px 20px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
+  color: #e8eefc !important;
+}
+html.navi-dark body a.item:hover,
+html.navi-dark body a.item:focus-visible {
+  background: rgba(55, 72, 98, .90) !important;
+  border-color: rgba(96, 165, 250, .48) !important;
+}
+html.navi-dark body.navi-dark a.item .tile-title,
+html.navi-dark body.navi-dark a.item .tile-title .text,
+html.navi-dark body.navi-dark a.item .item-title,
+html.navi-dark body.navi-dark a.item .item-title * {
+  color: #f1f5f9 !important;
+}
+html.navi-dark body.navi-dark a.item .description,
+html.navi-dark body.navi-dark a.item .item-url,
+html.navi-dark body.navi-dark a.item .tile-subtitle {
+  color: #a9b8cd !important;
+}
+
+/* 右侧方块的根因：dock / view-switch 是布局容器，绝不能绘制背景。 */
+html.navi-dark body.navi-dark .navi-dock,
+html.navi-dark body.navi-dark .navi-view-switch,
+html.navi-dark body.navi-dark .navi-footer-host {
+  background: transparent !important;
+  background-color: transparent !important;
+  border: 0 !important;
+  box-shadow: none !important;
+}
+html.navi-dark body .navi-admin-entry,
+html.navi-dark body .navi-view-toggle,
+html.navi-dark body .navi-search-bar {
+  background: rgba(20, 31, 49, .94) !important;
+  border-color: rgba(148, 163, 184, .30) !important;
+  color: #dbeafe !important;
+  box-shadow: 0 12px 30px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
+}
+html.navi-dark body .navi-admin-entry:hover,
+html.navi-dark body .navi-view-toggle:hover,
+html.navi-dark body .navi-search-bar:hover {
+  background: rgba(31, 46, 70, .97) !important;
+}
+html.navi-dark body .navi-admin-entry svg,
+html.navi-dark body .navi-view-toggle svg,
+html.navi-dark body .navi-search-toggle,
+html.navi-dark body .navi-search-toggle svg {
+  color: #dbeafe !important;
+  stroke: currentColor !important;
+}
+
+/* 备案号是一个完整的深色胶囊，子元素不再各自形成色块。 */
+html.navi-dark body .navi-footer {
+  background: rgba(20, 31, 49, .90) !important;
+  border-color: rgba(148, 163, 184, .24) !important;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
+  color: #9fb0c8 !important;
+}
+html.navi-dark body .navi-footer *,
+html.navi-dark body .navi-footer a,
+html.navi-dark body .navi-footer .navi-footer-sep {
+  background: transparent !important;
+  color: #9fb0c8 !important;
+}
+html.navi-dark body .navi-footer a:hover { color: #7dd3fc !important; }
+
+/* 极简/工作空间的侧栏、工具条和弹窗也使用同一深色层级。 */
+html.navi-dark body nav.side-bar,
+html.navi-dark body .navi-ws-toolbar,
+html.navi-dark body .navi-ws-notice,
+html.navi-dark body .navi-ws-modal,
+html.navi-dark body .minimal-headings-row .headings {
+  background: rgba(20, 31, 49, .91) !important;
+  border-color: rgba(148, 163, 184, .22) !important;
+  color: #e8eefc !important;
+}
+html.navi-dark body .navi-ws-toolbar *,
+html.navi-dark body .navi-ws-notice-title,
+html.navi-dark body .navi-ws-modal-title,
+html.navi-dark body nav.side-bar .side-bar-item {
+  color: #dce6f5 !important;
+}