Toggle search
Toggle menu
1K
5.4K
146.9K
27.4K
Digital Masters World
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Common.css: Difference between revisions

MediaWiki interface page
More actions
← Older edit
imported>Westgrass
No edit summary
imported>Westgrass
No edit summary
 
(66 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/***********************************************************************************************************
/* CSS placed here will be applied to all skins */
* css reset for browser default rules and MediaWiki internal rules
***********************************************************************************************************/
* {
  outline: 0;
}
 
table {
  white-space: unset; /* be set to `no-wrap` in MW internal css */
}
 
html {
  font-size: 16px; /* reset rem size */
}
 
body {
  overflow-y: unset;
}
 
pre {
  margin: 0;
}
 
h1, h2, h3, h4, h5, h6 {
  padding: 0;
  border: 0 solid transparent;
}
 
table {
  display: table;
  white-space: unset;
}


body, code {
/******************************************************************************************
  background: none;
********************************* Start user-edit variables *******************************
}
******************************************************************************************/


/***********************************************************************************************************
/*****************************************
* css for wiki.gg top bar and footer bar
****** START BASIC DESIGN VARIABLES ******
***********************************************************************************************************/
----------------------------------------*/
/********* wiki.gg header *********/
header#wikigg-header #p-personal ul {
  white-space: nowrap; /* for "log out" */
}
header#wikigg-header #p-personal .vector-menu-content #pt-anonuserpage, header#wikigg-header #p-personal .vector-menu-content #pt-userpage a {
  /* user avatar icon position fix */
  padding-top: 0;
  background-position: left center;
}
@media screen and (max-width: 720px) {
  header#wikigg-header #p-personal li#p-themes > span {
    display: inline-block;
  }
}
 
/********* wiki.gg footer *********/
footer#wikigg-footer .footer-right, footer#wikigg-footer .footer-left {
  margin: 0;
  text-align: center;
}
@media screen and (max-width: 479px) {
  footer#wikigg-footer .footer-right, footer#wikigg-footer .footer-left {
    width: auto;
  }
}
@media screen and (max-width: 359px) {
  footer#wikigg-footer .footer-middle {
    /* hide wiki.gg logo to make room to avoid text wrapping */
    display: none;
  }
}
 
/***********************************************************************************************************
* theming vars.
***********************************************************************************************************/
:root {
:root {
  /*** top site logo ***/
--wiki-content-heading-font-family: sans-serif;
  --theme-site-logo-image: url(/images/e/e6/Site-logo.png);
--wiki-sidebar-heading-font-family: sans-serif;
  --theme-site-logo-filter: none;
  --theme-site-logo-width: 272px;
--wiki-content-border-radius: 0px;
  --theme-site-logo-height: 170px;
--wiki-sidebar-border-radius: 0px;
  /*** site background ***/
  --theme-site-background: #73bfe8 url(/images/8/80/Site-background.jpg) top center / cover no-repeat fixed;
  /* common "box" style */
  --theme-box-back-backdrop-filter: none;
  --theme-box-border-radius: 4px;
  --theme-box-border-width: 0px;
  --theme-box-border-style: solid;
  --theme-box-border-color: #511e00;
  --theme-box-shadow: none;
  --theme-box-shadow2: none;
  --theme-box-back-background: blue;
  /* be used in multi-layer background, so we can't simpy use background-color */
  --theme-box-background: linear-gradient(blue,blue);
  --theme-background: var(--theme-box-background), var(--theme-box-back-background);
  /*** text color ***/
  --theme-text-color: #fff;
  --theme-text-color-hover: var(--theme-text-color);
  --theme-text-color-note: #9d9d9d;
  --theme-text-color-em: #0c742f;
  --theme-heading-color: var(--theme-text-color);
  --theme-text-color-placeholder: #808080;
  --theme-control-text-color: #333;
  --theme-control-text-color-hover: #333;
  /*** link text color ***/
  --theme-link-color: #00a8ff;
  --theme-link-color-hover: #00a8ff;
  --theme-link-color-visited: var(--theme-link-color);
  --theme-link-color-redlink: #dd001a;
  --theme-link-color-focus: var(--theme-link-color);
  /* default color for icons */
  --theme-icon-color: var(--theme-link-color);
  --theme-icon-color-redlink: var(--theme-link-color-redlink);
  --theme-icon-color-hover: var(--theme-link-color-hover);
  /* default common color */
  --theme-border-color: #cecece;
  --theme-border-color-accent: #ffdd7a;
  --theme-highlight-background: rgba(97, 30, 0, 0.15);
  /* dropdown menu */
  --theme-dropdown-border: 1px solid var(--theme-box-border-color);
  --theme-dropdown-background: rgba(255,255,255,0.95);
  --theme-dropdown-backdrop-filter: blur(5px);
  /* for wide table */
  --theme-wide-table-shadow-color: #999;
  /** notification **/
  --theme-notice-red-text-color: #ff001f;
  --theme-notice-orange-text-color: #ffab5b;
  /* portable infobox */
  --pi-background: none;
  --pi-border-color: #535663;
  --pi-secondary-background: #797a8e;
  --pi-secondary-background--label: #000;
  --pi-item-spacing: 8px 10px;
}
}
/*----------------------------------------
******* END BASIC DESIGN VARIABLES *******
*****************************************/


/* main content box */
/*****************************************
/* sidebar */
****** START BASIC COLOR VARIABLES *******
#mw-panel {
----------------------------------------*/
  --theme-border-width: 0;
:root,
  --theme-gap: 0;
/* Begin dark styles, delete from here to "end dark styles" if you don't want your wiki to support any dark themes (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */
}
/* FYI: .view- will affect any theme marked |kind=dark, */
/* individual themes are prefixed with .theme- instead  */
.view-dark {
/**********************
* Probably edit these * [ DARK VIEW ]
***********************/
--wiki-body-background-color: #011a38;
--wiki-body-background-image: url(filepath://Site-background.jpg);


#catlinks {
--wiki-content-background-color: #003e78;
  --theme-background: none;
--wiki-content-background-opacity: 0%;
  --theme-box-border-radius: 0;
--wiki-content-border-color: #0b59a2;
}


#footer {
--wiki-content-link-color: #6FD8FF; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */
  --theme-background: none;
/* [ DARK VIEW ] */
}
--wiki-accent-color: #b3ddea;
--wiki-accent-label-color: #000;
--wiki-accent-link-color: #1e1e43;


/* navbar */
--wiki-icon-to-link-filter: invert(78%) sepia(11%) saturate(2418%) hue-rotate(166deg) brightness(100%) contrast(103%);/* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */
#mw-head {
/**/
  --theme-link-color: var(--theme-text-color);
  --theme-link-color-visited: var(--theme-link-color);
  --theme-link-color-hover: var(--theme-link-color);
  --theme-background: none;
  --theme-background-shadow: linear-gradient(to top, rgba(0,0,0,0.05), transparent 6px);
  --theme-tab-background: var(--theme-box-background);
  --theme-tab-background-selected: var(--theme-box-background);
  --theme-tab-border-color: var(--theme-box-border-color);
  --theme-tab-border-color-selected: var(--theme-box-border-color);
}
}
#mw-head #p-search {
.view-dark #content .content-body {
  --theme-border-color: var(--theme-box-border-color);
--wiki-content-border-color: #00a5ff;
  --theme-link-color: var(--theme-text-color);
  --theme-background: var(--theme-box-background);
  --theme-border-color-hover: var(--theme-icon-color-hover);
  --theme-border-color-focus: var(--theme-border-color-hover);
  --theme-shadow: none;
  --theme-shadow-focus: var(--theme-box-shadow);
}
}
/* End dark styles */


/* search result suggestion */
/*----------------------------------------
body > .suggestions {
******* END BASIC COLOR VARIABLES ********
  --theme-border-color: var(--theme-border-color-accent);
*****************************************/
  --theme-rule-color: var(--theme-border-color-accent);
  --theme-link-color: var(--theme-text-color);
  --theme-link-color-visited: var(--theme-text-color);
  --theme-link-color-hover: var(--theme-text-color-hover);
}


/***********************************************************************************************************
/*****************************************
* base css styles for both interface and content box: font, color, etc.
**** START ADVANCED COLOR VARIABLES ******
***********************************************************************************************************/
----------------------------------------*/
/** Font **/
html, body {
  font-family: Helvetica, Arial, sans-serif;
  color: var(--theme-text-color);
}


html {
:root,
  background: var(--theme-site-background);
.view-dark {
}
/*******************
* Maybe edit these * [ DARK VIEW ]
********************/
--wiki-body-background-position: top center;
--wiki-body-background-size: cover;
--wiki-body-background-repeat: no-repeat;
--wiki-body-background-attachment: fixed;


body {
--wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));
  font-size: 14px;
--wiki-content-text-color: #fff;
  line-height: 1.5;
--wiki-content-link-color--visited: var(--wiki-content-link-color);
}
--wiki-content-link-color--hover: var(--wiki-content-link-color);
--wiki-content-redlink-color: #FC5B4F;


ul, ol {
--wiki-content-heading-color: var(--wiki-content-text-color);
  margin: 2px 0 2px 1.5em;
--wiki-content-heading-border-color: var(--wiki-content-border-color);
}


li {
/* [ DARK VIEW ] */
  margin: 0 0 2px 0;
--wiki-navigation-background-color: var(--wiki-content-background-color--secondary);
}
--wiki-navigation-border-color: var(--wiki-navigation-selected-border-color);
--wiki-navigation-text-color: var(--wiki-content-link-color);
--wiki-navigation-selected-background-color: var(--wiki-content-background-color);
--wiki-navigation-selected-border-color: var(--wiki-content-border-color);
--wiki-navigation-selected-text-color: var(--wiki-content-text-color);


pre, code, .mw-code {
/* [ DARK VIEW ] */
  color: var(--theme-text-color);
--wiki-neutral-color: var(--wiki-content-text-mix-color);
  border: 1px solid var(--theme-border-color);
--wiki-alert-color: #ff576a;
  background: var(--theme-background);
--wiki-warning-color: #cf721c;
}
--wiki-success-color: #13aa45;
/**/


/** link color **/
/***********************************
/* Self-links aren't real links, they're not clickable.
* Likely do not need to edit these * [ DARK VIEW ]
* Hence, they shouldn't change color when hovered over like real links, as that is counter-intuitive.
************************************/
* We should not use :not(.selflink) since it increases the priority and make it is difficult to override
--wiki-body-dynamic-color: #ffffff;
* link styles for certain elements (e.g. in wiki.gg header).
--wiki-body-dynamic-color--inverted: #000000;
*/
--wiki-body-dynamic-color--secondary: #cccccc;
a,
--wiki-body-dynamic-color--secondary--inverted: #333333;
a.selflink:hover, a.selflink:active {
  text-decoration: none;
  color: var(--theme-link-color);
}


a:visited {
--wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);
  color: var(--theme-link-color-visited);
--wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);
}
--wiki-content-link-label-color: #000;
--wiki-content-dynamic-color: #ffffff;
--wiki-content-dynamic-color--inverted: #000000;
--wiki-content-dynamic-color--secondary: #cccccc;
--wiki-content-dynamic-color--secondary--inverted: #333333;
/* [ DARK VIEW ] */
--wiki-alert-label-color: #000000;
--wiki-warning-label-color: #000000;
--wiki-success-label-color: #000000;


a:hover, a:active {
--wiki-icon-general-filter: invert(100%);
  text-decoration: underline;
  color: var(--theme-link-color-hover);
}
}


/** red link **/
/*----------------------------------------
/* we don't really need to mark you have "visited" an inexistent page */
***** END ADVANCED COLOR VARIABLES *******
a.new, a.new:visited {
*****************************************/
  color: var(--theme-link-color-redlink);
}


/*********************************************************************************************************/
/*****************************************
input, button {
**** START ADVANCED DESIGN VARIABLES *****
  color: var(--theme-control-text-color);
----------------------------------------*/
  caret-color: var(--theme-text-color);
}


input[type=submit] {
:root {
  color: var(--theme-control-text-color);
/***********************
}
  start logo position
 
----------------------*/
::placeholder {
--wiki-is-top-logo: 0; /* 1 = center logo at the top of the page; 0 = logo at the top left of the page */
  color: var(--theme-text-color-placeholder);
}
--wiki-logo-file-width: 272; /* Width of the image file in px. Put a number without the letters `px`. */
--wiki-logo-file-height: 170; /* Height of the image file in px. Put a number without the letters `px`. */
--wiki-logo-height: calc(var(--wiki-logo-file-height)*1px); /* Valid only when --wiki-is-top-logo is 1. The height the logo should be shown */
--wiki-logo-margin: 15px; /* the width of margin below the logo. When --wiki-is-top-logo is 1, this is also the default value of --wiki-top-spacing */
/*-----------------------
  end logo position
***********************/
--wiki-is-navigation-inside-content: 0; /* 0 = default navigation tabs layout; 1 = navigation tabs inside content box */


/* Removes VisualEdit button */
--wiki-body-font-family: sans-serif;
#ca-ve-edit {
--wiki-content-firstheading-font-family: var(--wiki-content-heading-font-family); /* only apply to the main title of article */
  display: none;
}


/* Link color */
/****** the following length variables must have units specified even if 0, ignore the warning *****/
.mw-parser-output a.external,
.mw-parser-output a.external:visited,
--wiki-content-border-width: 1px;
.mw-parser-output a.extiw,
--wiki-sidebar-width: 12.5em; /* width of sidebar(#mw-panel) */
.mw-parser-output a.extiw:visited,
--wiki-sidebar-portal-spacing: 0px;
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
--wiki-sidebar-border-width: 0px;
  color: var(--theme-link-color);
--wiki-navigation-border-radius: 4px; /* border radius of tabs */
}


/* Text color */
/*******************
.i .note,
* Maybe edit these * [ DESIGN ]
.note-text {
********************/
  color: var(--theme-text-color-note);
}
--wiki-logo-filter: none;
/****** the following length variables must have units specified even if 0, ignore the warning *****/
--wiki-content-border-top-radius: var(--wiki-content-border-radius);
--wiki-content-border-style: solid;
--wiki-content-border-image: none;
--wiki-content-backdrop-filter: none;
--wiki-page-content-max-width: 9999px; /* max width of sidebar+gap+content, must be a length value. A huge value can be used to indicate no limit, e.g. 99999px */
--wiki-gap-between-sidebar-and-content: 24px; /* gap between sidebar(#mw-panel) and content(#content) */
--wiki-sidebar-font-size: 0.875em; /* please use em or rem for this */
--wiki-sidebar-line-height: 1.25;
--wiki-sidebar-heading-font-size: 1.4em; /* please use em or rem for this */
--wiki-sidebar-margin: 0em;
--wiki-sidebar-list-item-padding: 0.25em 0.25rem;
--wiki-sidebar-list-padding: 0.25rem;
--wiki-sidebar-list-item-background--hover: none; /* background of hover item */


.pixel img, .pixel,
--wiki-navigation-font-size: 0.875em; /* please use em or rem for this */
#mw-imagepage-section-filehistory img {
--wiki-navigation-font-weight: normal;
  image-rendering: pixelated; /*for chrome*/
--wiki-navigation-selected-font-weight: bold;
  image-rendering: crisp-edges; /*for firefox*/
--wiki-navigation-text-transform: none;
}
--wiki-navigation-height: 2.75rem; /* height of navigation area,include spacing above tabs */
--wiki-navigation-left-spacing: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-radius) + var(--wiki-is-navigation-inside-content) * 0.5rem );
--wiki-navigation-right-spacing: calc( var(--wiki-is-navigation-inside-content) * 0.5rem );
--wiki-navigation-box-background-color: var(--wiki-content-background-color);
--wiki-navigation-box-background-opacity: calc(var(--wiki-content-background-opacity)*0.8*var(--wiki-is-navigation-inside-content));
--wiki-navigation-box-background: color-mix(in srgb, var(--wiki-navigation-box-background-color) var(--wiki-navigation-box-background-opacity), transparent); /* usually only needed when --wiki-is-navigation-inside-content is 1 */
--wiki-navigation-box-border-image: none; /* usually only needed when --wiki-is-navigation-inside-content is 1 */
--wiki-navigation-box-backdrop-filter: none; /* usually only needed when --wiki-is-navigation-inside-content is 1 */
--wiki-navigation-selected-backdrop-filter: var(--wiki-content-backdrop-filter);  /* usually only needed when --wiki-is-navigation-inside-content is 0 */
--wiki-navigation-backdrop-filter: var(--wiki-navigation-selected-backdrop-filter);  /* usually only needed when --wiki-is-navigation-inside-content is 0 */
/* nav tabs style. The vector gradient is default.
* If you want to customize the style of tabs, it's easier to start with the following settings:
*    --wiki-navigation-background-image: none;
*    --wiki-navigation-selected-background-image: none;
*    --wiki-navigation-selected-border-width: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-width) + var(--wiki-is-navigation-inside-content) * 1px );
*    --wiki-navigation-selected-border-bottom-background: none;
*    --wiki-navigation-tab-spacing: 0.25em;
*    --wiki-navigation-tab-padding-top: 0.5em;
*    --wiki-navigation-tab-padding-bottom: 0.5em;
*/
--wiki-navigation-tab-spacing: -30px; /* width of the space between tabs, can be a negative number, in which case adjacent tabs will overlap  */
--wiki-navigation-tab-padding-top: 0.5em;
--wiki-navigation-tab-padding-x: 3em;
--wiki-navigation-tab-padding-bottom: 0.5em;
--wiki-navigation-selected-border-width: 0px;
--wiki-navigation-border-width: var(--wiki-navigation-selected-border-width); /* border width of normal tabs */
--wiki-navigation-border-image: url(filepath://Tab.png) fill 29 35 0 35/100% 35px 0 35px stretch;
--wiki-navigation-selected-border-image: var(--wiki-navigation-border-image);
--wiki-navigation-background-image: none;
--wiki-navigation-background-repeat: no-repeat, no-repeat, repeat-x;
--wiki-navigation-background-position: left bottom, right bottom, left bottom;
--wiki-navigation-background-size:  1px 100%, 1px 100%, 100%;
--wiki-navigation-selected-background-image: none;
--wiki-navigation-selected-background-repeat: no-repeat, no-repeat;
--wiki-navigation-selected-background-position: left bottom, right bottom;
--wiki-navigation-selected-background-size: 1px 100%, 1px 100%;
--wiki-navigation-selected-border-bottom-background: var(--wiki-content-border-color);
/* affects the dropdown menu under More */
--wiki-navigation-dropdown-text-color: var(--wiki-navigation-text-color);
--wiki-navigation-dropdown-text-color--hover: var(--wiki-navigation-dropdown-text-color);
--wiki-navigation-dropdown-font-size: var(--wiki-navigation-font-size); /* please use em or rem for this */
--wiki-navigation-dropdown-border-width: 1px;
--wiki-navigation-dropdown-border-radius: var(--wiki-navigation-border-radius);
--wiki-navigation-dropdown-padding: 0.25em; /* padding of the dropdown menu box */
--wiki-navigation-dropdown-item-padding: 0.625em; /* padding of each dropdown menu items */
--wiki-navigation-dropdown-item-background--hover: none; /* background of hover item */
--wiki-navigation-dropdown-border-image: none;
--wiki-navigation-dropdown-backdrop-filter: none;
--wiki-navigation-dropdown-box-shadow: none; /* box shadow */
/* styles of the footer */
--wiki-spacing-before-footer: 0px;
--wiki-footer-border-image: none;


.small {
/* padding on body element */
  font-size: 85%;
--wiki-top-spacing: calc(var(--wiki-is-top-logo)*var(--wiki-logo-margin) + (1 - var(--wiki-is-top-logo))*1em); /* extra spacing below wiki.gg netbar */
}
--wiki-left-spacing: 3em;
--wiki-right-spacing: 3em;
--wiki-bottom-spacing: 3em;


.fullwidth, .full-width {
/* end design variables */
  width: 100%;
}
}


.nowrap {
/*----------------------------------------
  white-space: nowrap;
***** END ADVANCED DESIGN VARIABLES ******
}
*****************************************/


/* ".center" has width=100% rule, we don't want it, so use a different class name. */
.aligncenter,
.align-center {
  text-align: center;
}


.alignleft,
/*******************************
.align-left {
**** START SHARED VARIABLES ****
  text-align: left;
**** tl;dr: don't edit this ****
}
********************************/
 
/*
.alignright,
These variables are rarely touched, usually inherit other variables, and are shared on all themes.
.align-right {
In 99% of cases none of these are ever edited, and you should only be doing so if you have a very clear vision,
  text-align: right;
understand what you are doing, and *know* that what you are trying to do is not accomplished by changing
}
another variable in the above sections.
Since these are by default shared across all themes, if you support multiple themes you'll probably want to
separate the variables you want to modify here into .view-x blocks like above. If you don't understand
what that means or how to do that then you probably shouldn't be modifying this section.
*/
:root {
--wiki-content-border-bottom-width: var(--wiki-content-border-width);
--wiki-content-border-bottom-style: var(--wiki-content-border-style);
--wiki-content-border-bottom-color: var(--wiki-content-border-color);
--wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);
--wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));
--wiki-content-text-color--hover: var(--wiki-content-text-color);


/* clear fix for float block */
/* heading */
.clearfix {
--wiki-content-heading-border-bottom-width: 1px;
  *zoom: 1;
--wiki-content-heading-border-style: solid;
}
--wiki-content-heading-font-weight: normal;
--wiki-content-heading-font-style: normal;
--wiki-content-heading-text-transform: none;
--wiki-content-heading-line-height: normal;
--wiki-content-heading-text-shadow: none;
/* first heading (h1) */
--wiki-content-firstheading-border-bottom-width: var(--wiki-content-heading-border-bottom-width);
--wiki-content-firstheading-border-style: var(--wiki-content-heading-border-style);
--wiki-content-firstheading-border-color: var(--wiki-content-heading-border-color);
--wiki-content-firstheading-font-weight: var(--wiki-content-heading-font-weight);
--wiki-content-firstheading-font-style: var(--wiki-content-heading-font-style);
--wiki-content-firstheading-text-transform: var(--wiki-content-heading-text-transform);
--wiki-content-firstheading-line-height: var(--wiki-content-heading-line-height);
--wiki-content-firstheading-color: var(--wiki-content-heading-color);
--wiki-content-firstheading-text-shadow: none;
/* sub-heading (h3, h4, h5, h6) */
--wiki-content-subheading-border-bottom-width: 0px;
--wiki-content-subheading-border-style: var(--wiki-content-heading-border-style);
--wiki-content-subheading-border-color: var(--wiki-content-heading-border-color);
--wiki-content-subheading-font-family: var(--wiki-body-font-family);
--wiki-content-subheading-font-weight: bold;
--wiki-content-subheading-font-style: normal;
--wiki-content-subheading-text-transform: none;
--wiki-content-subheading-line-height: var(--wiki-content-heading-line-height);
--wiki-content-subheading-color: var(--wiki-content-heading-color);
--wiki-content-subheading-text-shadow: none;
/* heading size */
--wiki-content-firstheading-font-size: 1.8em;
--wiki-content-heading-h2-font-size: 1.5em;
--wiki-content-heading-h3-font-size: 1.2em;
--wiki-content-heading-h4-font-size: 114%;
--wiki-content-heading-h5-font-size: 108%;
--wiki-content-heading-h6-font-size: 100%;


.clearfix::before,
--wiki-content-toc-background: var(--wiki-content-background-color--secondary);
.clearfix::after {
--wiki-content-toc-border-width: 1px;
  content: " ";
--wiki-content-toc-border-style: solid;
  display: table;
--wiki-content-toc-border-color: var(--wiki-content-border-color);
}
--wiki-content-toc-border-radius: 0px;
--wiki-content-toc-border-image: none;
--wiki-content-toc-box-shadow: 0 0.1em 0.2em #000000;


.clearfix::after {
--wiki-content-catlinks-background: var(--wiki-content-background-color--secondary);
  clear: both;
--wiki-content-catlinks-border-width: 1px;
}
--wiki-content-catlinks-border-style: solid;
--wiki-content-catlinks-border-color: var(--wiki-content-border-color);
--wiki-content-catlinks-border-radius: 0px;
--wiki-content-catlinks-border-image: none;
--wiki-content-catlinks-box-shadow: none;


/* References smaller text than main */
--wiki-content-filetoc-background: var(--wiki-content-background-color--secondary);
.references {
--wiki-content-filetoc-border-width: 1px;
  font-size: 90%;
--wiki-content-filetoc-border-style: solid;
}
--wiki-content-filetoc-border-color: var(--wiki-content-border-color);
--wiki-content-filetoc-border-radius: 0px;
--wiki-content-filetoc-border-image: none;
--wiki-content-filetoc-box-shadow: none;


/* Larger font for Module: code display (default is smaller than other code pages) */
--wiki-logo-offset-x: 0px;
pre.lua.source-lua {
--wiki-logo-offset-y: 0px;
  font-size: 14px !important;
}
--wiki-sidebar-padding: 6px 18px 6px 10px;
--wiki-sidebar-background-color: var(--wiki-content-background-color);
--wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);
--wiki-sidebar-background-image: none;
--wiki-sidebar-background-position: center top;
--wiki-sidebar-background-repeat: no-repeat;
--wiki-sidebar-background-size: auto;
--wiki-sidebar-filter: none;
--wiki-sidebar-backdrop-filter: var(--wiki-content-backdrop-filter);
--wiki-sidebar-border-color: var(--wiki-content-border-color);
--wiki-sidebar-border-style: solid;
--wiki-sidebar-border-image: none;
--wiki-sidebar-link-color: var(--wiki-content-link-color);
--wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);
--wiki-sidebar-heading-color: var(--wiki-content-heading-color);
--wiki-sidebar-heading-font-weight: bold;
--wiki-sidebar-heading-font-style: normal;
--wiki-sidebar-heading-text-transform: none;
--wiki-sidebar-heading-line-height: normal;
--wiki-sidebar-heading-padding: 0px;
--wiki-sidebar-heading-margin: 0px 0px 0px 6px;
--wiki-sidebar-heading-background: none;
--wiki-sidebar-heading-border-image: linear-gradient(to right,#00bfe1,transparent) 1/0 0 1px 0;
--wiki-sidebar-heading-text-shadow: none;
--wiki-sidebar-list-background: none;
--wiki-sidebar-list-border-image: none;
--wiki-sidebar-list-margin: 0px;
--wiki-sidebar-list-item-background: none;
--wiki-sidebar-list-item-border-image: none;
--wiki-sidebar-list-item-background--hover: none;
--wiki-sidebar-list-item-border-image--hover: none;
--wiki-sidebar-list-item-spacing: 0px;
--wiki-sidebar-icon-to-link-filter: var(--wiki-icon-to-link-filter);
--wiki-sidebar-offset: -2.5em; /* Vertical offset */
--wiki-sidebar-box-padding: 20px 0px 10px 0px;
--wiki-sidebar-box-background: url(filepath://Sidebar-bg.jpg) center top no-repeat;
--wiki-sidebar-box-border: 0px;
--wiki-sidebar-box-border-radius: 0px 60px 0px 0px;
--wiki-sidebar-box-border-image: none;
--wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));


/* Facilitate inline scary transclusion */
--wiki-footer-border-width: var(--wiki-content-border-width);
.scary-transclusion p, .scary-transclusion .mw-parser-output {
--wiki-footer-border-style: var(--wiki-content-border-style);
  display: inline;
--wiki-footer-border-color: var(--wiki-content-border-color);
}
--wiki-footer-background-color: var(--wiki-content-background-color);
--wiki-footer-background-opacity: var(--wiki-content-background-opacity);
--wiki-footer-backdrop-filter: var(--wiki-content-backdrop-filter);
--wiki-footer-text-color: var(--wiki-content-text-color);
--wiki-footer-link-color: var(--wiki-content-link-color);
--wiki-footer-link-color--hover: var(--wiki-content-link-color--hover);
--wiki-footer-border-radius: var(--wiki-content-border-radius);


/* hide last empty paragraph at the end */
--wiki-navigation-background-opacity: var(--wiki-navigation-selected-background-opacity);
div.mw-parser-output > p:last-child > br:only-child {
--wiki-navigation-background-color--hover: var(--wiki-navigation-background-color);
  display: none;
--wiki-navigation-background-opacity--hover: var(--wiki-navigation-background-opacity);
}
--wiki-navigation-background-image--hover: var(--wiki-navigation-background-image);
--wiki-navigation-background-position--hover: var(--wiki-navigation-background-position);
--wiki-navigation-background-repeat--hover: var(--wiki-navigation-background-repeat);
--wiki-navigation-background-size--hover: var(--wiki-navigation-background-size);
--wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);
--wiki-navigation-transform--hover: none;
--wiki-navigation-selected-border-style: solid;
--wiki-navigation-selected-background-opacity: calc(var(--wiki-content-background-opacity) * 0.8);
--wiki-navigation-border-style: solid;
--wiki-navigation-border-color--hover: var(--wiki-navigation-border-color);
--wiki-navigation-border-image--hover: var(--wiki-navigation-border-image);
--wiki-navigation-border-bottom-color: var(--wiki-navigation-selected-border-color);
--wiki-navigation-border-bottom-style: var(--wiki-navigation-selected-border-style);
--wiki-navigation-border-bottom-width: calc(var(--wiki-is-navigation-inside-content, 0) * var(--wiki-navigation-selected-border-width, 1px) + (1 - var(--wiki-is-navigation-inside-content, 0)) * var(--wiki-content-border-width, 1px));
--wiki-navigation-icon-size: 1em;
--wiki-navigation-tab-padding-x--icon: var(--wiki-navigation-tab-padding-x);
--wiki-navigation-bottom-spacing: 0px; /* If you change this to greater than 0px, you should usually change the value of --wiki-navigation-selected-border-bottom-background to var(--wiki-navigation-border-bottom-color) */


/* Fix empty parameter descriptions on api.php having no height, causing misalignments that seriously impede readability */
--wiki-navigation-dropdown-background-color: var(--wiki-content-background-color);
.apihelp-parameters dd:empty::before {
--wiki-navigation-dropdown-background-opacity: 100%;
  content: " ";
--wiki-navigation-dropdown-border-color: var(--wiki-navigation-border-color);
}
--wiki-navigation-dropdown-offset: 0px; /* vertical offset */


.block {
--wiki-navigation-search-background-color: var(--wiki-content-background-color--secondary);
  display: block;
--wiki-navigation-search-background-image: none;
--wiki-navigation-search-background-position: 0;
--wiki-navigation-search-background-size: auto;
--wiki-navigation-search-background-repeat: repeat;
--wiki-navigation-search-backdrop-filter: none;
--wiki-navigation-search-border-color: var(--wiki-navigation-border-color);
--wiki-navigation-search-border-color--hover: var(--wiki-accent-color);
--wiki-navigation-search-border-style: solid;
--wiki-navigation-search-border-width: 1px;
--wiki-navigation-search-border-radius: 2px;
--wiki-navigation-search-border-image: none;
--wiki-navigation-search-border-image--hover: var(--wiki-navigation-search-border-image);
--wiki-navigation-search-box-shadow: none;
--wiki-navigation-search-box-shadow--hover: var(--wiki-navigation-search-box-shadow);
--wiki-navigation-search-text-color: var(--wiki-content-text-color);
--wiki-navigation-search-font-size: var(--wiki-navigation-font-size);
--wiki-navigation-search-height: 2em;
--wiki-navigation-search-button-color: currentColor;
--wiki-navigation-search-button-color--hover: var(--wiki-navigation-search-button-color);
--wiki-navigation-search-button-color-opacity: 80%;
--wiki-navigation-search-button-color-opacity--hover: 95%;
--wiki-navigation-search-bottom-spacing: 3px;
--wiki-navigation-search-highlight-background-color: color-mix(in srgb, var(--wiki-accent-color) 5%, transparent);
--wiki-navigation-gap-between-left-and-right: calc(max(0px, var(--wiki-navigation-tab-spacing))); /* minimum width between #left-navigation and #right-navigation before tabs start to collapse */
}
}


.inline {
/*** tablet adjustments ***/
  display: inline;
@media screen and (max-width: 1366px) {
:root,
.view-dark {
--wiki-left-spacing: 1em;
--wiki-right-spacing: 1em;
--wiki-navigation-tab-spacing: 0.25em; /* width of the space between tabs, can be a negative number, in which case adjacent tabs will overlap  */
--wiki-navigation-tab-padding-x: 0.5em;
--wiki-navigation-selected-border-width: 1px;
--wiki-navigation-border-image: none;
--wiki-navigation-selected-border-bottom-background: none;
}
}
}


.inline-block {
  display: inline-block;
}


hr.space {
/*** mobile adjustments ***/
  height: 4px;
@media screen and (max-width: 720px) {
  background: none;
body.has-vector-mobile-menu{
  border: 0;
--wiki-sidebar-offset: 0px; /* Vertical offset */
--wiki-sidebar-margin: 0px;
--wiki-sidebar-heading-background: none;
--wiki-sidebar-heading-border-image: none;
--wiki-sidebar-heading-margin: 0px 0px -0.5em 0px;
--wiki-sidebar-list-margin: 0px;
--wiki-sidebar-list-background: none;
--wiki-sidebar-list-border-image: none;
--wiki-sidebar-list-item-background: none;
--wiki-sidebar-list-item-border-image: none;
--wiki-sidebar-list-item-background--hover: none;
--wiki-sidebar-list-item-border-image--hover: none;
--wiki-sidebar-list-item-spacing: 0px;
--wiki-sidebar-line-height: 1.125;
--wiki-sidebar-background-opacity: 100%;
--wiki-navigation-search-border-width: 1px;
--wiki-logo-offset-x: 0px;
--wiki-logo-offset-y: 0px;
}
}
}


.page-content .vertical-align-top * {
  vertical-align: top;
}


.page-content .vertical-align-bottom * {
/*****************************
  vertical-align: bottom;
**** END SHARED VARIABLES ****
}
******************************/


/* Drowning Table No Border */
/******************************************************************************************
.drowning-table-no-border {
********************************* End user-edit variables *********************************
  border: none;
******************************************************************************************/
}


/* Gadget description length */
/******************************
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
* Fallback for older browsers *
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body {
* DONT EDIT THIS              *
  max-width: unset;
*******************************/
@supports not (color:color-mix(in srgb, #000, transparent)) {
.view-dark,
.view-light,
:root {
--wiki-content-text-mix-color: var(--wiki-content-text-color);
--wiki-content-text-mix-color-95: var(--wiki-content-background-color);
--wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);
--wiki-content-border-color--secondary: var(--wiki-content-border-color);
--wiki-content-border-color--accent: var(--wiki-accent-color);
--wiki-accent-color--hover: var(--wiki-accent-color);
--wiki-navigation-search-highlight-background-color: transparent;
}
}
}


/* Box at the top of all pages when the user has a new message on their User_talk: page */
/*****************************
.usermessage {
* End older browser fallback *
  box-sizing: border-box;
******************************/
  border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
  border-radius: var(--theme-box-border-radius);
  backdrop-filter: var(--theme-box-back-backdrop-filter);
  box-shadow: var(--theme-box-shadow);
  background: var(--theme-box-background), var(--theme-box-back-background);
}


/***********************************************************************************************************
/*****************************
* interface layout and styles for widgets outside of content box
*     PortableInfoboxes      *
***********************************************************************************************************/
******************************/
:root {
:root {
  --layout-topbar-height: 35px; /* height of wiki.gg topbar */
--pi-background: var(--wiki-content-background-color);
  --layout-sidebar-width: 200px; /* width of side navbar, without gap */
--pi-secondary-background: var(--wiki-accent-color);
  --layout-sidespace: 24px; /* whitespace width on most left and most right */
--pi-secondary-background-label: var(--wiki-accent-label-color);
  --layout-box-gap: 24px;
--pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);
  --layout-box-border-radius: 5px;
  --layout-logo-scale: calc(200/272);
  --layout-logo-box-height: calc(var(--theme-site-logo-height) * var(--layout-logo-scale));
  --dropdown-item-padding-x: 12px;
  --dropdown-item-padding-y: 4px;
}
}


/**** Main Layout START ***********************************************************/
.portable-infobox .pi-title,
/**
.portable-infobox .pi-header {
* Note: wiki.gg topbar is position:fixed. So we don't need to consider it in grid layout
text-align: center;
*/
font-size: 1.5em;
html, body {
background: color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);
  min-height: 100%;
color: var(--pi-secondary-background-label);
}
}


html {
.portable-infobox .pi-data,
  height: 100%;
.portable-infobox .pi-group {
  scroll-padding-top: calc(var(--layout-topbar-height) + 10px);
background: var(--wiki-content-background-color--secondary);
}
}


body {
.portable-infobox .pi-image {
  height: auto;
padding: 8px;
}
}


/*** main grid container ***/
.pi-image-thumbnail {
body {
max-width: 100%;
  /* self */
  box-sizing: border-box;
  /* grid */
  display: grid;
  grid-template-columns: [body-left] var(--layout-sidespace) [aside-left] var(--layout-sidebar-width) [aside-right nav-left content-left footer-left] minmax(0, 1fr) [nav-right content-right footer-right] var(--layout-sidespace) [body-right];
  grid-template-rows: [body-start] calc(var(--layout-topbar-height) + var(--layout-box-gap)) [page-start nav-start aside-start] 0fr [nav-end content-start] auto [content-end footer-start] 0fr [footer-end] 1fr [aside-end page-end] 0fr [body-end];
  gap: 0 var(--layout-box-gap);
}
}


/*** grid items ***/
.pi-caption {
/* Flatten DOM structure. Therefore we have following grid items under body grid container:
color: var(--wiki-content-text-mix-color);
* div#mw-page-base, div#mw-head-base, #mw-navigation>h2, div#mw-head, div#mw-panel, div#content.mw-body, div#footer, footer.
*/
body > .content-wrapper,
#mw-navigation {
  display: contents;
}
}


/** unused, hide them **/
.pi-section-navigation .pi-section-tab.pi-section-active,
#mw-head-base,
.pi-section-navigation .pi-section-tab.current,
#mw-navigation > h2 {
.pi-media-collection .pi-tab-link.current {
  display: none;
background: var(--pi-secondary-background);
color: var(--pi-secondary-background-label);
}
}


/** side nav bar **/
.pi-collapse > .pi-item:first-child {
#mw-panel {
cursor: pointer;
  grid-column: aside-left/aside-right;
  grid-row: aside-start/aside-end;
  margin-bottom: var(--layout-box-gap);
  float: none;
  width: unset;
  padding: 0;
  margin-top: calc(var(--layout-logo-box-height) + var(--layout-box-gap)); /* for logo */
}
}


/** nav **/
/* overqualify these to overwrite normal content heading styles */
#mw-head {
.mw-body .portable-infobox h2,
  grid-column: nav-left/nav-right;
.mw-body .portable-infobox h3 {
  grid-row: nav-start/nav-end;
border-bottom: 0;
font-family: inherit;
font-weight: 700;
margin: 0;
}
}


/** content **/
/*****************************
.mw-body {
*   End PortableInfoboxes    *
   grid-column: content-left/content-right;
******************************/
  grid-row: content-start/content-end;
}


/* For some page such as api.php, .mw-body is the only child, so take up all space. */
.mw-body:first-child {
  grid-column: body-left/body-right;
  grid-row: page-start/page-end;
}


/** #footer: content footer **/
/*******************
#footer {
* Main page layout *
  grid-column: footer-left/footer-right;
********************/
  grid-row: footer-start/footer-end;
  margin: 0;
  z-index: 0;
}


/** used to gen box shadow for main box (nav + content + #footer) **/
#mp-container {
#mw-page-base {
display: grid;
  grid-column: content-left/content-right;
gap: 10px;
  grid-row: nav-start/footer-end;
clear:both; /* for .mw-indicators combined with NOTITLE */
  height: 100%;
}
}


/** wiki.gg footer bar **/
@media screen and (max-width: 990px) {
body > footer {
/* for mobile screens */
  grid-column: body-left/body-right;
#mp-container {
  grid-row: page-end/body-end;
grid-template-areas:var(--main-page-layout--mobile);
}
grid-template-columns:var(--main-page-layout-columns--mobile, 100%);
}


/*** logo block. It is absolute position ***/
.mp-box.mp-hide-on-mobile {
#p-logo {
display: none;
  width: 100%;
}
  height: var(--layout-logo-box-height);
  margin-top: calc(0px - var(--layout-logo-box-height) - var(--layout-box-gap));
  margin-bottom: 48px;
  background: var(--theme-site-logo-image) center center/contain no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: var(--theme-site-logo-filter);
}
}


/* use logo image as <a>'s background will sometime flicker when hovered on Firefox,
@media screen and (min-width: 990px) and (max-width: 1350px) {
* I still don't know why, but move background to #p-logo can avoid this issue.
/* for narrow screens, between 990px and 1350px */
*/
#mp-container {
#p-logo .mw-wiki-logo {
grid-template-areas:var(--main-page-layout--tablet);
  width: 100%;
grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);
  height: var(--layout-logo-box-height);
}
  margin: auto;
  background: none; /* logo flicker fix */
}


/**** Main Layout END ***********************************************************/
.mp-box.mp-hide-on-tablet {
 
display: none;
/********* side panel START *********/
}
#mw-panel {
  --list-body-font-size: 14px;
  --list-body-padding-x: 6px;
  --list-body-padding-y: 3px;
  background: url(/images/2/2e/Sidebar-bg.jpg) center top no-repeat;
  height: fit-content;
  border-top-right-radius: 60px;
}
}


#mw-panel a {
@media screen and (min-width: 1350px) {
  text-decoration: none;
/* for all other screens, 1350px and wider */
}
#mp-container {
grid-template-areas:var(--main-page-layout--desktop);
grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);
}


/* section box */
.mp-box.mp-hide-on-desktop {
#mw-panel .portal {
display: none;
  margin: 0 0 12px 0;
}
  padding: 0 24px 0 16px;
}
#mw-panel .portal .vector-menu-heading {
  /* section heading */
  background: none;
  margin: 0;
  padding: 6px 0;
  font-size: 22px;
  line-height: 28px;
  font-weight: bold;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--theme-heading-color);
  border-image-source: linear-gradient(to right, #00bfe1, transparent);
  border-image-width: 0 0 1px 0;
  border-image-slice: 1;
}
}


/* show the heading of first section */
.mp-box {
#mw-panel #p-logo + .portal .vector-menu-heading {
position: relative;
  display: flex;
display: flex;
flex-flow: column nowrap;
width: 100%;
box-sizing: border-box;
background: color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);
border: 1px solid var(--wiki-content-border-color);
padding: 0px;
}
}


/* arrow icon */
.mp-body {
#mw-panel .portal .vector-menu-heading::after {
height: 100%;
  content: "";
display: flex;
  display: block;
padding: 0.5em;
  background: none;
flex-flow: column nowrap;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: var(--theme-icon-color) transparent;
  border-width: 0 5px 6px;
  margin-top: 2px;
  flex: 0 0 auto;
}
#mw-panel .portal .vector-menu-heading:hover::after {
  border-color: var(--theme-icon-color-hover) transparent;
}
#mw-panel .portal.collapsed .vector-menu-heading::after {
  transform: scaleY(-1);
}
}


/* list body */
.mp-box.centered-content .mp-body {
#mw-panel .portal .body {
height: 100%;
  background: none;
display: flex;
  border: 0;
flex-flow: column nowrap;
  padding: 0;
justify-content: space-evenly;
  margin: 6px 0 0 0;
  border-top: var(--theme-border-width) solid var(--theme-border-color);
}
#mw-panel .portal .body ul {
  padding: 0;
}
#mw-panel .portal .body li {
  margin: 0;
  padding: 0;
  font-size: var(--list-body-font-size);
  line-height: inherit;
}
#mw-panel .portal .body li:hover {
  background: var(--theme-highlight-background);
}
#mw-panel .portal .body li a {
  display: block;
  padding: var(--list-body-padding-y) 0;
  color: var(--theme-link-color);
}
#mw-panel .portal .body li a:visited {
  color: var(--theme-link-color-visited);
}
#mw-panel .portal .body li a:hover {
  color: var(--theme-link-color-hover);
}
}


/* "Atom" RSS Feed */
.mp-box.has-floating-image {
#mw-panel .portal .body li a.feedlink {
display: block;
  text-indent: calc(var(--list-body-font-size) + 2px);
  background-position: var(--list-body-padding-x) center; /* align icon with other text */
}
}


/********* side panel END *********/
.mp-box.has-floating-image .mp-body {
 
height: unset;
/********* main content box *********/
display: block;
/****** navbar (#mw-head) ******/
/* reset */
#mw-head * {
  float: unset;
  font-size: unset;
  line-height: unset;
}
}


/* tabs layout */
.mp-box.header-only {
#mw-head {
border-bottom-width:0px;
  --layout-padding: 12px;
  --layout-gap: 6px;
  --tab-padding-x: 12px;
  --tab-padding-y: 5px;
  --icon-size: 1em;
  padding: var(--layout-padding) 0 0 0;
  background: var(--theme-background);
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
#mw-head #left-navigation, #mw-head #right-navigation {
  float: none;
  flex: 1 1 auto;
  margin: 0;
  display: flex;
  align-items: flex-end;
}
#mw-head #left-navigation::before, #mw-head #left-navigation::after, #mw-head #right-navigation::before, #mw-head #right-navigation::after {
  content: "";
  display: block;
  height: 100%;
  border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
  background: var(--theme-background-shadow);
}
#mw-head #left-navigation {
  justify-content: flex-start;
}
#mw-head #right-navigation {
  justify-content: flex-end;
}
#mw-head #left-navigation::before, #mw-head #right-navigation::after {
  flex: 0 0 var(--layout-padding);
}
#mw-head #left-navigation::after, #mw-head #right-navigation::before {
  flex: 1 1 auto;
}
}


/*** tabs of navbar ***/
.mp-box.header-only .mp-body {
/* reset */
display:none;
#mw-head .vector-menu,
#mw-head .vector-menu * {
  background: none;
}
}


/* tabs list */
.mp-box.missing .mw-inputbox-input {
#mw-head .vector-menu-tabs {
/* max-width doesn't override the input element's 'size' property, but that property does work as a max-width itself, so we can set width:100% for the same effect */
  height: unset;
width:100% !important;
  padding: unset;
}
#mw-head .vector-menu-tabs .vector-menu-content-list {
  display: flex;
  align-items: flex-end;
}
}


/* tab */
/* overqualified to override normal heading styles */
#mw-head {
.mw-body .mp-box h2 {
  --theme-tab-border-style: solid;
text-align: center;
  --theme-tab-border-width: 1px;
font-weight: bold;
  --theme-border-bottom-style: solid;
font-family: var(--wiki-content-heading-font-family);
  --theme-border-bottom-width: 1px;
overflow: initial;
  --theme-border-bottom-color: var(--theme-tab-border-color-selected);
border-bottom: 1px solid var(--wiki-content-border-color);
  --theme-border-bottom-color-selected: transparent;
font-size: 150%;
}
margin: 0;
#mw-head .vector-menu-tabs .mw-list-item,
padding: 5px 0;
#mw-head .vector-menu-dropdown {
color: var(--wiki-content-heading-color);
  /* outer box */
  background: var(--theme-tab-background);
  border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
  border-radius: var(--theme-box-border-radius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  position: relative;
  margin-right: var(--layout-gap); /* make space for gap */
}
#mw-head .vector-menu-tabs .mw-list-item::after,
#mw-head .vector-menu-dropdown::after {
  /* gap */
  content: "";
  display: block;
  width: var(--layout-gap);
  height: 100%;
  border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
  position: absolute;
  left: 100%;
  bottom: calc(0px - var(--theme-border-bottom-width));
  background: var(--theme-background-shadow);
}
#mw-head .vector-menu-tabs .mw-list-item a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
  /* inner box */
  height: auto;
  margin: 0;
  padding: var(--tab-padding-y) var(--tab-padding-x);
  border: var(--theme-tab-border-width) var(--theme-tab-border-style) var(--theme-tab-border-color);
  border-bottom: 0;
  border-radius: var(--theme-box-border-radius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  color: var(--theme-link-color);
  background: var(--theme-background-shadow);
}
#mw-head .vector-menu-tabs .mw-list-item a:hover,
#mw-head .vector-menu-dropdown .vector-menu-heading:hover {
  color: var(--theme-link-color-hover);
}
#mw-head .vector-menu-tabs .mw-list-item a.new,
#mw-head .vector-menu-dropdown .vector-menu-heading.new {
  color: var(--theme-link-color-redlink);
}
#mw-head .vector-menu-tabs .mw-list-item.selected {
  /* outer box: selected */
  background: var(--theme-tab-background-selected);
  border: var(--theme-tab-border-width) var(--theme-tab-border-style) var(--theme-tab-border-color-selected);
  border-bottom: 0;
}
#mw-head .vector-menu-tabs .mw-list-item.selected:after {
  /* gap */
  bottom: 0;
  padding-left: var(--theme-tab-border-width); /* x-position offset */
}
#mw-head .vector-menu-tabs .mw-list-item.selected a {
  /* inner box: selected */
  border: 0;
  border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color-selected);
  background: none;
  color: var(--theme-text-color);
}
}


/* dropdown menu*/
#mp-box-welcome {
#mw-head .vector-menu-dropdown .vector-menu-heading {
text-align: center;
  /* tab label */
position: relative;
  position: relative;
overflow: hidden;
  display: flex;
  align-items: center;
  gap: 3px;
}
#mw-head .vector-menu-dropdown .vector-menu-heading::after {
  /* arrow icon */
  background: none;
  opacity: unset;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: var(--theme-icon-color) transparent;
  border-width: 6px 5px 0;
  margin-top: 2px;
}
#mw-head .vector-menu-dropdown:hover .vector-menu-heading::after {
  /* .vector-menu-heading is covered by .vector-menu-checkbox, therefore we can't use .vector-menu-heading:hover::after */
  border-color: var(--theme-icon-color-hover) transparent;
}
#mw-head .vector-menu-dropdown .vector-menu-content {
  /* dropdown list body */
  border: var(--theme-dropdown-border);
  border-radius: var(--theme-box-border-radius);
  background: var(--theme-dropdown-background);
  backdrop-filter: var(--theme-dropdown-backdrop-filter);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  left: 0; /* reset */
}
#mw-head .vector-menu-dropdown .vector-menu-content ul {
  padding: 4px;
}
#mw-head .vector-menu-dropdown .vector-menu-content li:hover {
  background: var(--theme-highlight-background);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a {
  display: block;
  padding: var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);
  text-decoration: none;
  color: var(--theme-link-color);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a:visited {
  color: var(--theme-link-color-visited);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a:hover {
  color: var(--theme-link-color-hover);
}
}


/* watch/unwatch star */
#mp-box-welcome h2 {
#mw-head .vector-menu-tabs .mw-watchlink.icon a {
font-size: 200%;
  --theme-link-color-hover: var(--theme-icon-color-hover);
  width: 1.5em; /* same as line height */
  height: 1.5em;
  box-sizing: content-box;
  padding: var(--tab-padding-y);
  color: transparent; /**<< for watch/unwatch, the text of <a> will be plain 'watch'/'unwatch' without <span> after clicking. **/
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a::before {
  content: "";
  display: block;
  position: unset;
  background-image: none;
  width: var(--icon-size);
  height: var(--icon-size);
  margin: calc((1.5em - var(--icon-size)) / 2);
  --mask: var(--icon) no-repeat;
  -webkit-mask: var(--mask);
  mask: var(--mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center center;
  mask-position: center center;
  background-color: var(--theme-link-color);
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a:hover::before {
  background-color: var(--theme-link-color-hover);
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a span {
  display: none;
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a::before {
  transform-origin: 50% calc(var(--icon-size) / 2 * 1.125);
}
}
#mw-head .vector-menu-tabs #ca-watch.icon {
  /* line star */
  --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M28.61,11.67H20l-2.66-8.2a1.39,1.39,0,0,0-2.64,0L12,11.67H3.39a1.39,1.39,0,0,0-.82,2.51l7,5.07L6.89,27.46a1.39,1.39,0,0,0,1.32,1.82A1.43,1.43,0,0,0,9,29l7-5.07L23,29a1.43,1.43,0,0,0,.81.27,1.39,1.39,0,0,0,1.32-1.82l-2.66-8.21,7-5.07A1.39,1.39,0,0,0,28.61,11.67Zm-7.34,6-1.17.86.44,1.38,2.09,6.41-5.45-4L16,21.46l-1.18.86-5.45,4,2.09-6.41.44-1.38-1.17-.86-5.45-4h8.19l.45-1.38L16,5.89l2.08,6.4.45,1.38h8.19Z'/%3E%3C/g%3E%3C/svg%3E");
}
#mw-head .vector-menu-tabs #ca-unwatch.icon {
  /* solid star */
  --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M28.61,11.67H20l-2.66-8.2a1.39,1.39,0,0,0-2.64,0L12,11.67H3.39a1.39,1.39,0,0,0-.82,2.51l7,5.07L6.89,27.46a1.39,1.39,0,0,0,1.32,1.82A1.43,1.43,0,0,0,9,29l7-5.07L23,29a1.43,1.43,0,0,0,.81.27,1.39,1.39,0,0,0,1.32-1.82l-2.66-8.21,7-5.07A1.39,1.39,0,0,0,28.61,11.67Z'/%3E%3C/g%3E%3C/svg%3E");
}


/*** search form ***/
#mp-welcome {
#mw-head #p-search {
display: flex;
  /* navbar common border bottom */
flex-flow: column nowrap;
  border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
position: relative;
  background: var(--theme-background-shadow);
height: 100%;
  margin: 0;
z-index: 2;
  align-self: stretch;
box-sizing: border-box;
}
#mw-head #p-search form {
  margin: 0;
}
#mw-head #p-search .vector-search-box-input {
  border-width: 1px;
  border-style: solid;
  border-color: var(--theme-border-color);
  color: var(--theme-text-color);
  background: var(--theme-background);
  box-shadow: var(--theme-shadow);
  height: 26px;
  padding: 0 26px 0 4px;
}
#mw-head #p-search .vector-search-box-input:hover {
  border-color: var(--theme-border-color-hover);
}
#mw-head #p-search .vector-search-box-input:focus {
  border-color: var(--theme-border-color-focus);
  box-shadow: var(--theme-shadow-focus);
  outline: 0;
  z-index: 1100; /* .suggestions: 1099 */
}
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton {
  z-index: 1101;
}
#mw-head #p-search .vector-search-box-input::placeholder {
  color: var(--theme-text-color-note);
}
#mw-head #p-search .mw-searchButton {
  opacity: 0;
}
#mw-head #p-search .searchButton {
  width: 26px;
  min-width: unset;
  opacity: 1;
  background-image: none;
  --mask: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E search %3C/title%3E%3Cpath fill-rule='evenodd' d='M12.2 13.6a7 7 0 1 1 1.4-1.4l5.4 5.4-1.4 1.4-5.4-5.4zM13 8A5 5 0 1 1 3 8a5 5 0 0 1 10 0z'/%3E%3C/svg%3E%0A") no-repeat;
  -webkit-mask: var(--mask);
  mask: var(--mask);
  -webkit-mask-size: 18px 18px;
  mask-size: 18px 18px;
  -webkit-mask-position: center center;
  mask-position: center center;
  background-color: var(--theme-link-color);
}
#mw-head #p-search #searchform:hover .searchButton {
  background-color: var(--theme-link-color-hover);
}
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton {
  background-color: var(--theme-link-color-focus);
}
}


/*** search result suggestions ***/
#mp-welcome .welcome-subtitle {
.suggestions {
height: 100%;
  background: var(--theme-background);
background: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);
  box-sizing: border-box;
padding: 0.5em;
  margin-top: 0;
  box-shadow: var(--theme-box-shadow);
  backdrop-filter: var(--theme-box-back-backdrop-filter);
}
.suggestions .suggestions-results,
.suggestions .suggestions-special {
  background: none;
}
.suggestions .suggestions-results {
  border: 1px solid var(--theme-border-color);
  border-top: 0;
  border-bottom-color: var(--theme-rule-color);
}
.suggestions .suggestions-results:empty {
  border-bottom: 0;
}
.suggestions .suggestions-result,
.suggestions .suggestions-special .special-label,
.suggestions .suggestions-special .special-query {
  color: var(--theme-text-color);
}
.suggestions .suggestions-result {
  padding: 1px 4px;
}
.suggestions .suggestions-special {
  margin: 0;
  padding: 2px 4px 4px;
  border: 1px solid var(--theme-border-color);
  border-top: 0;
  border-radius: var(--theme-box-border-radius);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.suggestions a.mw-searchSuggest-link,
.suggestions a.mw-searchSuggest-link:hover,
.suggestions a.mw-searchSuggest-link:active,
.suggestions a.mw-searchSuggest-link:focus {
  color: var(--theme-link-color);
}
.suggestions .suggestions-result-current {
  background: var(--theme-highlight-background);
  color: var(--theme-link-color-hover);
}
.suggestions .suggestions-result-current .special-label, .suggestions .suggestions-result-current .special-query {
  color: var(--theme-link-color-hover);
}
}


 
#mp-banner {
 
position: absolute;
/**** main content box ****/
width: 100%;
/* font */
height: 100%;
.vector-body {
filter: blur(5px);
  font-size: unset; /* reset */
z-index: -1;
  line-height: 1.7142857143;
background: url(/images/e/e0/MP_banner.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: top center;
}
}


/** layout **/
.view-dark #mp-banner {
#content {
filter: blur(5px) brightness(50%);
  color: var(--theme-text-color);
  padding: 0;
  display: flex;
  flex-direction: column;
  background: var(--theme-box-background);
  --theme-heading-rule-color-h1: var(--theme-border-color);
  --theme-heading-rule-color-h2: var(--theme-border-color);
  --layout-padding-x: 24px;
  --layout-padding-y: 16px;
}
}


.content-body {
.view-light #mp-banner {
  flex: 1 1 auto;
filter: blur(5px) contrast(50%);
}
.content-body > main {
  align-self: stretch;
  padding: var(--layout-padding-y) var(--layout-padding-x);
}
}


#bodyContent {
/* [[Template:MP_link]] */
  display: flex;
.mp-links {
  flex-direction: column;
--gap: 10px;
  position: unset;
}
}


/** main heading section **/
.mp-links > ul {
#firstHeading {
display: flex;
  overflow: hidden; /* override mw internal css, fix scroll-x issue for narrow width */
flex-flow: row wrap;
justify-content: space-evenly;
margin: 2px;
gap: var(--gap);
}
}


/** the " < rootpage < page " crumb **/
.mp-links > ul > li {
#contentSub, #contentSub2 {
display: flex;
  margin: 0;
flex-flow: column nowrap;
  color: var(--theme-text-color-note);
align-items: stretch;
  font-size: 12px;
text-align: center;
  line-height: 20px;
box-sizing: border-box;
flex: max(calc(50% - var(--gap)), 5em) 1 1;
outline: 1px solid var(--wiki-content-link-color);
transition: 0.1s ease-in;
}
}


#contentSub .subpages {
.mp-links > ul > li:hover {
  color: transparent;
background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);
  line-height: 20px;
  font-size: 0;
}
#contentSub .subpages a {
  font-size: 12px;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  padding-left: 4px;
}
#contentSub .subpages a::before {
  content: "";
  display: inline-block;
  height: 4px;
  width: 4px;
  border-color: var(--theme-icon-color);
  border-style: solid;
  border-width: 0 0 2px 2px;
  margin: 0 2px 0 0;
  transform: rotate(45deg);
}
#contentSub::after {
  /* the spacing and line between heading section and content body box */
  content: "";
  display: block;
  height: 0;
  border-bottom: 1px solid var(--theme-heading-rule-color-h2);
  margin-top: 4px;
  margin-bottom: var(--layout-padding-y);
}
}


/** content body box **/
.mp-links.columns-1 > ul > li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}
#mw-content-text {
.mp-links.columns-2 > ul > li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}
  flex: 1 1 auto;
.mp-links.columns-3 > ul > li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}
  min-height: 30em;
.mp-links.columns-4 > ul > li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}
}
.mp-links.columns-5 > ul > li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}
.mp-links.columns-6 > ul > li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}
.mp-links.columns-7 > ul > li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}
.mp-links.columns-8 > ul > li {flex: max(calc((100% / 8) - var(--gap)), 5em) 1 1;}
.mp-links.columns-max > ul > li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}


/*** "category:" box ***/
.mp-links > ul > li:hover a {
#catlinks {
text-decoration: underline;
  background: var(--theme-background);
  border: 1px solid var(--theme-border-color);
  border-radius: var(--theme-box-border-radius);
  margin: var(--layout-padding-y) 0 0 0;
  padding: 0.5em 1em;
}
}


/*** ads ***/
.mp-links > ul > li > a {
div.games-showcase-header {
display: flex;
  margin: 0;
align-items: center;
  padding: var(--layout-padding-y) var(--layout-padding-x) 0;
justify-content: center;
height: 100%;
flex: 1 1 auto;
box-sizing: border-box;
padding: 5px;
}
}


div.games-showcase-footer {
.mp-links > ul > li > a:first-child {
  margin: 0;
height: 100%;
  padding: 0 var(--layout-padding-x) var(--layout-padding-y);
}
 
.content-body > .games-showcase-sidebar {
  margin: 0;
  padding: var(--layout-padding-y) var(--layout-padding-x) 0 0;
}
 
.games-showcase-header img, .games-showcase-footer img {
  height: 100%;
  width: auto;
  object-fit: contain;
}
@media screen and (max-width: 1100px) {
  .games-showcase-header img, .games-showcase-footer img {
    height: auto !important;
    width: 100% !important;
    object-fit: contain;
  }
}
@media screen and (max-width: 926px) {
  .games-showcase-header img, .games-showcase-footer img {
    object-position: 50%;
    height: 105px !important;
    width: 100% !important;
    object-fit: none !important;
  }
}
}


aside.games-showcase-sidebar div.sidebar-showcase {
.mp-links > ul > li > a:last-child:not(:first-child) {
  padding: 0 0 var(--layout-padding-y) 0;
height: unset;
}
}


 
.mp-links.stretch,
/**** #footer (copyright info) ****/
.mp-links.stretch > ul {
#footer {
height: 100%;
  background: var(--theme-background);
  padding: 16px 24px;
  border-radius: 0 0 var(--theme-box-border-radius) var(--theme-box-border-radius);
  position: relative;
  /* grid */
  display: grid;
  grid-template-columns: [l] 1fr 0fr [r];
  grid-template-rows: [t] auto auto [b];
  z-index: 0; /* covered by content */
}
}


.mw-footer li {
.mp-links.side-image li {
  color: var(--theme-text-color);
flex-flow: row nowrap;
}
}


#footer a {
.mp-links.plain > ul > li {
  color: var(--theme-link-color);
outline-color: transparent;
}
}


#footer a:hover {
/***********************
  color: var(--theme-link-color-hover);
* End main page layout *
}
************************/


#footer-info {
  font-size: 12px;
  display: contents;
}


#footer ul li {
/*********************************************************************************************************************
  font-size: inherit;
* Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *
  line-height: 1.5;
**********************************************************************************************************************/
  padding: 0;
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
padding: 0;
}
}


#footer-icons {
/* Display list items inline */
  grid-column: span 1/r;
.hlist dd,
  grid-row: t/b;
.hlist dt,
  place-self: end;
.hlist li {
/*
* don't trust the note that says margin doesn't work with inline
* removing margin: 0 makes dds have margins again
* We also want to reset margin-right in Minerva
*/
margin: 0;
display: inline;
}
}


#footer #footer-info-lastmod {
/* Display requested top-level lists inline */
  grid-column: l/span 1;
.hlist.inline,
  grid-row: t/span 1;
.hlist.inline dl,
  place-self: start;
.hlist.inline ol,
  margin-bottom: 1em;
.hlist.inline ul,
/* Display nested lists inline */
.hlist dl dl,
.hlist dl ol,
.hlist dl ul,
.hlist ol dl,
.hlist ol ol,
.hlist ol ul,
.hlist ul dl,
.hlist ul ol,
.hlist ul ul {
display: inline;
}
}


#footer #footer-info-copyright {
/* Hide empty list items */
  grid-column: l/span 1;
.hlist .mw-empty-li {
  grid-row: span 1/b;
display: none;
  place-self: end stretch;
  position: relative;
  padding-right: 100px;
}
}


#footer-info-copyright img {
/* TODO: :not() can maybe be used here to remove the later rule. naive test
  position: absolute;
*  seems to work. more testing needed. like so: */
  right: 0;
.hlist dt:not(:last-child)::after {
  bottom: 0;
content: ":\20";
  height: 31px;
  width: auto;
}
}


#footer-places,
.hlist dd:not(:last-child)::after,
#footer > div {
.hlist li:not(:last-child)::after {
  display: none;
/* "space, Middle Dot, space"
We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.
The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */
/* content: "\20\00B7\20"; font-weight: bold; */
/* "space &nbsp; • &nbsp; space"
  There may (and likely) be an extra whitespace between <li>s,
  therefore we have to use a space character as last character of this sequence.
  By this way, the last space and the next whitespace will collapse as a single space,
  to make the whitespace on both sides of the middle dot the same width.
*/
content: "\20\A0\2022\A0\20";
font-weight: inherit;
}
}


/**** background box for nav+content+#footer ****/
/* Add parentheses around nested lists */
#mw-page-base {
.hlist dd ol::before,
  box-sizing: border-box;
.hlist dd ul::before,
  border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
.hlist dd dl::before,
  border-radius: var(--theme-box-border-radius);
.hlist dt ol::before,
  backdrop-filter: var(--theme-box-back-backdrop-filter);
.hlist dt ul::before,
  box-shadow: var(--theme-box-shadow);
.hlist dt dl::before,
  background: var(--theme-box-back-background);
.hlist li ol::before,
  z-index: -1;
.hlist li ul::before,
.hlist li dl::before {
content: "\20(";
font-weight: inherit;
}
}


#mw-head, #content, #footer {
.hlist dd ol::after,
  box-sizing: border-box;
.hlist dd ul::after,
  background-clip: padding-box;
.hlist dd dl::after,
  border: var(--theme-box-border-width) solid transparent;
.hlist dt ol::after,
  margin: 0;
.hlist dt ul::after,
.hlist dt dl::after,
.hlist li ol::after,
.hlist li ul::after,
.hlist li dl::after {
content: ")";
font-weight: inherit;
}
}


#mw-head {
/* Put ordinals in front of ordered list items */
  border-bottom-width: 0;
.hlist ol {
counter-reset: listitem;
}
}


#content {
.hlist ol > li {
  border-top-width: 0;
counter-increment: listitem;
  border-bottom-width: 0;
}
}


#footer {
.hlist ol > li::before {
  border-top-width: 0;
content: " " counter(listitem) ".\20";
}
}


/****** responsive Layout ******/
/* Progressive enhancement:
@media screen and (max-width: 1800px) {
* try to make the dot always follow the list item in same line
  :root {
    --layout-sidespace: 0px; /* whitespace width on most left and most right,must with "px" */
  }
} /* screen and (max-width: 1800px) */
@media screen and (max-width: 1365px) {
  :root {
    --layout-logo-scale: 0.75;
  }
 
  /* change layout */
  body {
    grid-template-columns: [body-left] 0 [aside-left nav-left content-left footer-left] minmax(0, 1fr) [content-right aside-right nav-right footer-right] 0 [body-right];
    grid-template-rows: [body-start] var(--layout-topbar-height) [page-start logo-start] var(--layout-logo-box-height) [logo-end aside-start] auto [aside-end nav-start] 0fr [nav-end content-start] auto [content-end footer-start] 0fr [footer-end] 1fr [page-end] 0fr [body-end];
  }
 
  /* re-style navbar */
  #mw-panel {
    display: flex;
    align-items: flex-end;
    padding: 0 var(--layout-box-gap);
    box-sizing: border-box;
    border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
    border-radius: var(--theme-box-border-radius);
    backdrop-filter: var(--theme-box-back-backdrop-filter);
    box-shadow: var(--theme-box-shadow);
    background: var(--theme-box-background), var(--theme-box-back-background);
    /* Make #p-logo be positioned relative to #mw-panel. By this way, we can safely apply filter/backdrop-filter on #mw-panel */
    position: relative;
    z-index: 1;
  }
  #mw-panel .portal {
    background: none;
    box-shadow: none;
    border: 0;
    margin: 0;
    padding: 0;
    position: relative;
  }
  #mw-panel .portal .vector-menu-heading {
    padding: 9px 12px;
    border: 0;
    border-radius: 0;
    background: none;
  }
  #mw-panel .portal .vector-menu-heading::after {
    border-width: 6px 5px 0; /* change arrow direction */
    margin-left: 4px;
  }
  #mw-panel .portal.collapsed .vector-menu-heading::after {
    transform: none;
  }
  #mw-panel .portal .body {
    display: none !important; /* !important is required, since there is inline-css from sidebar collapse/expand */
    position: absolute;
    left: 0;
    top: 100%;
    width: max-content;
    min-width: 8em;
    border: var(--theme-dropdown-border);
    border-radius: var(--theme-box-border-radius);
    background: var(--theme-dropdown-background);
    backdrop-filter: var(--theme-box-back-backdrop-filter);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  #mw-panel .portal .body li a {
    padding: 6px 12px;
  }
  #mw-panel .portal.expanded .vector-menu-heading, #mw-panel .portal:hover .vector-menu-heading {
    background: var(--theme-highlight-background);
    border-radius: 0;
  }
  #mw-panel .portal.expanded .vector-menu-heading::after, #mw-panel .portal:hover .vector-menu-heading::after {
    transform: scaleY(-1);
  }
  #mw-panel .portal.expanded .body, #mw-panel .portal:hover .body {
    display: block !important;
  }
 
  /* logo: smaller, and position relative to #mw-panel */
  #p-logo {
    background-size: calc(var(--theme-site-logo-width) * var(--layout-logo-scale)) auto;
    width: auto;
    top: calc(0px - var(--layout-logo-box-height));
  }
  #p-logo .mw-wiki-logo {
    width: calc(var(--theme-site-logo-width) * var(--layout-logo-scale));
    height: calc(var(--theme-site-logo-height) * var(--layout-logo-scale));
  }
 
  /* search: move to sidebar nav box ("main nav bar") */
  #mw-head #p-search {
    box-sizing: border-box;
    border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
    border-radius: var(--theme-box-border-radius);
    backdrop-filter: var(--theme-box-back-backdrop-filter);
    box-shadow: var(--theme-box-shadow);
    background: var(--theme-box-background), var(--theme-box-back-background);
    padding: var(--layout-padding);
    border-bottom: 0;
    position: absolute;
    right: 0;
    top: -110px; /* offset */
    z-index: 2;
  }
 
  .vector-search-box-inner {
    width: 50vw;
    max-width: 25em;
  }
 
  #mw-head #right-navigation #p-cactions {
    margin-right: 0;
  }
 
  /* "more" menu in #right-navigation */
  #mw-head #right-navigation .vector-menu-dropdown {
    margin-right: 0;
  }
  #mw-head #right-navigation .vector-menu-dropdown::after {
    display: none;
  }
  #mw-head #right-navigation .vector-menu-dropdown .vector-menu-content {
    left: auto;
    right: 0;
  }
 
} /* screen and (max-width: 1365px) */
@media screen and (max-width: 900px) {
  :root {
    --layout-logo-scale: 0.5;
    --layout-logo-box-height: calc( var(--theme-site-logo-height) * var(--layout-logo-scale) + 20px);
    --layout-box-gap: 6px;
  }
 
  /* change layout */
  body {
    grid-template-columns: [body-left aside-left nav-left content-left footer-left] minmax(0, 1fr) [content-right aside-right nav-right footer-right body-right];
  }
 
  #mw-page-base,
  #mw-panel,
  #mw-head, #content, #footer {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }
 
  #p-logo {
    left: 10px;
  }
 
  #mw-head #p-search {
    top: -98px; /* offset */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
 
  .vector-search-box-inner {
    width: 50vw;
    max-width: 20em;
  }
 
  .mw-indicators {
    z-index: auto;
  }
 
  /* re-style navbar */
  #mw-panel {
    flex-wrap: wrap;
  }
  #mw-panel .portal {
    position: unset;
    flex: 0 0 auto;
  }
  #mw-panel .portal .vector-menu-heading {
    justify-content: center;
    white-space: nowrap;
  }
  #mw-panel .portal .vector-menu-heading::after {
    display: none;
  }
  #mw-panel .portal .body {
    left: 0;
    width: 100%;
    padding: 12px;
    box-sizing: border-box;
  }
  #mw-panel .portal .body ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, var(--layout-sidebar-width));
    justify-content: center;
  }
  #mw-panel .portal .body li a {
    display: block;
  }
 
 
} /* screen and (max-width:900px) */
@media screen and (max-width: 720px) {
  :root {
    --layout-logo-scale: 0.75;
  }
 
  #p-logo {
    width: 100%;
    left: 0;
  }
 
  #mw-panel {
    box-shadow: var(--theme-box-shadow2);
    border-bottom: 0;
    display: block;
    height: 36px;
  }
  #mw-panel .portal {
    display: none;
    box-shadow: none;
    background: var(--theme-background);
    backdrop-filter: var(--theme-dropdown-backdrop-filter);
    border-left: var(--theme-dropdown-border);
    border-right: var(--theme-dropdown-border);
    margin: 0;
    border-radius: 0;
  }
  #mw-panel .portal .vector-menu-heading {
    padding: 0 12px 4px;
    border: 0;
    display: block;
    background: none;
    font-weight: bold;
  }
  #mw-panel .portal .vector-menu-heading::after {
    display: none;
  }
  #mw-panel .portal:hover .vector-menu-heading {
    background: none;
    color: var(--theme-heading-color);
  }
  #mw-panel .portal .body {
    display: block !important; /* !important is required, since there is inline-css from sidebar collapse/expand */
    position: unset;
    border: 0;
    background: none;
    backdrop-filter: none;
    padding: 4px 12px;
  }
  #mw-panel .portal .body ul {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: unset;
  }
  #mw-panel .portal .body li a {
    padding: 4px 8px;
    white-space: nowrap;
  }
  #mw-panel .portal:last-child {
    padding-bottom: 12px;
    border-bottom: var(--theme-dropdown-border);
    border-radius: 0 0 var(--layout-box-border-radius) var(--layout-box-border-radius);
  }
  #mw-panel .menu-toggle {
    --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-category-2' width='24' height='24' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E%3Cpath d='M14 4h6v6h-6z'%3E%3C/path%3E%3Cpath d='M4 14h6v6h-6z'%3E%3C/path%3E%3Cpath d='M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'%3E%3C/path%3E%3Cpath d='M7 7m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'%3E%3C/path%3E%3C/svg%3E") no-repeat;
    -webkit-mask: var(--mask);
    mask: var(--mask);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-position: center center;
    mask-position: center center;
    background-color: var(--theme-icon-color);
    cursor: pointer;
    display: block;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 6px 12px;
  }
  #mw-panel .menu-toggle.expanded ~ .portal {
    display: block;
  }
  #mw-panel .menu-toggle + .portal {
    padding-top: 12px;
    border-top: var(--theme-dropdown-border);
  }
 
  #mw-head #p-search {
    box-shadow: none;
    padding: 0;
    top: -37px; /* offset */
    left: auto;
    right: 12px;
    width: auto;
    z-index: 3;
  }
 
  .vector-search-box-inner {
    width: 100vw;
    max-width: 20em;
  }
 
  #content {
    --layout-padding-x: 12px;
    --layout-padding-y: 12px;
  }
 
  /* icon navbar tabs */
  #mw-head {
    top: unset; /* reset */
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg fill='none' height='24' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h24v24H0z' fill='none' stroke='none'/%3E%3Cpath d='M4 4l4 16l4 -14l4 14l4 -16'/%3E%3C/svg%3E");
    --icon-size: 1.5em;
  }
  #mw-head .vector-menu-tabs .mw-list-item a,
  #mw-head .vector-menu-dropdown .vector-menu-heading {
    --theme-link-color-hover: var(--theme-icon-color-hover);
    width: 1.5em; /* same as line height */
    height: 1.5em;
    box-sizing: content-box;
    padding: var(--tab-padding-y);
    color: transparent; /**<< for watch/unwatch, the text of <a> will be plain 'watch'/'unwatch' without <span> after clicking. **/
  }
  #mw-head .vector-menu-tabs .mw-list-item a::before,
  #mw-head .vector-menu-dropdown .vector-menu-heading::before {
    content: "";
    display: block;
    position: unset;
    background-image: none;
    width: var(--icon-size);
    height: var(--icon-size);
    margin: calc((1.5em - var(--icon-size)) / 2);
    --mask: var(--icon) no-repeat;
    -webkit-mask: var(--mask);
    mask: var(--mask);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-position: center center;
    mask-position: center center;
    background-color: var(--theme-link-color);
  }
  #mw-head .vector-menu-tabs .mw-list-item a:hover::before,
  #mw-head .vector-menu-dropdown .vector-menu-heading:hover::before {
    background-color: var(--theme-link-color-hover);
  }
  #mw-head .vector-menu-tabs .mw-list-item a span,
  #mw-head .vector-menu-dropdown .vector-menu-heading span {
    display: none;
  }
  #mw-head .vector-menu-dropdown .vector-menu-heading::after {
    display: none;
  }
 
  #ca-edit {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M29.12,6.05,26,2.88a3,3,0,0,0-4.24,0L6.29,18.29a3.06,3.06,0,0,0-.72,1.18L2.08,29.92l10.46-3.49a3.15,3.15,0,0,0,1.17-.72L29.12,10.29a3,3,0,0,0,0-4.24Zm-21,13.28,8.75-8.74,1.58,1.58L9.67,20.92ZM18.24,9.17l1.59-1.58,4.58,4.58-1.58,1.59ZM7.1,21.19l3.72,3.71L5.25,26.75Zm5.57,2.73-1.59-1.59,8.75-8.74,1.58,1.58Zm15-15-1.88,1.88L21.24,6.17l1.88-1.88A1,1,0,0,1,23.83,4a1,1,0,0,1,.71.29l3.17,3.18a1,1,0,0,1,.29.7A1,1,0,0,1,27.71,8.88Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #ca-view,
  #ca-view-foreign {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M30.89,15.54A17,17,0,0,0,16,6,17,17,0,0,0,1.11,15.54L.87,16l.24.46A17,17,0,0,0,16,26a17,17,0,0,0,14.89-9.54l.24-.46ZM24,16a8,8,0,1,1-8-8A8,8,0,0,1,24,16ZM3.14,16a16.47,16.47,0,0,1,4.14-4.89,10,10,0,0,0,0,9.78A16.47,16.47,0,0,1,3.14,16Zm21.58,4.89a10,10,0,0,0,0-9.78A16.47,16.47,0,0,1,28.86,16,16.47,16.47,0,0,1,24.72,20.89Z'/%3E%3Cpath d='M16,20a4,4,0,1,0-4-4A4,4,0,0,0,16,20Zm0-6a2,2,0,1,1-2,2A2,2,0,0,1,16,14Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #left-navigation li[id^=ca-nstab-] {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpolygon points='12 15 11 15 11 17 12 17 20 17 21 17 21 15 20 15 12 15'/%3E%3Cpolygon points='12 19 11 19 11 21 12 21 15 21 16 21 16 19 15 19 12 19'/%3E%3Cpath d='M20.41,3H5V26a3,3,0,0,0,3,3H24a3,3,0,0,0,3-3V9.59ZM20,5.41,24.59,10H21a1,1,0,0,1-1-1ZM24,27H8a1,1,0,0,1-1-1V5H18V9a3,3,0,0,0,3,3h4V26A1,1,0,0,1,24,27Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #ca-history {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Zm0,26A12,12,0,1,1,28,16,12,12,0,0,1,16,28Z'/%3E%3Cpath d='M17,7H15v8.52a2,2,0,0,0,.75,1.56l4.63,3.7,1.24-1.56L17,15.52Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #ca-talk {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M26,12H24V6a3,3,0,0,0-3-3H6A3,3,0,0,0,3,6V24.41l5.12-5.12A1.05,1.05,0,0,1,8.83,19H12v3a3,3,0,0,0,3,3h8.17a1.05,1.05,0,0,1,.71.29L29,30.41V15A3,3,0,0,0,26,12ZM12,15v2H8.83a3,3,0,0,0-2.12.88L5,19.59V6A1,1,0,0,1,6,5H21a1,1,0,0,1,1,1v6H15A3,3,0,0,0,12,15ZM27,25.59l-1.71-1.71A3,3,0,0,0,23.17,23H15a1,1,0,0,1-1-1V15a1,1,0,0,1,1-1H26a1,1,0,0,1,1,1Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #t-contributions {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg enable-background='new 0 0 32 32' id='Stock_cut' version='1.1' viewBox='0 0 32 32' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdesc/%3E%3Cpath d='M27,12V5h-7v0 c0-2.209-1.791-4-4-4h0c-2.209,0-4,1.791-4,4v0H1v7h0c2.209,0,4,1.791,4,4v0c0,2.209-1.791,4-4,4h0v11h11v0c0-2.209,1.791-4,4-4h0 c2.209,0,4,1.791,4,4v0h7V20h0c2.209,0,4-1.791,4-4v0C31,13.791,29.209,12,27,12L27,12z' fill='none' stroke='%23000000' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='2'/%3E%3C/svg%3E");
  }
 
  #ca-addsection {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpolygon points='29 15 17 15 17 3 15 3 15 15 3 15 3 17 15 17 15 28 17 28 17 17 29 17 29 15'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #ca-viewsource {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath class='heroicon-ui' d='M20.59 12l-3.3-3.3a1 1 0 1 1 1.42-1.4l4 4a1 1 0 0 1 0 1.4l-4 4a1 1 0 0 1-1.42-1.4l3.3-3.3zM3.4 12l3.3 3.3a1 1 0 0 1-1.42 1.4l-4-4a1 1 0 0 1 0-1.4l4-4a1 1 0 0 1 1.42 1.4L3.4 12zm7.56 8.24a1 1 0 0 1-1.94-.48l4-16a1 1 0 1 1 1.94.48l-4 16z'/%3E%3C/svg%3E");
  }
 
  #p-variants {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Zm8,13a24.28,24.28,0,0,0-.41-3.62c2.19.91,3.75,2.19,4.25,3.62Zm-2,0H17V10a20.9,20.9,0,0,1,4.34.63A20.26,20.26,0,0,1,22,15ZM17,8V4.19c1.43.5,2.71,2.06,3.62,4.25A24.28,24.28,0,0,0,17,8ZM15,4.19V8a24.28,24.28,0,0,0-3.62.41C12.29,6.25,13.57,4.69,15,4.19ZM15,10v5H10a20.26,20.26,0,0,1,.63-4.34A20.9,20.9,0,0,1,15,10ZM8,15H4.19c.5-1.43,2.06-2.71,4.25-3.62A24.28,24.28,0,0,0,8,15Zm0,2a24.28,24.28,0,0,0,.41,3.62C6.25,19.71,4.69,18.43,4.19,17Zm2,0h5v5a20.9,20.9,0,0,1-4.34-.63A20.26,20.26,0,0,1,10,17Zm5,7v3.84c-1.43-.5-2.71-2.06-3.62-4.25A24.28,24.28,0,0,0,15,24Zm2,3.84V24a24.28,24.28,0,0,0,3.62-.41C19.71,25.75,18.43,27.31,17,27.81ZM17,22V17h5a20.26,20.26,0,0,1-.63,4.34A20.9,20.9,0,0,1,17,22Zm7-5h3.84c-.5,1.43-2.06,2.71-4.25,3.62A24.28,24.28,0,0,0,24,17Zm2.87-6.12A15.11,15.11,0,0,0,23,9a15.11,15.11,0,0,0-1.85-3.87A12.12,12.12,0,0,1,26.84,10.88Zm-16-5.72A15.11,15.11,0,0,0,9,9a15.11,15.11,0,0,0-3.87,1.85A12.12,12.12,0,0,1,10.88,5.16Zm-5.72,16A15.11,15.11,0,0,0,9,23a15.11,15.11,0,0,0,1.85,3.87A12.12,12.12,0,0,1,5.16,21.12Zm16,5.72A15.11,15.11,0,0,0,23,23a15.11,15.11,0,0,0,3.87-1.85A12.12,12.12,0,0,1,21.12,26.84Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
  #p-cactions {
    --icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,13a3,3,0,1,0,3,3A3,3,0,0,0,16,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,16,17Z'/%3E%3Cpath d='M24,13a3,3,0,1,0,3,3A3,3,0,0,0,24,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,24,17Z'/%3E%3Cpath d='M8,13a3,3,0,1,0,3,3A3,3,0,0,0,8,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,8,17Z'/%3E%3C/g%3E%3C/svg%3E");
  }
 
} /* screen and (max-width:720px) */
@media screen and (max-width: 600px) {
  :root {
    --layout-logo-scale: 0.5;
  }
 
  .vector-search-box-inner {
    width: 50vw;
    max-width: 15em;
  }
 
  /* footer */
  #footer #footer-icons {
    float: none;
  }
  #footer #footer-info-copyright {
    grid-column: l/span 2;
    padding-right: 0;
    padding-bottom: 40px;
  }
  #footer #footer-info-copyright img {
    right: auto;
    left: 0;
  }
 
} /* screen and (max-width:600px) */
@media screen and (max-width: 450px) {
 
 
} /* screen and (max-width:450px) */
 
/***** Notification area *****/
.mw-notification-area-overlay {
  position: fixed;
  z-index: 9999;
}
 
.mw-notification-area {
  font-size: 14px;
  line-height: 1.7142857143;
}
 
.mw-notification {
  color: var(--theme-text-color);
  box-sizing: border-box;
  border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
  border-radius: var(--theme-box-border-radius);
  backdrop-filter: var(--theme-box-back-backdrop-filter);
  box-shadow: var(--theme-box-shadow);
  background: var(--theme-box-background), var(--theme-box-back-background);
  transform: none;
}
 
/* Notification boxes on the right, e.g. after patrolling an edit */
.mw-notification.mw-notification-type-error {
  color: var(--theme-notice-red-text-color);
  border-color: var(--theme-notice-red-text-color);
}
 
.mw-notification.mw-notification-type-warn {
  color: var(--theme-notice-orange-text-color);
  border-color: var(--theme-notice-orange-text-color);
}
 
/****** postedit notification ******/
.postedit-container {
  top: 4em;
}
 
 
/***********************************************************************************************************
* Over-width table floating-scroll
***********************************************************************************************************/
/*
css for floating-scroll v3.2.0
https://amphiluke.github.io/floating-scroll/
(c) 2022 Amphiluke
*/
*/
.fl-scrolls {
.hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))) {
  overflow: auto;
display: inline-block;
  position: fixed;
}
}


.fl-scrolls div {
/********************************************
  overflow: hidden;
* End semantically-correct horizontal lists *
  pointer-events: none;
*********************************************/
}


.fl-scrolls div:before {
/*** Miscellaneous ***/
  content: " ";
.responsive-image {
max-width: 100%;
height: auto;
box-sizing: border-box;
}
}


.fl-scrolls, .fl-scrolls div {
.view-dark .invert-on-dark,
  font-size: 1px;
.view-light .invert-on-light {
  line-height: 0;
filter: invert(100%);
  margin: 0;
  padding: 0;
}
}


.fl-scrolls-hidden div:before {
.pixelated {
  content: "  ";
image-rendering: pixelated;
}
}


.fl-scrolls-viewport {
@media screen and (min-width: 720px) {
  position: relative;
.mobileonly {
display: none;
}
}
}


.fl-scrolls-body {
@media screen and (max-width: 720px) {
  overflow: auto;
.nomobile {
display: none;
}
}
}


.fl-scrolls-viewport .fl-scrolls {
/*** Utility classes for standard MW galleries ***/
  position: absolute;
/* it's important that spaced comes before centered in the sheet */
.gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */
display: flex;
flex-flow: row wrap;
justify-content: space-evenly;
margin-left: unset;
}
}


.fl-scrolls-hoverable .fl-scrolls {
.gallery.centered {
  opacity: 0;
text-align: center;
  transition: opacity 0.5s 0.3s;
}
}


.fl-scrolls-hoverable:hover .fl-scrolls {
/**************************
  opacity: 1;
* Start Modular Templates *
}
**************************/


.fl-scrolls:not([data-orientation]), .fl-scrolls[data-orientation=horizontal] {
/********* [[Template:Ambox]] *********/
  bottom: 0;
.ambox {
  min-height: 17px;
--ambox-color: var(--wiki-accent-color);
}


.fl-scrolls:not([data-orientation]) div, .fl-scrolls[data-orientation=horizontal] div {
border: 1px solid var(--wiki-content-border-color);
  height: 1px;
border-left: 10px solid var(--ambox-color);
border-radius: 2px;
display: flex;
align-items: center;
gap: .6em;
margin: 1em 0;
padding: 3px .6em;
background-color: var(--wiki-content-background-color--secondary);
box-shadow: 2px 2px 5px 0px #0002;
}
}


.fl-scrolls-hidden.fl-scrolls:not([data-orientation]), .fl-scrolls-hidden.fl-scrolls[data-orientation=horizontal] {
@media (min-width: 720px) {
  bottom: 9999px;
.ambox {
margin-inline: 10%;
}
}
}


.fl-scrolls-viewport .fl-scrolls:not([data-orientation]), .fl-scrolls-viewport .fl-scrolls[data-orientation=horizontal] {
.ambox.tiny {
  left: 0;
padding: .04rem .5em;
margin-inline: 0;
width: fit-content;
}
}


.fl-scrolls[data-orientation=vertical] {
.ambox + .ambox {
  right: 0;
margin-top: -.6em;
  min-width: 17px;
}
 
.fl-scrolls[data-orientation=vertical] div {
  width: 1px;
}
 
.fl-scrolls-hidden.fl-scrolls[data-orientation=vertical] {
  right: 9999px;
}
 
.fl-scrolls-viewport .fl-scrolls[data-orientation=vertical] {
  top: 0;
}
 
/*css for wide table */
.table-wide {
  clear: both;
  position: relative;
}
 
.mw-parser-output > .table-width {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
 
.table-wide-inner {
  overflow-x: auto;
}
 
.table-wide-inner > table {
  margin: 0 !important;
}
 
.table-wide:before {
  box-shadow: inset -15px 0 20px -15px var(--theme-wide-table-shadow-color);
  content: "";
  display: block;
  width: 20px;
  height: 100%;
  pointer-events: none;
  position: absolute;
  right: 0;
}
 
/***********************************************************************************************************
* Styles for "real" wiki page content. (in div.mw-parser-output)
***********************************************************************************************************/
/* remove external link icon. */
.mw-parser-output a.external,
.link-https {
  padding-right: 0;
  background: none;
}
 
.mw-parser-output > :first-child {
  margin-top: 0;
}
 
/** headings **/
.mw-body h1, .mw-body-content h1, .mw-body-content h2,
.vector-body h3, .vector-body h4,
.vector-body h5, .vector-body h6 {
  margin: 0;
  color: var(--theme-heading-color);
  font-family: inherit;
  font-weight: normal;
  line-height: 1.25;
}
 
.mw-body h1, .mw-body-content h1 {
  font-size: 32px;
  line-height: 40px;
}
 
.mw-body-content h2 {
  font-size: 24px;
  line-height: 30px;
  margin-top: 18px;
  margin-bottom: 9px;
  border-bottom: 1px solid var(--theme-heading-rule-color-h2);
  padding-bottom: 3px;
}
 
.vector-body h3 {
  font-size: 20px;
  line-height: 26px;
  margin-top: 14px;
  margin-bottom: 7px;
}
 
.vector-body h4 {
  font-size: 16px;
  line-height: 22px;
  margin-top: 14px;
  margin-bottom: 7px;
}
 
.vector-body h5 {
  line-height: 22px;
  font-size: 14px;
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 7px;
}
 
.vector-body h6 {
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
  margin-top: 7px;
  margin-bottom: 7px;
}
 
/* reduce heading font size: */
@media (max-width: 900px) {
  .mw-body h1, .mw-body-content h1 {
    font-size: 24px;
    line-height: 32px;
  }
  .mw-body-content h2 {
    font-size: 20px;
    line-height: 28px;
  }
  .vector-body h3 {
    font-size: 18px;
    line-height: 24px;
  }
}
/* section edit link */
.mw-editsection {
  white-space: nowrap;
  color: var(--theme-text-color-note);
}
 
/** ToC **/
/* base common style */
.toc {
  background: none;
  border-radius: 4px;
  border: 1px solid var(--theme-border-color);
  margin-top: 18px;
  margin-bottom: 18px;
  padding: 0;
  font-size: 1em;
  min-width: 12em;
}
.toc a {
  color: var(--theme-text-color);
}
.toc .tocnumber {
  color: var(--theme-text-color-note);
}
.toc .tocnumber:after {
  content: ".";
}
 
/* header */
.toc {
  /* arrow */
  /* do not change ToC box width when toggle show/hide. */
}
.toc .toctitle {
  position: relative;
  overflow: hidden;
  text-align: left;
  padding: 8px;
}
.toc .toctitle h2 {
  line-height: 20px;
  font-weight: normal;
  margin: 0;
  border: 0;
  display: flex;
  align-items: center;
  padding: 0 0.5em;
}
.toc .toctitle h2::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewbox='0 0 12 12'%3E%3Cpath id='bulleted-list-tiny' d='M1.29 9.277c-.181.19-.29.45-.29.71 0 .26.109.52.29.71.189.18.45.29.71.29.26 0 .519-.11.71-.29.18-.19.29-.45.29-.71 0-.26-.11-.52-.29-.71-.38-.37-1.05-.37-1.42 0M10 9H6a1 1 0 1 0 0 2h4a1 1 0 1 0 0-2M6 3h4a1 1 0 1 0 0-2H6a1 1 0 1 0 0 2m4 2H6a1 1 0 1 0 0 2h4a1 1 0 1 0 0-2M1.29 1.277c.37-.37 1.04-.37 1.42 0 .18.19.29.45.29.71 0 .26-.11.52-.29.71-.191.18-.45.29-.71.29-.26 0-.521-.11-.71-.29-.181-.19-.29-.45-.29-.71 0-.26.109-.52.29-.71zM2.55 5.17c.06.03.11.08.16.12.18.19.29.45.29.71 0 .26-.11.521-.29.71-.05.04-.1.09-.16.12a.559.559 0 0 1-.17.09c-.06.03-.12.05-.19.06-.06.01-.13.02-.19.02-.26 0-.52-.11-.71-.29A1.05 1.05 0 0 1 1 6c0-.26.11-.52.29-.71.24-.23.58-.34.9-.269a.6.6 0 0 1 .19.058c.06.021.12.051.17.091z'%3E%3C/path%3E%3C/svg%3E") no-repeat;
  -webkit-mask: var(--mask);
  mask: var(--mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center center;
  mask-position: center center;
  background-color: var(--theme-text-color);
  margin: 0 6px 0 0;
}
.toc .toctogglelabel {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  box-sizing: border-box;
  padding-right: 1em;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.toc .toctogglespan::before,
.toc .toctogglespan::after,
.toc .toctogglelabel::after {
  display: none;
}
.toc .toctogglelabel::before {
  content: "";
  display: inline-block;
  background: none;
  position: relative;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: var(--theme-icon-color) transparent;
  border-width: 0 5px 6px 5px;
  vertical-align: middle;
  flex: 0 0 auto;
}
.toc .toctogglelabel:hover::before {
  border-color: var(--theme-icon-color-hover) transparent;
}
.toc .toctogglecheckbox:checked + .toctitle .toctogglelabel::before {
  border-width: 6px 5px 0 5px;
}
.toc .toctogglecheckbox:checked ~ ul {
  overflow: hidden;
  display: block;
  height: 0;
  border: 0;
  padding-top: 0;
  padding-bottom: 0;
}
}


/* content list */
.ambox-content {
.mw-content-ltr .toc ul ul,
flex: 1;
.mw-content-rtl .toc ul ul {
  margin: 0 0 0 1em;
}
}


.toc > ul {
.ambox-content p {
  padding: 0.5em;
margin: .15em 0;
  border-top: 1px solid var(--theme-border-color);
  margin: 0;
}
.toc > ul a {
  display: block;
  padding: 2px 0.5em;
  border-radius: 4px;
  transition: background 0.1s;
}
.toc > ul a:hover {
  text-decoration: none;
  background: var(--theme-highlight-background);
}
.toc > ul li {
  margin: 0;
}
}


/********* Tables *********/
.ambox-title {
table {
font-weight: bold;
  /* fix 100% width table with border */
  box-sizing: border-box;
}
}


table.lined,
/********* [[Template:Hatnote]] *********/
table.bordered,
.hatnote {
table.cellborder {
padding: 1px 0 1px 1.6em;
  border-collapse: collapse;
margin-bottom: 0.5em;
  border-style: solid;
font-style: italic;
  border-color: var(--theme-border-color);
border-top: 1px solid var(--wiki-content-border-color--secondary);
border-bottom: 1px solid var(--wiki-content-border-color--secondary);
}
}


table.lined th,
.hatnote.icon {
table.lined td {
padding-left: 0;
  border-width: 0 0 1px 0;
}
}


table tfoot:empty,
/********* [[Template:Spoiler]] *********/
table thead:empty {
.spoiler-content {
  display: none;
background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);
transition: all 0.3s;
cursor: pointer;
overflow: auto;
}
}


table.lined td.noline, table.lined tr.noline td {
@supports not (color:color-mix(in srgb, #000, transparent)) {
  border-bottom-width: 0;
.spoiler-content {
background-color: var(--wiki-content-dynamic-color--secondary);
}
}
}


table tr.bottomline td {
.spoiler-content > * {
  border-bottom-width: 1px;
pointer-events: none;
opacity: 0;
transition: all 0.3s;
}
}


table tr.topline td {
.spoiler-content.show {
  border-top-width: 1px;
background-color: transparent;
}
}


table td.bottomline, table.lined tr.noline td.bottomline {
.spoiler-content.show > * {
  border-bottom-width: 1px;
pointer-events: unset;
opacity: 1;
}
}


table td.topline {
/********* [[Template:Link icon]] *********/
  border-top-width: 1px;
.link-icon {
--link-icon-line-height: 1.5em;
--link-icon-size: 1.5em;
display: inline-flex;
align-items: center;
height: var(--link-icon-line-height);
vertical-align: bottom;
}
}


/* Hack for using "border-collapse" and "border-radius" in the same table display by using one table nested within another */
.link-icon .regular {
table.outer {
align-self: center;
  white-space: nowrap;
}
}


table.inner {
.link-icon .regular a {
  border-collapse: collapse;
display: flex;
  background: inherit;
  width: 100%;
}
}


table.inner th {
.link-icon .regular img {
  border: 2px solid var(--theme-border-color);
height: var(--link-icon-size);
max-width: var(--link-icon-size);
}
}


.wikitable,
.link-icon .fallback {
.wikitable > tr > th,
outline: 1px solid var(--wiki-content-text-color);
.wikitable > * > tr > th {
border-radius: 50%;
  color: inherit;
text-align: center;
  background: none;
width: var(--link-icon-size);
line-height: var(--link-icon-size);
}
}


.wikitable {
.link-icon.notext,
  border-color: var(--theme-border-color);
.link-icon.notext .fallback {
display: inline-block;
}
}


table.cargoTable.noMerge tr:nth-child(2n) {
/********* [[Template:Quote]] *********/
  background: rgba(127, 127, 127, 0.25);
.quote {
background: var(--wiki-content-background-color--secondary);
border-radius: 5px;
border: 2px solid var(--wiki-content-border-color);
margin: .5em 0;
padding: .5em;
overflow-y: hidden;
}
}


table.cargoTable.noMerge tr:nth-child(2n+1) {
.quote .block {
  background: none;
display: block;
}
}


/***********************************************************************************************************
.quote .title {
* common style for content box
font-size: large;
***********************************************************************************************************/
font-weight: bold;
.fullwidth, .full-width {
  width: 100%;
}
}


.nowrap {
.quote .content {
  white-space: nowrap;
font-style: italic;
}
}


/* ".center" has width=100% rule, we don't want it, so use a different class name. */
.quote .author {
.aligncenter,
font-weight: bold;
.align-center {
text-align: end;
  text-align: center;
}
}


.alignleft,
.quote .marks-wrapper {
.align-left {
display: flex;
  text-align: left;
gap: 5px;
}
}


.alignright,
.quote .marks-wrapper::before,
.align-right {
.quote .marks-wrapper::after {
  text-align: right;
font-size: 100px;
line-height: 0px;
}
}


/* clear fix for float block */
.quote .marks-wrapper::before {
.clearfix {
content: "\201C";
  *zoom: 1;
margin-top: 40px;
}
}


.clearfix::before,
.quote .marks-wrapper::after {
.clearfix::after {
content: "\201D";
  content: " ";
align-self: end;
  display: table;
margin-bottom: -10px;
}
}


.clearfix::after {
.client-js .mw-charinsert-item {
  clear: both;
display: none;
}
}


/* Thumbnail background color */
/************************
html .thumbimage {
* End Modular Templates *
  background-color: #4d3a32;
*************************/
}


/** gallery **/
/*****************************
.thumbinner {
* Used by [[Template:Color]] *
  border-radius: 5px;
******************************/
.color__splotch {
display: inline-block;
height: 1em;
width: 1em;
box-sizing: border-box;
vertical-align: text-top;
border-radius: 50%;
border: 1px solid var(--wiki-content-text-color);
}
}


li.gallerybox div.thumb {
/*********************
  border-radius: 5px;
* End Template:Color *
}
**********************/


.gallery * {
/*********************************
  box-sizing: initial;
* Used by [[Template:TOC limit]] *
**********************************/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
display: none;
}
}
/*************************
* End Template:TOC limit *
**************************/


.mw-gallery-traditional .thumb {
/*********************************
  display: flex;
* Used by [[Template:TOC right]] *
**********************************/
@media all and (min-width: 720px) {
.tocright {
float: right;
clear: right;
margin: 0 0 0.5em 1em;
}
}
}
/*************************
* End Template:TOC right *
**************************/


.mw-gallery-traditional .thumb a {
  display: block;
}


/***********************************************************************************************************
* css for specific content pages
***********************************************************************************************************/
/*********** Main page  START ****************/
/*********** Main page  START ****************/
#mainpage-wrap .footer {
#mainpage-wrap .footer {
Line 2,176: Line 1,197:
}
}
#mainpage-wrap .box {
#mainpage-wrap .box {
   border: 1px solid var(--theme-border-color);
   border: 1px solid var(--wiki-content-border-color);
   border-radius: var(--theme-box-border-radius);
   border-radius: var(--wiki-content-border-radius);
   padding: 1.5em;
   padding: 1.5em;
}
}
Line 2,294: Line 1,315:


/*********** Main page  END ****************/
/*********** Main page  END ****************/
/***********************************************************************************************************
* css for pages under MediaWiki or Special NS, or system widgets on template/module pages and so on
***********************************************************************************************************/
/********* ooui *********/
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
  background: none;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
  color: var(--theme-text-color);
}
.oo-ui-tabOptionWidget {
  color: var(--theme-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
  color: var(--theme-text-color);
  background: none;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
  color: var(--theme-text-color-note);
}
.oo-ui-tabSelectWidget-framed {
  background: none;
}
/********* for File: NS pages *********/
#filetoc {
  background: none;
}
/******* Search result page. (Special:Search)  ******/
.mw-search-form-wrapper {
  font-size: 1em;
}
.mw-search-form-wrapper #mw-search-top-table {
  display: flex;
  align-items: center;
}
.mw-search-form-wrapper #mw-search-top-table > div {
  float: none;
}
.mw-search-form-wrapper .results-info {
  color: var(--theme-text-color-note);
  font-size: 1em;
  padding: 0 0 0 3em;
  white-space: nowrap;
  text-align: right;
  flex: 1 1 auto;
}
.mw-search-form-wrapper .mw-search-visualclear {
  display: none;
}
.mw-search-form-wrapper .mw-search-profile-tabs {
  border: 0;
  margin: 1em 0;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types + div {
  display: none;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types {
  width: 100%;
  float: none;
  padding: 0;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li {
  float: none;
  display: inline-block;
  vertical-align: middle;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li.current {
  background: var(--theme-highlight-background);
  border-radius: 4px;
  overflow: hidden;
}
.mw-search-form-wrapper #mw-searchoptions {
  padding: 1em;
  background: var(--theme-box-background);
  border: 1px solid var(--theme-border-color-accent);
  border-radius: 4px;
}
/* responsive tweak */
@media screen and (max-width: 600px) {
  .mw-search-form-wrapper #mw-search-top-table {
    display: block;
  }
  .mw-search-form-wrapper .results-info {
    margin-top: 1em;
  }
  .mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li {
    font-size: 12px;
  }
}
/***********************************************************************************************************
* dark theme tweak
***********************************************************************************************************/
#filetoc, code,
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.mw-search-profile-tabs, #mw-searchoptions,
.mw-datatable td {
  background: none;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
  background: #1f3030;
  color: var(--theme-text-color);
}
#mw-allmessagestable tbody:hover td {
  background: var(--theme-highlight-background);
}
li.gallerybox div.thumb {
  background: var(--theme-box-background);
}
ul {
  list-style-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="5" height="13"><circle cx="2.5" cy="9" r="2.5" fill="#fff"/></svg>');
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
  color: var(--theme-text-color-note);
}
.oo-ui-tabSelectWidget-framed,
.mw-prefs-buttons {
  background: none;
}
.oo-ui-tabOptionWidget {
  color: var(--theme-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
  color: var(--theme-text-color);
  background: none;
}
table.diff .diff-context {
  background: rgba(248, 249, 250, 0.15);
  color: var(--theme-text-color);
}
table.diff .diff-addedline .diffchange {
  background: rgba(74, 166, 255, 0.6);
}
table.diff .diff-deletedline .diffchange {
  background: rgba(255, 198, 63, 0.6);
}
:root {
  --pi-background: rgba(255,255,255, 0.1);
}
div.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
  background: #231c3b;
}
.mw-rcfilters-ui-filterTagMultiselectWidget .oo-ui-iconElement-icon {
  filter: invert(1);
}
.mw-rcfilters-ui-filterTagMultiselectWidget .mw-rcfilters-ui-filterTagItemWidget .oo-ui-iconElement-icon {
  filter: none;
}
.mw-rcfilters-ui-filterTagMultiselectWidget .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
  color: #ddd;
}
div.thumbinner {
  background: none;
}
#pagehistory li.selected {
  background: rgba(40, 40, 40, 0.6);
  color: var(--theme-text-color);
}
#mw-indicator-mw-helplink a {
  background: none;
  position: relative;
}
#mw-indicator-mw-helplink a:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  background-image: url(/resources/src/mediawiki.helplink/images/helpNotice.svg?46d34);
  filter: invert(1);
}
.mw-plusminus-pos {
  color: #7cf56e;
}
.mw-plusminus-neg {
  color: #ff9a9b;
}
.autocomment, .autocomment a, .autocomment a:visited {
  color: var(--theme-text-color-note);
}
.mw-message-box-warning {
  background-color: rgba(54, 44, 10, 0.5);
  border-color: #fc3;
  color: #fff;
}
fieldset {
  border-color: #ccc;
}
.mw-highlight pre, .mw-highlight code, .mw-highlight .mw-code {
  color: #ccc;
}
.mw-highlight .nv {
  color: #01C2EC;
}
.portable-infobox {
  border: 1px solid var(--pi-border-color);
}
.wikiEditor-ui-toolbar {
  color: #000;
}
.toccolours {
  background-color: unset;
  border: unset;
  font-size: unset;
  padding: unset;
}

Latest revision as of 07:18, 1 November 2025

/* CSS placed here will be applied to all skins */

/******************************************************************************************
********************************* Start user-edit variables *******************************
******************************************************************************************/

/*****************************************
****** START BASIC DESIGN VARIABLES ******
----------------------------------------*/
:root {
	--wiki-content-heading-font-family: sans-serif;
	--wiki-sidebar-heading-font-family: sans-serif;
	
	--wiki-content-border-radius: 0px;
	--wiki-sidebar-border-radius: 0px;
}
/*----------------------------------------
******* END BASIC DESIGN VARIABLES *******
*****************************************/

/*****************************************
****** START BASIC COLOR VARIABLES *******
----------------------------------------*/
:root,
/* Begin dark styles, delete from here to "end dark styles" if you don't want your wiki to support any dark themes (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */
/* FYI: .view- will affect any theme marked |kind=dark, */
/* individual themes are prefixed with .theme- instead   */
.view-dark {
	/**********************
	* Probably edit these * [ DARK VIEW ]
	***********************/
	--wiki-body-background-color: #011a38;
	--wiki-body-background-image: url(filepath://Site-background.jpg);

	--wiki-content-background-color: #003e78;
	--wiki-content-background-opacity: 0%;
	--wiki-content-border-color: #0b59a2;

	--wiki-content-link-color: #6FD8FF; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */
	/* [ DARK VIEW ] */
	--wiki-accent-color: #b3ddea;
	--wiki-accent-label-color: #000;
	--wiki-accent-link-color: #1e1e43;

	--wiki-icon-to-link-filter: invert(78%) sepia(11%) saturate(2418%) hue-rotate(166deg) brightness(100%) contrast(103%);/* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */
	/**/
}
.view-dark #content .content-body {
	--wiki-content-border-color: #00a5ff;
}
/* End dark styles */

/*----------------------------------------
******* END BASIC COLOR VARIABLES ********
*****************************************/

/*****************************************
**** START ADVANCED COLOR VARIABLES ******
----------------------------------------*/

:root,
.view-dark {
	/*******************
	* Maybe edit these * [ DARK VIEW ]
	********************/
	--wiki-body-background-position: top center;
	--wiki-body-background-size: cover;
	--wiki-body-background-repeat: no-repeat;
	--wiki-body-background-attachment: fixed;

	--wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));
	--wiki-content-text-color: #fff;
	--wiki-content-link-color--visited: var(--wiki-content-link-color);
	--wiki-content-link-color--hover: var(--wiki-content-link-color);
	--wiki-content-redlink-color: #FC5B4F;

	--wiki-content-heading-color: var(--wiki-content-text-color);
	--wiki-content-heading-border-color: var(--wiki-content-border-color);

	/* [ DARK VIEW ] */
	--wiki-navigation-background-color: var(--wiki-content-background-color--secondary);
	--wiki-navigation-border-color: var(--wiki-navigation-selected-border-color);
	--wiki-navigation-text-color: var(--wiki-content-link-color);
	--wiki-navigation-selected-background-color: var(--wiki-content-background-color);
	--wiki-navigation-selected-border-color: var(--wiki-content-border-color);
	--wiki-navigation-selected-text-color: var(--wiki-content-text-color);

	/* [ DARK VIEW ] */
	--wiki-neutral-color: var(--wiki-content-text-mix-color);
	--wiki-alert-color: #ff576a;
	--wiki-warning-color: #cf721c;
	--wiki-success-color: #13aa45;
	/**/

	/***********************************
	* Likely do not need to edit these * [ DARK VIEW ]
	************************************/
	--wiki-body-dynamic-color: #ffffff;
	--wiki-body-dynamic-color--inverted: #000000;
	--wiki-body-dynamic-color--secondary: #cccccc;
	--wiki-body-dynamic-color--secondary--inverted: #333333;

	--wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);
	--wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);
	--wiki-content-link-label-color: #000;
	--wiki-content-dynamic-color: #ffffff;
	--wiki-content-dynamic-color--inverted: #000000;
	--wiki-content-dynamic-color--secondary: #cccccc;
	--wiki-content-dynamic-color--secondary--inverted: #333333;
	/* [ DARK VIEW ] */
	--wiki-alert-label-color: #000000;
	--wiki-warning-label-color: #000000;
	--wiki-success-label-color: #000000;

	--wiki-icon-general-filter: invert(100%);
}

/*----------------------------------------
***** END ADVANCED COLOR VARIABLES *******
*****************************************/

/*****************************************
**** START ADVANCED DESIGN VARIABLES *****
----------------------------------------*/

:root {
	/***********************
	  start logo position 
	----------------------*/
	--wiki-is-top-logo: 0; /* 1 = center logo at the top of the page; 0 = logo at the top left of the page */
	
	--wiki-logo-file-width: 272; /* Width of the image file in px. Put a number without the letters `px`. */
	--wiki-logo-file-height: 170; /* Height of the image file in px. Put a number without the letters `px`. */	
	--wiki-logo-height: calc(var(--wiki-logo-file-height)*1px); /* Valid only when --wiki-is-top-logo is 1. The height the logo should be shown */
	--wiki-logo-margin: 15px; /* the width of margin below the logo. When --wiki-is-top-logo is 1, this is also the default value of --wiki-top-spacing */
	/*-----------------------
	   end logo position 
	***********************/
	
	--wiki-is-navigation-inside-content: 0; /* 0 = default navigation tabs layout; 1 = navigation tabs inside content box */

	--wiki-body-font-family: sans-serif;
	--wiki-content-firstheading-font-family: var(--wiki-content-heading-font-family); /* only apply to the main title of article */

	/****** the following length variables must have units specified even if 0, ignore the warning *****/
	
	--wiki-content-border-width: 1px;
	--wiki-sidebar-width: 12.5em; /* width of sidebar(#mw-panel) */
	--wiki-sidebar-portal-spacing: 0px;
	--wiki-sidebar-border-width: 0px;
	--wiki-navigation-border-radius: 4px; /* border radius of tabs */

	/*******************
	* Maybe edit these * [ DESIGN ]
	********************/
	
	--wiki-logo-filter: none;
	
	/****** the following length variables must have units specified even if 0, ignore the warning *****/
	
	--wiki-content-border-top-radius: var(--wiki-content-border-radius);
	--wiki-content-border-style: solid;
	--wiki-content-border-image: none;
	--wiki-content-backdrop-filter: none;
	
	--wiki-page-content-max-width: 9999px; /* max width of sidebar+gap+content, must be a length value. A huge value can be used to indicate no limit, e.g. 99999px */
	--wiki-gap-between-sidebar-and-content: 24px; /* gap between sidebar(#mw-panel) and content(#content) */
	
	--wiki-sidebar-font-size: 0.875em; /* please use em or rem for this */
	--wiki-sidebar-line-height: 1.25;
	--wiki-sidebar-heading-font-size: 1.4em; /* please use em or rem for this */
	--wiki-sidebar-margin: 0em;
	--wiki-sidebar-list-item-padding: 0.25em 0.25rem;
	--wiki-sidebar-list-padding: 0.25rem;
	--wiki-sidebar-list-item-background--hover: none; /* background of hover item */

	--wiki-navigation-font-size: 0.875em; /* please use em or rem for this */
	--wiki-navigation-font-weight: normal; 
	--wiki-navigation-selected-font-weight: bold; 
	--wiki-navigation-text-transform: none;
	--wiki-navigation-height: 2.75rem; /* height of navigation area,include spacing above tabs */
	--wiki-navigation-left-spacing: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-radius) + var(--wiki-is-navigation-inside-content) * 0.5rem );
	--wiki-navigation-right-spacing: calc( var(--wiki-is-navigation-inside-content) * 0.5rem );
	--wiki-navigation-box-background-color: var(--wiki-content-background-color);
	--wiki-navigation-box-background-opacity: calc(var(--wiki-content-background-opacity)*0.8*var(--wiki-is-navigation-inside-content));
	--wiki-navigation-box-background: color-mix(in srgb, var(--wiki-navigation-box-background-color) var(--wiki-navigation-box-background-opacity), transparent); /* usually only needed when --wiki-is-navigation-inside-content is 1 */
	--wiki-navigation-box-border-image: none; /* usually only needed when --wiki-is-navigation-inside-content is 1 */
	--wiki-navigation-box-backdrop-filter: none; /* usually only needed when --wiki-is-navigation-inside-content is 1 */
	--wiki-navigation-selected-backdrop-filter: var(--wiki-content-backdrop-filter);  /* usually only needed when --wiki-is-navigation-inside-content is 0 */
	--wiki-navigation-backdrop-filter: var(--wiki-navigation-selected-backdrop-filter);  /* usually only needed when --wiki-is-navigation-inside-content is 0 */
	
	/* nav tabs style. The vector gradient is default. 
	 * If you want to customize the style of tabs, it's easier to start with the following settings:
	 *    --wiki-navigation-background-image: none;
	 *    --wiki-navigation-selected-background-image: none;
	 *    --wiki-navigation-selected-border-width: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-width) + var(--wiki-is-navigation-inside-content) * 1px );
	 *    --wiki-navigation-selected-border-bottom-background: none;
	 *    --wiki-navigation-tab-spacing: 0.25em;
	 *    --wiki-navigation-tab-padding-top: 0.5em;
	 *    --wiki-navigation-tab-padding-bottom: 0.5em;
	 */
	--wiki-navigation-tab-spacing: -30px; /* width of the space between tabs, can be a negative number, in which case adjacent tabs will overlap  */
	--wiki-navigation-tab-padding-top: 0.5em;
	--wiki-navigation-tab-padding-x: 3em;
	--wiki-navigation-tab-padding-bottom: 0.5em;
 	--wiki-navigation-selected-border-width: 0px;
	--wiki-navigation-border-width: var(--wiki-navigation-selected-border-width); /* border width of normal tabs */
	--wiki-navigation-border-image: url(filepath://Tab.png) fill 29 35 0 35/100% 35px 0 35px stretch;
	--wiki-navigation-selected-border-image: var(--wiki-navigation-border-image);
	--wiki-navigation-background-image: none;
	--wiki-navigation-background-repeat: no-repeat, no-repeat, repeat-x;
	--wiki-navigation-background-position: left bottom, right bottom, left bottom;
	--wiki-navigation-background-size:  1px 100%, 1px 100%, 100%;
	--wiki-navigation-selected-background-image: none;
	--wiki-navigation-selected-background-repeat: no-repeat, no-repeat;
	--wiki-navigation-selected-background-position: left bottom, right bottom;
	--wiki-navigation-selected-background-size:  1px 100%, 1px 100%;
	--wiki-navigation-selected-border-bottom-background: var(--wiki-content-border-color);
	
	/* affects the dropdown menu under More */
	--wiki-navigation-dropdown-text-color: var(--wiki-navigation-text-color);
	--wiki-navigation-dropdown-text-color--hover: var(--wiki-navigation-dropdown-text-color);
	--wiki-navigation-dropdown-font-size: var(--wiki-navigation-font-size); /* please use em or rem for this */
	--wiki-navigation-dropdown-border-width: 1px;
	--wiki-navigation-dropdown-border-radius: var(--wiki-navigation-border-radius);
	--wiki-navigation-dropdown-padding: 0.25em; /* padding of the dropdown menu box */
	--wiki-navigation-dropdown-item-padding: 0.625em; /* padding of each dropdown menu items */
	--wiki-navigation-dropdown-item-background--hover: none; /* background of hover item */
	--wiki-navigation-dropdown-border-image: none;
	--wiki-navigation-dropdown-backdrop-filter: none;
	--wiki-navigation-dropdown-box-shadow: none; /* box shadow */
	
	/* styles of the footer */
	--wiki-spacing-before-footer: 0px;
	--wiki-footer-border-image: none;

	/* padding on body element */
	--wiki-top-spacing: calc(var(--wiki-is-top-logo)*var(--wiki-logo-margin) + (1 - var(--wiki-is-top-logo))*1em); /* extra spacing below wiki.gg netbar */
	--wiki-left-spacing: 3em;
	--wiki-right-spacing: 3em;
	--wiki-bottom-spacing: 3em;

	/* end design variables */
}

/*----------------------------------------
***** END ADVANCED DESIGN VARIABLES ******
*****************************************/


/*******************************
**** START SHARED VARIABLES ****
**** tl;dr: don't edit this ****
********************************/
/*
	These variables are rarely touched, usually inherit other variables, and are shared on all themes.
	In 99% of cases none of these are ever edited, and you should only be doing so if you have a very clear vision,
	understand what you are doing, and *know* that what you are trying to do is not accomplished by changing
	another variable in the above sections.
	Since these are by default shared across all themes, if you support multiple themes you'll probably want to
	separate the variables you want to modify here into .view-x blocks like above. If you don't understand
	what that means or how to do that then you probably shouldn't be modifying this section.
*/
:root {
	--wiki-content-border-bottom-width: var(--wiki-content-border-width);
	--wiki-content-border-bottom-style: var(--wiki-content-border-style);
	--wiki-content-border-bottom-color: var(--wiki-content-border-color);
	--wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);
	--wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));
	--wiki-content-text-color--hover: var(--wiki-content-text-color);

	/* heading */
	--wiki-content-heading-border-bottom-width: 1px;
	--wiki-content-heading-border-style: solid;
	--wiki-content-heading-font-weight: normal;
	--wiki-content-heading-font-style: normal;
	--wiki-content-heading-text-transform: none;
	--wiki-content-heading-line-height: normal;
	--wiki-content-heading-text-shadow: none;
	/* first heading (h1) */
	--wiki-content-firstheading-border-bottom-width: var(--wiki-content-heading-border-bottom-width);
	--wiki-content-firstheading-border-style: var(--wiki-content-heading-border-style);
	--wiki-content-firstheading-border-color: var(--wiki-content-heading-border-color);
	--wiki-content-firstheading-font-weight: var(--wiki-content-heading-font-weight);
	--wiki-content-firstheading-font-style: var(--wiki-content-heading-font-style);
	--wiki-content-firstheading-text-transform: var(--wiki-content-heading-text-transform);
	--wiki-content-firstheading-line-height: var(--wiki-content-heading-line-height);
	--wiki-content-firstheading-color: var(--wiki-content-heading-color);
	--wiki-content-firstheading-text-shadow: none;
	/* sub-heading (h3, h4, h5, h6) */
	--wiki-content-subheading-border-bottom-width: 0px;
	--wiki-content-subheading-border-style: var(--wiki-content-heading-border-style);
	--wiki-content-subheading-border-color: var(--wiki-content-heading-border-color);
	--wiki-content-subheading-font-family: var(--wiki-body-font-family);
	--wiki-content-subheading-font-weight: bold;
	--wiki-content-subheading-font-style: normal;
	--wiki-content-subheading-text-transform: none;
	--wiki-content-subheading-line-height: var(--wiki-content-heading-line-height);
	--wiki-content-subheading-color: var(--wiki-content-heading-color);
	--wiki-content-subheading-text-shadow: none;
	/* heading size */
	--wiki-content-firstheading-font-size: 1.8em;
	--wiki-content-heading-h2-font-size: 1.5em;
	--wiki-content-heading-h3-font-size: 1.2em;
	--wiki-content-heading-h4-font-size: 114%;
	--wiki-content-heading-h5-font-size: 108%;
	--wiki-content-heading-h6-font-size: 100%;

	--wiki-content-toc-background: var(--wiki-content-background-color--secondary);
	--wiki-content-toc-border-width: 1px;
	--wiki-content-toc-border-style: solid;
	--wiki-content-toc-border-color: var(--wiki-content-border-color);
	--wiki-content-toc-border-radius: 0px;
	--wiki-content-toc-border-image: none;
	--wiki-content-toc-box-shadow: 0 0.1em 0.2em #000000;

	--wiki-content-catlinks-background: var(--wiki-content-background-color--secondary);
	--wiki-content-catlinks-border-width: 1px;
	--wiki-content-catlinks-border-style: solid;
	--wiki-content-catlinks-border-color: var(--wiki-content-border-color);
	--wiki-content-catlinks-border-radius: 0px;
	--wiki-content-catlinks-border-image: none;
	--wiki-content-catlinks-box-shadow: none;

	--wiki-content-filetoc-background: var(--wiki-content-background-color--secondary);
	--wiki-content-filetoc-border-width: 1px;
	--wiki-content-filetoc-border-style: solid;
	--wiki-content-filetoc-border-color: var(--wiki-content-border-color);
	--wiki-content-filetoc-border-radius: 0px;
	--wiki-content-filetoc-border-image: none;
	--wiki-content-filetoc-box-shadow: none;

	--wiki-logo-offset-x: 0px;
	--wiki-logo-offset-y: 0px;
	
	--wiki-sidebar-padding: 6px 18px 6px 10px;
	--wiki-sidebar-background-color: var(--wiki-content-background-color);
	--wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);
	--wiki-sidebar-background-image: none;
	--wiki-sidebar-background-position: center top;
	--wiki-sidebar-background-repeat: no-repeat;
	--wiki-sidebar-background-size: auto;
	--wiki-sidebar-filter: none;
	--wiki-sidebar-backdrop-filter: var(--wiki-content-backdrop-filter);
	--wiki-sidebar-border-color: var(--wiki-content-border-color);
	--wiki-sidebar-border-style: solid;
	--wiki-sidebar-border-image: none;
	--wiki-sidebar-link-color: var(--wiki-content-link-color);
	--wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);
	--wiki-sidebar-heading-color: var(--wiki-content-heading-color);
	--wiki-sidebar-heading-font-weight: bold;
	--wiki-sidebar-heading-font-style: normal;
	--wiki-sidebar-heading-text-transform: none;
	--wiki-sidebar-heading-line-height: normal;
	--wiki-sidebar-heading-padding: 0px;
	--wiki-sidebar-heading-margin: 0px 0px 0px 6px;
	--wiki-sidebar-heading-background: none;
	--wiki-sidebar-heading-border-image: linear-gradient(to right,#00bfe1,transparent) 1/0 0 1px 0;
	--wiki-sidebar-heading-text-shadow: none;
	--wiki-sidebar-list-background: none;
	--wiki-sidebar-list-border-image: none;
	--wiki-sidebar-list-margin: 0px;
	--wiki-sidebar-list-item-background: none;
	--wiki-sidebar-list-item-border-image: none;
	--wiki-sidebar-list-item-background--hover: none;
	--wiki-sidebar-list-item-border-image--hover: none;
	--wiki-sidebar-list-item-spacing: 0px;
	--wiki-sidebar-icon-to-link-filter: var(--wiki-icon-to-link-filter);
	--wiki-sidebar-offset: -2.5em; /* Vertical offset */
	--wiki-sidebar-box-padding: 20px 0px 10px 0px;
	--wiki-sidebar-box-background: url(filepath://Sidebar-bg.jpg) center top no-repeat;
	--wiki-sidebar-box-border: 0px;
	--wiki-sidebar-box-border-radius: 0px 60px 0px 0px;
	--wiki-sidebar-box-border-image: none;
	
	--wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));

	--wiki-footer-border-width: var(--wiki-content-border-width);
	--wiki-footer-border-style: var(--wiki-content-border-style);
	--wiki-footer-border-color: var(--wiki-content-border-color);
	--wiki-footer-background-color: var(--wiki-content-background-color);
	--wiki-footer-background-opacity: var(--wiki-content-background-opacity);
	--wiki-footer-backdrop-filter: var(--wiki-content-backdrop-filter);
	--wiki-footer-text-color: var(--wiki-content-text-color);
	--wiki-footer-link-color: var(--wiki-content-link-color);
	--wiki-footer-link-color--hover: var(--wiki-content-link-color--hover);
	--wiki-footer-border-radius: var(--wiki-content-border-radius);

	--wiki-navigation-background-opacity: var(--wiki-navigation-selected-background-opacity);
	--wiki-navigation-background-color--hover: var(--wiki-navigation-background-color);
	--wiki-navigation-background-opacity--hover: var(--wiki-navigation-background-opacity);
	--wiki-navigation-background-image--hover: var(--wiki-navigation-background-image);
	--wiki-navigation-background-position--hover: var(--wiki-navigation-background-position);
	--wiki-navigation-background-repeat--hover: var(--wiki-navigation-background-repeat);
	--wiki-navigation-background-size--hover: var(--wiki-navigation-background-size);
	--wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);
	--wiki-navigation-transform--hover: none;
	--wiki-navigation-selected-border-style: solid;
	--wiki-navigation-selected-background-opacity: calc(var(--wiki-content-background-opacity) * 0.8);
	--wiki-navigation-border-style: solid;
	--wiki-navigation-border-color--hover: var(--wiki-navigation-border-color);
	--wiki-navigation-border-image--hover: var(--wiki-navigation-border-image);
	--wiki-navigation-border-bottom-color: var(--wiki-navigation-selected-border-color);
	--wiki-navigation-border-bottom-style: var(--wiki-navigation-selected-border-style);
	--wiki-navigation-border-bottom-width: calc(var(--wiki-is-navigation-inside-content, 0) * var(--wiki-navigation-selected-border-width, 1px) + (1 - var(--wiki-is-navigation-inside-content, 0)) * var(--wiki-content-border-width, 1px));
	--wiki-navigation-icon-size: 1em;
	--wiki-navigation-tab-padding-x--icon: var(--wiki-navigation-tab-padding-x);
	--wiki-navigation-bottom-spacing: 0px; /* If you change this to greater than 0px, you should usually change the value of --wiki-navigation-selected-border-bottom-background to var(--wiki-navigation-border-bottom-color) */

	--wiki-navigation-dropdown-background-color: var(--wiki-content-background-color);
	--wiki-navigation-dropdown-background-opacity: 100%;
	--wiki-navigation-dropdown-border-color: var(--wiki-navigation-border-color);
	--wiki-navigation-dropdown-offset: 0px; /* vertical offset */

	--wiki-navigation-search-background-color: var(--wiki-content-background-color--secondary);
	--wiki-navigation-search-background-image: none;
	--wiki-navigation-search-background-position: 0;
	--wiki-navigation-search-background-size: auto;
	--wiki-navigation-search-background-repeat: repeat;
	--wiki-navigation-search-backdrop-filter: none;
	--wiki-navigation-search-border-color: var(--wiki-navigation-border-color);
	--wiki-navigation-search-border-color--hover: var(--wiki-accent-color);
	--wiki-navigation-search-border-style: solid;
	--wiki-navigation-search-border-width: 1px;
	--wiki-navigation-search-border-radius: 2px;
	--wiki-navigation-search-border-image: none;
	--wiki-navigation-search-border-image--hover: var(--wiki-navigation-search-border-image);
	--wiki-navigation-search-box-shadow: none;
	--wiki-navigation-search-box-shadow--hover: var(--wiki-navigation-search-box-shadow);
	--wiki-navigation-search-text-color: var(--wiki-content-text-color);
	--wiki-navigation-search-font-size: var(--wiki-navigation-font-size);
	--wiki-navigation-search-height: 2em;
	--wiki-navigation-search-button-color: currentColor;
	--wiki-navigation-search-button-color--hover: var(--wiki-navigation-search-button-color);
	--wiki-navigation-search-button-color-opacity: 80%;
	--wiki-navigation-search-button-color-opacity--hover: 95%;
	--wiki-navigation-search-bottom-spacing: 3px;
	--wiki-navigation-search-highlight-background-color: color-mix(in srgb, var(--wiki-accent-color) 5%, transparent);
	--wiki-navigation-gap-between-left-and-right: calc(max(0px, var(--wiki-navigation-tab-spacing))); /* minimum width between #left-navigation and #right-navigation before tabs start to collapse */
}

/*** tablet adjustments ***/
@media screen and (max-width: 1366px) {
	:root,
	.view-dark {
		--wiki-left-spacing: 1em;
		--wiki-right-spacing: 1em;
		--wiki-navigation-tab-spacing: 0.25em; /* width of the space between tabs, can be a negative number, in which case adjacent tabs will overlap  */
		--wiki-navigation-tab-padding-x: 0.5em;
	 	--wiki-navigation-selected-border-width: 1px;
		--wiki-navigation-border-image: none;
		--wiki-navigation-selected-border-bottom-background: none;
	}
}


/*** mobile adjustments ***/
@media screen and (max-width: 720px) {
	body.has-vector-mobile-menu{
		--wiki-sidebar-offset: 0px; /* Vertical offset */
		--wiki-sidebar-margin: 0px;
		--wiki-sidebar-heading-background: none;
		--wiki-sidebar-heading-border-image: none;
		--wiki-sidebar-heading-margin: 0px 0px -0.5em 0px;
		--wiki-sidebar-list-margin: 0px;
		--wiki-sidebar-list-background: none;
		--wiki-sidebar-list-border-image: none;
		--wiki-sidebar-list-item-background: none;
		--wiki-sidebar-list-item-border-image: none;
		--wiki-sidebar-list-item-background--hover: none;
		--wiki-sidebar-list-item-border-image--hover: none;
		--wiki-sidebar-list-item-spacing: 0px;
		--wiki-sidebar-line-height: 1.125;
		--wiki-sidebar-background-opacity: 100%;
		--wiki-navigation-search-border-width: 1px;
		--wiki-logo-offset-x: 0px;
		--wiki-logo-offset-y: 0px;
	}
}


/*****************************
**** END SHARED VARIABLES ****
******************************/

/******************************************************************************************
********************************* End user-edit variables *********************************
******************************************************************************************/

/******************************
* Fallback for older browsers *
* DONT EDIT THIS              *
*******************************/
@supports not (color:color-mix(in srgb, #000, transparent)) {
	.view-dark,
	.view-light,
	:root {
		--wiki-content-text-mix-color: var(--wiki-content-text-color);
		--wiki-content-text-mix-color-95: var(--wiki-content-background-color);
		--wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);
		--wiki-content-border-color--secondary: var(--wiki-content-border-color);
		--wiki-content-border-color--accent: var(--wiki-accent-color);
		--wiki-accent-color--hover: var(--wiki-accent-color);
		--wiki-navigation-search-highlight-background-color: transparent;
	}
}

/*****************************
* End older browser fallback *
******************************/

/*****************************
*     PortableInfoboxes      *
******************************/
:root {
	--pi-background: var(--wiki-content-background-color);
	--pi-secondary-background: var(--wiki-accent-color);
	--pi-secondary-background-label: var(--wiki-accent-label-color);
	--pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);
}

.portable-infobox .pi-title,
.portable-infobox .pi-header {
	text-align: center;
	font-size: 1.5em;
	background: color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);
	color: var(--pi-secondary-background-label);
}

.portable-infobox .pi-data,
.portable-infobox .pi-group {
	background: var(--wiki-content-background-color--secondary);
}

.portable-infobox .pi-image {
	padding: 8px;
}

.pi-image-thumbnail {
	max-width: 100%;
}

.pi-caption {
	color: var(--wiki-content-text-mix-color);
}

.pi-section-navigation .pi-section-tab.pi-section-active,
.pi-section-navigation .pi-section-tab.current,
.pi-media-collection .pi-tab-link.current {
	background: var(--pi-secondary-background);
	color: var(--pi-secondary-background-label);
}

.pi-collapse > .pi-item:first-child {
	cursor: pointer;
}

/* overqualify these to overwrite normal content heading styles */
.mw-body .portable-infobox h2,
.mw-body .portable-infobox h3 {
	border-bottom: 0;
	font-family: inherit;
	font-weight: 700;
	margin: 0;
}

/*****************************
*   End PortableInfoboxes    *
******************************/


/*******************
* Main page layout *
********************/

#mp-container {
	display: grid;
	gap: 10px;
	clear:both; /* for .mw-indicators combined with NOTITLE */
}

@media screen and (max-width: 990px) {
	/* for mobile screens */
	#mp-container {
		grid-template-areas:var(--main-page-layout--mobile);
		grid-template-columns:var(--main-page-layout-columns--mobile, 100%);
	}

	.mp-box.mp-hide-on-mobile {
		display: none;
	}
}

@media screen and (min-width: 990px) and (max-width: 1350px) {
	/* for narrow screens, between 990px and 1350px */
	#mp-container {
		grid-template-areas:var(--main-page-layout--tablet);
		grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);
	}

	.mp-box.mp-hide-on-tablet {
		display: none;
	}
}

@media screen and (min-width: 1350px) {
	/* for all other screens, 1350px and wider */
	#mp-container {
		grid-template-areas:var(--main-page-layout--desktop);
		grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);
	}

	.mp-box.mp-hide-on-desktop {
		display: none;
	}
}

.mp-box {
	position: relative;
	display: flex;
	flex-flow: column nowrap;
	width: 100%;
	box-sizing: border-box;
	background: color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);
	border: 1px solid var(--wiki-content-border-color);
	padding: 0px;
}

.mp-body {
	height: 100%;
	display: flex;
	padding: 0.5em;
	flex-flow: column nowrap;
}

.mp-box.centered-content .mp-body {
	height: 100%;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-evenly;
}

.mp-box.has-floating-image {
	display: block;
}

.mp-box.has-floating-image .mp-body {
	height: unset;
	display: block;
}

.mp-box.header-only {
	border-bottom-width:0px;
}

.mp-box.header-only .mp-body {
	display:none;
}

.mp-box.missing .mw-inputbox-input {
	/* max-width doesn't override the input element's 'size' property, but that property does work as a max-width itself, so we can set width:100% for the same effect */
	width:100% !important;
}

/* overqualified to override normal heading styles */
.mw-body .mp-box h2 {
	text-align: center;
	font-weight: bold;
	font-family: var(--wiki-content-heading-font-family);
	overflow: initial;
	border-bottom: 1px solid var(--wiki-content-border-color);
	font-size: 150%;
	margin: 0;
	padding: 5px 0;
	color: var(--wiki-content-heading-color);
}

#mp-box-welcome {
	text-align: center;
	position: relative;
	overflow: hidden;
}

#mp-box-welcome h2 {
	font-size: 200%;
}

#mp-welcome {
	display: flex;
	flex-flow: column nowrap;
	position: relative;
	height: 100%;
	z-index: 2;
	box-sizing: border-box;
}

#mp-welcome .welcome-subtitle {
	height: 100%;
	background: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);
	padding: 0.5em;
}

#mp-banner {
	position: absolute;
	width: 100%;
	height: 100%;
	filter: blur(5px);
	z-index: -1;
	background: url(/images/e/e0/MP_banner.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.view-dark #mp-banner {
	filter: blur(5px) brightness(50%);
}

.view-light #mp-banner {
	filter: blur(5px) contrast(50%);
}

/* [[Template:MP_link]] */
.mp-links {
	--gap: 10px;
}

.mp-links > ul {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	margin: 2px;
	gap: var(--gap);
}

.mp-links > ul > li {
	display: flex;
	flex-flow: column nowrap;
	align-items: stretch;
	text-align: center;
	box-sizing: border-box;
	flex: max(calc(50% - var(--gap)), 5em) 1 1;
	outline: 1px solid var(--wiki-content-link-color);
	transition: 0.1s ease-in;
}

.mp-links > ul > li:hover {
	background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);
}

.mp-links.columns-1 > ul > li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}
.mp-links.columns-2 > ul > li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}
.mp-links.columns-3 > ul > li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}
.mp-links.columns-4 > ul > li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}
.mp-links.columns-5 > ul > li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}
.mp-links.columns-6 > ul > li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}
.mp-links.columns-7 > ul > li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}
.mp-links.columns-8 > ul > li {flex: max(calc((100% / 8) - var(--gap)), 5em) 1 1;}
.mp-links.columns-max > ul > li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}

.mp-links > ul > li:hover a {
	text-decoration: underline;
}

.mp-links > ul > li > a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	flex: 1 1 auto;
	box-sizing: border-box;
	padding: 5px;
}

.mp-links > ul > li > a:first-child {
	height: 100%;
}

.mp-links > ul > li > a:last-child:not(:first-child) {
	height: unset;
}

.mp-links.stretch,
.mp-links.stretch > ul {
	height: 100%;
}

.mp-links.side-image li {
	flex-flow: row nowrap;
}

.mp-links.plain > ul > li {
	outline-color: transparent;
}

/***********************
* End main page layout *
************************/


/*********************************************************************************************************************
* Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *
**********************************************************************************************************************/
.hlist dl,
.hlist ol,
.hlist ul {
	margin: 0;
	padding: 0;
}

/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
	/*
	 * don't trust the note that says margin doesn't work with inline
	 * removing margin: 0 makes dds have margins again
	 * We also want to reset margin-right in Minerva
	 */
	margin: 0;
	display: inline;
}

/* Display requested top-level lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
	/* Display nested lists inline */
.hlist dl dl,
.hlist dl ol,
.hlist dl ul,
.hlist ol dl,
.hlist ol ol,
.hlist ol ul,
.hlist ul dl,
.hlist ul ol,
.hlist ul ul {
	display: inline;
}

/* Hide empty list items */
.hlist .mw-empty-li {
	display: none;
}

/* TODO: :not() can maybe be used here to remove the later rule. naive test
*  seems to work. more testing needed. like so: */
.hlist dt:not(:last-child)::after {
	content: ":\20";
}

.hlist dd:not(:last-child)::after,
.hlist li:not(:last-child)::after {
	/* "space, Middle Dot, space"
	We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.
	The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */
	/* content: "\20\00B7\20"; font-weight: bold; */
	/* "space &nbsp; • &nbsp; space"
	   There may (and likely) be an extra whitespace between <li>s,
	   therefore we have to use a space character as last character of this sequence.
	   By this way, the last space and the next whitespace will collapse as a single space,
	   to make the whitespace on both sides of the middle dot the same width.
	*/
	content: "\20\A0\2022\A0\20";
	font-weight: inherit;
}

/* Add parentheses around nested lists */
.hlist dd ol::before,
.hlist dd ul::before,
.hlist dd dl::before,
.hlist dt ol::before,
.hlist dt ul::before,
.hlist dt dl::before,
.hlist li ol::before,
.hlist li ul::before,
.hlist li dl::before {
	content: "\20(";
	font-weight: inherit;
}

.hlist dd ol::after,
.hlist dd ul::after,
.hlist dd dl::after,
.hlist dt ol::after,
.hlist dt ul::after,
.hlist dt dl::after,
.hlist li ol::after,
.hlist li ul::after,
.hlist li dl::after {
	content: ")";
	font-weight: inherit;
}

/* Put ordinals in front of ordered list items */
.hlist ol {
	counter-reset: listitem;
}

.hlist ol > li {
	counter-increment: listitem;
}

.hlist ol > li::before {
	content: " " counter(listitem) ".\20";
}

/* Progressive enhancement:
*  try to make the dot always follow the list item in same line
*/
.hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))) {
	display: inline-block;
}

/********************************************
* End semantically-correct horizontal lists *
*********************************************/

/*** Miscellaneous ***/
.responsive-image {
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}

.view-dark .invert-on-dark,
.view-light .invert-on-light {
	filter: invert(100%);
}

.pixelated {
	image-rendering: pixelated;
}

@media screen and (min-width: 720px) {
	.mobileonly {
		display: none;
	}
}

@media screen and (max-width: 720px) {
	.nomobile {
		display: none;
	}
}

/*** Utility classes for standard MW galleries ***/
/* it's important that spaced comes before centered in the sheet */
.gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	margin-left: unset;
}

.gallery.centered {
	text-align: center;
}

/**************************
* Start Modular Templates *
**************************/

/********* [[Template:Ambox]] *********/
.ambox {
	--ambox-color: var(--wiki-accent-color);

	border: 1px solid var(--wiki-content-border-color);
	border-left: 10px solid var(--ambox-color);
	border-radius: 2px;
	display: flex;
	align-items: center;
	gap: .6em;
	margin: 1em 0;
	padding: 3px .6em;
	background-color: var(--wiki-content-background-color--secondary);
	box-shadow: 2px 2px 5px 0px #0002;
}

@media (min-width: 720px) {
	.ambox {
		margin-inline: 10%;
	}
}

.ambox.tiny {
	padding: .04rem .5em;
	margin-inline: 0;
	width: fit-content;
}

.ambox + .ambox {
	margin-top: -.6em;
}

.ambox-content {
	flex: 1;
}

.ambox-content p {
	margin: .15em 0;
}

.ambox-title {
	font-weight: bold;
}

/********* [[Template:Hatnote]] *********/
.hatnote {
	padding: 1px 0 1px 1.6em;
	margin-bottom: 0.5em;
	font-style: italic;
	border-top: 1px solid var(--wiki-content-border-color--secondary);
	border-bottom: 1px solid var(--wiki-content-border-color--secondary);
}

.hatnote.icon {
	padding-left: 0;
}

/********* [[Template:Spoiler]] *********/
.spoiler-content {
	background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);
	transition: all 0.3s;
	cursor: pointer;
	overflow: auto;
}

@supports not (color:color-mix(in srgb, #000, transparent)) {
	.spoiler-content {
		background-color: var(--wiki-content-dynamic-color--secondary);
	}	
}

.spoiler-content > * {
	pointer-events: none;
	opacity: 0;
	transition: all 0.3s;
}

.spoiler-content.show {
	background-color: transparent;
}

.spoiler-content.show > * {
	pointer-events: unset;
	opacity: 1;
}

/********* [[Template:Link icon]] *********/
.link-icon {
	--link-icon-line-height: 1.5em;
	--link-icon-size: 1.5em;
	display: inline-flex;
	align-items: center;
	height: var(--link-icon-line-height);
	vertical-align: bottom;
}

.link-icon .regular {
	align-self: center;
}

.link-icon .regular a {
	display: flex;
}

.link-icon .regular img {
	height: var(--link-icon-size);
	max-width: var(--link-icon-size);
}

.link-icon .fallback {
	outline: 1px solid var(--wiki-content-text-color);
	border-radius: 50%;
	text-align: center;
	width: var(--link-icon-size);
	line-height: var(--link-icon-size);
}

.link-icon.notext,
.link-icon.notext .fallback {
	display: inline-block;
}

/********* [[Template:Quote]] *********/
.quote {
	background: var(--wiki-content-background-color--secondary);
	border-radius: 5px;
	border: 2px solid var(--wiki-content-border-color);
	margin: .5em 0;
	padding: .5em;
	overflow-y: hidden;
}

.quote .block {
	display: block;
}

.quote .title {
	font-size: large;
	font-weight: bold;
}

.quote .content {
	font-style: italic;
}

.quote .author {
	font-weight: bold;
	text-align: end;
}

.quote .marks-wrapper {
	display: flex;
	gap: 5px;
}

.quote .marks-wrapper::before,
.quote .marks-wrapper::after {
	font-size: 100px;
	line-height: 0px;
}

.quote .marks-wrapper::before {
	content: "\201C";
	margin-top: 40px;
}

.quote .marks-wrapper::after {
	content: "\201D";
	align-self: end;
	margin-bottom: -10px;
}

.client-js .mw-charinsert-item {
	display: none;
}

/************************
* End Modular Templates *
*************************/

/*****************************
* Used by [[Template:Color]] *
******************************/
.color__splotch {
	display: inline-block;
	height: 1em;
	width: 1em;
	box-sizing: border-box;
	vertical-align: text-top;
	border-radius: 50%;
	border: 1px solid var(--wiki-content-text-color);
}

/*********************
* End Template:Color *
**********************/

/*********************************
* Used by [[Template:TOC limit]] *
**********************************/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
	display: none;
}
/*************************
* End Template:TOC limit *
**************************/

/*********************************
* Used by [[Template:TOC right]] *
**********************************/
@media all and (min-width: 720px) {
	.tocright {
		float: right;
		clear: right;
		margin: 0 0 0.5em 1em; 
	}
}
/*************************
* End Template:TOC right *
**************************/


/*********** Main page  START ****************/
#mainpage-wrap .footer {
  text-align: right;
  font-size: 12px;
  line-height: 22px;
}
#mainpage-wrap .box {
  border: 1px solid var(--wiki-content-border-color);
  border-radius: var(--wiki-content-border-radius);
  padding: 1.5em;
}
#mainpage-wrap h2 {
  margin-top: 0;
  border-bottom: 0;
}
#mainpage-wrap .content-wrap {
  display: flex;
  gap: 1em;
  align-items: stretch;
  margin-bottom: 1em;
}
@media (max-width: 1200px) {
  #mainpage-wrap .content-wrap {
    flex-direction: column;
  }
}
#mainpage-wrap .content-wrap .l {
  flex: 3 3 600px;
  display: flex;
  flex-direction: column;
  gap: 1em;
}
#mainpage-wrap .content-wrap .r {
  flex: 1 1 300px;
  display: flex;
  flex-direction: column;
  gap: 1em;
}
#mainpage-wrap .box.header {
  text-align: center;
}
#mainpage-wrap .box.header .welcome h2 {
  font-size: 2em;
}
#mainpage-wrap .box.header ul {
  display: inline-flex;
  align-items: center;
  margin: 1.5em auto 0.5em;
  gap: 1em;
}
#mainpage-wrap .box.header ul li {
  list-style: none;
}
@media (max-width: 600px) {
  #mainpage-wrap .box.header img {
    width: 32px;
    height: auto;
  }
}
#mainpage-wrap .box.game > div {
  display: flex;
  gap: 1em;
  align-items: center;
}
@media (max-width: 640px) {
  #mainpage-wrap .box.game > div {
    flex-direction: column;
  }
}
#mainpage-wrap .box.game img {
  width: 100%;
  height: auto;
  max-width: 320px;
  max-height: 180px;
  box-shadow: 0 0 3px rgba(255, 255, 255, 0.25);
}
#mainpage-wrap .box.game p {
  font-size: 16px;
  line-height: 28px;
}
#mainpage-wrap .box.feature {
  font-size: 18px;
}
@media (max-width: 600px) {
  #mainpage-wrap .box.feature {
    font-size: 16px;
  }
}
#mainpage-wrap .box.feature ul {
  margin: 0.5em 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  list-style: none;
  justify-items: start;
  gap: 1em 1.5em;
}
@media (max-width: 600px) {
  #mainpage-wrap .box.feature ul {
    gap: 8px;
  }
}
#mainpage-wrap .box.gallery ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin: 0;
}
#mainpage-wrap .box.gallery ul li {
  flex: 1 1 40%;
  list-style: none;
}
@media (max-width: 1200px) and (min-width: 720px) {
  #mainpage-wrap .box.gallery ul li {
    flex: 1 1 22%;
  }
}
#mainpage-wrap .box.gallery ul li img {
  width: 100%;
  height: auto;
}
#mainpage-wrap .box.gallery img {
  box-shadow: 0 0 3px rgba(255, 255, 255, 0.25);
}

/*********** Main page  END ****************/
Retrieved from "https://wiki.digitalmasters.world/wiki/index.php?title=MediaWiki:Common.css&oldid=23839"
Last modified
This page was last edited on 1 November 2025, at 07:18.