@@ Line 464: / Line 464: @@
      text-align: center;
 }
+/* ══════════════════════════════════════════════════════
+   DARK MODE — ARTICLE PAGES & VECTOR LEGACY CHROME
+   Applies when the OS/browser is set to dark mode.
+   Targets skin-vector (legacy 2010) selectors.
+══════════════════════════════════════════════════════ */
+@media (prefers-color-scheme: dark) {
+    /* ── Page shell ─────────────────────────────────── */
+    html,
+    body {
+        background-color: #1a1a18;
+        color: var(--bs-text-primary);
+        color-scheme: dark;
+    }
+    /* ── Article content area ───────────────────────── */
+    #content,
+    .mw-body {
+        background-color: #121212;
+        color: var(--bs-text-primary);
+        border-color: #333331;
+    }
+    /* headings */
+    #content h1, #content h2, #content h3,
+    #content h4, #content h5, #content h6 {
+        color: var(--bs-purple-900);
+        border-bottom-color: #333331;
+    }
+    /* article title */
+    #firstHeading {
+        color: var(--bs-purple-900);
+        border-bottom-color: #333331;
+    }
+    /* horizontal rules, table borders */
+    #content hr  { border-color: #333331; }
+    /* standard wikitables */
+    #content table.wikitable,
+    #content table.wikitable > * > tr > th,
+    #content table.wikitable > * > tr > td {
+        background-color: #1e1e1c;
+        color: var(--bs-text-primary);
+        border-color: #3a3a38;
+    }
+    #content table.wikitable > * > tr > th {
+        background-color: #2a2a28;
+        color: var(--bs-gray-800);
+    }
+    /* infoboxes and floated tables */
+    #content table {
+        color: var(--bs-text-primary);
+    }
+    /* code / pre blocks */
+    #content pre,
+    #content code {
+        background-color: #1e1e1c;
+        color: #c8c4e8;
+        border-color: #333331;
+    }
+    /* blockquotes */
+    #content blockquote {
+        border-left-color: var(--bs-purple-200);
+        color: var(--bs-text-muted);
+    }
+    /* ── Tabs (article / talk / edit / history) ─────── */
+    #p-cactions,
+    div#mw-head {
+        background-color: #1a1a18;
+    }
+    /* inactive tabs */
+    #p-cactions li a,
+    #p-namespaces li a {
+        background-color: #252523;
+        color: #b0aeA6;
+        border-color: #333331;
+    }
+    /* active / selected tab */
+    #p-cactions li.selected a,
+    #p-namespaces li.selected a {
+        background-color: #121212;
+        color: var(--bs-purple-900);
+        border-bottom-color: #121212;
+    }
+    /* tab hover */
+    #p-cactions li a:hover,
+    #p-namespaces li a:hover {
+        background-color: #2e2e2c;
+        color: var(--bs-purple-400);
+    }
+    /* ── Left sidebar / panel ───────────────────────── */
+    #mw-panel,
+    div#mw-panel {
+        background-color: #1a1a18;
+    }
+    /* sidebar portlet headings (Navigation, Tools, etc.) */
+    #mw-panel .portal h3 {
+        color: var(--bs-gray-400);
+        border-bottom: 1px solid #2e2e2c;
+    }
+    /* sidebar links */
+    #mw-panel .portal a {
+        color: var(--bs-link);
+    }
+    #mw-panel .portal a:visited {
+        color: var(--bs-link-visited);
+    }
+    #mw-panel .portal a:hover {
+        color: var(--bs-link-hover);
+        text-decoration: underline;
+    }
+    /* ── Top toolbar / search bar ───────────────────── */
+    #mw-head {
+        background-color: #1a1a18;
+        border-bottom: 1px solid #2e2e2c;
+    }
+    /* search input */
+    #searchInput,
+    #searchform input[type="search"],
+    #searchform input[type="text"] {
+        background-color: #252523;
+        color: var(--bs-text-primary);
+        border-color: #3a3a38;
+    }
+    #searchInput::placeholder {
+        color: var(--bs-text-muted);
+    }
+    /* search button */
+    #mw-searchButton,
+    #searchButton {
+        background-color: #252523;
+        border-color: #3a3a38;
+        color: var(--bs-gray-800);
+    }
+    /* personal tools (login, preferences, etc.) */
+    #pt-login a,
+    #pt-userpage a,
+    #pt-preferences a,
+    #pt-logout a,
+    #p-personal a {
+        color: var(--bs-link);
+    }
+    #p-personal a:hover {
+        color: var(--bs-link-hover);
+    }
+    /* ── Site footer ────────────────────────────────── */
+    #footer {
+        background-color: #1a1a18;
+        border-top: 1px solid #2e2e2c;
+        color: var(--bs-text-muted);
+    }
+    #footer a       { color: var(--bs-link); }
+    #footer a:hover { color: var(--bs-link-hover); }
+    /* ── Miscellaneous chrome ───────────────────────── */
+    /* edit notices, system messages */
+    .mw-editsection a          { color: var(--bs-link); }
+    .mw-editsection a:hover    { color: var(--bs-link-hover); }
+    /* category links at page bottom */
+    #catlinks {
+        background-color: #1e1e1c;
+        border-color: #333331;
+        color: var(--bs-text-muted);
+    }
+    #catlinks a       { color: var(--bs-link); }
+    #catlinks a:hover { color: var(--bs-link-hover); }
+    /* TOC */
+    #toc {
+        background-color: #1e1e1c;
+        border-color: #333331;
+        color: var(--bs-text-primary);
+    }
+    #toc a       { color: var(--bs-link); }
+    #toc a:hover { color: var(--bs-link-hover); }
+    /* notification / sitenotice bar */
+    #siteNotice,
+    #centralNotice {
+        background-color: #1e1a3a;
+        border-color: var(--bs-purple-200);
+        color: var(--bs-purple-900);
+    }
+    /* diff view */
+    .diff-addedline   { background-color: #0d2b0d; color: #b8e6b8; }
+    .diff-deletedline { background-color: #2b0d0d; color: #e6b8b8; }
+    .diff-context     { background-color: #1e1e1c; color: var(--bs-text-muted); }
+} /* end @media (prefers-color-scheme: dark) */

MediaWiki:Common.css: Difference between revisions