MediaWiki:Timeless.css: Difference between revisions

From NOISZ Wiki
(Created page with "→‎All CSS here will be loaded for users of the Timeless skin: →‎==UserStyle== @name NOISZ Wiki Anarch - Timeless @namespace github.com/openstyles/stylus @version 1.0.0 @description A new userstyle @author Me ==/UserStyle==: @-moz-document domain("https://anarch.games/") { →‎Insert code here...: } @font-face { font-family: 'Exo'; font-style: normal; src: url(https://fonts.gstatic.com/s/exo/v24/4UaOrEtFpBISc36j.wof...")
 
(let's begin the show~)
Line 1: Line 1:
/* All CSS here will be loaded for users of the Timeless skin */
/* All CSS here will be loaded for users of the Timeless skin */
/* ==UserStyle==
/* ==UserStyle==
@name          NOISZ Wiki Anarch - Timeless
@name          NOISZ Wiki Anarch - Timeless
@namespace      github.com/openstyles/stylus
@namespace      github.com/openstyles/stylus
@version        1.0.0
@version        2.5.6
@description    A new userstyle
@description    the style for alpha testing the Timeless theme for the NOISZ Official Wiki
@author        Me
@author        angeldeluxe
==/UserStyle== */
==/UserStyle== */
@-moz-document domain("https://anarch.games/") {
@-moz-document url-prefix("https://anarch.games") {
     /* Insert code here... */
      
}
   
/* Let's import the fonts first */
   
    @font-face {
        font-family: 'Exo';
        font-style: normal;
        src: url(https://fonts.gstatic.com/s/exo/v24/4UaOrEtFpBISc36j.woff2) format('woff2');
    }
   
/* This is the responsive design section, and alters elements as needed for different screen sizes. */
 
    @media only screen and (min-width: 1099px) {
        .mainpage-rightcolumn,
        #mainpage-rightcolumn {
            display: block;
            float: right;
            position: initial;
            right: 0px;
            top: 0px;
            width: 27%;
            padding: 2%;
            border: 1px solid #fff;
            box-shadow: 0 0 5px 2px #f249b1, inset 0 0 5px 1px #f249b1;
            border-radius: 10px
        }
 
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            display: block;
            float: left;
            width: 63%;
            padding: 2%;
            border: 1px solid #fff;
            box-shadow: 0 0 5px 2px #f249b1, inset 0 0 5px 1px #f249b1;
            border-radius: 10px
        }
        .desktop-spoiler {
            display: block !important;
        }
        .album-spoiler {
            display: none !important;
        }
        /* This is the colour for links on the sidebar. */
        #mw-site-navigation .sidebar-chunk a:visited,
        #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
            color: #fff
        }
 
        #mw-site-navigation .sidebar-chunk a,
        #mw-related-navigation .sidebar-chunk .sidebar-inner a {
            color: #ffabdf
        }
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
    }


@font-face {
    @media only screen and (min-width: 1024px) and (max-width: 1099px) {
    font-family: 'Exo';
        .desktop-spoiler {
    font-style: normal;
            display: block !important;
    src: url(https://fonts.gstatic.com/s/exo/v24/4UaOrEtFpBISc36j.woff2) format('woff2');
        }
}
        .album-spoiler {
            display: none !important;
        }
        /* This is the colour for links on the sidebar. */
        #mw-site-navigation .sidebar-chunk a:visited,
        #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
            color: #f533db
        }


@media only screen and (min-width: 1024px) {
        #mw-site-navigation .sidebar-chunk a,
    .mainpage-rightcolumn {
        #mw-related-navigation .sidebar-chunk .sidebar-inner a {
         display: block;
            color: #ffabdf
         float: right;
        }
         position: initial;
         .sl-story-gallery .row-2 img,
         right: 0px;
         .sl-story-gallery .row-4 img,
         top: 0px;
         .sl-story-gallery .row-6 img {
         width: 30%;
            bottom: unset
         }
         #mw-site-navigation .sidebar-chunk .sidebar-inner .mw-portlet-body a  {
            color: unset 
         }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding: 2%  
        }
       
       
     }
     }
    @media only screen and (min-width: 851px) and (max-width: 1023px) {
        .desktop-spoiler {
            display: block !important;
        }
        .album-spoiler {
            display: none !important;
        }
        /* This is the colour for links on the sidebar. */
        #mw-site-navigation .sidebar-chunk a:visited,
        #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
            color: #f533db
        }
        #mw-site-navigation .sidebar-chunk a,
        #mw-related-navigation .sidebar-chunk .sidebar-inner a {
            color: #ffabdf
        }
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
        #mw-site-navigation .sidebar-chunk .sidebar-inner .mw-portlet-body a  {
            color: unset 
        }


    .mainpage-leftcolumn {
        #rightcolumn-spacer {
        display: block;
            display: block !important
         float: left;
        }
        width: 60%;
       
         padding-left: 5%
         .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding: 2%  
         }
     }
     }
     .desktop-spoiler {
 
        display: block;
    @media only screen and (max-width: 851px) and (min-width: 600px) {
        .mainpage-rightcolumn,
        #mainpage-rightcolumn {
            display: block;
            float: right;
            position: initial;
            right: 0px;
            top: 0px;
            width: 100%;
        }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding-left: unset 
        }
 
    }
       
     @media only screen and (max-width: 840px) and (min-width: 580px) {
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding-left: unset 
        }
    }
    @media only screen and (max-width: 580px) and (min-width:480px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 20px
        }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding-left: unset 
        }
    }
    @media only screen and (max-width: 480px) and (min-width:280px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 35px 
        }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding-left: unset 
        }
    }
    @media only screen and (max-width: 280px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 50px 
        }
        .mainpage-leftcolumn,
        #mainpage-leftcolumn {
            padding-left: unset 
        }
    }
 
       
/* This section is for the new main page sections. */
 
    .mainpage-game-video {
        padding: 10px;
        min-width: 390px;
        max-width: 65%;
        justify-content: center;
        align-self: center;
 
    }
 
    .pc-game-info-wrapper {
        width: 100%;
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
    }
 
    .pc-game-buttons-container {
        display: -webkit-flex;
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: fit-content
    }
    .mainpage-leftcolumn,
    #mainpage-leftcolumn {
            display: block;
            float: left;
        }
        .desktop-spoiler {
            display: none;
        }
        .album-spoiler {
            display: block;
        }
        #upcoming-birthdays > p:first-of-type, #upcoming-birthdays > p:nth-of-type(3){
            display: none   
        }
   
/* From here, the elements of the UI are altered. */
       
 
    #mw-site-navigation .sidebar-chunk a,
    #mw-related-navigation .sidebar-chunk .sidebar-inner a {
            color: #ffabdf
     }
     }
    .album-spoiler {
        display: none;
    }
}


@media only screen and (max-width: 840px) {
   
    .mainpage-rightcolumn {
 
         display: block;
    code, pre, .mw-code {
         float: right;
        color: #fff;
        position: initial;
        background: unset
        right: 0px;
    }
        top: 0px;
    .mw-plusminus-pos {
        width: 100%;
        color: #2ec817
    }
    }
   
    .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
         color: #fff;
         background-color: unset
    }
   
    .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
    .mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {
        background-color: #000 
    }
   
 
 
 
 
    .timeless-logo img,
    #p-banner {
        content: url(https://anarch.games/noisz/wiki/images/e/e6/Site-logo.png);
        position: relative;
        width: 50%
    }
 
 
 
    .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
    #mw-header-container, .sl-gameplay-navbox-header {
        background: #6f027c
    }
 
    #mw-content {
        border: 1px solid #f533db;
        margin-bottom: 2em
    }
 
    #mw-content-container {
        padding: 0px
    }
 
    .ts-inner {
        max-width: initial
    }
 
    .diff-addedline {
        border-color: #f533db
    }
 
    .diff-addedline .diffchange {
        background-color: #6f027c
    }
 
    #mw-site-navigation .sidebar-chunk,
    #mw-related-navigation .sidebar-chunk {
        background: rgba(155, 48, 140, 0.61);
        box-shadow: 0 0 20px 1px rgba(255, 79, 249, 0.3);
        color: #f533db;
        font-family: 'Exo';
        border-radius: 10px;
        border: 1px solid #f533db;
    }


    .mainpage-leftcolumn {
        display: block;
        float: left;
        width: 100%;
        padding-left: 5%
    }
    .desktop-spoiler {
        display: block;
    }
    .album-spoiler {
        display: none;
    }
}


@media only screen and (max-width:840px) {
    #mw-site-navigation h2,
    .desktop-spoiler {
    #mw-related-navigation h2 {
        display: none;
        font-family: 'Exo'
    }
    }
    .album-spoiler {
        display: block;
    }
}


    #mw-content-block {
        background-image: url(https://anarch.games/starlivht/images/bg.jpg);
        background-attachment: fixed;
        background-size: 1000px;
        background-position: 50% 50%;
        background-clip: border-box;
    }


    #mw-site-navigation .sidebar-chunk h3,
    #p-banner {
        font-family: 'Exo', sans serif
    }


.timeless-logo img,
    .cosmos-bannerOption * {
#p-banner {
        fill: #fff;
    content: url(https://anarch.games/noisz/wiki/images/e/e6/Site-logo.png);
        stroke: #fff
     position: relative;
    }
    width: 50%
    .tools-inline li[id^="ca-nstab-"] a, .tools-inline li[id^="ca-nstab-"] span, .tools-inline li[id^="ca-talk"] a, .tools-inline li[id^="ca-talk"] span {
}
        filter: invert(1) 
    }
    .mw-scribunto-console-fieldset {
        color: #fff;
        background: #000
    }
     .mw-scribunto-message {
        background: #000;
        color: #cc8b12
    }




#mw-header-container,
    /* This covers pretty much all text I can find. */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
 
     background: #6f027c
    .mw-body h1,
}
    .mw-body h2,
    .mw-body h3,
    .mw-body h4,
    .mw-body h5,
    .mw-capiunto-infobox,
    .editOptions,
    .editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label,
    .oo-ui-fieldLayout-body,
    .oo-ui-labelWidget.oo-ui-inline-help,
    #firstHeading,
    .ve-ce-contentBranchNode,
    .cosmos-header__sitename a:any-link,
    .cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li > a:not(.wds-button),
    .cosmos-header__counter *,
    #cosmos-footer-footerContent *,
    body #mw-content,
    .cosmos-dropdown-list > ul > li > :only-child *,
    body .mw-changeslist-line,
    .oo-ui-fieldLayout-header,
    body .wikitable > * > tr > td,
    table.mw-datatable,
    .oo-ui-radioSelectInputWidget .oo-ui-labelElement-label,
    #personal h2,
    .thumbcaption,
    textarea,
    #wpSummary,
    #wpDestFile,
    .oo-ui-textInputWidget .oo-ui-inputWidget-input,
    .mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
    code,
    pre,
    #mw_metadata *,
    .diff-context,
    .mw-body-content .mw-number-text h3,
    .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
    #contentSub,
    #content #mw-editpage-minoredit .oo-ui-labelElement-label,
    #content #mw-editpage-watch .oo-ui-labelElement-label {
        color: #fff;
        font-family: 'Exo';
    }
   
   
    /* This is the reference citation highlight text. */
    ol.references li:target, sup.reference:target {
     background-color: #A86D00
    }


/* CSS placed here will be applied to all skins */
/* CSS for SL song table (in the individual song pages) and style info  */
#mw-content {
    border: 1px solid #f533db;
    margin-bottom: 2em
}


#mw-content-container {
    /* This is so icons in slider galleries show up. */
     padding: 0px
    .oo-ui-icon-previous,
}
    .oo-ui-icon-imageGallery,
    .oo-ui-icon-next {
        filter: invert(1)
    }
    .oo-ui-popupWidget-popup .oo-ui-popupWidget-head .oo-ui-labelElement-label,
    .oo-ui-popupWidget-popup .oo-ui-popupWidget-body p,
    #ooui-52 .oo-ui-tool-title,
    #ooui-116 .oo-ui-labelElement .oo-ui-labelElement-label{
        color: #000 
    }
/* This section is for the editor interfaces. */
   
    #mw-header-nav-hack {
        background: #000
    }
    #ooui-17 .oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded,
    #ooui-17 .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt,
    #ooui-19 .oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded,
    #ooui-19 .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt,
    .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
        background: #000 
    }
    .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt a,
    #ooui-17 .ve-ui-mwMediaDialog-description-link,
    .oo-ui-window-body .ve-ui-mwMediaInfoFieldWidget-text a,
    .oo-ui-window-body #ooui-45 a,
    .ve-ui-mwSaveDialog-viewer a,
    .oo-ui-fieldLayout-field .oo-ui-labelWidget a,
    .oo-ui-tool-link:hover,
    #ooui-44 .oo-ui-labelElement-label .ve-ui-mwMediaDialog-description-link,
    .ve-ui-mwMediaDialog-description-link{
        color: #37fcff
    }
    #ooui-17 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label,
    #ooui-19 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label,
    #ooui-3,
    #ooui-17 .ve-ui-mwGalleryDialog-imageListMenuLayout-desktop > .oo-ui-menuLayout-menu,
    .oo-ui-processDialog-navigation,
    #ooui-19,
    #ooui-19 .oo-ui-fieldLayout-header .oo-ui-labelElement-label,
    .ve-ui-mwSaveDialog-savePanel,
    .oo-ui-window-foot .oo-ui-processDialog-actions-other,
    #ooui-19 #ooui-7.oo-ui-labelElement-label,
    .ve-ui-mwSaveDialog-summary .ve-ui-mwSaveDialog-options,
    .oo-ui-window-body,
    .oo-ui-window-body .oo-ui-toolbar-bar,
    #content .oo-ui-toolbar-bar,
    .oo-ui-popupToolGroup-tools,
    .ve-ui-targetWidget:not(.oo-ui-pendingElement-pending),
    .oo-ui-window-body .ve-ce-contentBranchNode .ve-ce-branchNode-inlineSlug,
    .oo-ui-window-body .ve-ui-mwSaveDialog-options,
    .oo-ui-window-foot {
        background: #000;
        color: #fff
    }
    #ooui-17 .ve-ui-mwGalleryDialog-highlighted-image {
        background: #000;
        background-repeat: no-repeat;
        background-position: center
    }
    #ooui-17 .ve-ui-mwGalleryDialog-imageListMenuLayout-desktop > .oo-ui-menuLayout-menu .oo-ui-panelLayout-padded .oo-ui-buttonElement-button span,
    #ooui-17 .oo-ui-labelElement-label,
    #ooui-19 .ve-ce-branchNode-slug,
    .ve-ui-mwSaveDialog-license #editpage-copywarn,
    .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-button .oo-ui-labelElement-label,
    .ve-ce-paragraphNode.ve-ce-generated-wrapper,
    .oo-ui-window-foot .oo-ui-buttonElement-button .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-buttonElement-button .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-messageDialog-text .oo-ui-messageDialog-message.oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-messageDialog-text .oo-ui-messageDialog-title.oo-ui-labelElement-label,
    .oo-ui-fieldLayout-field .oo-ui-labelWidget p,
    .ve-ui-fragmentInspector-form #ooui-3 .oo-ui-labelElement-label,
    .ve-ui-fragmentInspector-form #ooui-5 .oo-ui-labelElement-label,
    .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-labelElement-label
    {
        color: #fff
    }
    #ooui-19 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
    .oo-ui-processDialog-navigation .oo-ui-icon-close,
    .mw-rcfilters-ui-filterWrapperWidget-bottom .oo-ui-buttonElement-button .oo-ui-iconElement-icon,
    .mw-rcfilters-ui-row .oo-ui-buttonElement-button .oo-ui-iconElement-icon,
    .mw-rcfilters-ui-filterWrapperWidget-bottom .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator,
    .mw-rcfilters-ui-row .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator,
    .oo-ui-window-body .oo-ui-toolbar-bar .oo-ui-iconElement,
    .oo-ui-window-body .oo-ui-toolbar-bar .oo-ui-popupToolGroup-handle,
    .oo-ui-window-body .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle,
    .ve-ui-mwMediaDialog-panel-settings .oo-ui-icon-textStyle,
    .oo-ui-window-body .oo-ui-icon-textStyle,
    .oo-ui-window-body .oo-ui-listToolGroup[title="Style text"] .oo-ui-indicator-down,
    .ve-ui-specialCharacterPage .ve-ui-specialCharacterPage-character,
    .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title,
    #ooui-4 .oo-ui-iconElement-icon.oo-ui-icon-search{
        filter: invert(1)
    }
    .ve-ui-mwMediaDialog-panel-settings .oo-ui-toolbar .oo-ui-popupToolGroup-handle .oo-ui-indicator-down,
    .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-icon-imageGallery{
        filter: invert(0) 
    }
    #ooui-17 .oo-ui-toolbar-bar,
    #ooui-19 .oo-ui-toolbar-bar,
    #ooui-17.oo-ui-iconElement-icon.oo-ui-icon-add.oo-ui-image-progressive {
        filter:invert(1)
    }
    .ve-ui-linearContextItem-title .oo-ui-icon-imageGallery {
        filter:invert(0) 
    }
    .oo-ui-processDialog-actions-safe .oo-ui-icon-close {
        filter: invert(1) 
    }
    .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
        background: #6f027c 
    }
    .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
    .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover,
    .oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover,
    .oo-ui-menuLayout-menu .oo-ui-decoratedOptionWidget:hover,
    .ve-ui-linkAnnotationWidget .oo-ui-labelElement:hover,
    .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected,
    .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-optionWidget-selected,
    .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-menuOptionWidget:hover {
        background:#f533db
    }
    a.oo-ui-tool-link:hover {
        background:#f533db;
        filter: invert(0)
    }
    #ooui-52 a.oo-ui-tool-link:hover,
    .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link:hover {
        background:#f533db;
        filter: invert(1)
     }
    ul.fileupload-results li.ful-success a {
        color: unset !important
    }
    ul.fileupload-results li.ful-success {
        color: darkgreen
    }
    ul.fileupload-results li.ful-error {
        color: darkred
    }
   
    /* This is for the visual editor toolbar. */
   
    #content .oo-ui-toolGroup-tools .oo-ui-iconElement-icon,
    #content .oo-ui-iconElement-icon .oo-ui-icon-link,
    .oo-ui-popupToolGroup-handle,
    #content .oo-ui-image-progressive,
    .mw-rcfilters-head .oo-ui-icon-article,
    .mw-rcfilters-head .oo-ui-icon-tag,
    .client-js #ca-edit a,
    .client-js #ca-edit a span,
    .client-js #ca-history a,
    .client-js #ca-history a span,
    .client-js #t-contributions a,
    .client-js #t-contributions a span,
    .client-js #ca-ve-edit a,
    .client-js #ca-ve-edit a span,
    .oo-ui-window-body .ve-ui-specialCharacterPage-characters,
    .oo-ui-window-body .oo-ui-fieldsetLayout-header .oo-ui-iconElement-icon,
    .mw-rcfilters-ui-row .mw-rcfilters-ui-filterTagItemWidget .oo-ui-buttonElement-button,
    #ooui-44 .oo-ui-toolGroup-tools .oo-ui-tool-title,
    #ooui-116 {
        filter: invert(1) 
    }
    #content .oo-ui-icon-undo.oo-ui-image-progressive,
    #content .oo-ui-icon-redo.oo-ui-image-progressive,
    #content .oo-ui-icon-link.oo-ui-image-progressive,
    #content .oo-ui-icon-help.oo-ui-image-progressive,
    #content .oo-ui-icon-window.oo-ui-image-progressive,
    #content .oo-ui-icon-tag.oo-ui-image-progressive,
    #content .oo-ui-icon-pageSettings.oo-ui-image-progressive,
    #content .oo-ui-icon-settings.oo-ui-image-progressive,
    #content .oo-ui-icon-textLanguage.oo-ui-image-progressive,
    #content .oo-ui-icon-puzzle.oo-ui-image-progressive,
    #content .oo-ui-icon-textDirRTL.oo-ui-image-progressive,
    #content .oo-ui-icon-articleSearch.oo-ui-image-progressive {
        filter: invert(0) 
    }


.ts-inner {
    #content .ve-ui-toolbar-group-format .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
     max-width: initial
    #content .ve-ui-toolbar-group-cite .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
}
    #content .ve-ui-toolbar-group-insert .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
    .ve-ui-linearContextItem-body,
    #content .ve-ce-tableCellNode-header p,
    .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel .oo-ui-optionWidget .oo-ui-labelElement-label,
    .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item {
        color: #000
    }
    .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item .oo-ui-buttonElement a:not(new) .oo-ui-labelElement-label {
        color: #009E9E !important 
    }
    .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item .oo-ui-buttonElement a:visited .oo-ui-labelElement-label {
        color: #f533db !important 
    }
    #content .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link:hover {
        background: #f533db;
        color: #000000
    }
    #ooui-44 .oo-ui-tool-link:hover,
    #ooui-116 .oo-ui-labelElement:hover {
        filter: invert(1);
        background: #f533db;
        color: #000000
     }
    #content .oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-labelElement-label,
    #content .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-top-title .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-fieldLayout-header .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-optionWidget .oo-ui-labelElement-label,
    .oo-ui-window-head .oo-ui-processDialog-navigation .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-fieldsetLayout-header .oo-ui-labelElement-label,
    .oo-ui-window-body .ve-ui-mwMediaDialog-panel-imageinfo-info .ve-ui-mwMediaDialog-panel-imageinfo-details .oo-ui-labelElement-label,
    .oo-ui-window-body .ve-ui-mwMediaDialog-panel-imageinfo-main .oo-ui-labelElement-label,
    #content .ve-ce-branchNode .ve-ce-tableCellNode-header p,
    .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel #ooui-54.oo-ui-optionWidget .oo-ui-labelElement-label,
    .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel #ooui-56.oo-ui-optionWidget .oo-ui-labelElement-label
    {
        color: #fff
    }
    code,
    .mbox.notice.hidden {
        background-color: #808080 !important
    }


.diff-addedline {
    #pagehistory li.selected a {
    border-color: #f533db
        color: #A86D00
}
    }
   
   
/* This is to blur boss spoiler images. */
    .desktop-spoiler img {
        filter: blur(20px);
    }


.diff-addedline .diffchange {
    .desktop-spoiler img:hover,
    background-color: #6f027c
    .desktop-spoiler img:active {
}
        filter: blur(0px)
    }


#mw-site-navigation .sidebar-chunk,
    button.tabber__header__prev, button.tabber__header__next {
#mw-related-navigation .sidebar-chunk {
        filter: invert(1) 
    background: #ffd9f1;
    }
    color: #f533db;
    /* you WILL obey. */
    font-family: 'Exo';
    .tocnumber,
    border-radius: 10px;
    .oo-ui-window-content .oo-ui-labelElement-label .ve-ui-mwGalleryDialog-remove-button {
    border: 1px solid #f533db;
        color: #fff !important
}
    }


#mw-content-block {
    /* This is the background colour for the main body. */
    background-image: url(https://anarch.games/starlivht/images/bg.jpg);
    #mw-content,
     background-attachment: fixed;
    #catlinks,
    background-size: 1000px;
    #toc,
    background-position: 50% 50%;
    .mw-datatable tr:hover td,
    background-clip: border-box;
    .mw-prefs-buttons,
}
    textarea,
    #wpSummary,
    #wpDestFile,
    .oo-ui-textInputWidget .oo-ui-inputWidget-input,
    .mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
    .mw-editform .editOptions,
    pre,
    ul#filetoc,
    .diff-context {
        background-color: rgba(14, 25, 26, 0.8)
    }
   
    /* This is the visual editor gallery input text. */
     .ve-ce-branchNode .ve-ce-contentBranchNode .ve-ce-paragraphNode .ve-ce-generated-wrapper p {
        color: #000 !important
    }


#mw-site-navigation .sidebar-chunk h3,
    /* This is the link colour. */
#p-banner {
    #mw-content a:not(.new),
    font-family: 'Exo', sans serif
    .toctogglelabel {
}
        color: #37fcff
    }


.cosmos-bannerOption * {
    /* This is the link colour for datatable headers. */
    fill: #fff;
    .mw-datatable th a,
    stroke: #fff
    #mw-content .oo-ui-popupWidget-popup .ve-ui-context-menu .ve-ui-linearContextItem-body a:not(.new) {
}
        color: #009E9E !important
    }


/* This covers pretty much all text I can find. */
    .diff-deletedline .diffchange,
body #mw-content-text,
    .mw-message-box-warning {
.mw-body h1,
        background-color: #cc8b12
.mw-body h2,
    }
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-capiunto-infobox,
.editOptions,
.editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label,
.oo-ui-fieldLayout-body,
.oo-ui-labelWidget.oo-ui-inline-help,
#firstHeading,
.ve-ce-contentBranchNode,
.cosmos-header__sitename a:any-link,
.cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li > a:not(.wds-button),
.cosmos-header__counter *,
#cosmos-footer-footerContent *,
body #mw-content,
.cosmos-dropdown-list > ul > li > :only-child *,
body .mw-changeslist-line,
.oo-ui-fieldLayout-header,
body .wikitable > * > tr > td,
table.mw-datatable,
.oo-ui-radioSelectInputWidget .oo-ui-labelElement-label,
#personal h2,
.thumbcaption,
textarea,
#wpSummary,
#wpDestFile,
.oo-ui-textInputWidget .oo-ui-inputWidget-input,
.mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
code,
pre,
#mw_metadata * {
    color: #fff;
    font-family: 'Exo';
}


code {
    body .oo-ui-tabSelectWidget-framed {
    background-color: darkgray
        background-color: #ffabdf
}
    }


    /* This is the background colour for elements designed to blend in with the background, but still provide a readable backdrop for things. */
    li.gallerybox div.thumb,
    .mw-body li.gallerybox div.thumb,
    .mw-capiunto-infobox,
    .cosmos-header *,
    .cosmos-header:before,
    .wds-dropdown__content,
    .cosmos-header .wds-dropdown__content,
    #cosmos-footer-footerContent,
    .cosmos-dropdown-list:not(.cosmos-personalTools-list),
    #cosmos-footer,
    .wikitable:not([style*="background-color"]) > * > tr > td,
    .mw-datatable tr td,
    .thumbinner,
    #mw_metadata,
    .mw-body .mw-search-profile-tabs,
    figure[typeof~="mw:File/Thumb"].mw-halign-right,
    figure[typeof~="mw:File/Frame"].mw-halign-right,
    figure[typeof~="mw:Image/Thumb"].mw-halign-right,
    figure[typeof~="mw:Video/Thumb"].mw-halign-right,
    figure[typeof~="mw:Audio/Thumb"].mw-halign-right,
    figure[typeof~="mw:Image/Frame"].mw-halign-right,
    figure[typeof~="mw:Video/Frame"].mw-halign-right,
    figure[typeof~="mw:Audio/Frame"].mw-halign-right,
    .mw-content-ltr figure[typeof~="mw:File/Thumb"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:File/Frame"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Image/Thumb"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Video/Thumb"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Audio/Thumb"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Image/Frame"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Video/Frame"] > figcaption,
    .mw-content-ltr figure[typeof~="mw:Audio/Frame"] > figcaption {
        background: #352432
    }


.album-spoiler img {
    thumbinner.cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) {
    filter: blur(20px);
        color: #f533db
}
    }


.album-spoiler img:hover,
    .oo-ui-window-content .oo-ui-labelElement-label,
.album-spoiler img:active {
    .ve-ce-branchNode-slug,
    filter: blur(0px)
    .ve-ui-linearContextItem-title,
}
    .mw-datatable th,
    .style-table > * > td,
    .slideshow-current div.gallerytext {
        color: #000
    }


    .headerbox,
    #mw-headline {
        font-family: 'Arial Narrow', Arial, sans serif !important
    }


/* you WILL obey. */
    .mw-capiunto-infobox,
.tocnumber {
    .toc {
    color: #fff !important
}


/* This is the background colour for the main body. */
        border-radius: 10px
#mw-content,
    }
#catlinks,
#toc,
.mw-datatable tr:hover td,
.mw-prefs-buttons,
textarea,
#wpSummary,
#wpDestFile,
.oo-ui-textInputWidget .oo-ui-inputWidget-input,
.mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
.mw-editform .editOptions,
pre,
ul#filetoc {
    background-color: rgba(14, 25, 26, 0.7)
}


/* This is the link colour. */
    .desktop-spoiler img {
#mw-content a:not(.new) {
        filter: blur(20px);
    color: #37fcfffc
    }
}


body .oo-ui-tabSelectWidget-framed {
    .desktop-spoiler img:hover,
    background-color: #ffabdf
    .desktop-spoiler img:active {
}
        filter: blur(0px)
    }


/* This is the background colour for elements designed to blend in with the background, but still provide a readable backdrop for things. */
    .song-table.Clover > tbody > tr > th,
li.gallerybox div.thumb,
    .Grace-style > tbody > tr > td > table > tbody > tr > th,
.mw-body li.gallerybox div.thumb,
    .Clover-folder {
.mw-capiunto-infobox,
        background-color: #2ec817 !important;
.cosmos-header *,
        background-color: rgba(46, 200, 23, 0.3) !important;
.cosmos-header:before,
    }
.wds-dropdown__content,
    .song-table.Dia > tbody > tr > th,
.cosmos-header .wds-dropdown__content,
    .song-table.Diamond > tbody > tr > th,
#cosmos-footer-footerContent,
    .Sera-style > tbody > tr > td > table > tbody > tr > th,
.cosmos-dropdown-list:not(.cosmos-personalTools-list),
    .Dia-folder {
#cosmos-footer,
        background-color: #52a1fe !important;
.wikitable:not([style*="background-color"]) > * > tr > td,
        background-color: rgba(82, 161, 254, 0.3) !important;
.mw-datatable tr td,
    }
.thumbinner,
    .song-table.Heart > tbody > tr > th,
#mw_metadata * {
    .Sumire-style > tbody > tr > td > table > tbody > tr > th,
    background: #352432
    .Heart-folder {
}
        background-color: #ff5558 !important;
        background-color: rgba(255, 85, 88, 0.3) !important;
    }
    .Hitori-style > tbody > tr > td > table > tbody > tr > th {
        background-color: #ff5558 !important;
        background-color: rgba(225, 65, 68, 0.3) !important;
    }
    .song-table.Spade > tbody > tr > th,
    .Hakuno-style > tbody > tr > td > table > tbody > tr > th,
    .Spade-folder {
        background-color: #f1f1f1 !important;
        background-color: rgba(241, 241, 241, 0.3) !important;
    }
    .song-table.Joker > tbody > tr > th,
    .Joker-style > tbody > tr > td > table > tbody > tr > th,
    .Joker-folder {
        background-color: #B90000 !important;
        background-color: rgba(185, 0, 0, 0.35) !important;
    }


thumbinner.cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) {
    .song-table td {
    color: #f533db
        text-align: center;
}
    }


.oo-ui-window-content .oo-ui-labelElement-label,
.ve-ce-branchNode-slug,
.ve-ui-linearContextItem-title {
    color: #000
}


.headerbox,
    /* Resizing song infobox album art */
#mw-headline {
    .album-image > .portable-infobox {
    font-family: 'Arial Narrow', Arial, sans serif !important
        max-width: 200px;
}
        height: auto;
    }


.mw-capiunto-infobox,
.toc {


    border-radius: 10px
    /* Sortable table hover highlight */
}
    .article-table.sortable > tbody > tr:hover,
    .titles-list > tbody > tr:hover,
    .achievements-list > tbody > tr:hover,
    .shop-list > tbody > tr:hover,
    .style-table > tbody > tr:hover,
    .lost-data > tbody > tr:hover,
    .modules-table > tbody > tr:hover {
        background-color: #6f027c;
        left: -10px;
    }


.desktop-spoiler img {
    /* For lyrics, colours indicating who's singing */
    filter: blur(20px);
    .seratext {
}
        color: #3090FF;
    }
    .sumiretext {
        color: #FF5252;
    }
    .gracetext {
        color: #248900;
    }
    .hakunotext {
        color: #725B5F;
    }
    .jokertext {
        color: #cb3838;
    }
    .shiontext {
        color: #AF0000;
    }
    .asukatext {
        color: #AF8900;
    }
    .hikaritext {
        color: #35AACE;
    }
    .sltext {
        color: #CB3890;
    }
    .srtext {
        color: #F49B2E;
    }
    .beyondtext {
        color: #4D8AC6;
    }
    .aritext {
        color: #843636;
    }
    /* For lyrics in lines featuring two or more characters, so that the line includes the colours of everyone singing */
    .serashiontext {
        background: -webkit-linear-gradient(.2turn, #52A1FF, #AF0000);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .asukahikaritext {
        background: -webkit-linear-gradient(.3turn, #AF8900, #35AACE);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .asukashiontext {
        background: -webkit-linear-gradient(right, #AF8900 30%, #AF0000);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .hakunosumiretext {
        background: -webkit-linear-gradient(.2turn, #725B5F, #FF5252);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .seragracetext {
        background: -webkit-linear-gradient(.2turn, #3090FF, #248900);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .cottext {
        background: -webkit-linear-gradient(.3turn, #CB3890, #F49B2E);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .jokergracetext {
        background: -webkit-linear-gradient(.2turn, #cb3838, #248900);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .serasumiretext {
        background: -webkit-linear-gradient(.2turn, #3090FF, #FF5252);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .hakunogracetext {
        background: -webkit-linear-gradient(.2turn, #725B5F, #248900);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .gracesumirehakunotext {
        background: -webkit-linear-gradient(.2turn, #248900, #FF5252, #725B5F);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }
    .seragracesumitext {
        background: -webkit-linear-gradient(.2turn, #3090FF, #248900, #FF5252);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        color: transparent;
        background-clip: text;
    }


.desktop-spoiler img:hover,
    /* SL Joker spoiler warning, for SLTH warning */
.desktop-spoiler img:active {
    .sljokerwarning::after {
    filter: blur(0px)
        content: '';
}
        background-image: url(https://anarch.games/noisz/wiki/images/3/3f/Gracespoiler.png);
        height: 179px;
        width: 179px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -170px;
        left: 60px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .sljokerboxtext .mbox {
        margin-left: 50px;
        padding-left: 140px;
        background-image: url(https://anarch.games/noisz/wiki/images/2/2f/Dialogue_Box_BG_TH.jpg) !important;
        background-size: cover;
        border: 2px solid #ec625e !important;
        border-left-color: #ec625e !important;
        box-shadow: 0 0 10px #ec625e, inset 0 0 10px #ec625e;
        border-radius: 10px !important;
        background-position: center;
        min-height: 90px;
        color: white;
    }


.song-table.Clover > tbody > tr > th,
    /* SL Beyond spoiler warning, for SL spoiler warning */
.Grace-style > tbody > tr > td > table > tbody > tr > th,
    .slbeyondwarning::after {
.Clover-folder {
        content: '';
    background-color: #2ec817 !important;
        background-image: url(https://anarch.games/noisz/wiki/images/0/02/Beyondspoiler.png);
    background-color: rgba(46, 200, 23, 0.3) !important;
        height: 80px;
}
        width: 162px;
.song-table.Dia > tbody > tr > th,
        background-size: contain;
.song-table.Diamond > tbody > tr > th,
        background-repeat: no-repeat;
.Sera-style > tbody > tr > td > table > tbody > tr > th,
        display: block;
.Dia-folder {
        position: relative;
    background-color: #52a1fe !important;
        top: -167px;
    background-color: rgba(82, 161, 254, 0.3) !important;
        left: 60px;
}
        margin-bottom: -180px;
.song-table.Heart > tbody > tr > th,
        padding-top: 80px;
.Sumire-style > tbody > tr > td > table > tbody > tr > th,
    }
.Heart-folder {
    .slbeyondboxtext .mbox {
    background-color: #ff5558 !important;
        margin-left: 50px;
    background-color: rgba(255, 85, 88, 0.3) !important;
        padding-left: 50px;
}
        background-image: url(https://anarch.games/noisz/wiki/images/0/04/Dialogue_Box_BG.jpg) !important;
.Hitori-style > tbody > tr > td > table > tbody > tr > th {
        background-size: cover;
    background-color: #ff5558 !important;
        border: 2px solid #FCAAE2 !important;
    background-color: rgba(225, 65, 68, 0.3) !important;
        border-left-color: #FCAAE2 !important;
}
        box-shadow: 0 0 10px #FC78E2, inset 0 0 10px #FC78E2;
.song-table.Spade > tbody > tr > th,
        border-radius: 10px !important;
.Hakuno-style > tbody > tr > td > table > tbody > tr > th,
        background-position: center;
.Spade-folder {
        color: white
    background-color: #f1f1f1 !important;
    }
    background-color: rgba(241, 241, 241, 0.3) !important;
}
.song-table.Joker > tbody > tr > th,
.Joker-style > tbody > tr > td > table > tbody > tr > th,
.Joker-folder {
    background-color: #B90000 !important;
    background-color: rgba(185, 0, 0, 0.35) !important;
}


.song-table td {
    /* Arietta  spoiler warning, for NOISZ Ignition spoiler warning */
    text-align: center;
    .ariwarning::after {
}
        content: '';
        background-image: url(https://anarch.games/noisz/wiki/images/c/c0/Arispoiler.png);
        height: 150px;
        width: 162px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -149px;
        left: 50px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .ariwarning .mbox {
        margin-left: 50px;
        padding-left: 50px;
        background-color: #525456 !important;
        border: 2px solid #C68281 !important;
        border-left-color: #C68281 !important;
        border-radius: 10px !important;
        box-shadow: 0 0 10px #931010, inset 0 0 10px #931010;
        color: white
    }


    .karinwarning::after {
        content: '';
        background-image: url(https://anarch.games/noisz/wiki/images/b/bf/Karindisambiguation.png);
        height: 200px;
        width: 162px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -146px;
        left: 40px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .karinwarning .mbox {
        margin-left: 50px;
        padding-left: 50px;
        background-color: #584F8D !important;
        border: 2px solid #01D3FE !important;
        border-left-color: #01D3FE !important;
        border-radius: 10px !important;
        box-shadow: 0 0 10px #4599FF, inset 0 0 10px #4599FF;
        color: white
    }


/* Resizing song infobox album art */
    /* Beyond warning, for Needs Information banner */
.album-image > .portable-infobox {
    .beyondwarning::after {
    max-width: 200px;
        content: '';
    height: auto;
        background-image: url(https://anarch.games/noisz/wiki/images/e/e5/Beyondneedsinfo.png);
}
        height: 80px;
        width: 162px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -167px;
        left: 55px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .beyondwarning .mbox {
        margin-left: 50px;
        padding-left: 50px;
        background-color: #525456 !important;
        border: 2px solid #ABF6F7 !important;
        border-left-color: #ABF6F7 !important;
        border-radius: 10px !important;
        box-shadow: 0 0 10px #50ABB7, inset 0 0 10px #50ABB7;
        color: white
    }


    /* Stornel spoiler warning, for NOISZ re:VERSE spoiler warning */
    .stornelwarning::after {
        content: '';
        background-image: url(https://anarch.games/noisz/wiki/images/d/de/Stornelspoiler.png);
        height: 80px;
        width: 162px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -167px;
        left: 60px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .stornelwarning .mbox {
        margin-left: 50px;
        padding-left: 50px;
        background-color: #525456 !important;
        border: 2px solid #9B9B9B !important;
        border-left-color: #9B9B9B !important;
        border-radius: 10px !important;
        box-shadow: 0 0 10px #828282, inset 0 0 10px #828282;
        color: white
    }


/* Sortable table hover highlight */
    /* Gaius spoiler warning, for NOISZ episode G spoiler warning */
.article-table.sortable > tbody > tr:hover {
    .gaiuswarning::after {
    background-color: pink;
        content: '';
    background-color: rgba(255, 171, 223, 0.8);
        background-image: url(https://anarch.games/noisz/wiki/images/0/07/Gaius_Antiphon_EPISODE_G.png);
    left: -10px;
        height: 150px;
}
        width: 162px;
        background-size: contain;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        top: -172px;
        left: 60px;
        margin-bottom: -180px;
        padding-top: 80px;
    }
    .gaiuswarning .mbox {
        margin-left: 50px;
        padding-left: 50px;
        background-color: #212121 !important;
        border: 2px solid #87CD92 !important;
        border-left-color: #87CD92 !important;
        border-radius: 10px !important;
        box-shadow: 0 0 10px #109525, inset 0 0 10px #109525;
        color: white
    }


/* For lyrics, colours indicating who's singing */
    /* Main Character (NOISZ)  spoiler warning, for NOISZ series spoiler warning */
.seratext {
    .genbuwarning::after {
    color: #3090FF;
        content: '';
}
        background-image: url(https://anarch.games/noisz/wiki/images/8/82/Genbuwarning.png);
.sumiretext {
        height: 100px;
    color: #FF5252;
        max-width: 162px;
}
        background-size: contain;
.gracetext {
        background-repeat: no-repeat;
    color: #248900;
        display: block;
}
        position: relative;
.hakunotext {
        top: -175px;
    color: #725B5F;
        left: 55px;
}
        margin-bottom: -180px;
.jokertext {
        padding-top: 80px;
    color: #cb3838;
    }
}
    .genbuwarning .mbox {
.shiontext {
        margin-left: 50px;
    color: #AF0000;
        padding-left: 50px;
}
        background-color: #525456 !important;
.asukatext {
        border: 3px solid #CA88C3 !important;
    color: #AF8900;
        border-left-color: #CA88C3 !important;
}
        border-radius: 10px !important;
.hikaritext {
        box-shadow: 0 0 10px #9C158E, 0 0 10px #9C158E;
    color: #35AACE;
        background-size: cover;
}
        background-position: center;
.sltext {
        background-image: url(https://anarch.games/noisz/wiki/images/2/2f/Dialogue_Box_BG_TH.jpg) !important;
    color: #CB3890;
        filter: hue-rotate(-145deg) saturate(1.4) brightness(0.9);
}
        color: white
.srtext {
    }
    color: #F49B2E;
   
}
.beyondtext {
    color: #4D8AC6;
}
.aritext {
    color: #843636;
}
/* For lyrics in lines featuring two or more characters, so that the line includes the colours of everyone singing */
.serashiontext {
    background: -webkit-linear-gradient(.2turn, #52A1FF, #AF0000);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.asukahikaritext {
    background: -webkit-linear-gradient(.3turn, #AF8900, #35AACE);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.asukashiontext {
    background: -webkit-linear-gradient(right, #AF8900 30%, #AF0000);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.hakunosumiretext {
    background: -webkit-linear-gradient(.2turn, #725B5F, #FF5252);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.seragracetext {
    background: -webkit-linear-gradient(.2turn, #3090FF, #248900);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.cottext {
    background: -webkit-linear-gradient(.3turn, #CB3890, #F49B2E);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.jokergracetext {
    background: -webkit-linear-gradient(.2turn, #cb3838, #248900);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.serasumiretext {
    background: -webkit-linear-gradient(.2turn, #3090FF, #FF5252);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.hakunogracetext {
    background: -webkit-linear-gradient(.2turn, #725B5F, #248900);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.gracesumirehakunotext {
    background: -webkit-linear-gradient(.2turn, #248900, #FF5252, #725B5F);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}
.seragracesumitext {
    background: -webkit-linear-gradient(.2turn, #3090FF, #248900, #FF5252);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    color: transparent;
    background-clip: text;
}


/* SL Joker spoiler warning, for SLTH warning */
.sljokerwarning::after {
    content: '';
    background-image: url(https://anarch.games/noisz/wiki/images/f/fc/Jokerspoiler.png);
    height: 150px;
    width: 162px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    position: relative;
    top: -170px;
    left: 60px;
    margin-bottom: -180px;
    padding-top: 80px;
}
.sljokerboxtext .mbox {
    margin-left: 50px;
    padding-left: 140px;
    background-image: url(https://anarch.games/noisz/wiki/images/2/2f/Dialogue_Box_BG_TH.jpg) !important;
    background-size: cover;
    border: 2px solid #ec625e !important;
    border-left-color: #ec625e !important;
    box-shadow: 0 0 10px #ec625e;
    border-radius: 10px !important;
    background-position: center;
    min-height: 90px;
    color: white;
}


/* SL Beyond spoiler warning, for SL spoiler warning */
.slbeyondwarning::after {
    content: '';
    background-image: url(https://anarch.games/noisz/wiki/images/0/02/Beyondspoiler.png);
    height: 100px;
    width: 162px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    position: relative;
    top: -187px;
    left: 60px;
    margin-bottom: -180px;
    padding-top: 80px;
}
.slbeyondboxtext .mbox {
    margin-left: 50px;
    padding-left: 50px;
    background-image: url(https://anarch.games/noisz/wiki/images/0/04/Dialogue_Box_BG.jpg) !important;
    background-size: cover;
    border: 2px solid #FCAAE2 !important;
    border-left-color: #FCAAE2 !important;
    box-shadow: 0 0 10px #FC78E2;
    border-radius: 10px !important;
    background-position: center;
    color: white
}


/* Arietta  spoiler warning, for NOISZ Ignition spoiler warning */
    /* For NOISZ style tables */
.ariwarning::after {
    .Arietta > tbody > tr > th {
    content: '';
        background-color: #AE191C !important;
    background-image: url(https://anarch.games/noisz/wiki/images/c/c0/Arispoiler.png);
        background-color: rgba(358, 85, 68, 0.5) !important;
    height: 150px;
    }
    width: 162px;
    .Beyond > tbody > tr > th {
    background-size: contain;
        background-color: #5BC5EF !important;
    background-repeat: no-repeat;
        background-color: rgba(91, 197, 239, 0.5) !important;
    display: block;
    }
    position: relative;
    .Stornel > tbody > tr > th {
    top: -149px;
        background-color: white !important;
    left: 50px;
        background-color: rgba(255, 255, 255, 0.5) !important;
    margin-bottom: -180px;
        color: black !important;
    padding-top: 80px;
    }
}
    .Gaius > tbody > tr > th {
.ariwarning .mbox {
        background-color: rgba(2, 124, 0, 0.5) !important;
    margin-left: 50px;
        background-color: green;
    padding-left: 50px;
        color: white !important;
    background-color: #525456 !important;
    }
    border: 2px solid #C68281 !important;
    /* Transparency to main container */
    border-left-color: #C68281 !important;
    .page__main,
    border-radius: 10px !important;
    .wikiEditor-ui,
    box-shadow: 0 0 10px #931010;
    .page__right-rail {
    color: white
        background-color: var(--theme-page-background-color);
}
        background-color: rgba(var(--theme-page-background-color--rgb), 0.7);
    }


/* Beyond warning, for Needs Information banner */
    /* For the front page banner */
.beyondwarning::after {
    .noiszbanner img {
    content: '';
        width: 100%;
    background-image: url(https://anarch.games/noisz/wiki/images/e/e5/Beyondneedsinfo.png);
        height: auto;
    height: 80px;
    }
    width: 162px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    position: relative;
    top: -167px;
    left: 55px;
    margin-bottom: -180px;
    padding-top: 80px;
}
.beyondwarning .mbox {
    margin-left: 50px;
    padding-left: 50px;
    background-color: #525456 !important;
    border: 2px solid #ABF6F7 !important;
    border-left-color: #ABF6F7 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 10px #50ABB7;
    color: white
}


/* Stornel spoiler warning, for NOISZ re:VERSE spoiler warning */
    /* So Bandcamp players fill the whole width and don't look really mispositioned */
.stornelwarning::after {
    .inline_player {
    content: '';
        display: contents !important;
    background-image: url(https://anarch.games/noisz/wiki/images/d/de/Stornelspoiler.png);
    }
    height: 80px;
    width: 162px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    position: relative;
    top: -167px;
    left: 60px;
    margin-bottom: -180px;
    padding-top: 80px;
}
.stornelwarning .mbox {
    margin-left: 50px;
    padding-left: 50px;
    background-color: #525456 !important;
    border: 2px solid #9B9B9B !important;
    border-left-color: #9B9B9B !important;
    border-radius: 10px !important;
    box-shadow: 0 0 10px #828282;
    color: white
}


/* Gaius spoiler warning, for NOISZ episode G spoiler warning */
    /* For the events countdowns headers */
.gaiuswarning::after {
    .sl-events img {
    content: '';
        -webkit-transition: all 0.2s ease;
    background-image: url(https://anarch.games/noisz/wiki/images/0/07/Gaius_Antiphon_EPISODE_G.png);
        transition: all 0.2s ease;
    height: 150px;
    }
    width: 162px;
    .sl-events img:hover {
    background-size: contain;
        transform: scale(1.0);
    background-repeat: no-repeat;
    }
    display: block;
    position: relative;
    top: -172px;
    left: 60px;
    margin-bottom: -180px;
    padding-top: 80px;
}
.gaiuswarning .mbox {
    margin-left: 50px;
    padding-left: 50px;
    background-color: #626365 !important;
    border: 2px solid #87CD92 !important;
    border-left-color: #87CD92 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 10px #109525;
    color: white
}


/* Main Character (NOISZ)  spoiler warning, for NOISZ series spoiler warning */
    /*For the headers on the frontpage*/
.mcwarning::after {
    h2.headerbox {
    content: '';
        padding-left: 20px;
    background-image: url(https://anarch.games/noisz/wiki/images/2/2e/Ignition_Protagonist.png);
        padding-bottom: 10px;
    height: 150px;
        padding-top: 10px;
    width: 162px;
        background-color: #FFABDF;
    background-size: contain;
        color: #E345A4 !important;
    background-repeat: no-repeat;
        text-transform: uppercase;
    display: block;
    }
    position: relative;
    .headerbox .mw-editsection a,
    top: -149px;
    .wds-dropdown * {
    left: 50px;
        color: #E345A4;
    margin-bottom: -180px;
    }
    padding-top: 80px;
}
.mcwarning .mbox {
    margin-left: 50px;
    padding-left: 50px;
    background-color: #525456 !important;
    border: 2px solid #CA88C3 !important;
    border-left-color: #CA88C3 !important;
    border-radius: 10px !important;
    box-shadow: 0 0 10px #9C158E;
    color: white
}


    .header-box {
        padding-left: 30px;
        padding-bottom: 10px;
        padding-top: 10px;
        background-color: #FFABDF;
        color: #f533db;
        font-size: 38px;
        font-family: 'Arial Narrow', Arial, sans-serif;
        font-weight: bold;
        text-shadow: 0 0 6px rgba(242, 73, 177, 0.4);
        box-shadow: 0 0 20px 0 #f249b1
    }


/* For NOISZ style tables */
    /* For the menu index buttons on the frontpage */
.Arietta > tbody > tr > th {
    .main-page-button img,
    background-color: #AE191C !important;
    #NOISZ_ST--RLIVHT-Gameplay img {
    background-color: rgba(358, 85, 68, 0.5) !important;
        filter: brightness(1.0);
}
        -webkit-transition: all 0.2s ease;
.Beyond > tbody > tr > th {
        transition: all 0.2s ease;
    background-color: #5BC5EF !important;
    }
    background-color: rgba(91, 197, 239, 0.5) !important;
    .main-page-button img:hover,
}
    #NOISZ_ST--RLIVHT-Gameplay img:hover {
.Stornel > tbody > tr > th {
        filter: brightness(1.5);
    background-color: white !important;
        -webkit-filter: brightness(1.5);
    background-color: rgba(255, 255, 255, 0.5) !important;
    }
    color: black !important;
    .main-page-button img:active,
}
    #NOISZ_ST--RLIVHT-Gameplay img:active {
.Gaius > tbody > tr > th {
        filter: brightness(0.7);
    background-color: rgba(2, 124, 0, 0.5) !important;
        -webkit-filter: brightness(0.7);
    background-color: green;
    }
    color: white !important;
}
/* Transparency to main container */
.page__main,
.wikiEditor-ui,
.page__right-rail {
    background-color: var(--theme-page-background-color);
    background-color: rgba(var(--theme-page-background-color--rgb), 0.7);
}


/* For the front page banner */
    /* Normal green is hard on the eyes */
.noiszbanner img {
    .Clover-folder,
    width: 100%;
    .Heart-folder {
    height: auto;
        filter: grayscale(0.4);
}
        -webkit-filter: grayscale(0.4);
    }
    /* Mouseover event when the user hovers over an image in Upcoming */
    .coming-soon-slider img {
        transition: transform 0.6s ease-in-out;
    }
    .coming-soon-slider img:hover {
        transform: scale(1.05);
    }


/* So Bandcamp players fill the whole width and don't look really mispositioned */
    /* So SL story table header colours change with theme */
.inline_player {
    .sl-header > tbody > tr:nth-child(1),
    display: contents !important;
    .sl-story-navbar,
}
    .sl-gameplay-navbox > table > tbody > tr > th {
        background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
    }
    .noisz-story-navbar {
        background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
        filter: hue-rotate(300deg);
    }
    .noisz-story-navbar a {
        filter: hue-rotate(-300deg);
    }


/* For the events countdowns headers */
    /* ALternating colours to make tables slightly more readable */
.sl-events img {
    .sl-chapter-table tr:nth-child(2n + 1),
    -webkit-transition: all 0.2s ease;
    .song-table tr:nth-child(2n + 1),
    transition: all 0.2s ease;
    .sl-song-table tr:nth-child(2n + 1),
}
    .artists-table tr:nth-child(2n + 1) {
.sl-events img:hover {
        background-color: #7B4F7C;
    transform: scale(1.0);
        background-color: rgba(128, 128, 128, 0.2);
}
    }


/*For the headers on the frontpage*/
    .song-table th {
h2.headerbox {
        background: rgba(242, 73, 177, 0.3)
    padding-left: 20px;
    }
    padding-bottom: 10px;
    padding-top: 10px;
    background-color: #FFABDF;
    color: #E345A4 !important;
    text-transform: uppercase;
}
.headerbox .mw-editsection a,
.wds-dropdown * {
    color: #E345A4;
}


.header-box {
    .sl-character-navigation {
    padding-left: 30px;
        border: 1px solid var(--theme-accent-color);
    padding-bottom: 10px;
    }
    padding-top: 10px;
    background-color: #FFABDF;
    color: #f533db;
    font-size: 38px;
    font-family: 'Arial Narrow', Arial, sans-serif;
    font-weight: bold;
    text-shadow: 0 0 6px rgba(242, 73, 177, 0.4);
    box-shadow: 0 0 20px 0 #f249b1
}


/* For the menu index buttons on the frontpage */
    /* For the diamonds around the SL story LV requirements */
.main-page-button img,
    .gracelv:after {
#NOISZ_ST--RLIVHT-Gameplay img {
        content: url(https://anarch.games/noisz/wiki/images/4/4a/Gracediamondempty.png);
    filter: brightness(1.0);
    }
    -webkit-transition: all 0.2s ease;
    .seralv:after {
    transition: all 0.2s ease;
        content: url(https://anarch.games/noisz/wiki/images/a/a3/Seradiamondempty.png);
}
    }
.main-page-button img:hover,
    .sumirelv:after {
#NOISZ_ST--RLIVHT-Gameplay img:hover {
        content: url(https://anarch.games/noisz/wiki/images/9/96/Sumirediamondempty.png);
    filter: brightness(1.25);
    }
    -webkit-filter: brightness(1.1);
    .hakunolv:after {
}
        content: url(https://anarch.games/noisz/wiki/images/a/ac/Hakunodiamondempty.png);
.main-page-button img:active,
        filter: brightness(0.85);
#NOISZ_ST--RLIVHT-Gameplay img:active {
    }
    filter: brightness(0.7);
    .jokerlv:after {
    -webkit-filter: brightness(0.7);
        content: url(https://anarch.games/noisz/wiki/images/8/88/Jokerdiamondempty.png);
}
    }


/* Normal green is hard on the eyes */
.Clover-folder,
.Heart-folder {
    filter: grayscale(0.4);
    -webkit-filter: grayscale(0.4);
}
/* Mouseover event when the user hovers over an image in Upcoming */
.coming-soon-slider img {
    transition: transform 0.6s ease-in-out;
}
.coming-soon-slider img:hover {
    transform: scale(1.1);
}


/* So SL story table header colours change with theme */
.sl-header > tbody > tr:nth-child(1),
.sl-story-navbar,
.sl-gameplay-navbox > table > tbody > tr > th {
    background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
}
.noisz-story-navbar {
    background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
    filter: hue-rotate(300deg);
}
.noisz-story-navbar a {
    filter: hue-rotate(-300deg);
}
/* For story chapter table */
/* Grace */
.sl-chapter-table td:nth-child(4) {
    border: 1px solid #2ec817;
    padding: 0px;
}
/* Sera  */
.sl-chapter-table td:nth-child(5) {
    border: 1px solid #52a1fe;
    padding: 0px;
}
/* Sumire  */
.sl-chapter-table td:nth-child(6) {
    border: 1px solid #ff5558;
    padding: 0px;
}
/* Hakuno  */
.sl-chapter-table td:nth-child(7) {
    border: 1px solid #f1f1f1;
    padding: 0px;
}
/* Joker  */
.sl-chapter-table td:nth-child(8) {
    border: 1px solid #B90000;
    padding: 0px;
}
/* Chapter row */
.sl-chapter-table td:nth-child(1) {
    padding: 5px;
}
/* ALternating colours to make tables slightly more readable */
.sl-chapter-table tr:nth-child(2n + 1),
.sl-song-table tr:nth-child(2n + 1),
.artists-table tr:nth-child(2n + 1) {
    background-color: #7B4F7C;
    background-color: rgba(128, 128, 128, 0.2);
}


.sl-character-navigation {
    border: 1px solid var(--theme-accent-color);
}


/* For the diamonds around the SL story LV requirements */
    .gracelv:after,
.gracelv:after {
    .seralv:after,
    content: url(https://anarch.games/noisz/wiki/images/4/4a/Gracediamondempty.png);
    .sumirelv:after,
}
    .hakunolv:after,
.seralv:after {
    .jokerlv:after {
    content: url(https://anarch.games/noisz/wiki/images/a/a3/Seradiamondempty.png);
        position: relative;
}
        display: -webkit-flex;
.sumirelv:after {
        display: flex;
    content: url(https://anarch.games/noisz/wiki/images/9/96/Sumirediamondempty.png);
        height: 35px;
}
        top: -34px;
.hakunolv:after {
        left: 9px;
    content: url(https://anarch.games/noisz/wiki/images/a/ac/Hakunodiamondempty.png);
    }
    filter: brightness(0.85);
    .gracelv b,
}
    .seralv b,
.jokerlv:after {
    .sumirelv b,
    content: url(https://anarch.games/noisz/wiki/images/8/88/Jokerdiamondempty.png);
    .hakunolv b,
}
    .jokerlv b {
        left: 25%;
        position: relative;
        z-index: 2;
        text-align: center;
        text-shadow: 2px 2px black, 2px 0px black, 0px 2px black, 0px -2px black, -2px 0px black, 2px -2px black, -2px 2px black, -2px 0px black;
    }
    /* I was trying something to auto-update the event images when the timer ran out, but nothing came of it - ignore */
    .nucleardripevent,
    .attitudemintevent {
        transition: .5s ease;
        position: relative;
    }
    .nucleardripevent img {
        height: 0px;
    }
   
        /* For story chapter table */
    /* Grace */
    .sl-chapter-table td:nth-child(4) {
        border: 1px solid #2ec817;
        padding: 0px;
    }
    /* Sera  */
    .sl-chapter-table td:nth-child(5) {
        border: 1px solid #52a1fe;
        padding: 0px;
    }
    /* Sumire  */
    .sl-chapter-table td:nth-child(6) {
        border: 1px solid #ff5558;
        padding: 0px;
    }
    /* Hakuno  */
    .sl-chapter-table td:nth-child(7) {
        border: 1px solid #f1f1f1;
        padding: 0px;
    }
    /* Joker  */
    .sl-chapter-table td:nth-child(8) {
        border: 1px solid #B90000;
        padding: 0px;
    }
    /* Chapter row */
    .sl-chapter-table td:nth-child(1) {
        padding: unset;
    }
    .sl-level-reqs p {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
   


    /* Tweaks for the story character image galleries; transitions are for mouseover and click events */
    .sl-story-gallery img,
    .noisz-story-gallery img {
        padding: 2px;
        transition: .5s ease;
    }
    .sl-story-gallery img:hover,
    .noisz-story-gallery img:hover {
        filter: brightness(1.25);
        transition: .5s ease;
    }
    .sl-story-gallery img:active,
    .noisz-story-gallery img:active {
        filter: brightness(0.75);
        transition: .5s ease;
    }
    .sl-story-gallery {
        display: grid;
        justify-content: center
    }
    .row-1, .row-2, .row-3 {
        width: 100%
        }
   
    .article-table.story-gallery-table td {
        border: none;
    }
    .sl-story-gallery img {
        width: 22%;
        height: 22%
    }
    /* This is to align them half a diamond over so the even rows fit nicely together  */
    .sl-story-gallery .row-2 img,
    .sl-story-gallery .row-4 img,
    .sl-story-gallery .row-6 img {
        position: relative;
        right: -12%;
        bottom: unset
    }


    .sl-area-convos .row-1 p:nth-child(2),
    .sl-area-convos .row-3,
    .sl-area-convos .row-4,
    .sl-area-convos .row-5,
    .sl-area-convos .row-6 {
        display: none
    }


    .sl-area-convos .row-2 {
        position: relative;
        left: 8px
    }


.gracelv:after,
    .sl-chapter-table .sl-story-gallery {
.seralv:after,
        position: relative;
.sumirelv:after,
        display: table-cell;
.hakunolv:after,
    }
.jokerlv:after {
    .sl-chapter-table .sl-story-gallery img {
    position: relative;
        right: -16px !important;
    display: flex;
        top: -20px !important;
    height: 35px;
    }
    top: -34px;
    left: 9px;
}
.gracelv b,
.seralv b,
.sumirelv b,
.hakunolv b,
.jokerlv b {
    left: 25%;
    position: relative;
    z-index: 2;
    text-align: center;
}
/* I was trying something to auto-update the event images when the timer ran out, but nothing came of it - ignore */
.nucleardripevent,
.attitudemintevent {
    transition: .5s ease;
    position: relative;
}
.nucleardripevent img {
    height: 0px;
}


/* Tweaks for the story character image galleries; transitions are for mouseover and click events */
    .sl-chapter-table .story-gallery-table > tbody > tr,
.sl-story-gallery img,
    .sl-area-convos .story-gallery-table > tbody > tr {
.noisz-story-gallery img {
        background-color: transparent;
    padding: 2px;
        display: table-cell;
    transition: .5s ease;
    }
}
    .sl-chapter-table .story-gallery-table {
.sl-story-gallery img:hover,
        width: auto !important;
.noisz-story-gallery img:hover {
    }
    filter: brightness(1.25);
    /* This moves the entire story gallery up a bit so it's not pushing against the borders */
    transition: .5s ease;
    .sl-story-gallery-move-up {
}
        position: relative;
.sl-story-gallery img:active,
        top: -10px;
.noisz-story-gallery img:active {
    }
    filter: brightness(0.75);
    /* To centre the Bandcamp players in song pages */
    transition: .5s ease;
    #bandcamp {
}
        position: relative;
.sl-story-gallery {
        left: 25%;
    display: grid;
    }
    justify-content: center;
    /* For the AC Cabinets map */
}
    .maps-googlemaps3 p {
.article-table.story-gallery-table td {
        text-align: center;
    border: none;
        color: black;
}
    }
/* This is to align them half a diamond over so the even rows fit nicely together  */
    /* For the images showing what characters are featured in each NOISZ reV/Ignition stage */
.sl-story-gallery .row-2 img,
    .noisz-story-gallery img {
.sl-story-gallery .row-4 img,
        border: 1px solid white;
.sl-story-gallery .row-6 img {
        border-radius: 10px;
    position: relative;
        margin: 5px;
    right: -76px;
    }
    top: -90px;
    /* Animation for the "What" the Cat page. Currently inactive and not working but leaving the code for wheneve */
}
    .meowfly img:after,
    .meowfly:after {
        bottom: 200px;
        content: url(https://anarch.games/noisz/wiki/images/4/46/What_the_cat.png);
        position: fixed;
        left: -200px;
        transition: linear 0s;
        transition-delay: 2.0s;
    }
    .meowfly img:hover::after,
    .meowfly:hover::after,
    .meowfly img:active::after,
    .meowfly:active::after {
        position: fixed;
        left: 40000px;
        transition: linear 10.0s;
    }


.sl-area-convos .row-1 p:nth-child(2),
.sl-area-convos .row-3,
.sl-area-convos .row-4,
.sl-area-convos .row-5,
.sl-area-convos .row-6 {
    display: none
}


.sl-area-convos .row-2 {
    /* For the update history page */
    position: relative;
    .patch-updates-cell {
    left: 8px
        background-color: rgba(143, 185, 252, 0.5);
    }
    .content-updates-cell {
        background-color: rgba(255, 242, 204, 0.5);
    }
}
}


.sl-chapter-table .sl-story-gallery {
.category-select-button {
    position: relative;
    display: block;
    display: table-cell;
    width: fit-content;
}
    filter: brightness(0.5) grayscale(1);
.sl-chapter-table .sl-story-gallery img {
    margin-top: 15px;
    right: -16px !important;
    margin-bottom: 15px
    top: -20px !important;
}
}
.sl-chapter-table .story-gallery-table > tbody > tr,
.sl-area-convos .story-gallery-table > tbody > tr {
    background-color: transparent;
    display: table-cell;
}
.sl-chapter-table .story-gallery-table {
    width: auto !important;
}
/* This moves the entire story gallery up a bit so it's not pushing against the borders */
.sl-story-gallery-move-up {
    position: relative;
    top: -10px;
}
/* To centre the Bandcamp players in song pages */
#bandcamp {
    position: relative;
    left: 25%;
}
/* For the AC Cabinets map */
.maps-googlemaps3 p {
    text-align: center;
    color: black;
}
/* For the images showing what characters are featured in each NOISZ reV/Ignition stage */
.noisz-story-gallery img {
    border: 1px solid white;
    border-radius: 10px;
    margin: 5px;
}
/* Animation for the "What" the Cat page. Currently inactive and not working but leaving the code for wheneve */
.meowfly img:after,
.meowfly:after {
    bottom: 200px;
    content: url(https://anarch.games/noisz/wiki/images/4/46/What_the_cat.png);
    position: fixed;
    left: -200px;
    transition: linear 0s;
    transition-delay: 2.0s;
}
.meowfly img:hover::after,
.meowfly:hover::after,
.meowfly img:active::after,
.meowfly:active::after {
    position: fixed;
    left: 40000px;
    transition: linear 10.0s;
}


.category-select-button:hover,
.category-select-button:active {
    box-shadow: 0 0 1px 2px #C51A1A;
    filter: brightness(1) grayscale(0);
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
@-moz-document url("https://anarch.games/noiszwiki/Main_Page") {


/* For the update history page */
    #mw-related-navigation {
.patch-updates-cell {
        display: none
    background-color: rgba(143, 185, 252, 0.5);
    }
}
}
.content-updates-cell {
    background-color: rgba(255, 242, 204, 0.5);
}

Revision as of 09:19, 11 November 2025

 /* All CSS here will be loaded for users of the Timeless skin */
 /* ==UserStyle==
@name           NOISZ Wiki Anarch - Timeless
@namespace      github.com/openstyles/stylus
@version        2.5.6
@description    the style for alpha testing the Timeless theme for the NOISZ Official Wiki
@author         angeldeluxe
==/UserStyle== */
@-moz-document url-prefix("https://anarch.games") {
    
    
/* Let's import the fonts first */
    
     @font-face {
         font-family: 'Exo';
         font-style: normal;
         src: url(https://fonts.gstatic.com/s/exo/v24/4UaOrEtFpBISc36j.woff2) format('woff2');
     }
     
/* This is the responsive design section, and alters elements as needed for different screen sizes. */

     @media only screen and (min-width: 1099px) {
         .mainpage-rightcolumn,
         #mainpage-rightcolumn {
             display: block;
             float: right; 
             position: initial;
             right: 0px;
             top: 0px;
             width: 27%;
             padding: 2%;
             border: 1px solid #fff;
             box-shadow: 0 0 5px 2px #f249b1, inset 0 0 5px 1px #f249b1;
             border-radius: 10px
         }

         .mainpage-leftcolumn,
         #mainpage-leftcolumn {
             display: block;
             float: left;
             width: 63%;
             padding: 2%;
             border: 1px solid #fff;
             box-shadow: 0 0 5px 2px #f249b1, inset 0 0 5px 1px #f249b1;
             border-radius: 10px
         }
         .desktop-spoiler {
             display: block !important;
         }
         .album-spoiler {
             display: none !important;
         }
         /* This is the colour for links on the sidebar. */
         #mw-site-navigation .sidebar-chunk a:visited,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
             color: #fff
         }

         #mw-site-navigation .sidebar-chunk a,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a {
             color: #ffabdf
         }
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
     }

     @media only screen and (min-width: 1024px) and (max-width: 1099px) {
         .desktop-spoiler {
             display: block !important;
         }
         .album-spoiler {
             display: none !important;
         }
         /* This is the colour for links on the sidebar. */
         #mw-site-navigation .sidebar-chunk a:visited,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
             color: #f533db
         }

         #mw-site-navigation .sidebar-chunk a,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a {
             color: #ffabdf
         }
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
        #mw-site-navigation .sidebar-chunk .sidebar-inner .mw-portlet-body a  {
            color: unset   
        }
         .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding: 2%   
        }
        
        
    }
     @media only screen and (min-width: 851px) and (max-width: 1023px) {
         .desktop-spoiler {
             display: block !important;
         }
         .album-spoiler {
             display: none !important;
         }
         /* This is the colour for links on the sidebar. */
         #mw-site-navigation .sidebar-chunk a:visited,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a:visited {
             color: #f533db
         }

         #mw-site-navigation .sidebar-chunk a,
         #mw-related-navigation .sidebar-chunk .sidebar-inner a {
             color: #ffabdf
         }
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
        #mw-site-navigation .sidebar-chunk .sidebar-inner .mw-portlet-body a  {
            color: unset   
        }

        #rightcolumn-spacer {
            display: block !important
         }
         
        .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding: 2%   
        }
    }

     @media only screen and (max-width: 851px) and (min-width: 600px) {
         .mainpage-rightcolumn,
         #mainpage-rightcolumn {
             display: block;
             float: right;
             position: initial;
             right: 0px;
             top: 0px;
             width: 100%;
         }
         .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding-left: unset   
         }

     }
         
    @media only screen and (max-width: 840px) and (min-width: 580px) {
        .sl-story-gallery .row-2 img,
        .sl-story-gallery .row-4 img,
        .sl-story-gallery .row-6 img {
            bottom: unset
        }
        .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding-left: unset   
         }
     }
     @media only screen and (max-width: 580px) and (min-width:480px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 20px
         }
         .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding-left: unset   
         }
     }
    @media only screen and (max-width: 480px) and (min-width:280px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 35px  
         }
        .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding-left: unset   
         }
     }
    @media only screen and (max-width: 280px) {
        .sl-story-gallery .row-2 img, .sl-story-gallery .row-4 img, .sl-story-gallery .row-6 img {
            padding-top: 50px  
         }
        .mainpage-leftcolumn,
         #mainpage-leftcolumn {
            padding-left: unset   
         }
     }

         
/* This section is for the new main page sections. */

     .mainpage-game-video {
         padding: 10px;
         min-width: 390px;
         max-width: 65%;
         justify-content: center;
         align-self: center;

     }

     .pc-game-info-wrapper {
         width: 100%;
         display: -webkit-flex;
         display: flex;
         flex-wrap: wrap;
         justify-content: space-evenly;
     }

     .pc-game-buttons-container {
         display: -webkit-flex;
         display: flex;
         flex-direction: column;
         justify-content: center;
         width: fit-content
     }
     .mainpage-leftcolumn,
     #mainpage-leftcolumn {
             display: block;
             float: left;
         }
         .desktop-spoiler {
             display: none;
         }
         .album-spoiler {
             display: block;
         }
        #upcoming-birthdays > p:first-of-type, #upcoming-birthdays > p:nth-of-type(3){
            display: none    
        }
    
/* From here, the elements of the UI are altered. */
         

    #mw-site-navigation .sidebar-chunk a,
    #mw-related-navigation .sidebar-chunk .sidebar-inner a {
             color: #ffabdf
    }

     

    code, pre, .mw-code {
        color: #fff;
        background: unset
     }
     .mw-plusminus-pos {
        color: #2ec817
     }
     
     .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
        color: #fff;
        background-color: unset
     }
     
     .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
    .mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {
        background-color: #000   
     }
     




     .timeless-logo img,
     #p-banner {
         content: url(https://anarch.games/noisz/wiki/images/e/e6/Site-logo.png);
         position: relative;
         width: 50%
     }



     .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
     #mw-header-container, .sl-gameplay-navbox-header {
         background: #6f027c
     }

     #mw-content {
         border: 1px solid #f533db;
         margin-bottom: 2em
     }

     #mw-content-container {
         padding: 0px
     }

     .ts-inner {
         max-width: initial
     }

     .diff-addedline {
         border-color: #f533db
     }

     .diff-addedline .diffchange {
         background-color: #6f027c
     }

     #mw-site-navigation .sidebar-chunk,
     #mw-related-navigation .sidebar-chunk {
         background: rgba(155, 48, 140, 0.61);
         box-shadow: 0 0 20px 1px rgba(255, 79, 249, 0.3);
         color: #f533db;
         font-family: 'Exo';
         border-radius: 10px;
         border: 1px solid #f533db;
     }


     #mw-site-navigation h2,
     #mw-related-navigation h2 {
         font-family: 'Exo'
     }

     #mw-content-block {
         background-image: url(https://anarch.games/starlivht/images/bg.jpg);
         background-attachment: fixed;
         background-size: 1000px;
         background-position: 50% 50%;
         background-clip: border-box;
     }

     #mw-site-navigation .sidebar-chunk h3,
     #p-banner {
         font-family: 'Exo', sans serif
     }

     .cosmos-bannerOption * {
         fill: #fff;
         stroke: #fff
     }
     .tools-inline li[id^="ca-nstab-"] a, .tools-inline li[id^="ca-nstab-"] span, .tools-inline li[id^="ca-talk"] a, .tools-inline li[id^="ca-talk"] span {
        filter: invert(1)   
     }
    .mw-scribunto-console-fieldset {
        color: #fff;
        background: #000
    }
    .mw-scribunto-message {
        background: #000;
        color: #cc8b12
    }


     /* This covers pretty much all text I can find. */
   
     .mw-body h1,
     .mw-body h2,
     .mw-body h3,
     .mw-body h4,
     .mw-body h5,
     .mw-capiunto-infobox,
     .editOptions,
     .editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label,
     .oo-ui-fieldLayout-body,
     .oo-ui-labelWidget.oo-ui-inline-help,
     #firstHeading,
     .ve-ce-contentBranchNode,
     .cosmos-header__sitename a:any-link,
     .cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li > a:not(.wds-button),
     .cosmos-header__counter *,
     #cosmos-footer-footerContent *,
     body #mw-content,
     .cosmos-dropdown-list > ul > li > :only-child *,
     body .mw-changeslist-line,
     .oo-ui-fieldLayout-header,
     body .wikitable > * > tr > td,
     table.mw-datatable,
     .oo-ui-radioSelectInputWidget .oo-ui-labelElement-label,
     #personal h2,
     .thumbcaption,
     textarea,
     #wpSummary,
     #wpDestFile,
     .oo-ui-textInputWidget .oo-ui-inputWidget-input,
     .mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
     code,
     pre,
     #mw_metadata *,
     .diff-context,
     .mw-body-content .mw-number-text h3,
     .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
     #contentSub,
     #content #mw-editpage-minoredit .oo-ui-labelElement-label,
     #content #mw-editpage-watch .oo-ui-labelElement-label {
         color: #fff;
         font-family: 'Exo';
     }
     
     
     /* This is the reference citation highlight text. */
     ol.references li:target, sup.reference:target {
    background-color: #A86D00
     }


    /* This is so icons in slider galleries show up. */
     .oo-ui-icon-previous,
     .oo-ui-icon-imageGallery,
     .oo-ui-icon-next {
         filter: invert(1)
     }
     .oo-ui-popupWidget-popup .oo-ui-popupWidget-head .oo-ui-labelElement-label,
     .oo-ui-popupWidget-popup .oo-ui-popupWidget-body p,
     #ooui-52 .oo-ui-tool-title,
     #ooui-116 .oo-ui-labelElement .oo-ui-labelElement-label{
        color: #000   
     }
/* This section is for the editor interfaces. */
    
     #mw-header-nav-hack {
        background: #000
     }
     #ooui-17 .oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded,
     #ooui-17 .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt,
     #ooui-19 .oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded,
     #ooui-19 .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt,
    .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
        background: #000   
     }
     .ve-ce-branchNode.ve-ce-documentNode.ve-ce-attachedRootNode.ve-ce-rootNode.mw-content-ltr.mw-parser-output.mw-show-empty-elt a,
     #ooui-17 .ve-ui-mwMediaDialog-description-link,
     .oo-ui-window-body .ve-ui-mwMediaInfoFieldWidget-text a,
     .oo-ui-window-body #ooui-45 a,
     .ve-ui-mwSaveDialog-viewer a,
    .oo-ui-fieldLayout-field .oo-ui-labelWidget a,
    .oo-ui-tool-link:hover,
    #ooui-44 .oo-ui-labelElement-label .ve-ui-mwMediaDialog-description-link,
    .ve-ui-mwMediaDialog-description-link{
         color: #37fcff
     }
     #ooui-17 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label,
     #ooui-19 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label,
     #ooui-3,
     #ooui-17 .ve-ui-mwGalleryDialog-imageListMenuLayout-desktop > .oo-ui-menuLayout-menu,
    .oo-ui-processDialog-navigation,
    #ooui-19,
    #ooui-19 .oo-ui-fieldLayout-header .oo-ui-labelElement-label,
    .ve-ui-mwSaveDialog-savePanel,
    .oo-ui-window-foot .oo-ui-processDialog-actions-other,
    #ooui-19 #ooui-7.oo-ui-labelElement-label,
    .ve-ui-mwSaveDialog-summary .ve-ui-mwSaveDialog-options,
    .oo-ui-window-body,
    .oo-ui-window-body .oo-ui-toolbar-bar,
     #content .oo-ui-toolbar-bar,
     .oo-ui-popupToolGroup-tools,
     .ve-ui-targetWidget:not(.oo-ui-pendingElement-pending),
     .oo-ui-window-body .ve-ce-contentBranchNode .ve-ce-branchNode-inlineSlug,
     .oo-ui-window-body .ve-ui-mwSaveDialog-options,
     .oo-ui-window-foot {
        background: #000;
        color: #fff
     }
     #ooui-17 .ve-ui-mwGalleryDialog-highlighted-image {
        background: #000;
        background-repeat: no-repeat;
        background-position: center
     }
     #ooui-17 .ve-ui-mwGalleryDialog-imageListMenuLayout-desktop > .oo-ui-menuLayout-menu .oo-ui-panelLayout-padded .oo-ui-buttonElement-button span,
     #ooui-17 .oo-ui-labelElement-label,
     #ooui-19 .ve-ce-branchNode-slug,
     .ve-ui-mwSaveDialog-license #editpage-copywarn,
     .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-button .oo-ui-labelElement-label,
     .ve-ce-paragraphNode.ve-ce-generated-wrapper,
     .oo-ui-window-foot .oo-ui-buttonElement-button .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-buttonElement-button .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-messageDialog-text .oo-ui-messageDialog-message.oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-messageDialog-text .oo-ui-messageDialog-title.oo-ui-labelElement-label,
     .oo-ui-fieldLayout-field .oo-ui-labelWidget p,
     .ve-ui-fragmentInspector-form #ooui-3 .oo-ui-labelElement-label,
     .ve-ui-fragmentInspector-form #ooui-5 .oo-ui-labelElement-label,
     .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-labelElement-label
    {
        color: #fff
     }
     #ooui-19 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
     .oo-ui-processDialog-navigation .oo-ui-icon-close,
     .mw-rcfilters-ui-filterWrapperWidget-bottom .oo-ui-buttonElement-button .oo-ui-iconElement-icon,
     .mw-rcfilters-ui-row .oo-ui-buttonElement-button .oo-ui-iconElement-icon,
     .mw-rcfilters-ui-filterWrapperWidget-bottom .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator,
     .mw-rcfilters-ui-row .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator,
     .oo-ui-window-body .oo-ui-toolbar-bar .oo-ui-iconElement,
     .oo-ui-window-body .oo-ui-toolbar-bar .oo-ui-popupToolGroup-handle,
     .oo-ui-window-body .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle,
     .ve-ui-mwMediaDialog-panel-settings .oo-ui-icon-textStyle,
     .oo-ui-window-body .oo-ui-icon-textStyle,
     .oo-ui-window-body .oo-ui-listToolGroup[title="Style text"] .oo-ui-indicator-down,
     .ve-ui-specialCharacterPage .ve-ui-specialCharacterPage-character,
     .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title,
     #ooui-4 .oo-ui-iconElement-icon.oo-ui-icon-search{
         filter: invert(1)
     }
    .ve-ui-mwMediaDialog-panel-settings .oo-ui-toolbar .oo-ui-popupToolGroup-handle .oo-ui-indicator-down,
    .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-icon-imageGallery{
        filter: invert(0)   
    }
     #ooui-17 .oo-ui-toolbar-bar,
     #ooui-19 .oo-ui-toolbar-bar,
     #ooui-17.oo-ui-iconElement-icon.oo-ui-icon-add.oo-ui-image-progressive {
         filter:invert(1)
     }
     .ve-ui-linearContextItem-title .oo-ui-icon-imageGallery {
        filter:invert(0)   
     }
     .oo-ui-processDialog-actions-safe .oo-ui-icon-close {
        filter: invert(1)   
     }
     .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
        background: #6f027c   
     }
     .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
     .oo-ui-processDialog-actions-primary .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover,
     .oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover,
     .oo-ui-menuLayout-menu .oo-ui-decoratedOptionWidget:hover,
     .ve-ui-linkAnnotationWidget .oo-ui-labelElement:hover,
     .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected,
     .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-optionWidget-selected,
     .mw-special-Movepage #ooui-3.oo-ui-menuSelectWidget .oo-ui-menuOptionWidget:hover {
        background:#f533db
     }
     a.oo-ui-tool-link:hover {
        background:#f533db;
        filter: invert(0)
    }
     #ooui-52 a.oo-ui-tool-link:hover,
    .oo-ui-window[aria-labelledby="ooui-93"] .oo-ui-popupToolGroup-tools .oo-ui-tool-link:hover {
        background:#f533db;
        filter: invert(1)
    }
    ul.fileupload-results li.ful-success a {
        color: unset !important
    }
    ul.fileupload-results li.ful-success {
        color: darkgreen
    }
    ul.fileupload-results li.ful-error {
        color: darkred
    }
     
     /* This is for the visual editor toolbar. */
    
     #content .oo-ui-toolGroup-tools .oo-ui-iconElement-icon,
     #content .oo-ui-iconElement-icon .oo-ui-icon-link,
     .oo-ui-popupToolGroup-handle,
     #content .oo-ui-image-progressive,
     .mw-rcfilters-head .oo-ui-icon-article,
     .mw-rcfilters-head .oo-ui-icon-tag,
     .client-js #ca-edit a,
     .client-js #ca-edit a span,
     .client-js #ca-history a,
     .client-js #ca-history a span,
     .client-js #t-contributions a,
     .client-js #t-contributions a span,
     .client-js #ca-ve-edit a,
     .client-js #ca-ve-edit a span,
     .oo-ui-window-body .ve-ui-specialCharacterPage-characters,
     .oo-ui-window-body .oo-ui-fieldsetLayout-header .oo-ui-iconElement-icon,
     .mw-rcfilters-ui-row .mw-rcfilters-ui-filterTagItemWidget .oo-ui-buttonElement-button,
     #ooui-44 .oo-ui-toolGroup-tools .oo-ui-tool-title,
     #ooui-116 {
        filter: invert(1)   
     }
     #content .oo-ui-icon-undo.oo-ui-image-progressive, 
     #content .oo-ui-icon-redo.oo-ui-image-progressive,
     #content .oo-ui-icon-link.oo-ui-image-progressive,
     #content .oo-ui-icon-help.oo-ui-image-progressive,
     #content .oo-ui-icon-window.oo-ui-image-progressive,
     #content .oo-ui-icon-tag.oo-ui-image-progressive,
     #content .oo-ui-icon-pageSettings.oo-ui-image-progressive,
     #content .oo-ui-icon-settings.oo-ui-image-progressive,
     #content .oo-ui-icon-textLanguage.oo-ui-image-progressive,
     #content .oo-ui-icon-puzzle.oo-ui-image-progressive,
     #content .oo-ui-icon-textDirRTL.oo-ui-image-progressive,
     #content .oo-ui-icon-articleSearch.oo-ui-image-progressive {
        filter: invert(0)   
     }

     #content .ve-ui-toolbar-group-format .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
     #content .ve-ui-toolbar-group-cite .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
     #content .ve-ui-toolbar-group-insert .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label,
     .ve-ui-linearContextItem-body,
     #content .ve-ce-tableCellNode-header p,
     .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel .oo-ui-optionWidget .oo-ui-labelElement-label,
     .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item {
        color: #000
     }
     .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item .oo-ui-buttonElement a:not(new) .oo-ui-labelElement-label {
        color: #009E9E !important   
     }
     .oo-ui-popupWidget-popup .ve-ui-mwHelpPopupTool-items .ve-ui-mwHelpPopupTool-item .oo-ui-buttonElement a:visited .oo-ui-labelElement-label {
        color: #f533db !important   
     } 
     #content .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link:hover {
        background: #f533db;
        color: #000000
     }
     #ooui-44 .oo-ui-tool-link:hover,
     #ooui-116 .oo-ui-labelElement:hover {
        filter: invert(1);
        background: #f533db;
        color: #000000
    }
     #content .oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-labelElement-label,
     #content .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-top-title .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-fieldLayout-header .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-optionWidget .oo-ui-labelElement-label,
     .oo-ui-window-head .oo-ui-processDialog-navigation .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-fieldsetLayout-header .oo-ui-labelElement-label,
     .oo-ui-window-body .ve-ui-mwMediaDialog-panel-imageinfo-info .ve-ui-mwMediaDialog-panel-imageinfo-details .oo-ui-labelElement-label,
     .oo-ui-window-body .ve-ui-mwMediaDialog-panel-imageinfo-main .oo-ui-labelElement-label,
     #content .ve-ce-branchNode .ve-ce-tableCellNode-header p,
     .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel #ooui-54.oo-ui-optionWidget .oo-ui-labelElement-label,
     .oo-ui-window-body .oo-ui-menuLayout-menu .oo-ui-indexLayout-tabPanel #ooui-56.oo-ui-optionWidget .oo-ui-labelElement-label
    {
         color: #fff
     }
     code,
     .mbox.notice.hidden {
         background-color: #808080 !important
     }

     #pagehistory li.selected a {
         color: #A86D00
     }
     
     
/* This is to blur boss spoiler images. */
     .desktop-spoiler img {
         filter: blur(20px);
     }

     .desktop-spoiler img:hover,
     .desktop-spoiler img:active {
         filter: blur(0px)
     }

    button.tabber__header__prev, button.tabber__header__next {
        filter: invert(1)  
     }
     /* you WILL obey. */
     .tocnumber,
     .oo-ui-window-content .oo-ui-labelElement-label .ve-ui-mwGalleryDialog-remove-button {
         color: #fff !important
     }

     /* This is the background colour for the main body. */
     #mw-content,
     #catlinks,
     #toc,
     .mw-datatable tr:hover td,
     .mw-prefs-buttons,
     textarea,
     #wpSummary,
     #wpDestFile,
     .oo-ui-textInputWidget .oo-ui-inputWidget-input,
     .mw-widget-dateInputWidget.oo-ui-textInputWidget .oo-ui-labelElement-label,
     .mw-editform .editOptions,
     pre,
     ul#filetoc,
     .diff-context {
         background-color: rgba(14, 25, 26, 0.8)
     }
     
    /* This is the visual editor gallery input text. */
    .ve-ce-branchNode .ve-ce-contentBranchNode .ve-ce-paragraphNode .ve-ce-generated-wrapper p {
        color: #000 !important
     }

     /* This is the link colour. */
     #mw-content a:not(.new),
     .toctogglelabel {
         color: #37fcff
     }

     /* This is the link colour for datatable headers. */
     .mw-datatable th a,
     #mw-content .oo-ui-popupWidget-popup .ve-ui-context-menu .ve-ui-linearContextItem-body a:not(.new) {
         color: #009E9E !important
     }

     .diff-deletedline .diffchange,
     .mw-message-box-warning {
         background-color: #cc8b12
     }

     body .oo-ui-tabSelectWidget-framed {
         background-color: #ffabdf
     }

     /* This is the background colour for elements designed to blend in with the background, but still provide a readable backdrop for things. */
     li.gallerybox div.thumb,
     .mw-body li.gallerybox div.thumb,
     .mw-capiunto-infobox,
     .cosmos-header *,
     .cosmos-header:before,
     .wds-dropdown__content,
     .cosmos-header .wds-dropdown__content,
     #cosmos-footer-footerContent,
     .cosmos-dropdown-list:not(.cosmos-personalTools-list),
     #cosmos-footer,
     .wikitable:not([style*="background-color"]) > * > tr > td,
     .mw-datatable tr td,
     .thumbinner,
     #mw_metadata,
     .mw-body .mw-search-profile-tabs,
     figure[typeof~="mw:File/Thumb"].mw-halign-right,
     figure[typeof~="mw:File/Frame"].mw-halign-right,
     figure[typeof~="mw:Image/Thumb"].mw-halign-right,
     figure[typeof~="mw:Video/Thumb"].mw-halign-right,
     figure[typeof~="mw:Audio/Thumb"].mw-halign-right,
     figure[typeof~="mw:Image/Frame"].mw-halign-right,
     figure[typeof~="mw:Video/Frame"].mw-halign-right,
     figure[typeof~="mw:Audio/Frame"].mw-halign-right,
     .mw-content-ltr figure[typeof~="mw:File/Thumb"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:File/Frame"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Image/Thumb"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Video/Thumb"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Audio/Thumb"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Image/Frame"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Video/Frame"] > figcaption,
     .mw-content-ltr figure[typeof~="mw:Audio/Frame"] > figcaption {
         background: #352432
     }

     thumbinner.cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) {
         color: #f533db
     }

     .oo-ui-window-content .oo-ui-labelElement-label,
     .ve-ce-branchNode-slug,
     .ve-ui-linearContextItem-title,
     .mw-datatable th,
     .style-table > * > td,
     .slideshow-current div.gallerytext {
         color: #000
     }

     .headerbox,
     #mw-headline {
         font-family: 'Arial Narrow', Arial, sans serif !important
     }

     .mw-capiunto-infobox,
     .toc {

         border-radius: 10px
     }

     .desktop-spoiler img {
         filter: blur(20px);
     }

     .desktop-spoiler img:hover,
     .desktop-spoiler img:active {
         filter: blur(0px)
     }

     .song-table.Clover > tbody > tr > th,
     .Grace-style > tbody > tr > td > table > tbody > tr > th,
     .Clover-folder {
         background-color: #2ec817 !important;
         background-color: rgba(46, 200, 23, 0.3) !important;
     }
     .song-table.Dia > tbody > tr > th,
     .song-table.Diamond > tbody > tr > th,
     .Sera-style > tbody > tr > td > table > tbody > tr > th,
     .Dia-folder {
         background-color: #52a1fe !important;
         background-color: rgba(82, 161, 254, 0.3) !important;
     }
     .song-table.Heart > tbody > tr > th,
     .Sumire-style > tbody > tr > td > table > tbody > tr > th,
     .Heart-folder {
         background-color: #ff5558 !important;
         background-color: rgba(255, 85, 88, 0.3) !important;
     }
     .Hitori-style > tbody > tr > td > table > tbody > tr > th {
         background-color: #ff5558 !important;
         background-color: rgba(225, 65, 68, 0.3) !important;
     }
     .song-table.Spade > tbody > tr > th,
     .Hakuno-style > tbody > tr > td > table > tbody > tr > th,
     .Spade-folder {
         background-color: #f1f1f1 !important;
         background-color: rgba(241, 241, 241, 0.3) !important;
     }
     .song-table.Joker > tbody > tr > th,
     .Joker-style > tbody > tr > td > table > tbody > tr > th,
     .Joker-folder {
         background-color: #B90000 !important;
         background-color: rgba(185, 0, 0, 0.35) !important;
     }

     .song-table td {
         text-align: center;
     }


     /* Resizing song infobox album art */
     .album-image > .portable-infobox {
         max-width: 200px;
         height: auto;
     }


     /* Sortable table hover highlight */
     .article-table.sortable > tbody > tr:hover,
     .titles-list > tbody > tr:hover,
     .achievements-list > tbody > tr:hover,
     .shop-list > tbody > tr:hover,
     .style-table > tbody > tr:hover,
     .lost-data > tbody > tr:hover,
     .modules-table > tbody > tr:hover {
         background-color: #6f027c;
         left: -10px;
     }

     /* For lyrics, colours indicating who's singing */
     .seratext {
         color: #3090FF;
     }
     .sumiretext {
         color: #FF5252;
     }
     .gracetext {
         color: #248900;
     }
     .hakunotext {
         color: #725B5F;
     }
     .jokertext {
         color: #cb3838;
     }
     .shiontext {
         color: #AF0000;
     }
     .asukatext {
         color: #AF8900;
     }
     .hikaritext {
         color: #35AACE;
     }
     .sltext {
         color: #CB3890;
     }
     .srtext {
         color: #F49B2E;
     }
     .beyondtext {
         color: #4D8AC6;
     }
     .aritext {
         color: #843636;
     }
     /* For lyrics in lines featuring two or more characters, so that the line includes the colours of everyone singing */
     .serashiontext {
         background: -webkit-linear-gradient(.2turn, #52A1FF, #AF0000);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .asukahikaritext {
         background: -webkit-linear-gradient(.3turn, #AF8900, #35AACE);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .asukashiontext {
         background: -webkit-linear-gradient(right, #AF8900 30%, #AF0000);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .hakunosumiretext {
         background: -webkit-linear-gradient(.2turn, #725B5F, #FF5252);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .seragracetext {
         background: -webkit-linear-gradient(.2turn, #3090FF, #248900);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .cottext {
         background: -webkit-linear-gradient(.3turn, #CB3890, #F49B2E);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .jokergracetext {
         background: -webkit-linear-gradient(.2turn, #cb3838, #248900);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .serasumiretext {
         background: -webkit-linear-gradient(.2turn, #3090FF, #FF5252);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .hakunogracetext {
         background: -webkit-linear-gradient(.2turn, #725B5F, #248900);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .gracesumirehakunotext {
         background: -webkit-linear-gradient(.2turn, #248900, #FF5252, #725B5F);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }
     .seragracesumitext {
         background: -webkit-linear-gradient(.2turn, #3090FF, #248900, #FF5252);
         -webkit-text-fill-color: transparent;
         -webkit-background-clip: text;
         color: transparent;
         background-clip: text;
     }

     /* SL Joker spoiler warning, for SLTH warning */
     .sljokerwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/3/3f/Gracespoiler.png);
         height: 179px;
         width: 179px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -170px;
         left: 60px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .sljokerboxtext .mbox {
         margin-left: 50px;
         padding-left: 140px;
         background-image: url(https://anarch.games/noisz/wiki/images/2/2f/Dialogue_Box_BG_TH.jpg) !important;
         background-size: cover;
         border: 2px solid #ec625e !important;
         border-left-color: #ec625e !important;
         box-shadow: 0 0 10px #ec625e, inset 0 0 10px #ec625e;
         border-radius: 10px !important;
         background-position: center;
         min-height: 90px;
         color: white;
     }

     /* SL Beyond spoiler warning, for SL spoiler warning */
     .slbeyondwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/0/02/Beyondspoiler.png);
         height: 80px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -167px;
         left: 60px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .slbeyondboxtext .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-image: url(https://anarch.games/noisz/wiki/images/0/04/Dialogue_Box_BG.jpg) !important;
         background-size: cover;
         border: 2px solid #FCAAE2 !important;
         border-left-color: #FCAAE2 !important;
         box-shadow: 0 0 10px #FC78E2, inset 0 0 10px #FC78E2;
         border-radius: 10px !important;
         background-position: center;
         color: white
     }

     /* Arietta  spoiler warning, for NOISZ Ignition spoiler warning */
     .ariwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/c/c0/Arispoiler.png);
         height: 150px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -149px;
         left: 50px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .ariwarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #525456 !important;
         border: 2px solid #C68281 !important;
         border-left-color: #C68281 !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #931010, inset 0 0 10px #931010;
         color: white
     }

     .karinwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/b/bf/Karindisambiguation.png);
         height: 200px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -146px;
         left: 40px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .karinwarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #584F8D !important;
         border: 2px solid #01D3FE !important;
         border-left-color: #01D3FE !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #4599FF, inset 0 0 10px #4599FF;
         color: white
     }

     /* Beyond warning, for Needs Information banner */
     .beyondwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/e/e5/Beyondneedsinfo.png);
         height: 80px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -167px;
         left: 55px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .beyondwarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #525456 !important;
         border: 2px solid #ABF6F7 !important;
         border-left-color: #ABF6F7 !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #50ABB7, inset 0 0 10px #50ABB7;
         color: white
     }

     /* Stornel spoiler warning, for NOISZ re:VERSE spoiler warning */
     .stornelwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/d/de/Stornelspoiler.png);
         height: 80px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -167px;
         left: 60px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .stornelwarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #525456 !important;
         border: 2px solid #9B9B9B !important;
         border-left-color: #9B9B9B !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #828282, inset 0 0 10px #828282;
         color: white
     }

     /* Gaius spoiler warning, for NOISZ episode G spoiler warning */
     .gaiuswarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/0/07/Gaius_Antiphon_EPISODE_G.png);
         height: 150px;
         width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -172px;
         left: 60px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .gaiuswarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #212121 !important;
         border: 2px solid #87CD92 !important;
         border-left-color: #87CD92 !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #109525, inset 0 0 10px #109525;
         color: white
     }

     /* Main Character (NOISZ)  spoiler warning, for NOISZ series spoiler warning */
     .genbuwarning::after {
         content: '';
         background-image: url(https://anarch.games/noisz/wiki/images/8/82/Genbuwarning.png);
         height: 100px;
         max-width: 162px;
         background-size: contain;
         background-repeat: no-repeat;
         display: block;
         position: relative;
         top: -175px;
         left: 55px;
         margin-bottom: -180px;
         padding-top: 80px;
     }
     .genbuwarning .mbox {
         margin-left: 50px;
         padding-left: 50px;
         background-color: #525456 !important;
         border: 3px solid #CA88C3 !important;
         border-left-color: #CA88C3 !important;
         border-radius: 10px !important;
         box-shadow: 0 0 10px #9C158E, 0 0 10px #9C158E;
         background-size: cover;
         background-position: center;
         background-image: url(https://anarch.games/noisz/wiki/images/2/2f/Dialogue_Box_BG_TH.jpg) !important;
         filter: hue-rotate(-145deg) saturate(1.4) brightness(0.9);
         color: white
     }
     



     /* For NOISZ style tables */
     .Arietta > tbody > tr > th {
         background-color: #AE191C !important;
         background-color: rgba(358, 85, 68, 0.5) !important;
     }
     .Beyond > tbody > tr > th {
         background-color: #5BC5EF !important;
         background-color: rgba(91, 197, 239, 0.5) !important;
     }
     .Stornel > tbody > tr > th {
         background-color: white !important;
         background-color: rgba(255, 255, 255, 0.5) !important;
         color: black !important;
     }
     .Gaius > tbody > tr > th {
         background-color: rgba(2, 124, 0, 0.5) !important;
         background-color: green;
         color: white !important;
     }
     /* Transparency to main container */
     .page__main,
     .wikiEditor-ui,
     .page__right-rail {
         background-color: var(--theme-page-background-color);
         background-color: rgba(var(--theme-page-background-color--rgb), 0.7);
     }

     /* For the front page banner */
     .noiszbanner img {
         width: 100%;
         height: auto;
     }

     /* So Bandcamp players fill the whole width and don't look really mispositioned */
     .inline_player {
         display: contents !important;
     }

     /* For the events countdowns headers */
     .sl-events img {
         -webkit-transition: all 0.2s ease;
         transition: all 0.2s ease;
     }
     .sl-events img:hover {
         transform: scale(1.0);
     }

     /*For the headers on the frontpage*/
     h2.headerbox {
         padding-left: 20px;
         padding-bottom: 10px;
         padding-top: 10px;
         background-color: #FFABDF;
         color: #E345A4 !important;
         text-transform: uppercase;
     }
     .headerbox .mw-editsection a,
     .wds-dropdown * {
         color: #E345A4;
     }

     .header-box {
         padding-left: 30px;
         padding-bottom: 10px;
         padding-top: 10px;
         background-color: #FFABDF;
         color: #f533db;
         font-size: 38px;
         font-family: 'Arial Narrow', Arial, sans-serif;
         font-weight: bold;
         text-shadow: 0 0 6px rgba(242, 73, 177, 0.4);
         box-shadow: 0 0 20px 0 #f249b1
     }

     /* For the menu index buttons on the frontpage */
     .main-page-button img,
     #NOISZ_ST--RLIVHT-Gameplay img {
         filter: brightness(1.0);
         -webkit-transition: all 0.2s ease;
         transition: all 0.2s ease;
     }
     .main-page-button img:hover,
     #NOISZ_ST--RLIVHT-Gameplay img:hover {
         filter: brightness(1.5);
         -webkit-filter: brightness(1.5);
     }
     .main-page-button img:active,
     #NOISZ_ST--RLIVHT-Gameplay img:active {
         filter: brightness(0.7);
         -webkit-filter: brightness(0.7);
     }

     /* Normal green is hard on the eyes */
     .Clover-folder,
     .Heart-folder {
         filter: grayscale(0.4);
         -webkit-filter: grayscale(0.4);
     }
     /* Mouseover event when the user hovers over an image in Upcoming */
     .coming-soon-slider img {
         transition: transform 0.6s ease-in-out;
     }
     .coming-soon-slider img:hover {
         transform: scale(1.05);
     }

     /* So SL story table header colours change with theme */
     .sl-header > tbody > tr:nth-child(1),
     .sl-story-navbar,
     .sl-gameplay-navbox > table > tbody > tr > th {
         background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
     }
     .noisz-story-navbar {
         background-color: rgba(var(--theme-sticky-nav-background-color--rgb), 0.5);
         filter: hue-rotate(300deg);
     }
     .noisz-story-navbar a {
         filter: hue-rotate(-300deg);
     }

     /* ALternating colours to make tables slightly more readable */
     .sl-chapter-table tr:nth-child(2n + 1),
     .song-table tr:nth-child(2n + 1),
     .sl-song-table tr:nth-child(2n + 1),
     .artists-table tr:nth-child(2n + 1) {
         background-color: #7B4F7C;
         background-color: rgba(128, 128, 128, 0.2);
     }

     .song-table th {
         background: rgba(242, 73, 177, 0.3)
     }

     .sl-character-navigation {
         border: 1px solid var(--theme-accent-color);
     }

     /* For the diamonds around the SL story LV requirements */
     .gracelv:after {
         content: url(https://anarch.games/noisz/wiki/images/4/4a/Gracediamondempty.png);
     }
     .seralv:after {
         content: url(https://anarch.games/noisz/wiki/images/a/a3/Seradiamondempty.png);
     }
     .sumirelv:after {
         content: url(https://anarch.games/noisz/wiki/images/9/96/Sumirediamondempty.png);
     }
     .hakunolv:after {
         content: url(https://anarch.games/noisz/wiki/images/a/ac/Hakunodiamondempty.png);
         filter: brightness(0.85);
     }
     .jokerlv:after {
         content: url(https://anarch.games/noisz/wiki/images/8/88/Jokerdiamondempty.png);
     }




     .gracelv:after,
     .seralv:after,
     .sumirelv:after,
     .hakunolv:after,
     .jokerlv:after {
        position: relative;
        display: -webkit-flex;
        display: flex;
        height: 35px;
        top: -34px;
        left: 9px;
     }
     .gracelv b,
     .seralv b,
     .sumirelv b,
     .hakunolv b,
     .jokerlv b {
         left: 25%;
         position: relative;
         z-index: 2;
         text-align: center;
         text-shadow: 2px 2px black, 2px 0px black, 0px 2px black, 0px -2px black, -2px 0px black, 2px -2px black, -2px 2px black, -2px 0px black;
     }
     /* I was trying something to auto-update the event images when the timer ran out, but nothing came of it - ignore */
     .nucleardripevent,
     .attitudemintevent {
         transition: .5s ease;
         position: relative;
     }
     .nucleardripevent img {
         height: 0px;
     }
     
        /* For story chapter table */
     /* Grace */
     .sl-chapter-table td:nth-child(4) {
         border: 1px solid #2ec817;
         padding: 0px;
     }
     /* Sera  */
     .sl-chapter-table td:nth-child(5) {
         border: 1px solid #52a1fe;
         padding: 0px;
     }
     /* Sumire  */
     .sl-chapter-table td:nth-child(6) {
         border: 1px solid #ff5558;
         padding: 0px;
     }
     /* Hakuno  */
     .sl-chapter-table td:nth-child(7) {
         border: 1px solid #f1f1f1;
         padding: 0px;
     }
     /* Joker  */
     .sl-chapter-table td:nth-child(8) {
         border: 1px solid #B90000;
         padding: 0px;
     }
     /* Chapter row */
     .sl-chapter-table td:nth-child(1) {
         padding: unset;
     }
     .sl-level-reqs p {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
     }
     

     /* Tweaks for the story character image galleries; transitions are for mouseover and click events */
     .sl-story-gallery img,
     .noisz-story-gallery img {
         padding: 2px;
         transition: .5s ease;
     }
     .sl-story-gallery img:hover,
     .noisz-story-gallery img:hover {
         filter: brightness(1.25);
         transition: .5s ease;
     }
     .sl-story-gallery img:active,
     .noisz-story-gallery img:active {
         filter: brightness(0.75);
         transition: .5s ease;
     }
     .sl-story-gallery {
         display: grid;
         justify-content: center
     }
    .row-1, .row-2, .row-3 {
        width: 100%
        }
     
     .article-table.story-gallery-table td {
         border: none;
     }
     .sl-story-gallery img {
        width: 22%;
         height: 22%
     }
     /* This is to align them half a diamond over so the even rows fit nicely together  */
     .sl-story-gallery .row-2 img,
     .sl-story-gallery .row-4 img,
     .sl-story-gallery .row-6 img {
         position: relative;
         right: -12%;
         bottom: unset
    }

     .sl-area-convos .row-1 p:nth-child(2),
     .sl-area-convos .row-3,
     .sl-area-convos .row-4,
     .sl-area-convos .row-5,
     .sl-area-convos .row-6 {
         display: none
     }

     .sl-area-convos .row-2 {
         position: relative;
         left: 8px
     }

     .sl-chapter-table .sl-story-gallery {
         position: relative;
         display: table-cell;
     }
     .sl-chapter-table .sl-story-gallery img {
         right: -16px !important;
         top: -20px !important;
     }

     .sl-chapter-table .story-gallery-table > tbody > tr,
     .sl-area-convos .story-gallery-table > tbody > tr {
         background-color: transparent;
         display: table-cell;
     }
     .sl-chapter-table .story-gallery-table {
         width: auto !important;
     }
     /* This moves the entire story gallery up a bit so it's not pushing against the borders */
     .sl-story-gallery-move-up {
         position: relative;
         top: -10px;
     }
     /* To centre the Bandcamp players in song pages */
     #bandcamp {
         position: relative;
         left: 25%;
     }
     /* For the AC Cabinets map */
     .maps-googlemaps3 p {
         text-align: center;
         color: black;
     }
     /* For the images showing what characters are featured in each NOISZ reV/Ignition stage */
     .noisz-story-gallery img {
         border: 1px solid white;
         border-radius: 10px;
         margin: 5px;
     }
     /* Animation for the "What" the Cat page. Currently inactive and not working but leaving the code for wheneve */
     .meowfly img:after,
     .meowfly:after {
         bottom: 200px;
         content: url(https://anarch.games/noisz/wiki/images/4/46/What_the_cat.png);
         position: fixed;
         left: -200px;
         transition: linear 0s;
         transition-delay: 2.0s;
     }
     .meowfly img:hover::after,
     .meowfly:hover::after,
     .meowfly img:active::after,
     .meowfly:active::after {
         position: fixed;
         left: 40000px;
         transition: linear 10.0s;
     }


     /* For the update history page */
     .patch-updates-cell {
         background-color: rgba(143, 185, 252, 0.5);
     }
     .content-updates-cell {
         background-color: rgba(255, 242, 204, 0.5);
     }
}

 .category-select-button {
     display: block;
     width: fit-content;
     filter: brightness(0.5) grayscale(1);
     margin-top: 15px;
     margin-bottom: 15px
 }

 .category-select-button:hover,
 .category-select-button:active {
     box-shadow: 0 0 1px 2px #C51A1A;
     filter: brightness(1) grayscale(0);
     -webkit-transition: all 0.2s ease;
     transition: all 0.2s ease;
 }
 @-moz-document url("https://anarch.games/noiszwiki/Main_Page") {

     #mw-related-navigation {
         display: none
     }
 }
Retrieved from "https://anarch.games/noisz/wiki/index.php?title=MediaWiki:Timeless.css&oldid=9089"