Template:EmpiresMainPage/styles.css

/* Main Page panels: shared structure and light-mode colors. */

.empwiki-main-panels .empwiki-panel {
    vertical-align: top;
    color: #202122;
    border: 1px solid;
}

.empwiki-main-panels .empwiki-panel-red {
    background-color: #fff3f3;
    border-color: #ffc9c9;
}

.empwiki-main-panels .empwiki-panel-blue {
    background-color: #f0f0ff;
    border-color: #c6c9ff;
}

/* Headings follow the panel's text color.
   Leave link and visited-link colors to the wiki skin. */

.empwiki-main-panels .mw-heading,
.empwiki-main-panels h2 {
    color: inherit;
}

/* Explicitly selected Dark mode. */

@media screen {
    html.skin-theme-clientpref-night .empwiki-main-panels .empwiki-panel {
        color: #eaecf0;
    }

    html.skin-theme-clientpref-night .empwiki-main-panels .empwiki-panel-red {
        background-color: #32191b;
        border-color: #744047;
    }

    html.skin-theme-clientpref-night .empwiki-main-panels .empwiki-panel-blue {
        background-color: #192433;
        border-color: #435b80;
    }
}

/* Automatic mode when the operating system prefers dark colors. */

@media screen and (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .empwiki-main-panels .empwiki-panel {
        color: #eaecf0;
    }

    html.skin-theme-clientpref-os .empwiki-main-panels .empwiki-panel-red {
        background-color: #32191b;
        border-color: #744047;
    }

    html.skin-theme-clientpref-os .empwiki-main-panels .empwiki-panel-blue {
        background-color: #192433;
        border-color: #435b80;
    }
}