MediaWiki:Citizen.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* MediaWiki:Citizen.css */
:root {
    /* Layout Width (default is 1320px; set higher for dense data tables) */
    --width-layout: 1440px;

    /* Custom Fonts */
    --font-family-base: system-ui, -apple-system, sans-serif;
    --font-family-heading: inherit;
    --font-family-monospace: 'Courier New', monospace;

    /* Border radius (0px for sharp retro look, 8px for soft modern look) */
    --border-radius-base: 4px;
}

/* Retro styling for inline code and preformatted blocks */
pre, code {
    background-color: var(--color-surface-2) !important;
    border: 1px solid var(--color-border) !important;
}

/* Display banner/logo at top of Main Page */
body.mainpage #mw-content-text::before,
body.page-Main_Page #mw-content-text::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 140px !important; /* Adjust based on image aspect ratio */
    background-image: url('/forum/logo_2026_wide.png') !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: contain !important;
    margin: 1rem 0 2rem 0 !important;
}

/* Hide standard Main Page title header */
body.mainpage .citizen-page-header,
body.page-Main_Page .citizen-page-header {
    display: none !important;
}

/* Dark Mode Override (Manual Toggle) */
html.skin-theme-clientpref-night body.mainpage #mw-content-text::before,
html.skin-theme-clientpref-night body.page-Main_Page #mw-content-text::before,
html.citizen-dark body.mainpage #mw-content-text::before,
html.citizen-dark body.page-Main_Page #mw-content-text::before {
    background-image: url('/forum/logo_2026_wide_dark.png') !important;
}

/* Dark Mode Override (Automatic / System Preference) */
@media (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os body.mainpage #mw-content-text::before,
    html.skin-theme-clientpref-os body.page-Main_Page #mw-content-text::before,
    html:not(.skin-theme-clientpref-day) body.mainpage #mw-content-text::before {
        background-image: url('/forum/logo_2026_wide_dark.png') !important;
    }
}