html[data-theme="dark"] {
    --primary: #f6b817;
    --primary-hover: #d99a0b;
    --primary-soft: rgba(246, 184, 23, 0.16);
    --background: #07141c;
    --surface: #0f202b;
    --surface-secondary: #182c38;
    --text: #fff8e7;
    --text-muted: #c5bba8;
    --border: #30434e;
    --border-strong: #52636b;
    /* On a dark page the table lines have to be lighter to read as strong. */
    --table-border: #9ca3af;
    --success: #4ade80;
    --danger: #f87171;
    --danger-soft: rgba(248, 113, 113, 0.16);
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-menu: 0 12px 32px rgba(0, 0, 0, 0.4);
    --page-bg: #132530;
    --focus: 0 0 0 3px rgba(246, 184, 23, 0.3);
}

html[data-theme="dark"] .side-nav-item:hover {
    background: var(--surface-secondary);
}

html[data-theme="dark"] .side-nav-item.is-active {
    background: var(--primary-soft);
    color: var(--primary);
}

html[data-theme="dark"] .header-title:hover {
    background: var(--surface-secondary);
}

html[data-theme="dark"] .lang-btn.is-active {
    background: var(--primary-soft);
    color: var(--primary);
}

html[data-theme="dark"] .btn-voice,
html[data-theme="dark"] .btn-copy {
    background: var(--surface-secondary);
    border-color: var(--border);
    color: var(--text);
}

html[data-theme="dark"] .btn-voice.is-listening {
    background: rgba(239, 68, 68, 0.16);
    border-color: #ef4444;
    color: #fca5a5;
}

html[data-theme="dark"] .editor:empty::before {
    color: #78716c;
}

html[data-theme="dark"] .hl-mark {
    background: #854d0e;
    color: #fff;
}

html[data-theme="dark"] .toast {
    background: #111318;
    border: 1px solid var(--border);
}

html[data-theme="dark"] .font-tag.is-unicode {
    background: rgba(46, 125, 50, 0.22);
    color: #86efac;
}

html[data-theme="dark"] .font-tag.is-ascii {
    background: rgba(239, 108, 0, 0.22);
    color: #fdba74;
}

html[data-theme="dark"] .font-tab.is-active {
    color: var(--primary);
}

html[data-theme="dark"] .symbol-tab.is-active {
    color: var(--primary);
}

html[data-theme="dark"] .nudi-comment {
    background: rgba(249, 171, 0, 0.28);
    color: #fff;
}

html[data-theme="dark"] .nudi-watermark {
    color: rgba(231, 229, 228, 0.18);
}

html[data-theme="dark"] .site-features {
    background:
        radial-gradient(1200px 420px at 50% -10%, rgba(246, 184, 23, 0.12), transparent 60%),
        linear-gradient(180deg, #07141c 0%, #0b1922 40%, #0f202b 100%);
    border-top-color: var(--border);
}

html[data-theme="dark"] .site-features-title,
html[data-theme="dark"] .feature-card-title {
    color: var(--text);
}

html[data-theme="dark"] .feature-card {
    background: var(--surface);
    border-color: var(--border);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .feature-visual {
    background: linear-gradient(180deg, #2a2c32 0%, #23252a 100%);
    border-color: var(--border);
}

html[data-theme="dark"] .feature-card-text {
    color: var(--text-muted);
}

html[data-theme="dark"] .feature-card-text strong {
    color: var(--text);
}

html[data-theme="dark"] .features-scroll-hint {
    background: rgba(37, 38, 43, 0.94);
}

html[data-theme="dark"] .fv-chip,
html[data-theme="dark"] .fv-suggest span,
html[data-theme="dark"] .fv-lang,
html[data-theme="dark"] .fv-voice-btn,
html[data-theme="dark"] .fv-drafts,
html[data-theme="dark"] .fv-tb,
html[data-theme="dark"] .fv-convert-pane,
html[data-theme="dark"] .fv-theme-row:not(.is-on) {
    background: var(--surface-secondary);
    border-color: var(--border);
    color: var(--text);
}

html[data-theme="dark"] .fv-draft-item {
    border-top-color: var(--border);
}

html[data-theme="dark"] .fv-draft-item strong,
html[data-theme="dark"] .fv-font-row,
html[data-theme="dark"] .fv-convert-pane strong {
    color: var(--text);
}

html[data-theme="dark"] .site-app-cta {
    background: var(--background);
}

html[data-theme="dark"] .site-features-cta {
    background: linear-gradient(135deg, #0f6b43 0%, #0a4d31 100%);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .site-footer {
    background: var(--background);
    border-top-color: var(--border);
    color: var(--text-muted);
}

html[data-theme="dark"] .article-list-item.is-dark {
    border-color: #d1d5db;
    color: #e5e7eb;
}

html[data-theme="dark"] .article-title,
html[data-theme="dark"] .article-features h2,
html[data-theme="dark"] .article-body h2,
html[data-theme="dark"] .article-hub-body h2,
html[data-theme="dark"] .article-faq h2 {
    color: #86efac;
}

html[data-theme="dark"] .legal-page-request h1 {
    color: #5eead4;
}

html[data-theme="dark"] .legal-contact-form input,
html[data-theme="dark"] .legal-contact-form textarea {
    background: var(--surface-secondary);
    border-color: var(--border);
    color: var(--text);
}

html[data-theme="dark"] .legal-contact-form button[type="submit"] {
    background: var(--surface-secondary);
    border-color: var(--border);
    color: var(--text);
}