Dom's Dark Economist.com by BananaYoda

/* ==UserStyle==
@name           Dom's Dark Economist.com
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A dark style for Economist.com which is easier on the eyes.
@author         Bananayoda, lineav (Conwy)
==/UserStyle== */

@-moz-document domain("economist.com") {
    /* Insert code here... */

    /* DomConwy - The Economist
   Version:  2025.05.03
   Author:   Bananayoda, lineav (Conwy)
   Licence:  https://creativecommons.org/licenses/by-sa/4.0/
*/
    /* Invert the whole website */
    html {
        filter: invert(1) hue-rotate(180deg) contrast(0.8)!important;
        background: #fff;
    }

    /* Invert back the header, nav and footer which are already dark but also change contrast - REMOVED as turns header white for the economist*/

/*       header {
        filter: invert(1) hue-rotate(-180deg) contrast(1.2)!important;
    }

     nav {
        filter: invert(1) hue-rotate(-180deg) contrast(1.2)!important;
    }
*/    


    footer {
        filter: invert(1) hue-rotate(-180deg) contrast(1.2)!important;
    }


    /* darken the Relative time text & background */
    .dcr-4xb9x1,
    .dcr-13vvhme {
        background: #1b2124!important;
        color: #fff;
    }

    /* original conwy below, unchanged*/
    img,
    .youtube-media-atom__overlay,
    svg.inline-the-guardian-logo__svg,
    .top-bar__item,
    figure.element-video {
        filter: invert(1) hue-rotate(180deg) brightness(1.1) contrast(1.05)!important;
    }

    .new-header,
    .menu,
    .menu__inner,
    .menu-group--primary,
    .menu-group--secondary,
    .l-footer,
    .footer__back-to-top {
        background-color: #282736;
    }

    .pillar-link,
    .menu-item__title,
    .colophon__item a {
        color: #000;
    }

    /** invert twitter posts back to have images shown with correct colours */
    twitter-widget {
        filter: invert(1) hue-rotate(180deg) brightness(1.1) contrast(1.05)!important;
    }

    /* make scrollbars dark */
    ::-webkit-scrollbar {
        background: #2f2f2f;
        width: 0.8em;
    }
    ::-webkit-scrollbar-thumb {
        background-color: #555555;
        outline: 1px solid #111111;
    }
}