/* 外观切换。只改站点外壳。
   正文、插图、照片、二维码、地图保持原样：
   黑色线稿和黑色 PNG 仍画在原来的浅底上，不做 invert。
   例外只有单色 Logo：导航在深色时变白，页脚本身就是深色，始终变白。 */

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #333;
    cursor: pointer;
}

.theme-toggle:hover {
    background: rgba(0, 0, 0, 0.05);
}

.theme-toggle:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

.theme-toggle .theme-icon {
    display: none;
    width: 18px;
    height: 18px;
}

html[data-theme-pref="system"] .theme-toggle .theme-icon-system,
html[data-theme-pref="light"] .theme-toggle .theme-icon-light,
html[data-theme-pref="dark"] .theme-toggle .theme-icon-dark {
    display: block;
}

.navbar-theme {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-left: 4px;
}

.site-footer .footer-logo img {
    filter: brightness(0) invert(1);
    opacity: 0.92;
}

html[data-theme="dark"] .top-navbar {
    background: #141b24 !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

html[data-theme="dark"] .logo-text,
html[data-theme="dark"] .menu-link,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .i18n-lang-switcher button {
    color: #e8eef5;
}

html[data-theme="dark"] .top-navbar .logo-img {
    filter: brightness(0) invert(1);
}

html[data-theme="dark"] .menu-link:hover,
html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .logo-link:hover,
html[data-theme="dark"] .i18n-lang-switcher button:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

html[data-theme="dark"] .menu-item.active .menu-link,
html[data-theme="dark"] .menu-item.active .menu-link:hover {
    background: #2563eb;
    color: #fff;
}

html[data-theme="dark"] .hamburger-line,
html[data-theme="dark"] .mobile-menu-toggle:hover .hamburger-line {
    background: #e8eef5;
}

html[data-theme="dark"] .dropdown-submenu {
    background: #1c2633;
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .dropdown-submenu::before {
    background: #1c2633;
    border-left-color: rgba(255, 255, 255, 0.08);
    border-top-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .submenu-link {
    color: #d5dde6;
}

html[data-theme="dark"] .submenu-link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

html[data-theme="dark"] .submenu-divider {
    background: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .submenu-category,
html[data-theme="dark"] .submenu-tag {
    color: #8b98a9;
}

/* 下拉里的位图图标（IPv6 等）是画死的颜色，深色底上垫一块浅色，不反色。 */
html[data-theme="dark"] .dropdown-submenu img,
html[data-theme="dark"] .submenu-tool-icon {
    background: #fff;
    border-radius: 4px;
}

html[data-theme="dark"] .auth-btn-login,
html[data-theme="dark"] .auth-btn-logout,
html[data-theme="dark"] .auth-btn-user {
    color: #e8eef5;
    border-color: rgba(255, 255, 255, 0.22);
    background: transparent;
}

html[data-theme="dark"] .auth-btn-user {
    background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .auth-btn-login:hover,
html[data-theme="dark"] .auth-btn-logout:hover,
html[data-theme="dark"] .auth-btn-user:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.35);
}

html[data-theme="dark"] .auth-btn-register,
html[data-theme="dark"] .auth-btn-register:hover {
    background: #2563eb;
    color: #fff;
}

html[data-theme="dark"] .i18n-dropdown {
    background: #1c2633;
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .i18n-lang-native {
    color: #e8eef5;
}

html[data-theme="dark"] .i18n-lang-en {
    color: #8b98a9;
}

html[data-theme="dark"] .i18n-lang-item:hover,
html[data-theme="dark"] .i18n-lang-item.active {
    background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] #mobileNav {
    background: #141b24 !important;
    border-top-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

html[data-theme="dark"] #mobileNav a {
    color: #b9c4d1 !important;
}

html[data-theme="dark"] #mobileNav a.active {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .mobile-sidebar {
    background: #141b24;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .sidebar-section {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .sidebar-section-title {
    color: #8b98a9;
}

html[data-theme="dark"] .sidebar-link {
    color: #d5dde6;
}

html[data-theme="dark"] .sidebar-link svg {
    color: #9aa8b8;
}

html[data-theme="dark"] .sidebar-link:active,
html[data-theme="dark"] .sidebar-link.active {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

html[data-theme="dark"] .sidebar-link.active svg,
html[data-theme="dark"] .sidebar-link-more,
html[data-theme="dark"] .sidebar-link-more svg {
    color: #8eb6ff !important;
}

.theme-panel {
    display: flex;
    gap: 6px;
    margin: 12px 16px 4px;
    padding: 4px;
    border-radius: 10px;
    background: #f3f5f8;
}

.theme-panel button {
    flex: 1;
    border: 0;
    border-radius: 8px;
    padding: 7px 4px;
    background: transparent;
    color: #5a6b80;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.theme-panel button.is-active {
    background: #fff;
    color: #0f1c2e;
    box-shadow: 0 1px 2px rgba(15, 28, 46, 0.08);
}

html[data-theme="dark"] .theme-panel {
    background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .theme-panel button {
    color: #b9c4d1;
}

html[data-theme="dark"] .theme-panel button.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: none;
}

@media (max-width: 768px) {
    .navbar-theme {
        position: absolute;
        right: 56px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
    }
}

/* 正文。黑色描边图标改跟文字颜色：
   深色底上变浅，仍是白底的卡片里保持深色。
   不改 fill，避免二维码、蒙版和彩色插图被洗掉。 */
html[data-theme="dark"] {
    color-scheme: dark;
    background: #10151c;
}

html[data-theme="dark"] body {
    background-color: #10151c;
}

/* 统一深色：凡是工具页根节点（类名含 -page），一起换字色和常见白底块。
   不逐页维护。微信模拟、屏幕检测、键盘清理保持各自的底色。
   二维码底板保持白色，否则黑模块会消失。 */

html[data-theme="dark"] :is(
    .card, .card-header, .card-body, .card-footer,
    .list-group-item, .modal-content, .dropdown-menu,
    .table, .table-striped tbody tr:nth-of-type(odd),
    .form-control, .custom-select, pre
) {
    background-color: #182230 !important;
    color: #e6edf5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]) {
    background-color: #1a2330;
    color: #e6edf5;
    border-color: rgba(255, 255, 255, 0.18);
}


html[data-theme="dark"] [stroke="#000"],
html[data-theme="dark"] [stroke="#000000"],
html[data-theme="dark"] [stroke="black"],
html[data-theme="dark"] [stroke="#111"],
html[data-theme="dark"] [stroke="#222"],
html[data-theme="dark"] [stroke="#333"] {
    stroke: currentColor;
}

html[data-theme="dark"] .qr-code [stroke],
html[data-theme="dark"] [data-keep-ink] [stroke] {
    stroke: #111;
}

/* 首页排行 */
html[data-theme="dark"] #caption,
html[data-theme="dark"] .socName,
html[data-theme="dark"] .bar-text-outside .score-value,
html[data-theme="dark"] .text-outside .score-text {
    color: #e6edf5;
}

html[data-theme="dark"] .stats-banner,
html[data-theme="dark"] #filterButtons {
    background: #182230;
    border-color: rgba(255, 255, 255, 0.1);
    color: #c5d0dc;
}

html[data-theme="dark"] .stats-container,
html[data-theme="dark"] .notice,
html[data-theme="dark"] .score-label,
html[data-theme="dark"] .bar-text-outside .device-name,
html[data-theme="dark"] .text-outside .socinfo {
    color: #a8b3c0;
}

html[data-theme="dark"] .stat-item i,
html[data-theme="dark"] .stat-item strong {
    color: #e6edf5;
}

html[data-theme="dark"] .ratioBar {
    background-color: #243044;
}

html[data-theme="dark"] .score-label {
    background-color: rgba(16, 21, 28, 0.92);
}

html[data-theme="dark"] .downBtn {
    background: #1a2330;
    color: #e6edf5;
    border-color: rgba(255, 255, 255, 0.28);
}

html[data-theme="dark"] .featured-product-card,
html[data-theme="dark"] .nas-product-card,
html[data-theme="dark"] .step-card {
    background: #182230 !important;
    color: #e6edf5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* 文章 */
html[data-theme="dark"] .article-header {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .article-title,
html[data-theme="dark"] .article-content {
    color: #e6edf5;
}

html[data-theme="dark"] .article-header .article-meta,
html[data-theme="dark"] .article-meta,
html[data-theme="dark"] .article-header .meta-item i,
html[data-theme="dark"] .meta-item i {
    color: #a8b3c0 !important;
}

/* 年龄计算器：彩色插图保留，黑色轮廓跟标题颜色 */
html[data-theme="dark"] .header-icon {
    color: #e6edf5 !important;
}

html[data-theme="dark"] .age-calculator-page .page-header h1 {
    color: #e6edf5;
}

html[data-theme="dark"] .age-calculator-page .page-header p {
    color: #a8b3c0;
}

html[data-theme="dark"] .age-calculator-page :is(.input-panel, .panel-header, .info-content details, .info-accordion, .info-toc) {
    background: #182230;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6edf5;
}

html[data-theme="dark"] .age-calculator-page .mode-tab.active,
html[data-theme="dark"] .age-calculator-page .date-selects select {
    background: #243044;
    color: #e6edf5;
}

html[data-theme="dark"] .age-calculator-page .input-mode-tabs,
html[data-theme="dark"] .age-calculator-page .panel-header {
    background: #141c28;
}

/* 统一深色表面。类名里带这些片段的白底块一起变，不用按页面名单维护。 */
html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) {
    --ink: #e8eef5;
    --muted: #b7c3d0;
    --line: rgba(255, 255, 255, 0.14);
    --soft: #1c2633;
    --blue-soft: #1a3358;
    --ok-soft: #123226;
    --warn: #f3e6c0;
    --warn-soft: #2a2416;
    --bc-ink: #e8eef5;
    --bc-muted: #b7c3d0;
    --bc-line: rgba(255, 255, 255, 0.14);
    --bc-bg: #10151c;
    --bc-primary-soft: #1a2a44;
    background-color: #10151c !important;
    color: #e8eef5 !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is(
    [class*="-stage"],
    [class*="-card"],
    [class*="-panel"],
    [class*="-board"],
    [class*="-connect"],
    [class*="-sheet"],
    [class*="-box"],
    [class*="-faq"],
    [class*="-scene"],
    [class*="-room"],
    [class*="-section"],
    [class*="-item"],
    [class*="-note"],
    [class*="-drop"]:not([class*="-cta"]),
    [class*="-tool"],
    [class*="-output"],
    [class*="-console"],
    [class*="-content"],
    [class*="-container"],
    [class*="-family"],
    [class*="-wrap"],
    [class*="-shell"],
    .article-main,
    .article-header,
    .article-body,
    .article-footer,
    .articles-grid,
    section,
    article
) {
    background-color: #1c2633 !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: inherit;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is(h1, h2, h3, h4, h5, h6) {
    color: #f4f7fb !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is(p, li, label, summary, td, th) {
    color: #d5dde6 !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) strong:not([class*="badge"]) {
    color: inherit !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is(input, textarea, select):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]) {
    background-color: #141c28 !important;
    color: #e8eef5 !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is([class*="-ghost"], [class*="secondary"], [class*="-tab"]:not(.is-on)) {
    background-color: #243044 !important;
    color: #e8eef5 !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) [class*="-tab"].is-on {
    background-color: #1a3358 !important;
    color: #d6e6ff !important;
    border-color: #3d6cb5 !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) [class*="-tab"].is-on :is(b, small, span) {
    color: #d6e6ff !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) [class*="-danger"] {
    background-color: transparent !important;
    color: #ffb4ab !important;
    border-color: #7a3030 !important;
}

html[data-theme="dark"] :is(main, .faq-container, .article-container, .articles-container, .email-submission, .xy-wrap, .nf, .res):not(.wc-page):not(.screen-test-page):not(.keyboard-clean-page) :is(.faq-answer, .article-excerpt, .page-subtitle, .tuner-content p) {
    color: #d5dde6 !important;
}

html[data-theme="dark"] .tuner-page {
    --music-bg: #10151c;
    --music-ink: #e8eef5;
    --music-muted: #b7c3d0;
    --music-line: rgba(255, 255, 255, 0.14);
}

html[data-theme="dark"] :is(.ppt-qr, .qr-code, [data-keep-ink]) {
    background-color: #fff !important;
}

html[data-theme="dark"] .llm-leaderboard-page {
    --llm-bg: #10151c;
    --llm-panel: #182230;
    --llm-text: #e6edf5;
    --llm-muted: #a8b3c0;
    --llm-border: rgba(255, 255, 255, 0.12);
    --llm-blue-soft: #1a2a44;
    --llm-green-soft: #123226;
    background: #10151c;
    color: #e6edf5;
}

html[data-theme="dark"] .tz-page,
html[data-theme="dark"] .tz-card,
html[data-theme="dark"] .tz-kpi,
html[data-theme="dark"] .tz-hero {
    background: #182230;
    color: #e6edf5;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .tz-page {
    background: transparent;
}

html[data-theme="dark"] .tz-crumb,
html[data-theme="dark"] .tz-page h1 {
    color: #e6edf5;
}

html[data-theme="dark"] .auth-modal-card {
    background: #182230;
    color: #e6edf5;
}

html[data-theme="dark"] .auth-modal-close {
    background: #243044;
    color: #e6edf5;
}

html[data-theme="dark"] .auth-logo-img {
    filter: brightness(0) invert(1);
}

html[data-theme="dark"] .navbar-auth {
    background: transparent !important;
}

html[data-theme="dark"] :is(
    .test-card, .info-content, .result-next-card, .diagnostic-log,
    .api-endpoints, .endpoint-item, .page-toc, .toc-header,
    .config-card, .result-card
) {
    background-color: #182230 !important;
    color: #e6edf5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* IPv6 检测页：卡片、提示条和文字一起改，避免浅色字留在白底上。
   ipv4/ipv6 图标是深色位图，只加浅色底，不反色。 */
html[data-theme="dark"] .ipv6-test-page .page-header h1 {
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page .page-header p {
    color: #b7c3d0;
}

html[data-theme="dark"] .ipv6-test-page p.short-domain-hint {
    background: #182230;
    color: #d5dde6;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .ipv6-test-page .short-domain-hint svg {
    color: #8eb6ff;
}

html[data-theme="dark"] .ipv6-test-page img.header-icon,
html[data-theme="dark"] .ipv6-test-page .ip-card-header img,
html[data-theme="dark"] .ipv6-test-page .protocol-probe-icon {
    background: #fff !important;
    border-radius: 10px !important;
    padding: 4px !important;
    box-sizing: content-box !important;
}

html[data-theme="dark"] .ipv6-test-page :is(.ip-card, .quality-score, .latency-chart) {
    background: #1c2633;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e8eef5;
}

html[data-theme="dark"] .ipv6-test-page :is(
    .ip-card-header h3,
    .ip-address,
    .detail-item span,
    .test-status h3,
    .quality-score h4,
    .latency-chart h4,
    .score-value #scoreNumber
) {
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page :is(
    .detail-item label,
    .test-status p,
    .test-progress-meta,
    .score-max,
    .score-label,
    .legend-item,
    .protocol-probe-state
) {
    color: #c5d0dc;
}

html[data-theme="dark"] .ipv6-test-page .latency-help {
    color: #c5d0dc;
}

html[data-theme="dark"] .ipv6-test-page .protocol-probe {
    background: #141c28;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .ipv6-test-page .protocol-probe-name {
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page .protocol-probe[data-state="success"] {
    background: #123226;
    border-color: #1f6b4a;
}

html[data-theme="dark"] .ipv6-test-page .protocol-probe[data-state="success"] .protocol-probe-state {
    color: #6ee7b7;
}

html[data-theme="dark"] .ipv6-test-page .connection-summary {
    background: #2a2416;
    border-color: #6b5420;
}

html[data-theme="dark"] .ipv6-test-page .connection-summary h4,
html[data-theme="dark"] .ipv6-test-page .connection-summary p {
    color: #f3e6c0;
}

html[data-theme="dark"] .ipv6-test-page .ipv6-accuracy-note {
    background: #152033;
    border-color: #2a4068;
    color: #d5e4ff;
}

html[data-theme="dark"] .ipv6-test-page .ipv6-accuracy-note strong {
    color: #9ec1ff;
}

html[data-theme="dark"] .ipv6-test-page .ipv6-accuracy-note code {
    background: #10151c;
    color: #e6edf5;
}

/* 这一页后半段还有大量白底块。标题单独写了深色，白块里的说明又继承了浅色，
   所以标题和卡片要一起改，徽章保持原来的绿/红/蓝。 */
html[data-theme="dark"] .ipv6-test-page :is(h2, h3, h4, h5, strong, summary) {
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page :is(p, li, label) {
    color: #d5dde6;
}

html[data-theme="dark"] .ipv6-test-page :is(
    .type-item,
    .script-examples,
    .script-example,
    .tech-features,
    .feature-item,
    .api-notes,
    .cli-usage-details,
    .format-tabs,
    .ipv6-prefix-info,
    .tutorial-item,
    .tutorial-content,
    .tip-item,
    .tip-details,
    .cli-developer-cta,
    .result-next-card
) {
    background-color: #1c2633 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ipv6-test-page :is(
    .tutorial-item summary,
    .cli-usage-header,
    .script-header,
    summary.script-header
) {
    background-color: #141c28 !important;
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page .format-tab {
    color: #d5dde6;
    background: transparent;
}

html[data-theme="dark"] .ipv6-test-page .format-tab.active {
    background: #243044;
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page .result-next-card:not(.accent) .result-next-action,
html[data-theme="dark"] .ipv6-test-page .cli-developer-cta-button,
html[data-theme="dark"] .ipv6-test-page .copy-all-btn {
    background: #243044;
    color: #f4f7fb;
    border-color: rgba(255, 255, 255, 0.2);
}

html[data-theme="dark"] .ipv6-test-page .api-notes code {
    background: #10151c;
    color: #f3e6c0;
}

html[data-theme="dark"] .ipv6-test-page .result-next-steps {
    border-top-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .page-toc .toc-link {
    color: #c5d0dc;
}

html[data-theme="dark"] .page-toc .toc-link:hover,
html[data-theme="dark"] .page-toc .toc-link.active {
    background: #1a2a44;
    color: #9ec1ff;
}

/* 命令行区块和表格的选择器比上面的通用标题更具体，要单独盖住。
   黄底提示、橙色 zsh 提醒保持原来的深色字。 */
html[data-theme="dark"] .ipv6-test-page .cli-api-section :is(h2, h3, h4, h5, p, li, strong) {
    color: #e8eef5;
}

html[data-theme="dark"] .ipv6-test-page .cli-api-section :is(.info-content > p, .cli-developer-cta p, .click-hint) {
    color: #d5dde6;
}

html[data-theme="dark"] .ipv6-test-page .click-hint {
    background: #243044;
}

html[data-theme="dark"] .ipv6-test-page :is(.tip-note, .cli-shell-note),
html[data-theme="dark"] .ipv6-test-page :is(.tip-note, .cli-shell-note) :is(p, strong, li, summary, h4, h5) {
    color: #6b4e16;
}

html[data-theme="dark"] .ipv6-test-page .cli-shell-note,
html[data-theme="dark"] .ipv6-test-page .cli-shell-note :is(p, strong, summary) {
    color: #7c2d12;
}

html[data-theme="dark"] .ipv6-test-page :is(.faq-item, .faq-answer, .faq-item summary) {
    background-color: #1c2633 !important;
    color: #e8eef5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ipv6-test-page :is(.comparison-table, .config-table, .dns-table) :is(thead, tr, th, td) {
    background-color: #1c2633 !important;
    color: #e8eef5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ipv6-test-page .result-next-links a {
    color: #8fd9b4;
}

html[data-theme="dark"] .ipv6-test-page :is(.tool-card, .related-articles, .article-card) {
    background-color: #1c2633 !important;
    color: #e8eef5 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ipv6-test-page .article-card h3 a {
    color: #f4f7fb;
}

html[data-theme="dark"] .ipv6-test-page .article-card time {
    color: #a8b3c0;
}

/* NAT 检测页 */
html[data-theme="dark"] .nat-test-page :is(
    .page-header h1,
    .info-section h2,
    .faq-section h2,
    .test-status h3,
    .nat-type-title,
    .result-header h3,
    .result-value,
    .info-card h3,
    .faq-item h4,
    .detail-content .detail-value
) {
    color: #f4f7fb;
}

html[data-theme="dark"] .nat-test-page :is(
    .page-header p,
    .test-status p,
    .nat-type-subtitle,
    .result-item label,
    .result-method-note,
    .info-card p,
    .faq-item p,
    .image-caption,
    .detail-content label
) {
    color: #c5d0dc;
}

html[data-theme="dark"] .nat-test-page :is(.nat-quick-note, .short-domain-hint, .detection-notice) {
    background: #182230;
    color: #d5dde6;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .nat-test-page .short-domain-hint svg,
html[data-theme="dark"] .nat-test-page .detection-notice svg {
    color: #8eb6ff;
}

html[data-theme="dark"] .nat-test-page .detection-notice code {
    background: #10151c;
    color: #e6edf5;
}

html[data-theme="dark"] .nat-test-page :is(
    .result-item,
    .info-card,
    .faq-item,
    .detail-box,
    .nat-structure-image,
    .sponsor-tip
) {
    background: #1c2633;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e8eef5;
}

html[data-theme="dark"] .nat-test-page .result-description {
    background: #2a2416;
    border-color: #6b5420;
}

html[data-theme="dark"] .nat-test-page .result-description h4,
html[data-theme="dark"] .nat-test-page .result-description p {
    color: #f3e6c0;
}

html[data-theme="dark"] .nat-test-page .test-btn.secondary,
html[data-theme="dark"] .nat-test-page .result-confidence-help {
    background: #243044;
    color: #f4f7fb;
    border-color: rgba(255, 255, 255, 0.2);
}

html[data-theme="dark"] .nat-test-page #welcomeMessage {
    color: #c5d0dc !important;
}

html[data-theme="dark"] .nat-test-page .result-method-app-link {
    color: #9ec1ff;
}

html[data-theme="dark"] .nat-test-page .info-card p strong,
html[data-theme="dark"] .nat-test-page h2,
html[data-theme="dark"] .nat-test-page .faqx h2,
html[data-theme="dark"] .nat-test-page .faqx-item summary,
html[data-theme="dark"] .nat-test-page .promo-title {
    color: #f4f7fb;
}

html[data-theme="dark"] .nat-test-page .faqx-intro,
html[data-theme="dark"] .nat-test-page .faqx-a,
html[data-theme="dark"] .nat-test-page .promo-subtitle,
html[data-theme="dark"] .nat-test-page .promo-desc,
html[data-theme="dark"] .nat-test-page > p {
    color: #c5d0dc !important;
}

html[data-theme="dark"] .nat-test-page .faqx-item,
html[data-theme="dark"] .nat-test-page .nat-client-promo {
    background: #1c2633;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .nat-test-page .promo-more {
    color: #9ec1ff;
}

/* 教程列表 */
html[data-theme="dark"] .articles-container .page-title {
    color: #f4f7fb;
}

html[data-theme="dark"] .articles-container .page-subtitle {
    color: #a8b3c0;
}

html[data-theme="dark"] .articles-container .article-card {
    background: #1c2633;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: none;
}

html[data-theme="dark"] .articles-container .article-excerpt {
    color: #c5d0dc;
}

html[data-theme="dark"] .articles-container .article-meta {
    color: #a8b3c0;
    border-top-color: rgba(255, 255, 255, 0.1);
}