html.dark main {
    background: #0f172a;
}

html.dark .Topbar {
    background: #111827;
    border-bottom-color: #243244;
}

html.dark .Topbar-logo {
    color: #f8fafc;
}

html.dark .Topbar-logoMark {
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.28);
}

html.dark .Hero {
    border-color: #243244;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.28),
        0 2px 8px rgba(0, 0, 0, 0.22);
}

html.dark .Hero-badge {
    background: rgba(37, 99, 235, 0.18);
    color: #93c5fd;
}

html.dark .Hero-title {
    color: #f8fafc;
}

html.dark .Hero-text {
    color: #cbd5e1;
}

html.dark .Meta {
    color: #94a3b8;
}

html.dark .Section {
    background: #111827;
    border-color: #243244;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.28),
        0 2px 8px rgba(0, 0, 0, 0.22);
}

html.dark .Section-title {
    color: #f8fafc;
}

html.dark .Section-text {
    color: #cbd5e1;
}

html.dark .List li {
    color: #cbd5e1;
}

html.dark .Highlight {
    border-color: rgba(96, 165, 250, 0.35);
    background: rgba(37, 99, 235, 0.12);
    color: #dbeafe;
}

html.dark a.Button--primary,
html.dark a.Button--primary:visited,
html.dark .Button--primary,
html.dark .Button--primary:visited {
    background: #3b82f6;
    color: #ffffff;
    border-color: #3b82f6;
}

html.dark a.Button--primary:hover,
html.dark a.Button--primary:focus,
html.dark .Button--primary:hover,
html.dark .Button--primary:focus {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    text-decoration: none;
}

html.dark a.Button--secondary,
html.dark a.Button--secondary:visited,
html.dark .Button--secondary,
html.dark .Button--secondary:visited {
    background: #0f172a;
    color: #f8fafc;
    border-color: #334155;
}

html.dark a.Button--secondary:hover,
html.dark a.Button--secondary:focus,
html.dark .Button--secondary:hover,
html.dark .Button--secondary:focus {
    background: #1e293b;
    color: #ffffff;
    border-color: #475569;
    text-decoration: none;
}

html.dark .Footer {
    color: #94a3b8;
}