https://wiki.you107657.duckdns.org/api.php?action=feedcontributions&feedformat=atom&user=Admin 2026-09-25T16:09:43Z User contributions MediaWiki 1.43.9 https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.js&diff=7804 2026-09-25T15:52:47Z

<p>Admin: view-lightクラスを付与してテーマ変数を発動</p> <hr /> <div>document.documentElement.classList.add('view-light');<br /> /* ==== Reincarnated ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> /**<br /> * Pause animations on mouseover of a designated container (.animated-container and .mcui)<br /> *<br /> * This is so people have a chance to look at the image and click on pages they want to view.<br /> */<br /> $( '#mw-content-text' ).on( 'mouseenter mouseleave', '.animated-container, .mcui', function( e ) {<br /> $( this ).find( '.animated' ).toggleClass( 'animated-paused', e.type === 'mouseenter' );<br /> } );<br /> <br /> /**<br /> * Element animator<br /> *<br /> * Cycles through a set of elements (or &quot;frames&quot;) on a 2 second timer per frame<br /> * Add the &quot;animated&quot; class to the frame containing the elements to animate.<br /> * Optionally, add the &quot;animated-active&quot; class to the frame to display first.<br /> * Optionally, add the &quot;animated-subframe&quot; class to a frame, and the<br /> * &quot;animated-active&quot; class to a subframe within, in order to designate a set of<br /> * subframes which will only be cycled every time the parent frame is displayed.<br /> * Animations with the &quot;animated-paused&quot; class will be skipped each interval.<br /> */<br /> ( function() {<br /> var $content = $( '#mw-content-text' );<br /> <br /> // Helper function: advance the &quot;animated-active&quot; class to the next sibling<br /> var advanceFrame = function( parentElem, parentSelector ) {<br /> var curFrame = parentElem.querySelector( parentSelector + ' &gt; .animated-active' );<br /> $( curFrame ).removeClass( 'animated-active' );<br /> var $nextFrame = $( curFrame &amp;&amp; curFrame.nextElementSibling || parentElem.firstElementChild );<br /> return $nextFrame.addClass( 'animated-active' );<br /> };<br /> <br /> // Check if the tab is hidden (stop animating if user is in another tab)<br /> var hidden;<br /> if ( typeof document.hidden !== 'undefined' ) {<br /> hidden = 'hidden';<br /> } else if ( typeof document.msHidden !== 'undefined' ) {<br /> hidden = 'msHidden';<br /> } else if ( typeof document.webkitHidden !== 'undefined' ) {<br /> hidden = 'webkitHidden';<br /> }<br /> <br /> // Every 2 seconds, cycle through each .animated element<br /> setInterval( function() {<br /> // If the document is hidden, skip animating<br /> if ( hidden &amp;&amp; document[hidden] ) {<br /> return;<br /> }<br /> <br /> // For each .animated container...<br /> $content.find( '.animated' ).each( function() {<br /> // Skip if .animated-paused is present<br /> if ( $( this ).hasClass( 'animated-paused' ) ) {<br /> return;<br /> }<br /> <br /> // Advance the main frame<br /> var $nextFrame = advanceFrame( this, '.animated' );<br /> <br /> // If the new active frame is itself a .animated-subframe, advance that too<br /> if ( $nextFrame.hasClass( 'animated-subframe' ) ) {<br /> advanceFrame( $nextFrame[0], '.animated-subframe' );<br /> }<br /> } );<br /> }, 2000 );<br /> }() );<br /> <br /> <br /> /**<br /> * Set minimum height for animations to prevent moving the page if the frames differ in height<br /> */<br /> ( function() {<br /> // Mark them visible for a moment to measure<br /> var $animated = $( '.animated' ).addClass( 'animated-visible' );<br /> <br /> var animateds = [];<br /> $animated.each( function() {<br /> animateds.push( {<br /> $: $( this ).find( '&gt; .animated-subframe' ).addBack()<br /> .find( '&gt; *:not(.animated-subframe)' ),<br /> } );<br /> } );<br /> <br /> // Find max height among sibling frames<br /> $.each( animateds, function() {<br /> var minHeight = 0, differentHeights;<br /> this.$.each( function() {<br /> var height = this.offsetHeight;<br /> differentHeights = differentHeights || ( minHeight &amp;&amp; height !== minHeight );<br /> minHeight = Math.max( height, minHeight );<br /> } );<br /> if ( differentHeights ) {<br /> this.height = minHeight;<br /> }<br /> } );<br /> <br /> // Apply min-height, then hide them again<br /> $animated.each( function( i ) {<br /> $( this ).css( 'min-height', animateds[i].height );<br /> } ).removeClass( 'animated-visible' );<br /> <br /> // Optional lazy-loading for all frames once the animation is in view<br /> var animatedObserver = new IntersectionObserver( function( entries ) {<br /> entries.forEach( function( entry ) {<br /> if ( entry.isIntersecting &amp;&amp; !entry.target.classList.contains( 'animated-lazyloaded' ) ) {<br /> $( entry.target ).find( 'img' ).attr( 'loading', 'eager' );<br /> entry.target.classList.add( 'animated-lazyloaded' );<br /> animatedObserver.unobserve( entry.target );<br /> }<br /> } );<br /> } );<br /> <br /> $animated.each( function() {<br /> animatedObserver.observe( this );<br /> } );<br /> }() );<br /> <br /> document.addEventListener(&quot;DOMContentLoaded&quot;, function() {<br /> var hideTemplate = document.querySelector('.hide-content-template');<br /> if (hideTemplate) {<br /> // Hide all other content<br /> var bodyChildren = document.body.children;<br /> for (var i = 0; i &lt; bodyChildren.length; i++) {<br /> var child = bodyChildren[i];<br /> if (!child.classList.contains('hide-content-template')) {<br /> child.style.display = 'none';<br /> }<br /> }<br /> <br /> // Optionally, style the template container<br /> hideTemplate.style.position = 'relative';<br /> hideTemplate.style.zIndex = '1000';<br /> hideTemplate.style.background = 'white';<br /> hideTemplate.style.padding = '20px';<br /> hideTemplate.style.border = '2px solid #f00';<br /> }<br /> });<br /> <br /> /**<br /> * Creates Minecraft-style tooltips<br /> *<br /> * Replaces normal tooltips. Supports Minecraft [[formatting codes]] (except k), and a description with line breaks (/).<br /> */<br /> ( function() {<br /> var escapeChars = { '\\&amp;': '&amp;#38;', '&lt;': '&amp;#60;', '&gt;': '&amp;#62;' };<br /> var escape = function( text ) {<br /> // &quot;\&quot; must be escaped first<br /> return text.replace( /\\\\/g, '&amp;#92;' )<br /> .replace( /\\&amp;|[&lt;&gt;]/g, function( char ) { return escapeChars[char]; } );<br /> };<br /> var $tooltip = $();<br /> var $win = $( window ), winWidth, winHeight, width, height;<br /> <br /> $( '#mw-content-text' ).on( {<br /> 'mouseenter.minetip': function( e ) {<br /> $tooltip.remove();<br /> <br /> var $elem = $( this ), title = $elem.attr( 'data-minetip-title' );<br /> if ( title === undefined ) {<br /> title = $elem.attr( 'title' );<br /> if ( title !== undefined ) {<br /> title = $.trim( title.replace( /&amp;/g, '\\&amp;' ) );<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> }<br /> <br /> // No title or title only contains formatting codes<br /> if ( title === undefined || title !== '' &amp;&amp; title.replace( /&amp;([0-9a-jl-qs-vyzr]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/g, '' ) === '' ) {<br /> // Find deepest child title<br /> var childElem = $elem[0], childTitle;<br /> do {<br /> if ( childElem.hasAttribute( 'title' ) ) {<br /> childTitle = childElem.title;<br /> }<br /> childElem = childElem.firstChild;<br /> } while( childElem &amp;&amp; childElem.nodeType === 1 );<br /> if ( childTitle === undefined ) {<br /> return;<br /> }<br /> <br /> // Append child title as title may contain formatting codes<br /> if ( !title ) {<br /> title = '';<br /> }<br /> title += $.trim( childTitle.replace( /&amp;/g, '\\&amp;' ) );<br /> <br /> // Set the retrieved title as data for future use<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> <br /> if ( !$elem.data( 'minetip-ready' ) ) {<br /> // Remove title attributes so the native tooltip doesn't get in the way<br /> $elem.find( '[title]' ).addBack().removeAttr( 'title' );<br /> $elem.data( 'minetip-ready', true );<br /> }<br /> <br /> if ( title === '' ) {<br /> return;<br /> }<br /> <br /> var content = '&lt;span class=&quot;minetip-title&quot;&gt;' + escape( title ) + '&amp;r&lt;/span&gt;';<br /> <br /> var description = $.trim( $elem.attr( 'data-minetip-text' ) );<br /> if ( description ) {<br /> // Apply normal escaping plus &quot;/&quot;<br /> description = escape( description ).replace( /\\\//g, '&amp;#47;' );<br /> content += '&lt;span class=&quot;minetip-description&quot;&gt;' + description.replace( /\//g, '&lt;br&gt;' ) + '&amp;r&lt;/span&gt;';<br /> }<br /> <br /> // Add classes for Minecraft formatting codes<br /> while ( content.search( /&amp;(?:[0-9a-jl-qs-vyz]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/ ) &gt; -1 ) {<br /> content = content.replace( /&amp;([0-9a-jl-qs-vyz])(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-$1&quot;&gt;$2&lt;/span&gt;&amp;r' );<br /> content = content.replace( /&amp;(?:#([0-9a-fA-F]{6})|\$([0-9a-fA-F]{3}))(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-custom&quot; style=&quot;color: #$1$2;&quot;&gt;$3&lt;/span&gt;&amp;r' );<br /> }<br /> // Remove reset formatting<br /> content = content.replace( /&amp;r/g, '' );<br /> <br /> $tooltip = $( '&lt;div id=&quot;minetip-tooltip&quot;&gt;' );<br /> $tooltip.html( content ).appendTo( 'body' );<br /> <br /> // Cache current window and tooltip size<br /> winWidth = $win.width();<br /> winHeight = $win.height();<br /> width = $tooltip.outerWidth( true );<br /> height = $tooltip.outerHeight( true );<br /> <br /> // Trigger a mouse movement to position the tooltip<br /> $elem.trigger( 'mousemove', e );<br /> },<br /> 'mousemove.minetip': function( e, trigger ) {<br /> if ( !$tooltip.length ) {<br /> $( this ).trigger( 'mouseenter' );<br /> return;<br /> }<br /> <br /> // Get event data from remote trigger<br /> e = trigger || e;<br /> <br /> // Get mouse position and add default offsets<br /> var top = e.clientY - 34;<br /> var left = e.clientX + 14;<br /> <br /> // If going off the right of the screen, go to the left of the cursor<br /> if ( left + width &gt; winWidth ) {<br /> left -= width + 36;<br /> }<br /> <br /> // If now going off to the left of the screen, resort to going above the cursor<br /> if ( left &lt; 0 ) {<br /> left = 0;<br /> top -= height - 22;<br /> <br /> // Go below the cursor if too high<br /> if ( top &lt; 0 ) {<br /> top += height + 47;<br /> }<br /> // Don't go off the top of the screen<br /> } else if ( top &lt; 0 ) {<br /> top = 0;<br /> // Don't go off the bottom of the screen<br /> } else if ( top + height &gt; winHeight ) {<br /> top = winHeight - height;<br /> }<br /> <br /> // Apply the positions<br /> $tooltip.css( { top: top, left: left } );<br /> },<br /> 'mouseleave.minetip': function() {<br /> if ( !$tooltip.length ) {<br /> return;<br /> }<br /> <br /> $tooltip.remove();<br /> $tooltip = $();<br /> }<br /> }, '.minetip, .invslot-item' );<br /> }() );<br /> <br /> /* ==== Mysticism ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> <br /> <br /> // Remove the Abilities/Whatever<br /> <br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Vector.css&diff=7803 2026-09-25T15:45:24Z

<p>Admin: 本家ReincarnatedのCSSのみに戻す</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* All CSS here will be loaded for users of the Vector skin */<br /> <br /> /*********************************************************<br /> * Backwards compatibility with deprecated variable names *<br /> **********************************************************/<br /> :root {<br /> --wiki-heading-color: var(--wiki-content-heading-color);<br /> }<br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /************************************<br /> * Body, head, and general framework *<br /> *************************************/<br /> body {<br /> background-color: var(--wiki-body-background-color);<br /> background-image: var(--wiki-body-background-image);<br /> /* the following have fallbacks for backwards compatibility with older versions of the loadout */<br /> background-position: var(--wiki-body-background-position, top center);<br /> background-size: var(--wiki-body-background-size, cover);<br /> background-repeat: var(--wiki-body-background-repeat, no-repeat);<br /> background-attachment: var(--wiki-body-background-attachment, fixed);<br /> font-family: var(--wiki-body-font-family);<br /> accent-color: var(--wiki-accent-color);<br /> }<br /> <br /> #mw-page-base {<br /> background:none;<br /> }<br /> <br /> /* let ul default to text that respects color */<br /> ul {<br /> list-style-image: none;<br /> }<br /> <br /> /************************<br /> * End general framework *<br /> *************************/<br /> <br /> /**************<br /> * Vector tabs *<br /> ***************/<br /> .vector-menu-tabs-legacy {<br /> padding-left: var(--wiki-content-border-width, 1px);<br /> }<br /> <br /> .vector-menu-tabs-legacy li,<br /> #p-cactions {<br /> background-image: linear-gradient(<br /> to top,<br /> var(--wiki-navigation-border-color) 0,<br /> var(--wiki-navigation-background-color) 1px,<br /> var(--wiki-navigation-background-color--secondary) 100%);<br /> }<br /> <br /> #p-cactions {<br /> z-index: 5;<br /> }<br /> <br /> #p-variants {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .vector-menu-dropdown {<br /> /* Matching a built-in rule for .vector-menu-tabs-legacy */<br /> height: 2.5em;<br /> }<br /> <br /> .vector-menu-tabs-legacy li.selected {<br /> background: var(--wiki-navigation-selected-background-color);<br /> border-color: var(--wiki-navigation-selected-border-color);<br /> }<br /> <br /> .vector-menu-tabs,<br /> .vector-menu-tabs a,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading{<br /> background-image: linear-gradient(to bottom,transparent 0,var(--wiki-navigation-border-color) 100%);<br /> background-size: var(--wiki-content-border-width, 1px) 100%;<br /> }<br /> <br /> .vector-menu-tabs li a,<br /> .vector-menu-tabs li.new a,<br /> .vector-menu-tabs li.new a:visited,<br /> .vector-menu-tabs .selected a,<br /> .vector-menu-tabs .selected a:visited,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading {<br /> color: var(--wiki-navigation-text-color);<br /> }<br /> <br /> .vector-menu-tabs .selected a,<br /> .vector-menu-tabs .selected a:visited {<br /> color: var(--wiki-navigation-selected-text-color);<br /> }<br /> <br /> .vector-menu-dropdown .vector-menu-content {<br /> background: none;<br /> border: none;<br /> box-shadow:none;<br /> margin-top:-1px;<br /> }<br /> <br /> .vector-menu-dropdown .vector-menu-content-list {<br /> background-color: var(--wiki-navigation-background-color--secondary);<br /> border: 1px solid var(--wiki-navigation-border-color);<br /> }<br /> <br /> div.vectorMenu .mw-list-item a,<br /> .vector-menu-dropdown .mw-list-item a,<br /> .vector-menu-dropdown .mw-list-item.selected a,<br /> .vector-menu-dropdown .mw-list-item.selected a:visited {<br /> color: var(--wiki-navigation-text-color);<br /> }<br /> <br /> .vector-menu-tabs li a:hover,<br /> .vector-menu-tabs li.new a:hover,<br /> .vector-menu-tabs li.new a:visited:hover,<br /> .vector-menu-tabs .selected a:hover,<br /> .vector-menu-tabs .selected a:visited:hover,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading:hover,<br /> div.vectorMenu .mw-list-item a:hover,<br /> .vector-menu-dropdown .mw-list-item.selected a:hover,<br /> .vector-menu-dropdown .mw-list-item.selected a:visited:hover {<br /> color:var(--wiki-navigation-text-color--hover);<br /> }<br /> <br /> .vector-menu-dropdown .vector-menu-heading::after {<br /> filter: brightness(0) var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> #p-search {<br /> z-index:2;<br /> }<br /> <br /> #p-search .searchButton {<br /> background-color:transparent;<br /> }<br /> <br /> /******************<br /> * End vector tabs *<br /> *******************/<br /> <br /> /********<br /> * Links *<br /> *********/<br /> a,<br /> .mw-parser-output a.external,<br /> .mw-parser-output a.extiw {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> a:visited,<br /> .mw-parser-output a.extiw:visited,<br /> .mw-parser-output a.external:visited {<br /> color: var(--wiki-content-link-color--visited);<br /> }<br /> <br /> a:not(.mw-selflink):hover,<br /> a:visited:hover,<br /> .mw-parser-output a.extiw:hover,<br /> .mw-parser-output a.extiw:visited:hover,<br /> .mw-parser-output a.external:hover,<br /> .mw-parser-output a.external:visited:hover {<br /> color:var(--wiki-content-link-color--hover);<br /> }<br /> <br /> a.new,<br /> a.new:visited,<br /> a.new:hover,<br /> .mw-usertoollinks-contribs-no-edits {<br /> color:var(--wiki-content-redlink-color);<br /> }<br /> <br /> a:not(.mw-selflink):active,<br /> a:visited:active,<br /> .mw-parser-output a.extiw:active,<br /> .mw-parser-output a.extiw:visited:active,<br /> .mw-parser-output a.external:active,<br /> .mw-parser-output a.external:visited:active {<br /> color: var(--wiki-warning-color);<br /> }<br /> <br /> /* move external marker to an after so we can filter it to link color */<br /> .mw-parser-output a.external {<br /> background:none;<br /> padding-right: 0;<br /> }<br /> <br /> .mw-parser-output a.external::after {<br /> display:inline-block;<br /> width:1em;<br /> height:1em;<br /> margin-left:1px;<br /> content:'';<br /> vertical-align: text-top;<br /> --mask: var(--icon) no-repeat;<br /> --mask-size: 0.857em;<br /> --mask-position: center right;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: var(--mask-size);<br /> mask-size: var(--mask-size);<br /> -webkit-mask-position: var(--mask-position);<br /> mask-position: var(--mask-position);<br /> background-color: currentColor;<br /> }<br /> <br /> .mw-parser-output a.external::after {<br /> margin-left:0;<br /> --icon: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E %3Cpath d=%22M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16L6 1ZM2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z%22/%3E %3C/svg%3E&quot;);<br /> }<br /> <br /> a.extiw[title^=&quot;wikipedia:&quot;]::after,<br /> a.extiw[title^=&quot;wp:&quot;]::after,<br /> a.extiw[title^=&quot;mw:&quot;]::after,<br /> a.extiw[title^=&quot;support:&quot;]::after {<br /> display:inline-block;<br /> width:1em;<br /> height:1em;<br /> margin-left:1px;<br /> background-position: center right;<br /> background-repeat: no-repeat;<br /> background-size: 0.857em;<br /> content:'';<br /> vertical-align: text-top;<br /> }<br /> <br /> a.extiw[title^=&quot;wikipedia:&quot;]::after,<br /> a.extiw[title^=&quot;wp:&quot;]::after {<br /> background-image:url(https://commons.wiki.gg/images/2/28/Wikipedia.svg?202406);<br /> }<br /> <br /> a.extiw[title^=&quot;mw:&quot;]::after {<br /> background-image:url(https://commons.wiki.gg/images/9/9b/MediaWiki.svg?202406);<br /> }<br /> <br /> a.extiw[title^=&quot;support:&quot;]::after {<br /> background-image:url(https://commons.wiki.gg/images/9/9b/Wiki.gg_icon-pink.svg);<br /> }<br /> /************<br /> * End links *<br /> *************/<br /> <br /> /***************<br /> * Left Sidebar *<br /> ****************/<br /> <br /> #mw-panel .vector-menu-portal {<br /> background-color: var(--wiki-sidebar-background-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-sidebar-background-color) var(--wiki-sidebar-background-opacity), transparent);<br /> border: var(--wiki-sidebar-border-width, 1px) solid var(--wiki-sidebar-border-color);<br /> margin: 0 0.5em;<br /> }<br /> <br /> #mw-panel .vector-menu-portal + .vector-menu-portal {<br /> border-top-width: 0;<br /> }<br /> <br /> #mw-panel .vector-menu-portal:last-child {<br /> margin-bottom:0;<br /> }<br /> <br /> .vector-menu-portal .vector-menu-heading {<br /> padding: 0.75em 0.33em 0 0.67em;<br /> margin: 0;<br /> }<br /> .vector-menu-portal .vector-menu-content {<br /> margin: 0 0.5em;<br /> }<br /> <br /> .vector-menu-portal .vector-menu-content .mw-list-item a,<br /> .vector-menu-portal .vector-menu-content .mw-list-item a:visited,<br /> .vector-menu-portal .vector-menu-content li a,<br /> .vector-menu-portal .vector-menu-content li a:visited {<br /> color: var(--wiki-sidebar-link-color);<br /> }<br /> <br /> .vector-menu-portal .vector-menu-content .mw-list-item a:hover,<br /> .vector-menu-portal .vector-menu-content .mw-list-item a:visited:hover {<br /> color:var(--wiki-sidebar-link-color--hover);<br /> }<br /> <br /> .vector-menu-portal .vector-menu-heading {<br /> background: none;<br /> color: var(--wiki-sidebar-heading-color);<br /> font-family:var(--wiki-sidebar-heading-font-family);<br /> }<br /> <br /> #t-newpage {<br /> --sidebar-icon:url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 384 512%22%3E%3C!--%21Font Awesome Free 6.5.2 by %40fontawesome - https%3A%2F%2Ffontawesome.com License - https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree Copyright 2024 Fonticons%2C Inc.--%3E%3Cpath d%3D%22M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128z%22%2F%3E%3C%2Fsvg%3E');<br /> order:-1;<br /> }<br /> <br /> #t-upload {<br /> --sidebar-icon: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 512 512%22%3E%3C!--%21Font Awesome Free 6.5.2 by %40fontawesome - https%3A%2F%2Ffontawesome.com License - https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree Copyright 2024 Fonticons%2C Inc.--%3E%3Cpath d%3D%22M288 109.3V352c0 17.7-14.3 32-32 32s-32-14.3-32-32V109.3l-73.4 73.4c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l128-128c12.5-12.5 32.8-12.5 45.3 0l128 128c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L288 109.3zM64 352H192c0 35.3 28.7 64 64 64s64-28.7 64-64H448c35.3 0 64 28.7 64 64v32c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V416c0-35.3 28.7-64 64-64zM432 456a24 24 0 1 0 0-48 24 24 0 1 0 0 48z%22%2F%3E%3C%2Fsvg%3E');<br /> order:-1;<br /> }<br /> <br /> #t-print {<br /> --sidebar-icon: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 512 512%22%3E%3C!--%21Font Awesome Free 6.5.2 by %40fontawesome - https%3A%2F%2Ffontawesome.com License - https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree Copyright 2024 Fonticons%2C Inc.--%3E%3Cpath d%3D%22M128 0C92.7 0 64 28.7 64 64v96h64V64H354.7L384 93.3V160h64V93.3c0-17-6.7-33.3-18.7-45.3L400 18.7C388 6.7 371.7 0 354.7 0H128zM384 352v32 64H128V384 368 352H384zm64 32h32c17.7 0 32-14.3 32-32V256c0-35.3-28.7-64-64-64H64c-35.3 0-64 28.7-64 64v96c0 17.7 14.3 32 32 32H64v64c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V384zM432 248a24 24 0 1 1 0 48 24 24 0 1 1 0-48z%22%2F%3E%3C%2Fsvg%3E');<br /> order:-1;<br /> }<br /> <br /> #t-whatlinkshere {<br /> --sidebar-icon: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 640 512%22%3E%3C!--%21Font Awesome Free 6.5.2 by %40fontawesome - https%3A%2F%2Ffontawesome.com License - https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree Copyright 2024 Fonticons%2C Inc.--%3E%3Cpath d%3D%22M579.8 267.7c56.5-56.5 56.5-148 0-204.5c-50-50-128.8-56.5-186.3-15.4l-1.6 1.1c-14.4 10.3-17.7 30.3-7.4 44.6s30.3 17.7 44.6 7.4l1.6-1.1c32.1-22.9 76-19.3 103.8 8.6c31.5 31.5 31.5 82.5 0 114L422.3 334.8c-31.5 31.5-82.5 31.5-114 0c-27.9-27.9-31.5-71.8-8.6-103.8l1.1-1.6c10.3-14.4 6.9-34.4-7.4-44.6s-34.4-6.9-44.6 7.4l-1.1 1.6C206.5 251.2 213 330 263 380c56.5 56.5 148 56.5 204.5 0L579.8 267.7zM60.2 244.3c-56.5 56.5-56.5 148 0 204.5c50 50 128.8 56.5 186.3 15.4l1.6-1.1c14.4-10.3 17.7-30.3 7.4-44.6s-30.3-17.7-44.6-7.4l-1.6 1.1c-32.1 22.9-76 19.3-103.8-8.6C74 372 74 321 105.5 289.5L217.7 177.2c31.5-31.5 82.5-31.5 114 0c27.9 27.9 31.5 71.8 8.6 103.9l-1.1 1.6c-10.3 14.4-6.9 34.4 7.4 44.6s34.4 6.9 44.6-7.4l1.1-1.6C433.5 260.8 427 182 377 132c-56.5-56.5-148-56.5-204.5 0L60.2 244.3z%22%2F%3E%3C%2Fsvg%3E');<br /> order:-1;<br /> }<br /> <br /> #t-specialpages {<br /> --sidebar-icon: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 576 512%22%3E%3C!--%21Font Awesome Free 6.5.2 by %40fontawesome - https%3A%2F%2Ffontawesome.com License - https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree Copyright 2024 Fonticons%2C Inc.--%3E%3Cpath d%3D%22M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z%22%2F%3E%3C%2Fsvg%3E');<br /> order:-1;<br /> }<br /> <br /> #t-cargopagevalueslink {<br /> --sidebar-icon: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 126.971 136.024'%3E%3Cpath d='m105.999 0-84 .049L0 8.957v127.065h126.97V8.957Z' fill='none' display='inline' opacity='1' paint-order='normal'/%3E%3Cpath d='m9.735 8.774 12.265-5h84l12.25 5H9.75' fill='%23000' fill-opacity='1' display='inline'/%3E%3Cpath d='M3.5 41.024H28v63.5H3.5zm95.5 0h24.5v63.5H99zm-95.5 67.5H123v24H3.5zm0-95.5H123v24H3.5zm27.985 28V59.67l13.61 13.61 17.323 17.324 1.788 1.787 12.131 12.132h19.147v-16.21l-13.6-13.6-1.788-1.787-17.325-17.324-14.578-14.579H31.485zm45.865 0-12.2 12.2 17.324 17.324 13.01-13.01V41.024H77.35zM42.716 75.658l-11.23 11.231v17.634h17.013l11.541-11.54-17.324-17.325z' fill='%23000' fill-opacity='1' fill-rule='nonzero' display='inline' opacity='1' paint-order='normal'/%3E%3C/svg%3E&quot;);<br /> order:-1;<br /> }<br /> <br /> #t-specialpages &gt; a::before,<br /> #t-whatlinkshere &gt; a::before,<br /> #t-print &gt; a::before,<br /> #t-newpage &gt; a::before,<br /> #t-upload &gt; a::before,<br /> #t-cargopagevalueslink &gt; a::before {<br /> content:'';<br /> background-image:var(--sidebar-icon);<br /> background-size:contain;<br /> background-repeat:no-repeat;<br /> background-position:center;<br /> display:inline-block;<br /> width:15px;<br /> height:15px<br /> }<br /> <br /> #p-tb .mw-list-item &gt; a::before {<br /> filter:var(--wiki-icon-to-link-filter)<br /> }<br /> <br /> #p-tb .mw-list-item &gt; a {<br /> display:flex;<br /> align-items:center;<br /> gap:3px<br /> }<br /> <br /> #p-tb .vector-menu-content-list {<br /> display:flex;<br /> flex-direction:column;<br /> }<br /> <br /> /* Sidebar spacing and border-radius section */<br /> #mw-panel .vector-menu-portal:not(:last-child) {<br /> margin-bottom:var(--wiki-sidebar-portal-spacing);<br /> }<br /> <br /> #mw-panel #p-logo + .vector-menu-portal {<br /> /*<br /> The way this works is that if the sidebar does not have any spacing, only the top and bottom corners<br /> of the top and bottom portals respectively should be rounded, instead of all corners of every portal.<br /> <br /> min and calc are combined here to basically create an `if x &gt; 0 then y else z` function.<br /> <br /> The lower of (sidebar-border-radius) and (spacing * 999) are compared and the smaller value is taken (999 is simply an arbitrary large number).<br /> If portal spacing is zero, multiplying it gets 0 and will be the smaller value. If it's non-zero, it will be large and sidebar-border-radius will be the smaller value.<br /> <br /> This is only applied to the &quot;inner&quot; corners because we'd want the &quot;outer&quot; corners rounded in either scenario.<br /> */<br /> border-radius:<br /> var(--wiki-sidebar-border-radius)<br /> var(--wiki-sidebar-border-radius)<br /> calc(min(var(--wiki-sidebar-border-radius), var(--wiki-sidebar-portal-spacing) * 999 ))<br /> calc(min(var(--wiki-sidebar-border-radius), var(--wiki-sidebar-portal-spacing) * 999 ));<br /> }<br /> <br /> #mw-panel .vector-menu-portal:last-child {<br /> /* see rule above for explanation */<br /> border-radius:<br /> calc(min(var(--wiki-sidebar-border-radius), var(--wiki-sidebar-portal-spacing) * 999 ))<br /> calc(min(var(--wiki-sidebar-border-radius), var(--wiki-sidebar-portal-spacing) * 999 ))<br /> var(--wiki-sidebar-border-radius)<br /> var(--wiki-sidebar-border-radius);<br /> }<br /> <br /> #mw-panel .vector-menu-portal {<br /> /* see above rules for explanation */<br /> border-radius:calc(min(var(--wiki-sidebar-border-radius), var(--wiki-sidebar-portal-spacing) * 999 ));<br /> }<br /> <br /> #mw-panel .vector-menu-portal + .vector-menu-portal {<br /> /* This keeps the border from doubling up if there is no spacing between them,<br /> The portals other than the first only have a top border if there is spacing */<br /> border-top-width: min(1px, var(--wiki-sidebar-portal-spacing, 0px)); /* the 0px fallback is for backwards compatibility with older versions of the loadout */<br /> }<br /> /* end sidebar spacing and border-radius */<br /> <br /> /*******************<br /> * End left sidebar *<br /> ********************/<br /> <br /> /*******<br /> * Logo *<br /> ********/<br /> /* [[File:Site-logo.png]] */<br /> <br /> .mw-wiki-logo {<br /> background-size: contain;<br /> }<br /> <br /> /***********<br /> * End logo *<br /> ************/<br /> <br /> /***************<br /> * Content area *<br /> ****************/<br /> <br /> .mw-body,<br /> .parsoid-body,<br /> .mw-footer {<br /> color: var(--wiki-content-text-color);<br /> background-color: var(--wiki-content-background-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color) var(--wiki-content-background-opacity), transparent);<br /> border: var(--wiki-content-border-width, 1px) solid var(--wiki-content-border-color);<br /> margin-right: 1em;<br /> }<br /> <br /> .mw-footer {<br /> border-top-width:0;<br /> }<br /> <br /> .mw-footer li {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> @media screen and (max-width: 981px) {<br /> .mw-body,<br /> .parsoid-body,<br /> .mw-footer {<br /> margin-right: 0;<br /> }<br /> }<br /> <br /> /*******************************<br /> * End content area and footer *<br /> *******************************/<br /> <br /> /***********<br /> * Headings *<br /> ************/<br /> .mw-body h1,<br /> .mw-body h2 {<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-family: var(--wiki-heading-font-family);<br /> }<br /> <br /> h1, h2, h3, h4, h5, h6 {<br /> color: var(--wiki-heading-color);<br /> }<br /> <br /> .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type,<br /> .client-js .mw-content-rtl .mw-editsection-bracket:not(:first-of-type),<br /> .mw-editsection-divider,<br /> .client-js .mw-content-rtl .mw-editsection-bracket:first-of-type,<br /> .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type) {<br /> color: var(--wiki-heading-color);<br /> }<br /> <br /> /***************<br /> * End headings *<br /> ****************/<br /> <br /> /*************<br /> * Wikitables *<br /> **************/<br /> .wikitable {<br /> background: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .wikitable&gt;tr&gt;th,<br /> .wikitable&gt;*&gt;tr&gt;th {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikitable&gt;tr&gt;td,<br /> .wikitable&gt;*&gt;tr&gt;td {<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikitable *,<br /> .wikitable :after,<br /> .wikitable :before {<br /> -webkit-box-sizing: inherit;<br /> box-sizing: inherit;<br /> }<br /> <br /> <br /> /* Forward = yes bg on Special:Interwiki */<br /> table.mw-interwikitable.body td.mw-interwikitable-local-yes {<br /> background: var(--content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-success-color) 25%, transparent);<br /> }<br /> <br /> .zebra-table &gt; * &gt; tr:nth-of-type(2n),<br /> .zebra-table &gt; tr:nth-of-type(2n) {<br /> background: transparent; /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color--secondary) 5%, transparent);<br /> }<br /> <br /> .client-js .sortable:not(.jquery-tablesorter) &gt; * &gt; tr:first-child &gt; th:not(.unsortable),<br /> .jquery-tablesorter th.headerSort {<br /> background-image: unset;<br /> position: relative;<br /> }<br /> .client-js .sortable:not(.jquery-tablesorter) &gt; * &gt; tr:first-child &gt; th:not(.unsortable)::after,<br /> .jquery-tablesorter th.headerSort::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> top: 0;<br /> right: 0;<br /> width: 21px;<br /> height: 100%;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%229%22 viewBox=%220 0 21 9%22%3E %3Cpath d=%22m14.5 5-4 4-4-4zm0-1-4-4-4 4z%22 fill=%22%23fff%22/%3E %3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: auto;<br /> mask-size: auto;<br /> -webkit-mask-position: center right;<br /> mask-position: center right;<br /> background-color: var(--wiki-content-link-color);<br /> }<br /> <br /> .jquery-tablesorter th.headerSortUp::after {<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%224%22 viewBox=%220 0 21 4%22%3E %3Cpath d=%22m6.5 4 4-4 4 4z%22 fill=%22%23fff%22/%3E %3C/svg%3E&quot;) no-repeat;<br /> }<br /> <br /> .jquery-tablesorter th.headerSortDown::after {<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%224%22 viewBox=%220 0 21 4%22%3E %3Cpath d=%22m14.5 0-4 4-4-4z%22 fill=%22%23fff%22/%3E %3C/svg%3E&quot;) no-repeat;<br /> }<br /> <br /> /*****************<br /> * End wikitables *<br /> ******************/<br /> <br /> /**************<br /> * Preferences *<br /> ***************/<br /> .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed,<br /> .mw-prefs-tabs&gt;.oo-ui-menuLayout-content&gt;.oo-ui-indexLayout-stackLayout&gt;.oo-ui-tabPanelLayout {<br /> border: none;<br /> }<br /> <br /> .oo-ui-tabSelectWidget-framed {<br /> background-color: transparent;<br /> border-bottom: 1px solid var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled,<br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {<br /> background-color:var(--wiki-accent-label-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-label-color) 75%, transparent);<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {<br /> color: var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected,<br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {<br /> background-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {<br /> border-bottom: none;<br /> }<br /> <br /> #preferences .mw-htmlform-submit-buttons {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle,<br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled,<br /> .oo-ui-textInputWidget .oo-ui-inputWidget-input,<br /> .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-pendingElement-pending {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> background-image: linear-gradient(135deg,var(--wiki-content-background-color) 25%,transparent 25%,transparent 50%,var(--wiki-content-background-color) 50%,var(--wiki-content-background-color) 75%,transparent 75%,transparent);<br /> }<br /> <br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-border-color)<br /> }<br /> <br /> .view-dark .oo-ui-inputWidget-input.oo-ui-indicator-down {<br /> background-image: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E%3Ctitle%3E down %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M9.9 2.9 6 6.8 2.1 2.9 1 4l5 5 5-5z%22/%3E%3C/g%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {<br /> color:var(--wiki-content-text-mix-color);<br /> border-color:var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:active {<br /> color: var(--wiki-content-dynamic-color);<br /> border-color: var(--wiki-accent-color)<br /> }<br /> <br /> .oo-ui-dropdownInputWidget select option,<br /> .oo-ui-dropdownInputWidget select optgroup {<br /> color: #000;<br /> }<br /> <br /> .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover,<br /> .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus,<br /> .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active,<br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover,<br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled:focus,<br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled:active,<br /> .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input,<br /> .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus,<br /> .oo-ui-textInputWidget.oo-ui-widget-enabled:active .oo-ui-inputWidget-input,<br /> .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: none;<br /> }<br /> <br /> .oo-ui-radioInputWidget [type=&quot;radio&quot;] + span {<br /> background-color:var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked + span,<br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:hover + span{<br /> border-color:var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 90%, transparent);<br /> }<br /> <br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked:hover + span {<br /> border-color:var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:active + span,<br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked:active + span{<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> border-color:var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked:focus + span::before {<br /> border-color: var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked:active + span {<br /> border-color:var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color); /* fallback */<br /> box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-menuOptionWidget.oo-ui-optionWidget.oo-ui-optionWidget-selected,<br /> .oo-ui-menuOptionWidget.oo-ui-optionWidget.oo-ui-optionWidget-highlighted,<br /> .oo-ui-menuOptionWidget.oo-ui-optionWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected,<br /> .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,<br /> .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-prefs-tabs.mw-prefs-tabs-searching .oo-ui-tabPanelLayout.mw-prefs-search-matched &gt; fieldset &gt; legend {<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw-prefs-search-highlight {<br /> background-color: transparent !important; /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 7%, transparent) !important;<br /> outline-color: transparent !important; /* fallback */<br /> outline-color: color-mix(in srgb, var(--wiki-accent-color) 7%, transparent) !important;<br /> }<br /> <br /> /****************<br /> * End preferences *<br /> *****************/<br /> <br /> /***************<br /> * Page history *<br /> ****************/<br /> #pagehistory li {<br /> background-color: transparent;<br /> border: none;<br /> }<br /> <br /> #pagehistory li.selected {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px dashed var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .diff td.diff-addedline {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-success-color);<br /> border-width: 1px 1px 1px 4px;<br /> }<br /> <br /> .diff td.diff-addedline .diffchange {<br /> background-color: var(--wiki-success-color);<br /> color: var(--wiki-success-label-color);<br /> }<br /> <br /> .diff td.diff-deletedline {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-alert-color);<br /> border-width: 1px 1px 1px 4px;<br /> }<br /> <br /> .diff td.diff-deletedline .diffchange {<br /> background-color: var(--wiki-alert-color);<br /> color: var(--wiki-alert-label-color)<br /> }<br /> <br /> .diff td.diff-context {<br /> background:var(--wiki-content-text-mix-color-95); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-text-mix-color-95) 80%, var(--wiki-content-background-color));<br /> border-color: var(--wiki-neutral-color, var(--wiki-content-text-mix-color)); /* fallback for backwards compatibility */<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-right {<br /> color: transparent;<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-right:hover:after {<br /> opacity: .75;<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-right:after {<br /> color: var(--wiki-content-text-color);<br /> content: &quot;\21a9&quot;;<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-left {<br /> color: transparent;<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-left:hover:after {<br /> opacity: .75;<br /> }<br /> <br /> .diff-marker a.mw-diff-movedpara-left:after {<br /> color: var(--wiki-content-text-color);<br /> content: &quot;\21aa&quot;;<br /> }<br /> <br /> .mw-plusminus-neg {<br /> color:var(--wiki-alert-color);<br /> }<br /> .mw-plusminus-null{<br /> color:var(--wiki-neutral-color, var(--wiki-content-text-mix-color)); /* fallback for backwards compatibility */<br /> }<br /> .mw-plusminus-pos {<br /> color:var(--wiki-success-color);<br /> }<br /> <br /> .updatedmarker {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-success-color) 25%, transparent);<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> li span.deleted,<br /> span.history-deleted {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> span.mw-history-suppressed {<br /> /* overrides above, since suppressed is also deleted */<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> /* inline diff (1.41) */<br /> .mw-diff-inline-header {<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-diff-inline-added ins,<br /> .mw-diff-inline-changed ins,<br /> .mw-diff-inline-moved ins,<br /> .mw-diff-table-prefix .mw-diff-inline-legend .mw-diff-inline-legend-ins,<br /> .mw-diff-inline-added.mw-diff-empty-line::after,<br /> .mw-inline-diff-newline::after {<br /> background:var(--wiki-success-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-success-color) 90%, transparent);<br /> color: var(--wiki-success-label-color);<br /> display: inline-block;<br /> }<br /> <br /> .mw-diff-inline-added.mw-diff-empty-line::after,<br /> .mw-diff-inline-deleted.mw-diff-empty-line::after,<br /> .mw-inline-diff-newline::after {<br /> padding: 0.4em 0;<br /> }<br /> <br /> .mw-diff-inline-deleted del,<br /> .mw-diff-inline-changed del,<br /> .mw-diff-inline-moved del,<br /> .mw-diff-table-prefix .mw-diff-inline-legend .mw-diff-inline-legend-del,<br /> .mw-diff-inline-deleted.mw-diff-empty-line::after {<br /> background:var(--wiki-alert-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-alert-color) 90%, transparent);<br /> color: var(--wiki-alert-label-color);<br /> display: inline-block;<br /> }<br /> <br /> .mw-diff-movedpara-left::after,<br /> .mw-diff-movedpara-right::after {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .ve-ui-diffElement-hasDescriptions .ve-ui-diffElement-content {<br /> border-right-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-diffElement-attributeChange {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-diffElement-attributeChange ins {<br /> background-color:var(--wiki-success-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-success-color) 90%, transparent);<br /> box-shadow: 0 0 0 1px var(--wiki-success-color); /* fallback */<br /> box-shadow: 0 0 0 1px color-mix(in srgb, var(--wiki-success-color) 90%, transparent);<br /> color: var(--wiki-success-label-color);<br /> }<br /> <br /> .ve-ui-diffElement-attributeChange del {<br /> background-color:var(--wiki-alert-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-alert-color) 90%, transparent);<br /> box-shadow: 0 0 0 1px var(--wiki-alert-color); /* fallback */<br /> box-shadow: 0 0 0 1px color-mix(in srgb, var(--wiki-alert-color) 90%, transparent);<br /> color: var(--wiki-alert-label-color);<br /> }<br /> <br /> .ve-ui-diffElement-highlight {<br /> outline-color:var(--wiki-accent-color); /* fallback */<br /> outline-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .ve-ui-changeDescriptionsSelectWidget &gt; .oo-ui-optionWidget-highlighted {<br /> background:var(--wiki-accent-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> }<br /> <br /> /* Edit conflict */<br /> <br /> .mw-twocolconflict-split-tour-image-dual-column-view-1 {<br /> filter:var(--wiki-icon-general-filter);<br /> }<br /> <br /> .mw-twocolconflict-split-tour-image-blue-dot {<br /> filter:brightness(0) var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> .mw-pulsating-dot::before, .mw-pulsating-dot::after {<br /> background-color: var(--wiki-content-link-color);<br /> }<br /> <br /> .mw-twocolconflict-split-current-version-header .mw-twocolconflict-revision-label {<br /> background-color: var(--wiki-alert-color);<br /> color:var(--wiki-alert-label-color);<br /> }<br /> <br /> .mw-twocolconflict-special-your-version-header .mw-twocolconflict-revision-label,<br /> .mw-twocolconflict-split-your-version-header .mw-twocolconflict-revision-label {<br /> background-color: var(--wiki-success-color);<br /> color:var(--wiki-success-label-color);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-copy,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-copy {<br /> border-color: var(--wiki-neutral-color, var(--wiki-content-text-mix-color)); /* fallback for backwards compatibility */<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> }<br /> <br /> .mw-twocolconflict-single-column .mw-twocolconflict-split-collapsed .mw-twocolconflict-split-fade,<br /> .mw-twocolconflict-split-column .mw-twocolconflict-split-collapsed .mw-twocolconflict-split-fade {<br /> background-image: linear-gradient(transparent, var(--wiki-content-text-mix-color-95));<br /> }<br /> <br /> .mw-twocolconflict-single-column,<br /> .mw-twocolconflict-split-column {<br /> background-color: var(--wiki-content-background-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 80%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-delete,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-delete {<br /> border-color:var(--wiki-alert-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-alert-color) 40%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-delete,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-delete {<br /> border-color: var(--wiki-alert-color);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-add,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected.mw-twocolconflict-split-add {<br /> border-color:var(--wiki-success-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-success-color) 40%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-add,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-add {<br /> border-color: var(--wiki-success-color);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected del.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected del.mw-twocolconflict-diffchange {<br /> background-color:var(--wiki-alert-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-alert-color) 30%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected del.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected del.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-single-column del.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-split-column del.mw-twocolconflict-diffchange {<br /> background-color: var(--wiki-alert-color);<br /> color: var(--wiki-alert-label-color);<br /> }<br /> <br /> .mw-twocolconflict-single-column.mw-twocolconflict-split-unselected ins.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-split-column.mw-twocolconflict-split-unselected ins.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-single-column ins.mw-twocolconflict-diffchange,<br /> .mw-twocolconflict-split-column ins.mw-twocolconflict-diffchange {<br /> background-color: var(--wiki-success-color);<br /> color:var(--wiki-success-label-color);<br /> }<br /> <br /> .mw-twocolconflict-split-selection &gt; div:nth-child(2) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked + span,<br /> .mw-twocolconflict-split-selection &gt; div:nth-child(2) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:active + span,<br /> .mw-twocolconflict-split-selection &gt; div:nth-child(2) .oo-ui-radioInputWidget [type=&quot;radio&quot;] + span {<br /> border-color: var(--wiki-success-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-success-color) 80%, transparent);<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-success-color) 10%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-split-selection &gt; div:nth-child(2) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:active + span,<br /> .mw-twocolconflict-split-selection &gt; div:nth-child(2) .oo-ui-radioInputWidget [type=&quot;radio&quot;] + span {<br /> border-color: var(--wiki-success-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-success-color) 90%, transparent);<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-success-color) 10%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-split-selection &gt; div:nth-child(1) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:checked + span,<br /> .mw-twocolconflict-split-selection &gt; div:nth-child(1) .oo-ui-radioInputWidget.oo-ui-widget-enabled [type=&quot;radio&quot;]:active + span,<br /> .mw-twocolconflict-split-selection &gt; div:nth-child(1) .oo-ui-radioInputWidget [type=&quot;radio&quot;] + span {<br /> border-color:var(--wiki-alert-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-alert-color) 90%, transparent);<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-alert-color) 10%, transparent);<br /> }<br /> <br /> .mw-twocolconflict-split-editable .mw-twocolconflict-split-editor {<br /> color:var(--wiki-content-text-color);<br /> }<br /> /**/<br /> <br /> /*******************<br /> * End page history *<br /> ********************/<br /> <br /> /********************<br /> * Table of contents *<br /> *********************/<br /> #toc,<br /> .toc,<br /> .toccolours,<br /> .mw-warning {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> box-shadow: 0 0.1em 0.2em #000000;<br /> }<br /> #mw-toc-heading{<br /> border: 0;<br /> }<br /> .toctogglelabel {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .tocnumber {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> /************************<br /> * End table of contents *<br /> *************************/<br /> <br /> /*************<br /> * Thumbnails *<br /> **************/<br /> img.thumbborder {<br /> border: 1px solid var(--wiki-content-border-color);<br /> padding: 5px;<br /> }<br /> <br /> div.thumbinner {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> li.gallerybox div.thumb {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> html .thumbimage {<br /> background-color: unset;<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .thumb,<br /> .thumb .thumbinner,<br /> .thumb .thumbimage {<br /> max-width: 100%;<br /> box-sizing: border-box;<br /> }<br /> <br /> .thumb .thumbimage {<br /> height: auto;<br /> }<br /> <br /> /* packed-overlay and packed-hover modes for galleries */<br /> ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper,<br /> ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper,<br /> ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 65%, transparent);<br /> }<br /> <br /> /* Responsive floating thumbnails */<br /> @media screen and (max-width: 720px) {<br /> div.tright,<br /> div.floatright,<br /> div.tleft,<br /> div.floatleft {<br /> float: none;<br /> margin: 0 auto;<br /> width: fit-content;<br /> }<br /> }<br /> <br /> /*****************<br /> * End thumbnails *<br /> ******************/<br /> <br /> /**************<br /> * Wiki editor *<br /> ***************/<br /> #wpTextbox0 {<br /> /* need !important here to override inline styling */<br /> background-color:var(--wiki-content-background-color) !important;<br /> }<br /> <br /> .wikiEditor-ui {<br /> border: none;<br /> }<br /> <br /> .wikiEditor-ui .wikiEditor-ui-top,<br /> .wikiEditor-ui .wikiEditor-ui-view {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar {<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group,<br /> .wikiEditor-ui-toolbar .section-secondary .group {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .tabs span.tab a,<br /> .wikiEditor-ui-toolbar .tabs span.tab a:visited,<br /> .wikiEditor-ui-toolbar .tabs span.tab a.current,<br /> .wiikiEditor-ui-toolbar .tabs span.tab a.current:visited,<br /> .wikiEditor-ui-toolbar .booklet .index .current {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group .tool-select .options {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group .tool-select .options .option {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group .tool-select .menu .options .option:hover {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .tabs span.tab a::before,<br /> .wikiEditor-ui-toolbar .group .tool-select .label::after {<br /> filter: var(--wiki-icon-general-filter);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group .label,<br /> .wikiEditor-ui-toolbar .group .tool-select .label,<br /> .wikiEditor-ui-toolbar .page-table th,<br /> .wikiEditor-ui-toolbar .page-table td,<br /> .wikiEditor-ui-toolbar .page-characters div span,<br /> .wikiEditor-ui-toolbar .booklet .index div {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .booklet&gt;.index&gt; :hover {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .page-characters div span {<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .sections .section,<br /> .wikiEditor-ui-toolbar .booklet .pages,<br /> .wikiEditor-ui-toolbar .booklet .index .current,<br /> .wikiEditor-ui-toolbar .page-characters div span:hover {<br /> background-color: transparent; /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 5%, transparent);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .sections .section {<br /> border-top: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .page-characters div span:hover {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .page-table td {<br /> border-top: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .wikiEditor-ui-tabs div a {<br /> background: #9A647F;<br /> display: inline-block;<br /> }<br /> <br /> .wikiEditor-ui-tabs div.current {<br /> border-bottom: 1px solid #3B3352;<br /> }<br /> <br /> .wikiEditor-ui-tabs div.current a {<br /> font-weight: bold;<br /> }<br /> <br /> .wikiEditor-ui-tabs {<br /> border-left: 1px solid #3B3352;<br /> border-top: 1px solid #3B3352;<br /> }<br /> <br /> .wikiEditor-ui-text {<br /> background-color:var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .wikiEditor-preview-contents {<br /> background: transparent;<br /> background-color: rgba(255, 255, 255, 0.2);<br /> border-color: #3B3352;<br /> border-style: solid;<br /> border-width: 0 1px 1px;<br /> }<br /> <br /> .wikiEditor-ui-controls {<br /> background: transparent;<br /> }<br /> <br /> .wikiEditor-preview-contents,<br /> .wikiEditor-preview-loading {<br /> background-color: transparent;<br /> }<br /> <br /> .mw-wikiEditor-InsertLink-TitleInputField .oo-ui-messageWidget,<br /> .mw-widget-titleWidget-menu .mw-widget-titleOptionWidget-description {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .wikiEditor-toolbar-dialog .ui-dialog-content input[type='text']::placeholder {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ext-WikiEditor-ResizingDragBar {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ext-WikiEditor-ResizingDragBar-ns {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ext-WikiEditor-ResizingDragBar span {<br /> background-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ext-WikiEditor-ResizingDragBar:hover span {<br /> background-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ext-WikiEditor-twopanes-TwoPaneLayout .ext-WikiEditor-twopanes-pane1,<br /> .ext-WikiEditor-twopanes-TwoPaneLayout .ext-WikiEditor-twopanes-pane2 {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ext-WikiEditor-realtimepreview-button.oo-ui-toggleWidget-on .oo-ui-labelElement-label {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .wikiEditor-ui-toolbar .group,<br /> .wikiEditor-ui-toolbar .section-secondary .group {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ext-WikiEditor-realtimepreview-button:hover {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> color: var(--wiki-accent-color);<br /> border-color:var(--wiki-accent-color);<br /> box-shadow:inset 0 0 3px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleButtonWidget.oo-ui-widget-enabled.oo-ui-buttonElement-frameless.oo-ui-toggleWidget-on .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ext-WikiEditor-reloadButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button,<br /> .ext-WikiEditor-reloadButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button:hover {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .editOptions {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-border-color);<br /> border-image: none;<br /> border-radius: 0 0 5px 5px;<br /> border-style: none solid solid;<br /> border-width: medium 1px 1px;<br /> }<br /> <br /> input#wpSummary {<br /> margin-bottom: 1em;<br /> margin-top: 1em;<br /> width: 80%;<br /> }<br /> <br /> .view-dark .ace_editor,<br /> .ace_editor {<br /> --ace-keywords: #CDA869;<br /> --ace-regexp: #E9C062;<br /> --ace-constants: #CF6A4C;<br /> --ace-illegal: #F8F8F8;<br /> --ace-deprecated: #D2A8A1;<br /> --ace-support: #9B859D;<br /> --ace-function: #DAD085;<br /> --ace-list: #F9EE98;<br /> --ace-variable: #7587A6;<br /> --ace-string: #8F9D6A;<br /> <br /> --ace-illegal-highlight: rgba(86, 45, 86, 0.75);<br /> --ace-step-highlight: #665200;<br /> --ace-multiselect-shadow: #141414;<br /> }<br /> <br /> .view-light .ace_editor{<br /> --ace-keywords: #00f;<br /> --ace-regexp: #036a07;<br /> --ace-constants: #c5060b;<br /> --ace-illegal: #f00;<br /> --ace-deprecated: #f00;<br /> --ace-support: #6d79de;<br /> --ace-function: #3c4c72;<br /> --ace-list: #b90690;<br /> --ace-variable: #318495;<br /> --ace-string: #036a07;<br /> <br /> --ace-illegal-highlight: rgba(255, 0, 0, 0.1);<br /> --ace-step-highlight: #fcff00;<br /> --ace-multiselect-shadow: #fff;<br /> }<br /> <br /> .ace_editor .ace_gutter {<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> }<br /> <br /> .ace_gutter-cell {<br /> color:var(--wiki-content-dynamic-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color) 40%, transparent);<br /> }<br /> <br /> .ace_editor .ace_print-margin {<br /> width: 1px;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 75%, transparent);<br /> }<br /> <br /> .ace_editor {<br /> /* this image gradient hack effectively lets the element have 2 layers of background */<br /> background-image: linear-gradient(var(--wiki-content-dynamic-color), var(--wiki-content-dynamic-color));<br /> background-color: var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 93%, transparent);<br /> color: var(--wiki-content-dynamic-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color) 93%, transparent);<br /> }<br /> <br /> .ace_editor .ace_cursor {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .ace_editor .ace_marker-layer .ace_selection {<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color) 20%, transparent)<br /> }<br /> <br /> .ace_editor.ace_multiselect .ace_selection.ace_start {<br /> box-shadow: 0 0 3px 0px var(--ace-multiselect-shadow);<br /> }<br /> <br /> .ace_editor .ace_marker-layer .ace_step {<br /> background: var(--ace-step-highlight);<br /> }<br /> <br /> .ace_editor .ace_marker-layer .ace_active-line,<br /> .ace_editor .ace_gutter-active-line {<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color) 3.1%, transparent)<br /> }<br /> <br /> .ace-tm .ace_marker-layer .ace_selected-word {<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color) 5%, transparent);<br /> }<br /> <br /> .ace_editor .ace_marker-layer .ace_selection {<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color) 10%, transparent);<br /> }<br /> <br /> .ace_editor .ace_marker-layer .ace_selected-word {<br /> border: 1px solid var(--wiki-content-background-color--secondary); /* fallback */<br /> border: 1px solid color-mix(in srgb, var(--wiki-content-dynamic-color) 20%, transparent);<br /> }<br /> <br /> .ace_editor .ace_invisible {<br /> color: var(--wiki-content-background-color--secondary); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color) 25%, transparent);<br /> }<br /> <br /> .ace_editor .ace_keyword,<br /> .ace_editor .ace_meta {<br /> color: var(--ace-keywords);<br /> }<br /> <br /> .ace_editor .ace_constant,<br /> .ace_editor .ace_constant.ace_numeric,<br /> .ace_editor .ace_constant.ace_character,<br /> .ace_editor .ace_constant.ace_character.ace_escape,<br /> .ace_editor .ace_constant.ace_other,<br /> .ace_editor .ace_heading,<br /> .ace_editor .ace_markup.ace_heading,<br /> .ace_editor .ace_support.ace_constant {<br /> color: var(--ace-constants);<br /> }<br /> <br /> .ace_editor .ace_invalid.ace_illegal {<br /> color: var(--ace-illegal);<br /> background-color: var(--ace-illegal-highlight);<br /> }<br /> <br /> .ace_editor .ace_invalid.ace_deprecated {<br /> text-decoration: underline;<br /> font-style: italic;<br /> color: var(--ace-deprecated);<br /> }<br /> <br /> .ace_editor .ace_support,<br /> .ace_editor .ace_support.ace_type {<br /> color: var(--ace-support);<br /> }<br /> <br /> .ace_editor .ace_fold {<br /> background-color: var(--wiki-content-dynamic-color--secondary--inverted); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 10%, transparent);<br /> border-color: var(--wiki-content-dynamic-color--secondary--inverted); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 10%, transparent);<br /> }<br /> <br /> .ace_editor .ace_support.ace_function {<br /> color: var(--ace-function);<br /> }<br /> <br /> .ace_editor .ace_list,<br /> .ace_editor .ace_markup.ace_list,<br /> .ace_editor .ace_storage {<br /> color: var(--ace-list);<br /> }<br /> <br /> .ace_editor .ace_entity.ace_name.ace_function,<br /> .ace_editor .ace_meta.ace_tag,<br /> .ace_editor .ace_variable {<br /> color: var(--ace-variable);<br /> }<br /> <br /> .ace_editor .ace_string {<br /> color: var(--ace-string);<br /> }<br /> <br /> .ace_editor .ace_string.ace_regexp {<br /> color: var(--ace-regexp);<br /> }<br /> <br /> .ace_editor .ace_comment {<br /> font-style: italic;<br /> color:var(--wiki-content-dynamic-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color) 30%, transparent);<br /> }<br /> <br /> .ace_editor .ace_xml-pe {<br /> color:var(--wiki-content-dynamic-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color) 28%, transparent);<br /> }<br /> <br /> .ace_editor .ace_indent-guide {<br /> background:none;<br /> border-right:1px solid var(--wiki-content-dynamic-color);<br /> border-right:1px solid color-mix(in srgb, var(--wiki-content-dynamic-color) 20%, transparent);<br /> }<br /> <br /> .ace_search {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .ace_search_field {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ace_button {<br /> color: var(--wiki-content-text-color);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .ace_button:hover {<br /> background-color: var(--wiki-accent-color--hover);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .ace_button.checked {<br /> background-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .ace_searchbtn {<br /> background-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .ace_searchbtn:hover {<br /> background-color: var(--wiki-accent-color--hover);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .ace_searchbtn.prev::after,<br /> .ace_searchbtn.next::after {<br /> border-color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .ace_searchbtn_close {<br /> filter: var(--wiki-icon-general-filter);<br /> }<br /> <br /> .wikiEditor-ui .codeEditor-status {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-editform #wpTextbox1 {<br /> background:var(--wiki-content-background-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-background-color) 50%, transparent);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .view-dark .ext-codemirror-wrapper,<br /> .ext-codemirror-wrapper {<br /> --codemirror-yellow: #ffd700;<br /> --codemirror-light-blue: #adf;<br /> --codemirror-blue: #08f;<br /> --codemirror-green: #290;<br /> --codemirror-red: #f50;<br /> --codemirror-dark-red: #dd1616;<br /> --codemirror-purple: #CD4EF9;<br /> --codemirror-pink: #e0e;<br /> --codemirror-light-gray: #eee;<br /> --codemirror-gray: #84a0a0;<br /> }<br /> <br /> .view-light .ext-codemirror-wrapper {<br /> --codemirror-yellow: #9e8500;<br /> --codemirror-light-blue: #008ae7;<br /> --codemirror-blue: #0085f9;<br /> --codemirror-green: #290;<br /> --codemirror-red: #ef4f00;<br /> --codemirror-dark-red: #a11;<br /> --codemirror-purple: #80c;<br /> --codemirror-pink: #ed00ed;<br /> --codemirror-light-gray: #858585;<br /> --codemirror-gray: #6b8a8a;<br /> }<br /> <br /> .ext-codemirror-wrapper {<br /> background-color:var(--wiki-content-background-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color) 35%, transparent);<br /> color: var(--wiki-content-text-color)<br /> }<br /> <br /> .cm-editor .cm-selectionBackground,<br /> .cm-editor.cm-focused &gt; .cm-scroller &gt; .cm-selectionLayer .cm-selectionBackground {<br /> background: var(--wiki-accent-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> }<br /> <br /> .cm-mw-keyword {<br /> color: var(--codemirror-purple)<br /> }<br /> <br /> .cm-mw-def {<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-variable-2 {<br /> color: var(--codemirror-light-blue)<br /> }<br /> <br /> .cm-mw-string {<br /> color: var(--codemirror-red)<br /> }<br /> <br /> .cm-mw-atom {<br /> color: var(--codemirror-pink)<br /> }<br /> <br /> .cm-mw-number {<br /> color: var(--codemirror-green)<br /> }<br /> <br /> .cm-mw-matching {<br /> background-color: var(--codemirror-yellow)<br /> }<br /> <br /> .cm-mw-skipformatting {<br /> background-color: var(--codemirror-light-blue)<br /> }<br /> <br /> .cm-mw-list {<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-doubleUnderscore,<br /> .cm-mw-hr,<br /> .cm-mw-signature {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-indenting {<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-mnemonic {<br /> color: var(--codemirror-green)<br /> }<br /> <br /> .cm-mw-comment {<br /> color: var(--codemirror-gray)<br /> }<br /> <br /> .cm-mw-apostrophes-bold,<br /> .cm-mw-apostrophes-italic,<br /> .cm-mw-section-header {<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-template,<br /> .cm-mw-template-argument-name,<br /> .cm-mw-template-bracket,<br /> .cm-mw-template-delimiter,<br /> .cm-mw-template-name {<br /> color: var(--codemirror-purple);<br /> }<br /> <br /> .cm-mw-templatevariable,<br /> .cm-mw-templatevariable-bracket,<br /> .cm-mw-templatevariable-delimiter,<br /> .cm-mw-templatevariable-name {<br /> color: var(--codemirror-red)<br /> }<br /> <br /> .cm-mw-parserfunction-bracket,<br /> .cm-mw-parserfunction-delimiter,<br /> .cm-mw-parserfunction-name {<br /> color: var(--codemirror-dark-red)<br /> }<br /> <br /> .cm-mw-exttag-attribute,<br /> .cm-mw-exttag-bracket,<br /> .cm-mw-exttag-name,<br /> .cm-mw-htmltag-attribute,<br /> .cm-mw-htmltag-bracket,<br /> .cm-mw-htmltag-name {<br /> color: var(--codemirror-green)<br /> }<br /> <br /> .cm-mw-link,<br /> .cm-mw-link-pagename {<br /> color: var(--wiki-content-link-color)<br /> }<br /> <br /> .cm-mw-link-tosection {<br /> color: var(--codemirror-blue)<br /> }<br /> <br /> .cm-mw-extlink,<br /> .cm-mw-extlink-bracket,<br /> .cm-mw-extlink-protocol,<br /> .cm-mw-free-extlink,<br /> .cm-mw-free-extlink-protocol,<br /> .cm-mw-link-bracket,<br /> .cm-mw-link-delimiter {<br /> color: var(--wiki-content-link-color)<br /> }<br /> <br /> .cm-mw-table-bracket,<br /> .cm-mw-table-definition,<br /> .cm-mw-table-delimiter {<br /> color: var(--codemirror-pink)<br /> }<br /> <br /> .cm-mw-matchingbracket {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: inset 0 0 1px 1px var(--wiki-content-link-color);<br /> font-weight: bold;<br /> }<br /> <br /> /* VisualEditor: Fix broken toolbar layout */<br /> .oo-ui-toolbar {<br /> clear: none;<br /> }<br /> .ve-init-mw-desktopArticleTarget-toolbar-open &gt; .oo-ui-toolbar-bar &gt; div:nth-child(4) {<br /> display: none;<br /> }<br /> .ve-ui-toolbar-floating &gt; .oo-ui-toolbar-bar {<br /> top: var( --wikigg-header-height );<br /> }<br /> .oo-ui-toolbar-bar .oo-ui-toolbar-bar,<br /> .ve-area-wrapper .oo-ui-toolbar-bar {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> .ve-init-mw-desktopArticleTarget-originalContent .content-body {<br /> clear: right;<br /> }<br /> <br /> /*************<br /> * End editor *<br /> **************/<br /> <br /> /****************<br /> * Tabber styles *<br /> *****************/<br /> .tabber__header {<br /> box-shadow: inset 0 -1px 0 0 var(--wiki-content-border-color);<br /> }<br /> <br /> .tabber__tab,<br /> .tabber__tab:visited {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .tabber__tab:hover,<br /> .tabber__tab:hover:visited,<br /> .tabber__tab[aria-selected=&quot;true&quot;],<br /> .tabber__tab[aria-selected=&quot;true&quot;]:visited {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .tabber__indicator {<br /> background: var(--wiki-accent-color);<br /> }<br /> <br /> .tabber__header__prev::after,<br /> .tabber__header__next::after {<br /> filter: var(--wiki-icon-general-filter);<br /> }<br /> /********************<br /> * End Tabber styles *<br /> *********************/<br /> <br /> /***************************************<br /> * Various fixes for multi-theme Vector *<br /> ****************************************/<br /> :focus,<br /> :focus-visible {<br /> outline-color:var(--wiki-accent-color)<br /> }<br /> <br /> :focus-visible {<br /> outline-style:solid;<br /> }<br /> <br /> .oo-ui-iconElement-icon {<br /> filter: var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> .oo-ui-iconElement-icon.oo-ui-icon-reload {<br /> filter: brightness(0) var(--wiki-icon-to-link-filter); <br /> }<br /> <br /> fieldset {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> hr {<br /> background-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .CategoryTreeToggle {<br /> color:var(--wiki-content-link-color);<br /> }<br /> <br /> input,<br /> select {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> input:hover,<br /> input:focus,<br /> input:active {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: none;<br /> }<br /> <br /> input:focus-visible {<br /> outline: 1px solid var(--wiki-accent-color);<br /> }<br /> <br /> input::file-selector-button,<br /> input[type=&quot;button&quot;],<br /> input[type=&quot;submit&quot;] {<br /> background-color:var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .vector-body blockquote {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> ol.references li:target, sup.reference:target {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> }<br /> <br /> /* category bar and filetoc */<br /> .catlinks,<br /> ul#filetoc {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> /**/<br /> <br /> body .ui-dialog .ui-widget-header {<br /> /* we need an important here because the built-in styles have one :( */<br /> background: var(--wiki-content-background-color) !important;<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .ui-widget-header .ui-dialog-titlebar-close .ui-icon-closethick {<br /> filter: var(--wiki-icon-general-filter);<br /> }<br /> <br /> .ui-widget-header .ui-dialog-titlebar-close.ui-state-hover {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .ui-widget-content {<br /> background: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> body .ui-button {<br /> /* we need an important here because the built-in styles have one. Vector is a mess */<br /> background: var(--wiki-accent-color) !important;<br /> border-color: var(--wiki-accent-color) !important;<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> body .ui-button:hover,<br /> body .ui-button:focus,<br /> body .ui-button:active {<br /> /* we need an important here because we had to use some above */<br /> background: var(--wiki-accent-color--hover) !important;<br /> border-color: var(--wiki-accent-color--hover) !important;<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .ui-state-default,<br /> .ui-widget-content .ui-state-default,<br /> .ui-widget-header .ui-state-default {<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> #contentSub,<br /> #contentSub2 {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> /* notifications (&quot;your edit was saved&quot;, etc.) */<br /> .mw-notification {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-notification .oo-ui-labelElement-label {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-notification .oo-ui-iconElement-icon {<br /> filter:unset;<br /> }<br /> <br /> <br /> <br /> /**/<br /> <br /> .mime-type.has-warning {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-image-warning.oo-ui-icon-alert,<br /> .mw-ui-icon-alert-warning::before {<br /> filter:drop-shadow(0 0 3px #000);<br /> }<br /> <br /> .oo-ui-image-invert.oo-ui-icon-subtract,<br /> .mw-ui-icon-subtract-invert::before,<br /> .oo-ui-image-invert.oo-ui-icon-add,<br /> .mw-ui-icon-add-invert::before {<br /> filter:brightness(0) var(--wiki-icon-to-link-filter);<br /> filter:var(--wiki-icon-general-filter);<br /> }<br /> <br /> .mw_metadata td,<br /> .mw_metadata th {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw_metadata th {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw_metadata td {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-datatable td,<br /> .mw-datatable th {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> #mw-allmessagestable tbody:hover td,<br /> .mw-datatable tr:hover&gt;td {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> #mw-allmessagestable .am_default {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 80%, transparent);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> #mw-allmessagestable .am_actual,<br /> #mw-allmessagestable tbody:hover .am_default {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 60%, transparent);<br /> }<br /> <br /> #mw-allmessagestable .am_actual {<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> #mw-allmessagestable tbody:hover .am_actual {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .mw-datatable,<br /> .mw-json {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> color: inherit;<br /> }<br /> <br /> .mw-datatable&gt;*&gt;tr&gt;th,<br /> .mw-datatable&gt;tr&gt;th,<br /> .mw-json&gt;*&gt;tr&gt;th,<br /> .mw-json&gt;tr&gt;th {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> padding-bottom: 9px;<br /> padding-top: 9px;<br /> }<br /> <br /> .mw-datatable&gt;*&gt;tr&gt;td,<br /> .mw-datatable&gt;tr&gt;td,<br /> .mw-json&gt;*&gt;tr&gt;td,<br /> .mw-json&gt;tr&gt;td {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-json tr {<br /> background-color: inherit;<br /> }<br /> <br /> .mw-json .mw-json-single-value,<br /> .mw-json .mw-json-value,<br /> .mw-json .value {<br /> background: var(--wiki-success-color); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-success-color) 60%, transparent);<br /> }<br /> <br /> .mw-json .mw-json-empty {<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw-message-box,<br /> .mw-message-box-warning {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-message-box-warning {<br /> border-color: var(--wiki-warning-color);<br /> border-width: 1px 1px 1px 10px;<br /> }<br /> <br /> /*.wikitable *,<br /> .wikitable :after,<br /> .wikitable :before {<br /> -webkit-box-sizing: inherit;<br /> box-sizing: inherit;<br /> }*/<br /> <br /> .cargo-pagevalues-tableinfo {<br /> background-color: var(--wiki-content-background-color);<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> top: 46px;<br /> position: static;<br /> /* override sticky in the built-in */<br /> }<br /> <br /> .cargo-table-diagram .cargo-table-svg .node.entity-name rect {<br /> fill: var(--wiki-content-background-color--secondary);<br /> fill-opacity: 1;<br /> }<br /> <br /> .cargo-table-diagram .cargo-table-svg .node rect {<br /> stroke: var(--wiki-content-border-color);<br /> opacity: 1;<br /> }<br /> <br /> .cargo-table-diagram .cargo-table-svg .node text tspan {<br /> fill: var(--wiki-content-text-color);<br /> }<br /> <br /> table.cargoTable {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> table.cargoTable tbody td,<br /> table.cargoTable thead th {<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> table.cargoTable tr:hover {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 25%, transparent);<br /> }<br /> <br /> table.cargoTable thead tr:nth-child(odd),<br /> table.cargoTable.noMerge thead tr:nth-child(odd) {<br /> background-color: var(--wiki-accent-color);<br /> }<br /> <br /> table.cargoTable tbody tr:nth-child(2n),<br /> table.cargoTable.noMerge tbody tr:nth-child(2n) {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> table.cargoTable tbody tr:nth-child(odd),<br /> table.cargoTable.noMerge tbody tr:nth-child(odd) {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> table.cargoTable th.headerSort {<br /> color:var(--wiki-accent-label-color);<br /> }<br /> <br /> table.cargoTable th.headerSort:hover {<br /> color:var(--wiki-accent-label-color);<br /> text-decoration:underline;<br /> }<br /> <br /> table.cargoTable th.headerSort::after {<br /> background-color:var(--wiki-accent-link-color);<br /> }<br /> <br /> #mw-content-text div.cargoReplacementTableInfo {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }.dataTables_wrapper .dataTables_length,<br /> .dataTables_wrapper .dataTables_filter,<br /> .dataTables_wrapper .dataTables_info,<br /> .dataTables_wrapper .dataTables_processing,<br /> .dataTables_wrapper .dataTables_paginate {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> table.dataTable tbody tr {<br /> background-color:var(--wiki-content-background-color);<br /> }<br /> <br /> table.dataTable.display tbody tr.odd &gt; .sorting_1,<br /> table.dataTable.order-column.stripe tbody tr.odd &gt; .sorting_1 {<br /> background-color:var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 75%, transparent);<br /> }<br /> <br /> table.dataTable.stripe tbody tr.odd,<br /> table.dataTable.display tbody tr.odd,<br /> table.dataTable.display tbody tr.even &gt; .sorting_1,<br /> table.dataTable.order-column.stripe tbody tr.even &gt; .sorting_1 {<br /> background-color:var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> }<br /> <br /> table.dataTable.display tbody tr:hover &gt; .sorting_1,<br /> table.dataTable.order-column.hover tbody tr:hover &gt; .sorting_1 {<br /> background-color:var(--wiki-content-background-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color) 75%, transparent);<br /> }<br /> <br /> table.dataTable.hover tbody tr:hover,<br /> table.dataTable.display tbody tr:hover {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,<br /> .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,<br /> .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {<br /> /* we need this !important to override a built-in one */<br /> color: var(--wiki-content-text-mix-color) !important;<br /> }<br /> <br /> table.dataTable.row-border tbody th,<br /> table.dataTable.row-border tbody td,<br /> table.dataTable.display tbody th,<br /> table.dataTable.display tbody td {<br /> border-top: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .dataTables_wrapper .dataTables_paginate .paginate_button.current,<br /> .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {<br /> /* we need this !important to override a built-in one */<br /> color: var(--wiki-content-mix-color) !important;<br /> border: 1px solid var(--wiki-content-border-color);<br /> background-color: var(--wiki-content-background-color);<br /> background: linear-gradient(to bottom,var(--wiki-content-background-color) 0%,var(--wiki-content-background-color--secondary) 100%);<br /> }<br /> <br /> div.drilldown-filters-wrapper {<br /> background-color: transparent;<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .action-pagevalues tr:nth-of-type(2n) {<br /> background-color:var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> }<br /> <br /> .action-pagevalues tr:hover {<br /> background-image: linear-gradient(var(--wiki-accent-color), var(--wiki-accent-color)); /* fallback */<br /> background-image: linear-gradient(color-mix(in srgb, var(--wiki-accent-color) 20%, transparent), color-mix(in srgb, var(--wiki-accent-color) 20%, transparent));<br /> }<br /> <br /> div.specialCargoQuery-extraPane {<br /> background: var(--wiki-content-background-color);<br /> }<br /> <br /> .oo-ui-panelLayout-framed {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button {<br /> background-color: transparent;<br /> }<br /> <br /> .oo-ui-inputWidget-input + .oo-ui-image-invert.oo-ui-icon-check {<br /> background-image:none;<br /> }<br /> <br /> .oo-ui-inputWidget-input:checked + .oo-ui-image-invert.oo-ui-icon-check::before {<br /> position:absolute;<br /> width:100%;<br /> height:100%;<br /> top:0;<br /> left:0;<br /> background-image: url(/load.php?modules=oojs-ui-core.icons&amp;image=check&amp;variant=invert&amp;format=rasterized&amp;skin=vector&amp;version=y9f1k);<br /> background-image: linear-gradient(transparent,transparent),url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E check %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M7 14.2 2.8 10l-1.4 1.4L7 17 19 5l-1.4-1.4z%22/%3E%3C/g%3E%3C/svg%3E&quot;);<br /> content:'';<br /> pointer-events: none;<br /> filter:var(--wiki-icon-general-filter);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget [type=&quot;checkbox&quot;] + span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked + span {<br /> filter: unset;<br /> background-color: transparent; /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 5%, transparent);<br /> border-color: var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 75%, transparent);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget [type=&quot;checkbox&quot;]:disabled + span {<br /> background-color: var(--wiki-content-text-mix-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:hover+span {<br /> border-color: var(--wiki-accent-color);<br /> filter: unset;<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate+span {<br /> background-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked:focus+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate:focus+span {<br /> box-shadow: none;<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:active+span {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:focus+span {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> outline: 1px solid transparent;<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked:focus+span {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:hover+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:active+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:focus+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked:hover+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked:active+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:checked:focus+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate:hover+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate:active+span,<br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:indeterminate:focus+span {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=&quot;checkbox&quot;]:active + span {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent)<br /> }<br /> <br /> .oo-ui-image-invert.oo-ui-icon-check {<br /> background:none;<br /> position:relative;<br /> }<br /> <br /> .oo-ui-inputWidget-input:checked + .oo-ui-image-invert.oo-ui-icon-check::before {<br /> position:absolute;<br /> width:100%;<br /> height:100%;<br /> top:0;<br /> left:0;<br /> background-image: url(/load.php?modules=oojs-ui-core.icons&amp;image=check&amp;variant=invert&amp;format=rasterized&amp;skin=vector&amp;version=y9f1k);<br /> background-image: linear-gradient(transparent,transparent),url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E check %3C/title%3E%3Cg fill=%22%23fff%22%3E%3Cpath d=%22M7 14.2 2.8 10l-1.4 1.4L7 17 19 5l-1.4-1.4z%22/%3E%3C/g%3E%3C/svg%3E&quot;);<br /> content:'';<br /> pointer-events: none;<br /> filter:var(--wiki-icon-general-filter);<br /> }<br /> <br /> .oo-ui-indicatorElement-indicator {<br /> filter: var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed) {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {<br /> color: var(--wiki-content-text-color--hover);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-disabled {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-mix-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-savedLinksListWidget-placeholder.oo-ui-optionWidget .oo-ui-labelElement-label {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-savedLinksListWidget-menu .mw-rcfilters-ui-savedLinksListItemWidget {<br /> color: var(--wiki-content-text-color);<br /> padding: 8px 6px;<br /> -webkit-transition: color .3s, background-color .3s;<br /> transition: color .3s, background-color .3s;<br /> }<br /> <br /> .mw-rcfilters-ui-savedLinksListWidget-menu .mw-rcfilters-ui-savedLinksListItemWidget:hover {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-rcfilters-ui-savedLinksListItemWidget-label {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {<br /> background-color: transparent;<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle+.mw-rcfilters-ui-table,<br /> .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle.mw-rcfilters-ui-filterTagMultiselectWidget-emphasize {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {<br /> border-color: var(--wiki-content-border-color);<br /> padding: 0;<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-savedQueryTitle {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-hideshowButton .oo-ui-buttonElement-button&gt;.oo-ui-labelElement-label {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-hideshowButton .oo-ui-buttonElement-button&gt;.oo-ui-labelElement-label:hover {<br /> color: var(--wiki-content-link-color--hover);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-hideshowButton .oo-ui-buttonElement-button:before {<br /> content: &quot;[&quot;;<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-hideshowButton .oo-ui-buttonElement-button:after {<br /> content: &quot;]&quot;;<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive&gt;.oo-ui-buttonElement-button {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {<br /> background-color: var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .mw-rcfilters-ui-filterTagMultiselectWidget-emptyFilters {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 60%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-filterMenuSectionOptionWidget {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .oo-ui-menuSelectWidget {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterMenuHeaderWidget-header {<br /> background-color: var(--wiki-content-background-color);<br /> border-bottom-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-filterMenuHeaderWidget-title {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child):not(.mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) {<br /> border-bottom-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget-view-namespaces {<br /> border-top-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected,<br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected .mw-rcfilters-ui-itemMenuOptionWidget-label-title,<br /> .mw-rcfilters-ui-itemMenuOptionWidget:hover,<br /> .mw-rcfilters-ui-itemMenuOptionWidget:hover .mw-rcfilters-ui-itemMenuOptionWidget-label-title {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]+span,<br /> .mw-rcfilters-ui-itemMenuOptionWidget:hover .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]+span {<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected,<br /> .mw-rcfilters-ui-itemMenuOptionWidget:hover {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent)<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget-excludeLabel,<br /> .mw-rcfilters-ui-itemMenuOptionWidget-label-title {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget-label-desc {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 60%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-selected:hover,<br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected):hover {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-selected .mw-rcfilters-ui-itemMenuOptionWidget-label-title,<br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) .mw-rcfilters-ui-itemMenuOptionWidget-label-title {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-selected .mw-rcfilters-ui-itemMenuOptionWidget-label-desc {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 60%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected .mw-rcfilters-ui-itemMenuOptionWidget-label-desc,<br /> .mw-rcfilters-ui-itemMenuOptionWidget:hover .mw-rcfilters-ui-itemMenuOptionWidget-label-desc,<br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) .mw-rcfilters-ui-itemMenuOptionWidget-label-desc {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 80%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted.oo-ui-optionWidget-selected .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]+span,<br /> .mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type=checkbox]+span {<br /> border-color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 60%, transparent);<br /> }<br /> <br /> .oo-ui-tagItemWidget.oo-ui-widget-enabled,<br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {<br /> background-color: transparent;<br /> color: var(--wiki-content-text-color);<br /> border-color:var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled.selected {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-rcfilters-ui-datePopupWidget {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 80%, transparent);<br /> }<br /> <br /> .mw-changeslist-legend,<br /> .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> @keyframes fadeBlue {<br /> 60% {<br /> border-top-color:var(--wiki-accent-color);<br /> }<br /> 100% {<br /> border-top-color:var(--wiki-content-border-color);<br /> }<br /> }<br /> <br /> .mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator {<br /> border-top-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-rcfilters-ui-menuSelectWidget-footer {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> }<br /> <br /> .mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-text-color) 10%, transparent);<br /> }<br /> <br /> .oo-ui-iconElement-icon.mw-rcfilters-ui-filterItemHighlightButton-circle {<br /> filter:unset;<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .mw-rcfilters-ui-tagItemWidget-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> border-color:var(--wiki-accent-color);<br /> }<br /> <br /> .mw-rcfilters-ui-tagItemWidget.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-labelElement-label {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 76%, transparent);<br /> }<br /> <br /> .mw-rcfilters-ui-tagItemWidget-popup-content {<br /> color: var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 75%, transparent);<br /> }<br /> <br /> /* fix for weird focus box on recentchanges arrows when clicking, but keep it for tab navigation */<br /> .mw-enhancedchanges-checkbox:focus + * .mw-enhancedchanges-arrow {<br /> outline:none;<br /> }<br /> <br /> .mw-enhancedchanges-checkbox:focus-visible + * .mw-enhancedchanges-arrow {<br /> outline:1px solid var(--wiki-accent-color);<br /> }<br /> /**/<br /> <br /> .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before {<br /> border-top-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after {<br /> border-top-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .unpatrolled {<br /> color: var(--wiki-alert-color);<br /> }<br /> <br /> .autocomment, .autocomment a, .autocomment a:visited {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> /* Recent changes filter highlighting */<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c1,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c1 tr:first-child,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c1.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c1.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {<br /> background-color: #1c283f;<br /> }<br /> <br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c2,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c2 tr:first-child,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c2.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c2.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {<br /> background-color: #0f3128;<br /> }<br /> <br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c3,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c3 tr:first-child,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c3.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c3.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {<br /> background-color: #352c10;<br /> }<br /> <br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c4,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c4 tr:first-child,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c4.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c4.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {<br /> background-color: #411d0c;<br /> }<br /> <br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget li.mw-rcfilters-highlight-color-c5,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget .mw-rcfilters-highlight-color-c5 tr:first-child,<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c5.mw-rcfilters-ui-highlights-enhanced-toplevel:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+2)),<br /> .view-dark .mw-rcfilters-ui-changesListWrapperWidget tr.mw-rcfilters-highlight-color-c5.mw-rcfilters-ui-highlights-enhanced-nested:not(.mw-rcfilters-ui-changesListWrapperWidget-enhanced-grey) td:not(:nth-child(-n+4)) {<br /> background-color: #3f0f0f;<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled,<br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {<br /> background-color: transparent;<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> -webkit-transition: border-color 300ms, box-shadow 300ms;<br /> transition: border-color 300ms, box-shadow 300ms;<br /> background-color: var(--wiki-content-background-color--secondary)<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> outline: 0<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle {<br /> border-color: var(--wiki-accent-color)<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid .oo-ui-tagMultiselectWidget-handle,<br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid:hover .oo-ui-tagMultiselectWidget-handle {<br /> border-color: var(--wiki-alert-color)<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-bottom-width: 0;<br /> border-bottom-left-radius: 0;<br /> border-bottom-right-radius: 0<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-inputWidget-input {<br /> border-radius: 0;<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {<br /> border-color: var(--wiki-alert-color);<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {<br /> color: var(--wiki-alert-color);<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {<br /> opacity: 0.5;<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group &gt; input {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-tagMultiselectWidget .oo-ui-inputWidget-input {<br /> color: inherit;<br /> background: transparent;<br /> font-family: inherit;<br /> }<br /> <br /> .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle,<br /> .oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input,<br /> .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {<br /> background: var(--wiki-content-text-mix-color-95);<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 25%, transparent);<br /> text-shadow:none;<br /> border-color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::placeholder {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-dropdownInputWidget select {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus {<br /> border-color:var(--wiki-accent-color);<br /> box-shadow:inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 95%, var(--wiki-content-dynamic-color));<br /> border-color: var(--wiki-content-border-color);<br /> border-color: color-mix(in srgb, var(--wiki-content-border-color) 95%, var(--wiki-content-dynamic-color));<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> border-color: #0006;<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {<br /> background-color: var(--wiki-accent-color);<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-content-dynamic-color));<br /> border-color: #0006;<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {<br /> background-color: var(--wiki-accent-label-color);<br /> border-color: #0006;<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {<br /> background-color: var(--wiki-accent-color--hover);<br /> border-color: var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active,<br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover,<br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus {<br /> background-color: var(--wiki-accent-color--hover);<br /> border-color: var(--wiki-accent-color--hover);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip,<br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip,<br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip {<br /> background-color: var(--wiki-accent-label-color);<br /> border-color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active,<br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active:hover {<br /> background-color: var(--wiki-accent-color--hover);<br /> border-color: var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus {<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus::before {<br /> border-color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> border-color: var(--wiki-content-text-mix-color-95);<br /> }<br /> <br /> .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {<br /> border-color: var(--wiki-content-dynamic-color--inverted);<br /> box-shadow: inset 0 0 0 1px var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected,<br /> .oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .oo-ui-labelWidget.oo-ui-inline-help {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 80%, transparent);<br /> }<br /> <br /> .oo-ui-progressBarWidget:not(.oo-ui-pendingElement-pending){<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow:0 1px 1px var(--wiki-content-dynamic-color); /* fallback */<br /> box-shadow: 0 1px 1px color-mix(in srgb, var(--wiki-content-dynamic-color) 15%, transparent);<br /> }<br /> <br /> .oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {<br /> background-color:var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-bookletLayout-outlinePanel {<br /> padding: 7px 0;<br /> }<br /> <br /> .oo-ui-processDialog-content .oo-ui-window-head,<br /> .oo-ui-processDialog-content .oo-ui-window-foot,<br /> .oo-ui-messageDialog-content &gt; .oo-ui-window-head,<br /> .oo-ui-messageDialog-content &gt; .oo-ui-window-foot {<br /> outline-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {<br /> border-right-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) &gt; .oo-ui-buttonElement-button:hover {<br /> background-color: var(--wiki-content-background-color);<br /> border-right-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-messageDialog-title {<br /> color: var(--wiki-heading-color);<br /> }<br /> <br /> /* OAuth authorisation dialog */<br /> #mw-mwoauth-authorize-form {<br /> color: inherit;<br /> }<br /> <br /> .oo-ui-toolbar-bar,<br /> .oo-ui-popupToolGroup-tools,<br /> .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled &gt; .oo-ui-popupToolGroup-handle:hover {<br /> border-right-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-tool-active,<br /> .oo-ui-tool.oo-ui-widget-enabled &gt; .oo-ui-tool-link:active,<br /> .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active &gt; .oo-ui-tool-link,<br /> .oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active &gt; .oo-ui-tool-link,<br /> .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active &gt; .oo-ui-popupToolGroup-handle {<br /> background-color: var(--wiki-content-background-color);<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link {<br /> /* we remove the transition here because it causes the hard-coded color to flash briefly */<br /> transition:none;<br /> }<br /> <br /> .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active &gt; .oo-ui-popupToolGroup-handle:hover {<br /> color:var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-popupToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {<br /> color:var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-popupToolGroup.oo-ui-widget-enabled &gt; .oo-ui-popupToolGroup-handle:hover,<br /> .oo-ui-tool.oo-ui-widget-enabled &gt; .oo-ui-tool-link:hover {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> }<br /> <br /> .oo-ui-popupToolGroup.oo-ui-widget-enabled &gt; .oo-ui-popupToolGroup-handle:active {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);<br /> }<br /> <br /> .oo-ui-popupToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus {<br /> box-shadow:inset 0 0 0 2px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-popupToolGroup.oo-ui-widget-enabled &gt; .oo-ui-popupToolGroup-handle:focus,<br /> .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus,<br /> .oo-ui-tool.oo-ui-widget-enabled &gt; .oo-ui-tool-link:focus {<br /> outline:1px solid var(--wiki-accent-color);<br /> box-shadow:inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-menuToolGroup,<br /> .oo-ui-popupToolGroup-tools {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-toolbar-position-top &gt; .oo-ui-toolbar-bar {<br /> border-color: var(--wiki-content-border-color);<br /> box-shadow:0 1px 1px 0 var(--wiki-content-dynamic-color--secondary--inverted); /* fallback */<br /> box-shadow: 0 1px 1px 0 color-mix(in srgb, var(--wiki-content-dynamic-color) 10%, transparent);<br /> }<br /> <br /> .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary &gt; .oo-ui-tool-link,<br /> .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary &gt; .oo-ui-tool-link {<br /> background-color: var(--wiki-content-text-mix-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive &gt; .oo-ui-tool-link {<br /> background-color:var(--wiki-accent-color);<br /> color:var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive &gt; .oo-ui-tool-link:hover {<br /> background-color:var(--wiki-accent-color--hover);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless&gt;.oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus {<br /> color: var(--wiki-content-text-color--hover);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus {<br /> color: var(--wiki-content-text-color--hover);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive&gt;.oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive &gt; .oo-ui-buttonElement-button{<br /> color: var(--wiki-alert-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button:focus {<br /> color: var(--wiki-alert-color--hover);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless&gt;.oo-ui-buttonElement-button {<br /> border: 1px solid transparent;<br /> }<br /> <br /> .oo-ui-buttonElement-frameless&gt;button.oo-ui-buttonElement-button {<br /> color: inherit;<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color),inset 0 0 0 2px var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active {<br /> background-color: var(--wiki-accent-color--hover);<br /> border-color: var(--wiki-accent-color--hover);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive &gt; .oo-ui-buttonElement-button {<br /> background-color: #bf0017;<br /> border-color: #bf0017;<br /> color: #fff;<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active {<br /> background-color: #59000b;<br /> border-color: #59000b;<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active &gt; .oo-ui-buttonElement-button:focus {<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color--hover),inset 0 0 0 2px var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color--hover);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active &gt; .oo-ui-buttonElement-button{<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-link-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-buttonElement-pressed &gt; input.oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:active {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 8%, transparent);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive &gt; .oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed &gt; .oo-ui-buttonElement-button {<br /> color:var(--wiki-content-link-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-link-color) 90%, transparent);<br /> border-color:var(--wiki-content-link-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-content-link-color) 90%, transparent);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover {<br /> background-color: transparent;<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive &gt; .oo-ui-buttonElement-button:hover {<br /> background-color: var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {<br /> border-color: var(--wiki-accent-color--hover);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color--hover),inset 0 0 0 2px var(--wiki-accent-label-color);<br /> }<br /> <br /> .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(2n) td,<br /> .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .oo-ui-popupWidget-popup {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-advancedSearch-namespace-selection {<br /> background: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-advancedSearch-fieldContainer {<br /> background: var(--wiki-content-background-color);<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-advancedSearch-fieldContainer fieldset {<br /> border-color: var(--wiki-content-border-color);<br /> margin-top: 0;<br /> }<br /> <br /> .mw-advancedSearch-fieldContainer .oo-ui-labelElement &gt; .oo-ui-fieldsetLayout-header &gt; .oo-ui-labelElement-label {<br /> all: unset;<br /> }<br /> <br /> .mw-advancedSearch-expandablePane-button.oo-ui-widget-enabled.oo-ui-buttonWidget &gt; .oo-ui-buttonElement-button:hover {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-advancedSearch-expandablePane-button.oo-ui-widget-enabled.oo-ui-buttonWidget.oo-ui-buttonElement-pressed &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .oo-ui-popupWidget-popup .mw-advancedSearch-tooltip-head {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-menuSectionOptionWidget {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> /* possibly deprecated */<br /> <br /> .mw-ui-button:not(:disabled) {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-accent-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-ui-button:not(:disabled):visited {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-ui-button:not(:disabled):hover {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-accent-color--hover);<br /> }<br /> <br /> .mw-ui-button:not(:disabled):focus {<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-content-text-color);<br /> box-shadow: none;<br /> }<br /> <br /> .mw-ui-button:not(:disabled):active,<br /> .mw-ui-button:not(:disabled).is-on {<br /> background-color: var(--wiki-content-background-color);<br /> color: var(--wiki-content-dynamic-color);<br /> border-color: var(--wiki-content-link-color);<br /> }<br /> <br /> /* end possibly deprecated */<br /> <br /> .mw-ui-icon-before::before {<br /> filter: var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> .oo-ui-windowManager-modal &gt; .oo-ui-dialog &gt; .oo-ui-window-frame {<br /> background-color: var(--wiki-content-background-color);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-windowManager-modal&gt;.oo-ui-dialog {<br /> background-color:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 50%, transparent);<br /> }<br /> <br /> .oo-ui-windowManager-modal.oo-ui-windowManager-floating &gt; .oo-ui-dialog &gt; .oo-ui-window-frame {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-messageDialog-message {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed:not(.oo-ui-flaggedElement-primary):not(.oo-ui-buttonElement-active) &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-disabled:not(.oo-ui-flaggedElement-primary):not(.oo-ui-buttonElement-active) &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-content-text-mix-color-95);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button {<br /> color: var(--wiki-accent-color);<br /> border-color:var(--wiki-accent-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover {<br /> color: var(--wiki-accent-color--hover);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 3px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled&gt;.oo-ui-buttonElement-button:active,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-link-color--hover);<br /> border-color: var(--wiki-content-link-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-disabled &gt; .oo-ui-buttonElement-button,<br /> .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-flaggedElement-primary &gt; .oo-ui-buttonElement-button {<br /> background-color: var(--wiki-content-text-mix-color);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .tdg-templateDataParamWidget-param-description {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-messageWidget.oo-ui-flaggedElement-error:not(.oo-ui-messageWidget-block),<br /> .mw-body-content .error {<br /> color: var(--wiki-alert-color);<br /> }<br /> <br /> .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-alert-color);<br /> border-left-width: 10px;<br /> }<br /> <br /> .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-success {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-success-color);<br /> border-left-width: 10px;<br /> }<br /> <br /> .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .tdg-templateDataParamWidget-param-alias {<br /> color: var(--wiki-content-text-mix-color);<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .tdg-templateDataParamWidget-param-alias:first-child {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw-templatedata-doc-muted {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) &gt; .oo-ui-buttonElement-button:active {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-right-color: var(--wiki-accent-color);<br /> }<br /> <br /> /* Date picker */<br /> .mw-widget-dateInputWidget-handle {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> .mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle:hover {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: none;<br /> }<br /> .mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> .mw-widget-dateInputWidget.oo-ui-widget-enabled .mw-widget-dateInputWidget-handle &gt; .oo-ui-labelElement-label {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-widget-calendarWidget {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-widget-calendarWidget:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .mw-widget-dateInputWidget-calendar {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-widget-dateInputWidget-calendar:focus {<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color),0 2px 2px 0 rgba(0,0,0,0.2);<br /> }<br /> <br /> .mw-widget-calendarWidget-header .oo-ui-labelElement-label,<br /> .mw-widget-calendarWidget-day,<br /> .mw-widget-calendarWidget-month,<br /> .mw-widget-calendarWidget-year {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-widget-calendarWidget-day-heading,<br /> .mw-widget-calendarWidget-day-additional {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 55%, transparent);<br /> }<br /> <br /> .mw-widget-calendarWidget-day-today {<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .mw-widget-calendarWidget-item-selected {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 90%, transparent);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .mw-widget-calendarWidget-item:hover {<br /> background-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .mw-widgets-datetime-calendarWidget:focus {<br /> border-color: var(--wiki-content-border-color);<br /> box-shadow: none;<br /> }<br /> <br /> .mw-widgets-datetime-calendarWidget-grid {<br /> overflow-x: initial;<br /> }<br /> <br /> .mw-widgets-datetime-dateTimeInputWidget-handle {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> .mw-widgets-datetime-dateTimeInputWidget.oo-ui-widget-enabled .mw-widgets-datetime-dateTimeInputWidget-handle:hover {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-widgets-datetime-dateTimeInputWidget.oo-ui-widget-enabled .mw-widgets-datetime-dateTimeInputWidget-editField:hover {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-widgets-datetime-calendarWidget {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-widgets-datetime-calendarWidget-grid .mw-widgets-datetime-calendarWidget-cell.mw-widgets-datetime-calendarWidget-extra .oo-ui-buttonElement-button .oo-ui-labelElement-label {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 55%, transparent);<br /> }<br /> <br /> /* Unpatrolled page creations on Special:NewPages */<br /> .not-patrolled {<br /> background-color:var(--wiki-warning-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-warning-color) 16%, transparent);<br /> }<br /> <br /> .mw-spinner-container &gt; div::after {<br /> background-color:var(--wiki-content-text-color);<br /> }<br /> <br /> pre,<br /> code,<br /> .mw-code {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid transparent;<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-templatedata-doc-param-alias {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-highlight,<br /> .view-light .mw-highlight {<br /> --pygments-background:var(--wiki-content-background-color--secondary); /* fallback */<br /> --pygments-background: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> --pygments-err: #db0000;<br /> --pygments-c: #3a7575;<br /> --pygments-k: #008000;<br /> --pygments-o: #666;<br /> --pygments-ch: #3a7575;<br /> --pygments-cm: #3a7575;<br /> --pygments-cp: #986200;<br /> --pygments-cpf: #3a7575;<br /> --pygments-c1: #3a7575;<br /> --pygments-cs: #3a7575;<br /> --pygments-gd: #a00000;<br /> --pygments-gr: #db0000;<br /> --pygments-gh: #000080;<br /> --pygments-gi: #008100;<br /> --pygments-go: #6e6e6e;<br /> --pygments-gp: #000080;<br /> --pygments-gu: #800080;<br /> --pygments-gt: #04d;<br /> --pygments-kc: #008000;<br /> --pygments-kd: #008000;<br /> --pygments-kn: #008000;<br /> --pygments-kp: #008000;<br /> --pygments-kr: #008000;<br /> --pygments-kt: #b00040;<br /> --pygments-m: #666;<br /> --pygments-s: #ba2121;<br /> --pygments-na: #647421;<br /> --pygments-nb: #008000;<br /> --pygments-nc: #00f;<br /> --pygments-no: #800;<br /> --pygments-nd: #a412ff;<br /> --pygments-ni: #6d6d6d;<br /> --pygments-ne: #c9352e;<br /> --pygments-nf: #00f;<br /> --pygments-nl: #727200;<br /> --pygments-nn: #00f;<br /> --pygments-nt: #008000;<br /> --pygments-nv: #19177c;<br /> --pygments-ow: #a412ff;<br /> --pygments-w: #6e6e6e;<br /> --pygments-mb: #666;<br /> --pygments-mf: #666;<br /> --pygments-mh: #666;<br /> --pygments-mi: #666;<br /> --pygments-mo: #666;<br /> --pygments-sa: #ba2121;<br /> --pygments-sb: #ba2121;<br /> --pygments-sc: #ba2121;<br /> --pygments-dl: #ba2121;<br /> --pygments-sd: #ba2121;<br /> --pygments-s2: #ba2121;<br /> --pygments-se: #a55a1e;<br /> --pygments-sh: #ba2121;<br /> --pygments-si: #af4d74;<br /> --pygments-sx: #008000;<br /> --pygments-sr: #af4d74;<br /> --pygments-s1: #ba2121;<br /> --pygments-ss: #19177c;<br /> --pygments-bp: #008000;<br /> --pygments-fm: #00f;<br /> --pygments-vc: #19177c;<br /> --pygments-vg: #19177c;<br /> --pygments-vi: #19177c;<br /> --pygments-vm: #19177c;<br /> --pygments-il: #666;<br /> }<br /> <br /> .view-dark .mw-highlight {<br /> --pygments-background:var(--wiki-content-background-color--secondary); /* fallback */<br /> --pygments-background: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> --pygments-err: #fe4242;<br /> --pygments-c: #4b9797;<br /> --pygments-k: #00a300;<br /> --pygments-o: #898989;<br /> --pygments-ch: #4b9797;<br /> --pygments-cm: #4b9797;<br /> --pygments-cp: #c17d00;<br /> --pygments-cpf: #4b9797;<br /> --pygments-c1: #4b9797;<br /> --pygments-cs: #4b9797;<br /> --pygments-gd: #ff3f3f;<br /> --pygments-gr: #fe4242;<br /> --pygments-gh: #7a7aff;<br /> --pygments-gi: #00a000;<br /> --pygments-go: #8a8a8a;<br /> --pygments-gp: #7a7aff;<br /> --pygments-gu: #f500f5;<br /> --pygments-gt: #4e84fe;<br /> --pygments-kc: #00a300;<br /> --pygments-kd: #00a300;<br /> --pygments-kn: #00a300;<br /> --pygments-kp: #00a300;<br /> --pygments-kr: #00a300;<br /> --pygments-kt: #fe357e;<br /> --pygments-m: #898989;<br /> --pygments-s: #e25e5e;<br /> --pygments-na: #80932a;<br /> --pygments-nb: #00a300;<br /> --pygments-nc: #7a7afe;<br /> --pygments-no: #ff4040;<br /> --pygments-nd: #bf5aff;<br /> --pygments-ni: #999;<br /> --pygments-ne: #da655f;<br /> --pygments-nf: #7a7afe;<br /> --pygments-nl: #a0a000;<br /> --pygments-nn: #7a7afe;<br /> --pygments-nt: #00a300;<br /> --pygments-nv: #8381e7;<br /> --pygments-ow: #bf5aff;<br /> --pygments-w: #bbb;<br /> --pygments-mb: #898989;<br /> --pygments-mf: #898989;<br /> --pygments-mh: #898989;<br /> --pygments-mi: #898989;<br /> --pygments-mo: #898989;<br /> --pygments-sa: #e25e5e;<br /> --pygments-sb: #e25e5e;<br /> --pygments-sc: #e25e5e;<br /> --pygments-dl: #e25e5e;<br /> --pygments-sd: #e25e5e;<br /> --pygments-s2: #e25e5e;<br /> --pygments-se: #d07125;<br /> --pygments-sh: #e25e5e;<br /> --pygments-si: #c17492;<br /> --pygments-sx: #00a300;<br /> --pygments-sr: #c17492;<br /> --pygments-s1: #e25e5e;<br /> --pygments-ss: #8381e7;<br /> --pygments-bp: #00a300;<br /> --pygments-fm: #7a7afe;<br /> --pygments-vc: #8381e7;<br /> --pygments-vg: #8381e7;<br /> --pygments-vi: #8381e7;<br /> --pygments-vm: #8381e7;<br /> --pygments-il: #898989;<br /> }<br /> <br /> div.mw-highlight,<br /> .skin-theme-clientpref-night div.mw-highlight {<br /> background-color: var(--wiki-content-dynamic-color--inverted);<br /> margin: 0.5em 0;<br /> }<br /> <br /> .mw-highlight .err {border-color: var(--pygments-err);}<br /> .mw-highlight .c {color: var(--pygments-c);}<br /> .mw-highlight .k {color: var(--pygments-k);}<br /> .mw-highlight .o {color: var(--pygments-o);}<br /> .mw-highlight .ch {color: var(--pygments-ch);}<br /> .mw-highlight .cm {color: var(--pygments-cm);}<br /> .mw-highlight .cp {color: var(--pygments-cp);}<br /> .mw-highlight .cpf {color: var(--pygments-cpf);}<br /> .mw-highlight .c1 {color: var(--pygments-c1);}<br /> .mw-highlight .cs {color: var(--pygments-cs);}<br /> .mw-highlight .gd {color: var(--pygments-gd);}<br /> .mw-highlight .gr {color: var(--pygments-gr);}<br /> .mw-highlight .gh {color: var(--pygments-gh);}<br /> .mw-highlight .gi {color: var(--pygments-gi);}<br /> .mw-highlight .go {color: var(--pygments-go);}<br /> .mw-highlight .gp {color: var(--pygments-gp);}<br /> .mw-highlight .gu {color: var(--pygments-gu);}<br /> .mw-highlight .gt {color: var(--pygments-gt);}<br /> .mw-highlight .kc {color: var(--pygments-kc);}<br /> .mw-highlight .kd {color: var(--pygments-kd);}<br /> .mw-highlight .kn {color: var(--pygments-kn);}<br /> .mw-highlight .kp {color: var(--pygments-kp);}<br /> .mw-highlight .kr {color: var(--pygments-kr);}<br /> .mw-highlight .kt {color: var(--pygments-kt);}<br /> .mw-highlight .m {color: var(--pygments-m);}<br /> .mw-highlight .s {color: var(--pygments-s);}<br /> .mw-highlight .na {color: var(--pygments-na);}<br /> .mw-highlight .nb {color: var(--pygments-nb);}<br /> .mw-highlight .nc {color: var(--pygments-nc);}<br /> .mw-highlight .no {color: var(--pygments-no);}<br /> .mw-highlight .nd {color: var(--pygments-nd);}<br /> .mw-highlight .ni {color: var(--pygments-ni);}<br /> .mw-highlight .ne {color: var(--pygments-ne);}<br /> .mw-highlight .nf {color: var(--pygments-nf);}<br /> .mw-highlight .nl {color: var(--pygments-nl);}<br /> .mw-highlight .nn {color: var(--pygments-nn);}<br /> .mw-highlight .nt {color: var(--pygments-nt);}<br /> .mw-highlight .nv {color: var(--pygments-nv);}<br /> .mw-highlight .ow {color: var(--pygments-ow);}<br /> .mw-highlight .w {color: var(--pygments-w);}<br /> .mw-highlight .mb {color: var(--pygments-mb);}<br /> .mw-highlight .mf {color: var(--pygments-mf);}<br /> .mw-highlight .mh {color: var(--pygments-mh);}<br /> .mw-highlight .mi {color: var(--pygments-mi);}<br /> .mw-highlight .mo {color: var(--pygments-mo);}<br /> .mw-highlight .sa {color: var(--pygments-sa);}<br /> .mw-highlight .sb {color: var(--pygments-sb);}<br /> .mw-highlight .sc {color: var(--pygments-sc);}<br /> .mw-highlight .dl {color: var(--pygments-dl);}<br /> .mw-highlight .sd {color: var(--pygments-sd);}<br /> .mw-highlight .s2 {color: var(--pygments-s2);}<br /> .mw-highlight .se {color: var(--pygments-se);}<br /> .mw-highlight .sh {color: var(--pygments-sh);}<br /> .mw-highlight .si {color: var(--pygments-si);}<br /> .mw-highlight .sx {color: var(--pygments-sx);}<br /> .mw-highlight .sr {color: var(--pygments-sr);}<br /> .mw-highlight .s1 {color: var(--pygments-s1);}<br /> .mw-highlight .ss {color: var(--pygments-ss);}<br /> .mw-highlight .bp {color: var(--pygments-bp);}<br /> .mw-highlight .fm {color: var(--pygments-fm);}<br /> .mw-highlight .vc {color: var(--pygments-vc);}<br /> .mw-highlight .vg {color: var(--pygments-vg);}<br /> .mw-highlight .vi {color: var(--pygments-vi);}<br /> .mw-highlight .vm {color: var(--pygments-vm);}<br /> .mw-highlight .il {color: var(--pygments-il);}<br /> <br /> .mw-highlight pre {<br /> background: var(--pygments-background);<br /> margin: 0;<br /> }<br /> <br /> .mw-content-ltr.mw-highlight-lines pre,<br /> .mw-content-ltr.content .mw-highlight-lines pre {<br /> padding-left: 3.5em;<br /> box-shadow: inset 2.75em 0 0 var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .mw-highlight .hll {<br /> background-color: var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent)<br /> }<br /> <br /> .mw-apisandbox-toolbar {<br /> background: var(--wiki-content-background-color--secondary);<br /> top: var( --wikigg-header-height );<br /> }<br /> <br /> /* special:replacetext */<br /> .ext-replacetext-searchoptions {<br /> background-color: transparent;<br /> border: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .ext-replacetext-searchoptions .ext-replacetext-divider {<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> /**/<br /> <br /> .view-dark textarea {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .view-dark textarea:focus-visible {<br /> outline-color: var(--wiki-accent-color);<br /> outline-style: solid;<br /> }<br /> <br /> .oo-ui-textInputWidget.oo-ui-widget-enabled textarea.oo-ui-inputWidget-input:focus {<br /> outline: 1px solid var(--wiki-accent-color);<br /> }<br /> <br /> /* make math formulas legible on dark theme */<br /> .mwe-math-fallback-image-inline,<br /> .mwe-math-fallback-image-display,<br /> .ve-ui-mwLatexPage-symbol {<br /> filter: var(--wiki-icon-general-filter);<br /> }<br /> <br /> /* search bar */<br /> #searchInput {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> box-shadow: none;<br /> }<br /> <br /> #searchInput:focus,<br /> #simpleSearch:hover #searchInput,<br /> #simpleSearch:hover #searchInput:focus {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: none;<br /> }<br /> <br /> #searchButton {<br /> filter: var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> .vector-search-box-input::placeholder {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> /* Search suggestions */<br /> <br /> .suggestions-results,<br /> .suggestions-special {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .suggestions a.mw-searchSuggest-link,<br /> .suggestions a.mw-searchSuggest-link:hover,<br /> .suggestions a.mw-searchSuggest-link:active,<br /> .suggestions a.mw-searchSuggest-link:focus {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .suggestions-result {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .suggestions-result-current {<br /> background-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .suggestions-special .special-label {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .suggestions-special.suggestions-result-current .special-label {<br /> color:var(--wiki-accent-label-color);<br /> }<br /> <br /> .suggestions-special .special-query {<br /> color: var(--wiki-link-label-color);<br /> }<br /> <br /> <br /> /* search page */<br /> fieldset#mw-searchoptions {<br /> background-color:var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> #mw-searchoptions .divider {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-search-profile-tabs {<br /> background-color:var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 50%, transparent);<br /> border: 1px solid var(--wiki-content-border-color);<br /> margin-top: 1em;<br /> }<br /> <br /> .mw-search-profile-tabs div.search-types ul li.current a {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .results-info,<br /> .mw-search-result-data {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> /**/<br /> <br /> /* Login/register page */<br /> .mw-number-text {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-body-content .mw-number-text h3 {<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mw-number-text.icon-edits,<br /> .mw-number-text.icon-pages,<br /> .mw-number-text.icon-contributors {<br /> position:relative;<br /> background:none; <br /> }<br /> <br /> .mw-number-text.icon-edits::before,<br /> .mw-number-text.icon-pages::before,<br /> .mw-number-text.icon-contributors::before {<br /> position:absolute;<br /> width:95px;<br /> height:100%;<br /> left:0;<br /> top:0;<br /> content:'';<br /> filter:brightness(0) var(--wiki-icon-general-filter);<br /> }<br /> <br /> .mw-number-text.icon-edits::before {<br /> background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABLCAYAAADnAAD1AAACrUlEQVR4AWL4//8/oH170LEsiKIwXGPbtm0EY9s2g7bdjzh4oVnjyslKVZ3hSu+d5L/c0Xdx/Bt5jjCyAR3QAd9/+DhSW4oeoYmJGQdM4HWjYfQKTXTA8pZFeIgjOmA5Hkd0wDwe6TWa6IAcr4eA5RAdEC0neKWIDoieFcMRRPOAaDJ6+4uITxzwJ+KbmnjdaKkDliISPIv/gcvRxsT7kzgix7MGuBz1ooFyRIq3xOJ64ArUG0EMoMV5RI5nAJDjRV1Go1DIIL7meJKAAngc8Qn/tgoACuCNRtfRJhQyGQLkeJcI3u3oP3GzA5bjjYnwEEE0Acjx+urgEcRNVgFX1sUjdaHF9gA53sW/jScFKIC3SH8hIo5nDXAVwbtA8O6U4+kD6uPpA2rhWQNcXYh3N4HXSfAMAHK8838BTwBQF28hCpKAAnj3SvCsAa4heOdU8NQB5fGUAfXxhAEZ3lmCdz+B18Hx9ABN46kBrv1DeAtQsAZYivdAB08AMMLrJ3hBHU8BkOGdqcyMLcCbj4I1QH08YUCGd0kbTwCQ4MW1oFkR3kM5PAHAdVU8gjhPEk8AkOKRBjN481AwAxjhDRCM4Rq1EzwTgAzvGtoqiicAmMcbjRZI4wkATiP/eVe/4QU0DvXJ4gkAHq9gNEV4cdPRRtQjgycAOA51VkAOoECaiF5J4QkA7iVnuI+vgTcXBauAo1BjBeU0mZuCXlfm2gieOcCN5KzPadH7s9EF1CeJJwD4lKy2BLQM3UFDaFgSTwBwKcE5il6Q1wmeA95KQLGafuI54Ay+I4D2Fm1HY2QwBADPZdCG0EO0Wg5CAHAi6k1ce3E1fdDHAQ8TuG50Ml6F4TngGNQawTWjg2iCPoAG4I5vcG/QVrLDIJMDnvyNBYMDeg7ogA7ogJ4DOqBmnwD4A/itR9A4HwAAAABJRU5ErkJggg==) no-repeat left center;<br /> }<br /> <br /> .mw-number-text.icon-pages::before {<br /> background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABLCAYAAADnAAD1AAAByUlEQVR4Ae3XQ6JcQRhH8Rs7mYWT2LZt25rEtpNvicGCOid51lWhX3X/B78F1ClnjUZDHChCDgVUQAVUwF+//zTbaEzwJKuqFQJOwVOYB0fSDege8RnMg8OxA47HhMhGho4YM+BHWGTXMApZP1NxAqdKuIS3DhETC5gT0cEonM+LmH7A8BHHF4zhUMyAr3DKswt4ARvCVQ8RL8FyHIoV8DqyAEbidMCIu2AFDqUbEBiLd4EiroOVcDDdgMBJWI4rNSOugpV0MOWAa2EBIq6HVXAw1YDzYQEiboVVdCDFgLNhASIegtWwP7WAM2AVXC4Z8SKsho+pBZwDCxDxIZ7hGo5iN7ZgG/bjOj61QsB5sAARxyArMA7nUw+4GuYQcaSHv/PrlAPuhDnYh8zR9ZQDnoF1+ooXuI87uIvH+JoT8ES7B1yJxZiGETnbbAHuKqCbkbiqgG5mK6Cb8QqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogAqogG0acAwmVHRLAXschDlQQAVUwKYGXIZTDo7qFnakgAqogP4ooAK+waVh5GpSAROggAqogFKOAiqgAiqg/AUjJ7hc1MT1egAAAABJRU5ErkJggg==) no-repeat left center<br /> }<br /> <br /> .mw-number-text.icon-contributors::before {<br /> background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAAAtCAYAAAA5reyyAAAEMElEQVR4AWJ4/uLFYMJsgHbtIVhzLQqg8G7btm3bfLZt2/abtG3btm3btt19tXuNU5UbnV9VPfj2PCtODh7DaOzHDdzEIQxFG6SERItoilcPq6EOpqNsrAdMiWb4CQPQEx+jMsSH13Ad6tJRtIf4UBkfoyf642c0Q8pwBSyOEYiDWpzHP8gIcelZ3IV6dBENIS5lxD84D7WIwwgUD3XActjk8jTLDnFQAiegPm1FFoiD7JgKdbAJ5UIVMA0WQ10aCnEwHBrQ/xAHQ6EuLULqUAT8EurRkxAbtXEWGtBu5IPYeBLq0RemA6bDUqhHwyE2/oIa8qHho3wp0pkM2AS3oR4dRCmIFWZADRkEsUIpHIR6dBtNTAZ8DepDEhpDLIphL9Q9X0dMYyRBfXjNZMD3oT61hFjUwHmoITtQAGLREurT+yYDvgn1IQ4NwhBwP0pALBogDurDmyYDPgL14QjKQCzK43gYjsAyOAL14RGTAcvhKNSjWUgLsciDzVBDliG9zceJWT53fFlzAYGJUI/+g9iYCjVkBMTGv1CPJkJMB/wM6sEdtILY6Aw15A+IjVa4A/Xgs1C9ym2AujQVkoznkQgN6CpaQAwd7euQynxA4EMkuTz6noAkIxu2QQNaAXHwhMujMAkfhvpz1gSogwEQF/pAA/oV4sIAqIPxkFAHLIwVUBuLkQ/iQkNchPp0BHkhLuTDYocjuVDoAwLNobCKx7MQZ0buxn9CPHgO8VBYNYOEI2AxTIPaWI3SEJdq47rPz1jZIC6VxmqHm17RUAYsjm+wB+rgDH5FZYgL/0M9egjiQmX8hjNQB3vwDYqZClgRn2I8TkM9uoxp+BY1IDayYAnUpd8hyaiBbzEdl6EencZ4fIoKXgPWQ0eswTmoIRexCz9DYFUWh6AOeiEFBFYfYYv7aK6cxRp0RL3kAjbBSsRBQ+gwykBg1SrAF+5qOAUNoTisRBNrwHeQAA2D7hAbLQL+qOoBDYMEvA0RRm3cg4bQIYxBO4iNnFgOdfAoJBntMAaHoSF0D7WtbwOmJGIHBuFtFHJxhx8HdeEEnoI4KIS3MQg7kAg1rI8w9kMN2YQ/8RByQRwUxE844GPvj0B9iAu58BD+NPwdcp8wrkEDOoG3kR3iIC0exhAcgQZwHQvwOfJDXMiOt3ECGtA1EwH3oDLERgoUxisYhv24AzUoEWexCD+iJtJBklEF+yId8A7aQywyoCK+xCJcRSI0TO5iL7qjDXIjBcTiIdwNGnAetmKjR8fQHdYL93tYiSRolDiJzqgLseiOYz62fyvmCcOUJ3EAGuV6oUi0rVD9BBpDtqJstARsj3hojFmBdNEQcDw0Rn0V6YAVcBIao2YjXSQDtoDGsDOoFMmAD0FjXLMHAYN5KJIBW+FBwADq4x40hrWLZMCKOIhEXIsxd3EdDSF+3QeCfPkMAgchOAAAAABJRU5ErkJggg==) no-repeat left center<br /> }<br /> /**/<br /> <br /> /* Multimedia viewer */<br /> .mw-mmv-post-image,<br /> .mw-mmv-image-metadata {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-mmv-ttf-container .mw-mmv-ttf-ellipsis {<br /> box-shadow: -4px 6px 0 0 var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-mmv-title-para .mw-mmv-ttf-ellipsis {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-mmv-title-para .mw-mmv-ttf-ellipsis::before {<br /> background-image: linear-gradient(to right, transparent 0%, var(--wiki-content-background-color) 100%);<br /> }<br /> <br /> .mw-mmv-ttf-ellipsis-container:hover .mw-mmv-ttf-container .mw-mmv-ttf-ellipsis {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .mw-mmv-ttf-container .mw-mmv-ttf-ellipsis:hover, .mw-mmv-ttf-ellipsis-container .mw-mmv-ttf-container .mw-mmv-ttf-ellipsis:hover {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> background-color: color-mix(in srgb, var(--wiki-content-background-color--secondary) 95%, var(--wiki-content-dynamic-color));<br /> }<br /> <br /> .mw-ui-button.mw-ui-progressive:not(:disabled) {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .mw-ui-button.mw-ui-progressive:not(:disabled):hover {<br /> background-color: var(--wiki-accent-color--hover);<br /> }<br /> <br /> .skin-vector .mw-ui-button.mw-ui-progressive:hover,<br /> .skin-vector .mw-ui-button.mw-ui-primary:disabled {<br /> box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.75) inset, 0 0 5px var(--wiki-content-border-color);<br /> border: 2px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-ui-button.mw-ui-progressive:not(:disabled):active,<br /> .mw-ui-button.mw-ui-progressive:not(:disabled).is-on {<br /> background-color: var(--wiki-accent-color);<br /> border-color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-ui-button.mw-ui-progressive {<br /> box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.75) inset, 0 0 5px var(--wiki-content-border-color)<br /> }<br /> <br /> /* possibly deprecated */<br /> .mw-ui-input:not(:disabled) {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-ui-input:not(:disabled):hover,<br /> .mw-ui-input:not(:disabled):focus {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-color);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: none;<br /> }<br /> <br /> .mw-ui-input::placeholder {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> /* end possibly deprecated */<br /> <br /> <br /> <br /> .mw-mmv-dialog {<br /> background-color: var(--wiki-content-background-color);<br /> box-shadow: 0 2px 2px 0 var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-mmv-dialog .mw-mmv-dialog-down-arrow {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-mmv-options-dialog-header {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-mmv-options-text-header,<br /> .mw-mmv-options-text-body {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-mmv-dialog .mw-mmv-dialog-warning {<br /> color: #000;<br /> }<br /> <br /> .mw-mmv-dialog .mw-mmv-dialog-warning a {<br /> color: #0645ad;<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-area .mw-mmv-download-select-menu {<br /> background-image: none;<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-area .mw-mmv-download-select-menu span {<br /> display: none;<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-area .mw-mmv-download-select-menu::after {<br /> display:inline-block;<br /> width:8px;<br /> height:100%;<br /> content:'';<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E %3Cpath fill=%22%23000%22 fill-rule=%22evenodd%22 d=%22m2.023 3 3.49 5.953L9 3z%22 clip-rule=%22evenodd%22/%3E %3C/svg%3E&quot;) no-repeat;<br /> --mask-size: 12px;<br /> --mask-position: center;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: var(--mask-size);<br /> mask-size: var(--mask-size);<br /> -webkit-mask-position: var(--mask-position);<br /> mask-position: var(--mask-position);<br /> background-color: currentColor;<br /> }<br /> <br /> .mw-mmv-embed-dimensions {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 76%, transparent);<br /> }<br /> <br /> .oo-ui-optionWidget-selected .mw-mmv-embed-dimensions {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 82%, transparent);<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-attribution {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-attribution:hover {<br /> background-color: var(--wiki-content-dynamic-color--inverted);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-mmv-download-pane .mw-mmv-download-area .mw-mmv-download-preview-link,<br /> .mw-mmv-download-pane .mw-mmv-download-attribution-cta-invite {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .mw-ui-button.mw-ui-quiet,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-progressive,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-destructive {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .mw-ui-button.mw-ui-progressive:not(:disabled):focus {<br /> box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 1), inset 0 0 0 2px var(--wiki-accent-color);<br /> }<br /> <br /> input[type=&quot;checkbox&quot;]:active+.mw-ui-button.mw-ui-quiet,<br /> input[type=&quot;checkbox&quot;]:active+.mw-ui-button.mw-ui-quiet.mw-ui-progressive,<br /> input[type=&quot;checkbox&quot;]:active+.mw-ui-button.mw-ui-quiet.mw-ui-destructive,<br /> .mw-ui-button.mw-ui-quiet:active,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-progressive:active,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-destructive:active,<br /> input[type=&quot;checkbox&quot;]:focus+.mw-ui-button.mw-ui-quiet,<br /> input[type=&quot;checkbox&quot;]:focus+.mw-ui-button.mw-ui-quiet.mw-ui-progressive,<br /> input[type=&quot;checkbox&quot;]:focus+.mw-ui-button.mw-ui-quiet.mw-ui-destructive,<br /> .mw-ui-button.mw-ui-quiet:focus,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-progressive:focus,<br /> .mw-ui-button.mw-ui-quiet.mw-ui-destructive:focus {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> /**/<br /> <br /> /* Echo */<br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-optionWidget-selected &gt; .oo-ui-buttonElement-button:hover {<br /> color: var(--wiki-accent-label-color);<br /> }<br /> <br /> .oo-ui-buttonElement-framed.oo-ui-widget-enabled &gt; .oo-ui-buttonElement-button:hover {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> @-webkit-keyframes unseen-fadeout-to-unread {<br /> from {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> }<br /> to {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> @keyframes unseen-fadeout-to-unread {<br /> from {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> }<br /> to {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> @-webkit-keyframes unseen-fadeout-to-read {<br /> from {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> }<br /> to {<br /> background-color:var(--wiki-content-background-color);<br /> }<br /> }<br /> @keyframes unseen-fadeout-to-read {<br /> from {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> }<br /> to {<br /> background-color:var(--wiki-content-background-color);<br /> }<br /> }<br /> <br /> .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {<br /> border-bottom-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {<br /> border-bottom-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .client-js .mw-echo-special-nojs {<br /> filter:var(--wiki-icon-general-filter)<br /> }<br /> /**/<br /> <br /> /*************************<br /> * End Vector theme fixes *<br /> **************************/<br /> <br /> /************************<br /> * Theme-based Scribunto *<br /> *************************/<br /> #mw-scribunto-input {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-border-color);<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-scribunto-console-fieldset,<br /> .mw-scribunto-message,<br /> .mw-scribunto-input,<br /> .mw-scribunto-error,<br /> .mw-scribunto-print,<br /> .mw-scribunto-normalOutput {<br /> background: transparent;<br /> }<br /> <br /> .mw-scribunto-console-fieldset {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-scribunto-message {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-scribunto-input {<br /> color: var(--wiki-content-text-color--hover);<br /> }<br /> <br /> .mw-scribunto-error {<br /> color: var(--wiki-alert-color);<br /> }<br /> <br /> .mw-scribunto-print {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> .mw-scribunto-normalOutput {<br /> color: var(--wiki-content-text-color);<br /> }<br /> <br /> /****************<br /> * End Scribunto *<br /> *****************/<br /> <br /> /***************************<br /> * Theme-based VisualEditor *<br /> ****************************/<br /> .ve-activated .vector-menu-tabs .selected {<br /> box-shadow:inset 0 -1px 0 var(--wiki-content-border-color); /* fallback */<br /> box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> }<br /> <br /> .ve-init-mw-progressBarWidget {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-accent-color);<br /> box-shadow:0 1px 1px var(--wiki-content-dynamic-color); /* fallback */<br /> box-shadow: 0 1px 1px color-mix(in srgb, var(--wiki-content-dynamic-color) 15%, transparent);<br /> }<br /> <br /> .ve-init-mw-progressBarWidget-bar {<br /> background-color:var(--wiki-accent-color);<br /> }<br /> <br /> .ve-init-mw-desktopArticleTarget-toolbarPlaceholder-bar {<br /> border-bottom-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-init-mw-desktopArticleTarget-toolbarPlaceholder-floating .ve-init-mw-desktopArticleTarget-toolbarPlaceholder-bar {<br /> top: var(--wikigg-header-height, 0);<br /> background: var(--wiki-content-background-color);<br /> }<br /> <br /> div.ve-ce-branchNode {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ce-focusableNode-highlight {<br /> background: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .ve-ce-surface-highlights-focused .ve-ce-focusableNode-highlights {<br /> opacity: 0.25;<br /> }<br /> <br /> .ve-ce-branchNode-blockSlug, .ve-ce-branchNode-newSlug:not(.ve-ce-branchNode-newSlug-open) {<br /> outline-color: var(--wiki-accent-color);<br /> background-color:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 75%, transparent);<br /> }<br /> <br /> figure[typeof~='mw:File/Thumb'],<br /> figure[typeof~='mw:File/Frame'],<br /> figure[typeof~='mw:Image/Thumb'],<br /> figure[typeof~='mw:Video/Thumb'],<br /> figure[typeof~='mw:Audio/Thumb'],<br /> figure[typeof~='mw:Image/Frame'],<br /> figure[typeof~='mw:Video/Frame'],<br /> figure[typeof~='mw:Audio/Frame'] {<br /> border-color: var(--wiki-content-border-color);<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> figure[typeof~='mw:File/Thumb'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:File/Frame'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Image/Thumb'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Video/Thumb'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Audio/Thumb'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Image/Frame'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Video/Frame'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Audio/Frame'] &gt; a:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:File/Thumb'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:File/Frame'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Image/Thumb'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Video/Thumb'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Audio/Thumb'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Image/Frame'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Video/Frame'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media),<br /> figure[typeof~='mw:Audio/Frame'] &gt; span:first-child &gt; *:first-child:not(.mw-broken-media) {<br /> border-color: var(--wiki-content-border-color);<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> figure[typeof~='mw:File/Thumb'] &gt; figcaption,<br /> figure[typeof~='mw:File/Frame'] &gt; figcaption,<br /> figure[typeof~='mw:Image/Thumb'] &gt; figcaption,<br /> figure[typeof~='mw:Video/Thumb'] &gt; figcaption,<br /> figure[typeof~='mw:Audio/Thumb'] &gt; figcaption,<br /> figure[typeof~='mw:Image/Frame'] &gt; figcaption,<br /> figure[typeof~='mw:Video/Frame'] &gt; figcaption,<br /> figure[typeof~='mw:Audio/Frame'] &gt; figcaption {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-specialCharacterPage-character,<br /> .oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above,<br /> .oo-ui-bookletLayout &gt; .oo-ui-menuLayout-menu,<br /> .ve-ui-mwTwoPaneTransclusionDialogLayout &gt; .oo-ui-menuLayout-menu,<br /> .ve-ui-specialCharacterPage-character:hover {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-specialCharacterPage-character:hover {<br /> box-shadow:inset 0 0 1px 1px var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title,<br /> .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary &gt; .oo-ui-tool-link .oo-ui-tool-title,<br /> .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary &gt; .oo-ui-tool-link .oo-ui-tool-title {<br /> color:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 78%, transparent);<br /> }<br /> <br /> .ve-activated .ve-init-mw-desktopArticleTarget-originalContent #catlinks:hover {<br /> background: var(--wiki-content-background-color--secondary); /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-link-color) 10%, transparent);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {<br /> color: var(--wiki-accent-color);<br /> box-shadow: inset 0 -2px 0 0 var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-tabOptionWidget {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:not(.oo-ui-optionWidget-selected):hover {<br /> color: var(--wiki-accent-color--hover);<br /> box-shadow: inset 0 -2px 0 0 var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:not(.oo-ui-optionWidget-selected):active {<br /> color: var(--wiki-content-text-color);<br /> box-shadow: inset 0 -2px 0 0 var(--wiki-accent-color--hover);<br /> }<br /> <br /> .oo-ui-tabSelectWidget-frameless {<br /> box-shadow: inset 0 -1px 0 0 var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {<br /> border-color: var(--wiki-alert-color);<br /> }<br /> <br /> .ve-ce-linkAnnotation.ve-ce-annotation-active {<br /> box-shadow:0 0 0 1px var(--wiki-content-background-color--secondary); /* fallback */<br /> box-shadow: 0 0 0 1px color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 10%, transparent);<br /> }<br /> <br /> .ve-ui-mwInternalLinkContextItem-withImage &gt; .oo-ui-iconElement.oo-ui-iconElement-icon {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> background-color: color-mix(in srgb, var(--wiki-content-text-mix-color-95) 90%, var(--wiki-content-dynamic-color));<br /> border-color: var(--wiki-content-text-mix-color-95);<br /> border-color: color-mix(in srgb, var(--wiki-content-text-mix-color-95) 90%, var(--wiki-content-dynamic-color));<br /> filter: unset;<br /> }<br /> <br /> .mw-widget-titleWidget-menu-withImages .mw-widget-titleOptionWidget.oo-ui-iconElement &gt; .oo-ui-iconElement-icon.mw-widget-titleOptionWidget-hasImage {<br /> filter: unset;<br /> }<br /> <br /> .mw-widget-titleWidget-menu-withImages .mw-widget-titleOptionWidget.oo-ui-iconElement &gt; .oo-ui-iconElement-icon:not(.mw-widget-titleOptionWidget-hasImage) {<br /> background-color: var(--wiki-content-text-mix-color-95); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-text-mix-color-95) 90%, var(--wiki-content-dynamic-color));<br /> filter: unset;<br /> }<br /> <br /> .ve-ui-desktopContext .ve-ui-linkContextItem .ve-ui-linkContextItem-label .ve-ui-linkContextItem-label-preview {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-toolbarDialog {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 5%, transparent);<br /> }<br /> <br /> .ve-ce-languageAnnotation {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 20%, transparent);<br /> border-color: var(--wiki-content-link-color);<br /> }<br /> <br /> .mw-widget-mediaResultWidget-overlay {<br /> box-shadow: inset 0 0 0 1px var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) &gt; .oo-ui-buttonElement-button {<br /> background-color: transparent;<br /> border-right-color: var(--wiki-accent-color); /* fallback */<br /> border-right-color: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-selectFileWidget-dropTarget {<br /> background-color: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget:hover {<br /> border-color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop.oo-ui-selectFileWidget-dropTarget,<br /> .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileInputWidget-info &gt; .oo-ui-inputWidget-input {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .oo-ui-selectFileWidget.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,<br /> .oo-ui-selectFileWidget.oo-ui-selectFileInputWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget {<br /> background-color: var(--wiki-content-text-mix-color-95);<br /> border-color: var(--wiki-content-dynamic-color--secondary);<br /> }<br /> <br /> .mw-upload-bookletLayout-filePreview {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ve-ui-mwMediaDialog-panel-imageinfo-details {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input {<br /> -webkit-text-fill-color:var(--wiki-content-text-color); /* fallback */<br /> -webkit-text-fill-color: color-mix(in srgb, var(--wiki-content-text-color) 50%, transparent);<br /> }<br /> <br /> .oo-ui-optionWidget.oo-ui-widget-disabled {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwLanguagesPage-languages-table th,<br /> .ve-ui-mwLanguagesPage-languages-table td {<br /> border-bottom-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-mwLanguagesPage-languages-table tr:nth-child(even) td {<br /> background: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-mwLanguagesPage-languages-table tr:nth-child(odd) td {<br /> background: transparent; /* fallback */<br /> background: color-mix(in srgb, var(--wiki-content-dynamic-color--secondary) 5%, transparent);<br /> }<br /> <br /> .ve-ui-targetWidget {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) {<br /> background: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-targetWidget-focused {<br /> border-color: var(--wiki-accent-color);<br /> box-shadow: inset 0 0 0 1px var(--wiki-accent-color);<br /> }<br /> <br /> .ve-ui-mwTransclusionOutlineTemplateWidget-sticky {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.oo-ui-optionWidget-highlighted {<br /> color: var(--wiki-content-dynamic-color);<br /> }<br /> <br /> .ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage,<br /> .ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage:hover,<br /> .ve-ui-mwTransclusionOutlineTemplateWidget .ve-ui-mwTransclusionOutlineParameterWidget.ve-ui-mwTransclusionOutlineParameterWidget-activePage.oo-ui-optionWidget-highlighted {<br /> color: var(--wiki-accent-color);<br /> }<br /> <br /> .ve-ui-mwTransclusionOutlineTemplateWidget-no-template-parameters {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwTemplatePage-description {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwParameterPage-doc-required,<br /> .ve-ui-mwParameterPage-doc-deprecated,<br /> .ve-ui-mwParameterPage-inlineDescription .ve-ui-mwParameterPage-doc-example {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-expandableContent-fade {<br /> background: linear-gradient(to right, transparent 0, var(--wiki-content-background-color) 90%);<br /> }<br /> <br /> .ve-ui-expandableContent-toggle {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-mwParameterPage-undocumentedLabel {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-fieldLayout-disabled &gt; .oo-ui-fieldLayout-body &gt; .oo-ui-fieldLayout-header &gt; .oo-ui-labelElement-label {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwLatexDialog-content .oo-ui-bookletLayout-stackLayout h3 {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwLatexPage-symbol {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-mwGalleryDialog-highlighted-image {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ve-ui-mwHelpListToolGroup-tools-footer {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-mwHelpListToolGroup-version-link,<br /> .ve-ui-mwHelpListToolGroup-version-date,<br /> .ve-ui-mwHelpPopupTool-version-label,<br /> .ve-ui-mwHelpPopupTool-version-link,<br /> .ve-ui-mwHelpPopupTool-version-date {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-mwSaveDialog-summary {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-mwSaveDialog-options {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-mwSaveDialog-license {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) &gt; .oo-ui-buttonElement-button:hover,<br /> .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) &gt; .oo-ui-buttonElement-button:active {<br /> border-right-color: var(--wiki-accent-color);<br /> border-left-color: var(--wiki-accent-color);<br /> }<br /> <br /> .ve-ui-debugBar {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-debugBar-commands-divider {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-debugBar-dump &gt; table {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-debugBar-dump td {<br /> background-color: var(--wiki-content-background-color);<br /> }<br /> <br /> .ve-ui-debugBar-dump th {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 80%, transparent);<br /> text-shadow: 0 1px 1px var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .ve-ui-debugBar-dump ol {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 60%, transparent);<br /> }<br /> <br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-element,<br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-char,<br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-achar {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> color: var(--wiki-content-dynamic-color);<br /> text-shadow: 0 1px 1px var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-element {<br /> background-color:var(--wiki-accent-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> }<br /> <br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-char {<br /> background-color:var(--wiki-success-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-success-color) 20%, transparent);<br /> }<br /> <br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-achar {<br /> background-color:var(--wiki-warning-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-warning-color) 20%, transparent);<br /> }<br /> <br /> .ve-ui-debugBar-dump li .ve-ui-debugBar-dump-note {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .ve-ui-debugBar-filibuster {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .ve-ui-debugBar-transactions &gt; ol &gt; li {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> /*******************<br /> * End VisualEditor *<br /> ********************/<br /> <br /> /**************************<br /> * Theme-based AbuseFilter *<br /> ***************************/<br /> table.mw-abuselog-details {<br /> background: var(--wiki-content-background-color);<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> table.mw-abuselog-details th,<br /> table.mw-abuselog-details td,<br /> div.mw-abusefilter-editor {<br /> border-color: var(--wiki-content-border-color);<br /> }<br /> <br /> table.mw-abuselog-details th {<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> body td.mw-abusefilter-history-changed {<br /> background-color:var(--wiki-alert-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-alert-color) 20%, transparent);<br /> }<br /> /******************<br /> * End AbuseFilter *<br /> *******************/<br /> <br /> /************************************<br /> * Theme-based Special:MultiPageEdit *<br /> *************************************/<br /> :root {<br /> --jexcel-border-color:var(--wiki-content-border-color); /* this is defined by the extension but does not seem to be used anywhere. We override it just in case *shrug* */<br /> }<br /> <br /> .jexcel,<br /> .jexcel_container.fullscreen .jexcel_content{<br /> background-color:var(--wiki-content-background-color);<br /> border-bottom-color:var(--wiki-content-border-color);<br /> border-right-color:var(--wiki-content-border-color);<br /> }<br /> <br /> table.jexcel &gt; tbody &gt; tr &gt; td:first-child,<br /> table.jexcel &gt; thead,<br /> table.jexcel &gt; thead &gt; tr &gt; td,<br /> table.jexcel &gt; tbody &gt; tr.selected &gt; td:first-child,<br /> table.jexcel &gt; thead &gt; tr &gt; td.selected {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> table.jexcel &gt; tbody &gt; tr.selected &gt; td:first-child,<br /> table.jexcel &gt; thead &gt; tr &gt; td.selected {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-accent-color) 10%, transparent);<br /> }<br /> <br /> table.jexcel &gt; thead &gt; tr &gt; td{<br /> border-bottom-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-up,<br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-down {<br /> background:none;<br /> }<br /> <br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-up::after,<br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-down::after {<br /> display:inline-block;<br /> position:absolute;<br /> right:0;<br /> top:0;<br /> background-repeat:no-repeat;<br /> background-position:center right 5px;<br /> width:22px;<br /> height:100%;<br /> content:'';<br /> filter:brightness(50%) var(--wiki-icon-general-filter);<br /> }<br /> <br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-up::after {<br /> background-image:url(&quot;data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' d='M0 0h24v24H0V0z'/%3E%3Cpath d='M7 14l5-5 5 5H7z' fill='gray'/%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> .jexcel &gt; thead &gt; tr &gt; td.arrow-down::after {<br /> background-image:url(&quot;data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' d='M0 0h24v24H0V0z'/%3E%3Cpath d='M7 10l5 5 5-5H7z' fill='gray'/%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> .jexcel &gt; thead &gt; tr:nth-child(2) &gt; td {<br /> z-index:1; /* prevents overlapping the headings after scrolling on tall tables */<br /> }<br /> <br /> .jexcel &gt; tbody &gt; tr &gt; td {<br /> border-top-color:var(--wiki-content-text-mix-color-95);<br /> border-bottom-color:var(--wiki-content-text-mix-color-95);<br /> }<br /> <br /> .jexcel &gt; tbody &gt; tr &gt; td.readonly {<br /> color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .jexcel_content {<br /> scrollbar-color:var(--wiki-content-text-mix-color) transparent;<br /> /* we need this important to override inline styling */<br /> box-shadow:var(--wiki-content-dynamic-color--secondary--inverted) 2px 2px 5px 0.1px !important;<br /> }<br /> <br /> .jexcel .highlight {<br /> background-color: transparent; /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 5%, transparent);<br /> }<br /> <br /> .jexcel .highlight-top {<br /> border-top-color:var(--wiki-content-text-mix-color);<br /> box-shadow:0px -1px var(--wiki-content-dynamic-color--secondary--inverted);<br /> }<br /> <br /> .jexcel .highlight-left {<br /> border-left-color:var(--wiki-content-text-mix-color);<br /> box-shadow:-1px 0px var(--wiki-content-dynamic-color--secondary--inverted);<br /> }<br /> <br /> .jexcel .highlight-top.highlight-left {<br /> box-shadow:-1px -1px var(--wiki-content-dynamic-color--secondary--inverted);<br /> }<br /> <br /> .jexcel .highlight-right {<br /> border-right-color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .jexcel .highlight-bottom {<br /> border-bottom-color:var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .jexcel .jexcel_column_filter {<br /> background:none;<br /> }<br /> <br /> .jexcel .jexcel_column_filter::after {<br /> display:inline-block;<br /> position:absolute;<br /> right:0;<br /> top:0;<br /> background-repeat:no-repeat;<br /> background-position:top 50% right 5px;<br /> background-image:url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='gray' width='18px' height='18px'%3E%3Cpath d='M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E&quot;);<br /> width:20px;<br /> height:100%;<br /> content:'';<br /> filter:brightness(50%) var(--wiki-icon-general-filter);<br /> }<br /> <br /> .jexcel_pagination &gt; div &gt; div {<br /> background-color:var(--wiki-accent-color);<br /> /* we need this important to override a built-in one */<br /> color:var(--wiki-accent-label-color) !important;<br /> }<br /> <br /> .jexcel_page_selected {<br /> background:linear-gradient(to bottom,var(--wiki-accent-color) 0%,var(--wiki-accent-color--hover) 100%);<br /> /* we need this important to override a built-in one */<br /> border:1px solid var(--wiki-content-border-color) !important;<br /> }<br /> <br /> /****************************<br /> * End Special:MultiPageEdit *<br /> *****************************/<br /> <br /> /***********************<br /> * Theme-based msupload *<br /> ************************/<br /> #msupload-div,<br /> #msupload-list .file {<br /> background-color:var(--wiki-content-background-color);<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> #msupload-select {<br /> filter:brightness(0) var(--wiki-icon-to-link-filter);<br /> }<br /> <br /> #msupload-dropzone {<br /> border-color:var(--wiki-content-border-color);<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .drop-over {<br /> background-color:var(--wiki-accent-color);<br /> color:var(--wiki-accent-label-color) !important;<br /> }<br /> <br /> #msupload-bottom {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> #msupload-bottom #msupload-files {<br /> padding-left:0;<br /> background: none;<br /> }<br /> <br /> #msupload-bottom #msupload-files::before {<br /> display:inline-block;<br /> background: url(/extensions/MsUpload/resources/images/msu-upload-icon.png?bdd61) no-repeat 0 0;<br /> background-position:left center;<br /> height:22px;<br /> width:25px;<br /> content:'';<br /> vertical-align: top;<br /> filter:var(--wiki-icon-general-filter);<br /> }<br /> <br /> #msupload-list .file .file-size {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> #msupload-div a {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> #msupload-list .file .file-name:hover {<br /> background-color: var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> #msupload-list .file .file-name-input {<br /> background: var(--wiki-content-dynamic-color--inverted);<br /> }<br /> <br /> #msupload-list .file .file-warning {<br /> color: var(--wiki-warning-color);<br /> }<br /> /***************************<br /> * End theme-based msupload *<br /> ****************************/<br /> <br /> /*****************************<br /> * Theme-based commentstreams *<br /> ******************************/<br /> .cs-title-edit-field {<br /> border-color:var(--wiki-accent-color);<br /> }<br /> <br /> .cs-title-edit-field::placeholder,<br /> .view-dark .cs-body-edit-field::placeholder {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .cs-edit-box ,<br /> .cs-expanded .cs-comment-header {<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .cs-target-comment .cs-comment-header {<br /> border-color:var(--wiki-accent-color);<br /> }<br /> <br /> .cs-comment-author a {<br /> color: var(--wiki-content-link-color);<br /> }<br /> <br /> .cs-comment-details {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 95%, transparent);<br /> }<br /> <br /> .cs-comment {<br /> border:1px solid var(--wiki-content-border-color);<br /> }<br /> <br /> .cs-comment-body {<br /> padding:0 5px;<br /> }<br /> /*********************************<br /> * End theme-based commentstreams *<br /> **********************************/<br /> <br /> /************************<br /> * Theme-based checkuser *<br /> *************************/<br /> .mw-datatable.ext-checkuser-investigate-table tr:hover td {<br /> background-color:var(--wiki-content-background-color);<br /> }<br /> <br /> .mw-datatable.ext-checkuser-investigate-table th {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned td,<br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned-data-match td,<br /> .ext-checkuser-investigate-table.mw-datatable:not(.ext-checkuser-investigate-table-pinned) .ext-checkuser-investigate-table-row-hover-data-match td,<br /> .ext-checkuser-investigate-table.mw-datatable:not(.ext-checkuser-investigate-table-pinned) tr:hover td{<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-warning-color) 10%, transparent);<br /> }<br /> <br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned td.ext-checkuser-investigate-table-cell-pinned,<br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned-data-match td.ext-checkuser-investigate-table-cell-pinned,<br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned td.ext-checkuser-investigate-table-cell-pinned-data-match,<br /> .ext-checkuser-investigate-table.mw-datatable.ext-checkuser-investigate-table-pinned .ext-checkuser-investigate-table-row-pinned-data-match td.ext-checkuser-investigate-table-cell-pinned-data-match,<br /> .ext-checkuser-investigate-table.mw-datatable:not(.ext-checkuser-investigate-table-pinned) tr td.ext-checkuser-investigate-table-cell-hover-data-match,<br /> .ext-checkuser-investigate-table.mw-datatable:not(.ext-checkuser-investigate-table-pinned) tr td:hover.ext-checkuser-investigate-table-cell-pinnable {<br /> background-color: var(--wiki-content-background-color--secondary); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-warning-color) 40%, transparent);<br /> }<br /> <br /> .ext-checkuser-investigate-copy-message.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .mw-special-Investigate .ext-checkuser-investigate-subtitle-fieldset {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> /****************<br /> * End checkuser *<br /> *****************/<br /> <br /> /***************************<br /> * Theme-based SearchDigest *<br /> ****************************/<br /> .searchdigest-stats-table {<br /> border-color: var(--wiki-content-border-color);<br /> border-collapse: collapse;<br /> }<br /> <br /> .searchdigest-stats-table thead th,<br /> .searchdigest-stats-table tr:not(:last-child) th,<br /> .searchdigest-stats-table tr:not(:last-child) td {<br /> border-bottom-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .searchdigest-stats-table thead th:last-child,<br /> .searchdigest-stats-table td {<br /> border-left-color: var(--wiki-content-border-color);<br /> }<br /> <br /> .searchdigest-stats-table thead tr {<br /> background: var(--wiki-content-background-color--secondary);<br /> }<br /> /*******************<br /> * End SearchDigest *<br /> ********************/<br /> <br /> /****************************<br /> * Extension:RelatedArticles *<br /> *****************************/<br /> .client-js .read-more-container {<br /> min-height:unset;<br /> }<br /> <br /> @media (min-width: 1000px) {<br /> .client-js .read-more-container {<br /> min-height:calc(<br /> 80px /*card height*/<br /> + 10px /*card margin*/<br /> + 1em /*container padding*/<br /> + 0.3em /*card-list margin*/<br /> + 0.8em /*h2 font-size*/<br /> + 1em /*h2 padding*/<br /> + 0.6em /*h2 margin*/<br /> + 1px /*container border*/<br /> );<br /> }<br /> }<br /> <br /> .ext-related-articles-card-list .ext-related-articles-card {<br /> background-color:var(--wiki-content-background-color);<br /> }<br /> <br /> .ext-related-articles-card-list .ext-related-articles-card,<br /> .ext-related-articles-card-list .ext-related-articles-card + .ext-related-articles-card { /* your guess is as good as mine for why they did this */<br /> border-color:var(--wiki-content-border-color); /* fallback */<br /> border-color: color-mix(in srgb, var(--wiki-content-border-color) 20%, transparent);<br /> }<br /> <br /> .ext-related-articles-card-list .ext-related-articles-card-thumb {<br /> background-color:var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> .ra-read-more h2 {<br /> color:var(--wiki-body-dynamic-color--secondary);<br /> }<br /> <br /> .ext-related-articles-card-list h3 a {<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> .ext-related-articles-card-list h3::after {<br /> background-image: linear-gradient(to right,transparent,var(--wiki-content-background-color) 50%);<br /> }<br /> <br /> .ext-related-articles-card-list .ext-related-articles-card-extract {<br /> color:var(--wiki-content-text-color); /* fallback */<br /> color: color-mix(in srgb, var(--wiki-content-text-color) 50%, transparent);<br /> }<br /> <br /> /* removed background image and use a mask image instead */<br /> .ext-related-articles-card-list .ext-related-articles-card-thumb-placeholder {<br /> position:relative;<br /> background-image:none;<br /> }<br /> <br /> .ext-related-articles-card-list .ext-related-articles-card-thumb-placeholder::after {<br /> position:absolute;<br /> width:100%;<br /> height:100%;<br /> top:0;<br /> left:0;<br /> content:'';<br /> --mask-image: url(&quot;/extensions/RelatedArticles/resources/ext.relatedArticles.readMore/article.svg?3c572&quot;);<br /> --mask-size: 40px;<br /> --mask-repeat: no-repeat;<br /> --mask-position: center;<br /> -webkit-mask: var(--mask-image);<br /> mask: var(--mask-image);<br /> -webkit-mask-size: var(--mask-size);<br /> mask-size: var(--mask-size);<br /> -webkit-mask-repeat: var(--mask-repeat);<br /> mask-repeat: var(--mask-repeat);<br /> -webkit-mask-position: var(--mask-position);<br /> mask-position: var(--mask-position);<br /> background-color:var(--wiki-content-text-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-text-color) 75%, transparent);<br /> }<br /> /**/<br /> <br /> /* this simulates mw-footer having a top border */<br /> .read-more-container {<br /> border-bottom: var(--wiki-content-border-width, 1px) solid var(--wiki-content-border-color);<br /> }<br /> <br /> @media screen and (min-width: 720px) {<br /> .read-more-container {<br /> margin-right:1em;<br /> }<br /> }<br /> <br /> /********************************<br /> * End Extension:RelatedArticles *<br /> *********************************/<br /> <br /> /*******************<br /> * Extension:Popups *<br /> ********************/<br /> .mwe-popups {<br /> box-shadow:0 30px 90px -20px rgba(0,0,0,0.3),0 0 1px 1px transparent; /* fallback */<br /> box-shadow: 0 30px 90px -20px rgba(0,0,0,0.3),0 0 1px 1px color-mix(in srgb, var(--wiki-content-border-color) 5%, transparent);<br /> }<br /> <br /> .mwe-popups,<br /> .mwe-popups .mwe-popups-container {<br /> background-color:var(--wiki-content-background-color);<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .mwe-popups .mwe-popups-extract {<br /> color:var(--wiki-content-text-color);<br /> }<br /> <br /> .mwe-popups .mwe-popups-extract[dir=&quot;ltr&quot;]::after {<br /> background-image: linear-gradient(to right,transparent,var(--wiki-content-background-color) 50%);<br /> }<br /> <br /> .mwe-popups.flipped-y::before,<br /> .mwe-popups.flipped-x-y::before,<br /> .mwe-popups.mwe-popups-image-pointer::before,<br /> .mwe-popups.mwe-popups-image-pointer.flipped-x::before,<br /> .mwe-popups.mwe-popups-no-image-pointer::before,<br /> .mwe-popups.flipped-x.mwe-popups-is-tall::before,<br /> .mwe-popups.flipped-x-y.mwe-popups-is-tall::before {<br /> border-color:var(--wiki-content-border-color);<br /> }<br /> <br /> .mwe-popups.flipped-y::after,<br /> .mwe-popups.flipped-x-y::after,<br /> .mwe-popups.mwe-popups-image-pointer::after,<br /> .mwe-popups.mwe-popups-image-pointer.flipped-x::after,<br /> .mwe-popups.mwe-popups-no-image-pointer::after,<br /> .mwe-popups.flipped-x-y.mwe-popups-is-tall::after {<br /> border-color:var(--wiki-content-background-color);<br /> }<br /> <br /> .popups-icon {<br /> position:relative;<br /> background-position: center;<br /> background-repeat: no-repeat;<br /> background-size: calc(max(1.4285714em,20px));<br /> min-width: 20px;<br /> min-height: 20px;<br /> width: 1.4285714em;<br /> height: 1.4285714em;<br /> display: inline-block;<br /> vertical-align: text-bottom;<br /> }<br /> <br /> .popups-icon--preview-generic,<br /> .popups-icon--settings,<br /> .popups-icon--infoFilled,<br /> .popups-icon--infoFilled:lang(ar),<br /> .popups-icon--close,<br /> .popups-icon--reference-generic,<br /> .popups-icon--reference-book,<br /> .popups-icon--preview-disambiguation {<br /> background-image:none;<br /> }<br /> <br /> .popups-icon::after {<br /> position:absolute;<br /> width:100%;<br /> height:100%;<br /> top:0;<br /> left:0;<br /> content:'';<br /> -webkit-mask-image:var(--mask-image, none);<br /> mask-image:var(--mask-image, none);<br /> -webkit-mask-repeat:var(--mask-repeat, no-repeat);<br /> mask-repeat:var(--mask-repeat, no-repeat);<br /> -webkit-mask-size:var(--mask-size, calc(max(1.4285714em,20px)));<br /> mask-size:var(--mask-size, calc(max(1.4285714em,20px)));<br /> -webkit-mask-position:var(--mask-position, center);<br /> mask-position:var(--mask-position, center);<br /> background-color:var(--mask-color, currentColor);<br /> background-color:var(--mask-color, currentColor);<br /> }<br /> <br /> .popups-icon--preview-generic::after {<br /> --mask-image: url(&quot;data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E %3Ctitle%3E sad face %3C/title%3E %3Cpath d=%22M2 0a2 2 0 0 0-2 2v18l4-4h14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm4 4c1.336 0 2.007 1.617 1.06 2.56-.943.947-2.56.276-2.56-1.06A1.5 1.5 0 0 1 6 4zm8 0c1.336 0 2.007 1.617 1.06 2.56-.943.947-2.56.276-2.56-1.06A1.5 1.5 0 0 1 14 4zm-4 5c2.61 0 4.83.67 5.65 3H4.35C5.17 9.67 7.39 9 10 9z%22/%3E %3C/svg%3E&quot;);<br /> }<br /> <br /> .popups-icon--settings::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;g transform=\&quot;translate(10 10)\&quot;&gt;&lt;path id=\&quot;cdx-icon-settings-a\&quot; d=\&quot;M1.5-10h-3l-1 6.5h5m0 7h-5l1 6.5h3\&quot;/&gt;&lt;use xlink:href=\&quot;%23cdx-icon-settings-a\&quot; transform=\&quot;rotate(45)\&quot;/&gt;&lt;use xlink:href=\&quot;%23cdx-icon-settings-a\&quot; transform=\&quot;rotate(90)\&quot;/&gt;&lt;use xlink:href=\&quot;%23cdx-icon-settings-a\&quot; transform=\&quot;rotate(135)\&quot;/&gt;&lt;/g&gt;&lt;path d=\&quot;M10 2.5a7.5 7.5 0 000 15 7.5 7.5 0 000-15v4a3.5 3.5 0 010 7 3.5 3.5 0 010-7\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--infoFilled::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10S15.523 0 10 0zM9 5h2v2H9zm0 4h2v6H9z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--infoFilled:lang(ar)::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M8 19a1 1 0 001 1h2a1 1 0 001-1v-1H8zm9-12a7 7 0 10-12 4.9S7 14 7 15v1a1 1 0 001 1h4a1 1 0 001-1v-1c0-1 2-3.1 2-3.1A7 7 0 0017 7z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--close::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;m4.34 2.93 12.73 12.73-1.41 1.41L2.93 4.35z\&quot;/&gt;&lt;path d=\&quot;M17.07 4.34 4.34 17.07l-1.41-1.41L15.66 2.93z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--reference-generic::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;m15 10-2.78-2.78L9.44 10V1H5a2 2 0 00-2 2v14a2 2 0 002 2h10a2 2 0 002-2V3a2 2 0 00-2-2z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--reference-book::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M15 2a7.65 7.65 0 00-5 2 7.65 7.65 0 00-5-2H1v15h4a7.65 7.65 0 015 2 7.65 7.65 0 015-2h4V2zm2.5 13.5H14a4.38 4.38 0 00-3 1V5s1-1.5 4-1.5h2.5z\&quot;/&gt;&lt;path d=\&quot;M9 3.5h2v1H9z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--reference-journal::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M2 18.5A1.5 1.5 0 003.5 20H5V0H3.5A1.5 1.5 0 002 1.5zM6 0v20h10a2 2 0 002-2V2a2 2 0 00-2-2zm7 8H8V7h5zm3-2H8V5h8z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--reference-news::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M5 2a2 2 0 00-2 2v12a1 1 0 01-1-1V5h-.5A1.5 1.5 0 000 6.5v10A1.5 1.5 0 001.5 18H18a2 2 0 002-2V4a2 2 0 00-2-2zm1 2h11v4H6zm0 6h6v1H6zm0 2h6v1H6zm0 2h6v1H6zm7-4h4v5h-4z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--reference-web::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M2 2a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V4a2 2 0 00-2-2zm2 1.5A1.5 1.5 0 112.5 5 1.5 1.5 0 014 3.5zM18 16H2V8h16z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> .popups-icon--preview-disambiguation::after {<br /> --mask-image: url(&quot;data:image/svg+xml;utf8,&lt;svg xmlns=\&quot;http://www.w3.org/2000/svg\&quot; xmlns:xlink=\&quot;http://www.w3.org/1999/xlink\&quot; width=\&quot;20\&quot; height=\&quot;20\&quot; viewBox=\&quot;0 0 20 20\&quot; fill=\&quot;%23202122\&quot;&gt;&lt;path d=\&quot;M7 0a2 2 0 00-2 2h9a2 2 0 012 2v12a2 2 0 002-2V2a2 2 0 00-2-2z\&quot;/&gt;&lt;path d=\&quot;M13 20a2 2 0 002-2V5a2 2 0 00-2-2H4a2 2 0 00-2 2v13a2 2 0 002 2zM9 5h4v5H9zM4 5h4v1H4zm0 2h4v1H4zm0 2h4v1H4zm0 2h9v1H4zm0 2h9v1H4zm0 2h9v1H4z\&quot;/&gt;&lt;/svg&gt;&quot;);<br /> }<br /> <br /> /***********************<br /> * End Extension:Popups *<br /> ************************/<br /> <br /> /*********************<br /> * Mobile adjustments *<br /> **********************/<br /> /* Responsive Special:UserRights */<br /> #mw-userrights-table-outer input#wpReason {<br /> width:100%;<br /> max-width:33.5em;<br /> }<br /> <br /> @media screen and (max-width:720px) {<br /> :root {<br /> --wiki-content-right-margin: 0px;<br /> --wiki-content-padding:0.5rem;<br /> --wiki-navigation-right-margin: 1px;<br /> --wiki-navigation-left-margin: 0px;<br /> --wiki-navigation-top-padding: 5px;<br /> --wiki-navigation-bottom-padding:0px;<br /> --wiki-navigation-height:2rem;<br /> --wiki-navigation-search-height:2.15rem;<br /> --wiki-navigation-search-margin:0.5rem;<br /> --wiki-logo-height: 80px;<br /> --wiki-logo-width: 100%;<br /> --wiki-logo-margin: 10px;<br /> --wiki-head-height: calc(var(--wiki-logo-height) + (var(--wiki-logo-margin) * 2) + var(--wiki-navigation-height) + var(--wiki-navigation-top-padding) + var(--wiki-navigation-bottom-padding));<br /> --wiki-head-icon-padding: 0.25rem;<br /> --wiki-head-icon-size: calc(var(--wiki-navigation-height) - var(--wiki-head-icon-padding) * 2);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-menu-margin: 0.2rem;<br /> --wiki-menu-top-offset: calc(var(--wiki-head-height) + var( --wikigg-header-height ) + var(--wiki-navigation-bottom-padding) + var(--wiki-navigation-search-margin));<br /> --wiki-sidebar-portal-spacing:0px;<br /> }<br /> <br /> #mw-page-base,<br /> #mw-head-base {<br /> height:var(--wiki-head-height);<br /> }<br /> <br /> #mw-page-base {<br /> padding-top: var( --wikigg-header-height );<br /> }<br /> <br /> #mw-head-base {<br /> margin-top:calc(var(--wiki-head-height) * -1);<br /> }<br /> <br /> #p-logo,<br /> #p-logo a {<br /> height: var(--wiki-logo-height);<br /> width: var(--wiki-logo-width);<br /> }<br /> <br /> #p-logo {<br /> position:absolute;<br /> background:none;<br /> padding:0;<br /> left:0;<br /> margin:var(--wiki-logo-margin) 0;<br /> transform:none;<br /> top:calc(var(--wikigg-header-height));<br /> }<br /> <br /> .mw-wiki-logo {<br /> background-size:contain;<br /> }<br /> <br /> #mw-head {<br /> left:0;<br /> width:100%;<br /> top:calc(var(--wiki-head-height) + var( --wikigg-header-height ) - var(--wiki-navigation-height));<br /> border:none;<br /> border-image:none;<br /> }<br /> <br /> #mw-navigation {<br /> position:unset;<br /> }<br /> <br /> #left-navigation,<br /> #right-navigation {<br /> margin-top: 0;<br /> height:var(--wiki-navigation-height);<br /> }<br /> <br /> #right-navigation {<br /> margin-right: var(--wiki-navigation-right-margin);<br /> }<br /> <br /> div#left-navigation {<br /> margin-left: var(--wiki-navigation-left-margin);<br /> }<br /> <br /> div#right-navigation div#p-search {<br /> margin-right: 0;<br /> }<br /> <br /> .vector-menu-tabs-legacy,<br /> .vector-menu-dropdown {<br /> height:var(--wiki-navigation-height);<br /> }<br /> <br /> .vector-menu-tabs-legacy li a {<br /> height:var(--wiki-navigation-height);<br /> }<br /> <br /> #p-cactions {<br /> padding-bottom: 0px;<br /> }<br /> <br /> #p-search {<br /> position: absolute;<br /> left: 50%;<br /> transform:translateX(-50%);<br /> top: calc(var(--wiki-navigation-height) + var(--wiki-navigation-bottom-padding));<br /> margin-left:0px;<br /> z-index: 4 /** above #mw-panel **/;<br /> }<br /> <br /> #simpleSearch {<br /> width: calc(100vw - var(--wiki-navigation-right-margin) - var(--wiki-navigation-left-margin));<br /> }<br /> <br /> .vector-search-box-input {<br /> height:var(--wiki-navigation-search-height);<br /> }<br /> <br /> .vector-search-box form {<br /> margin:var(--wiki-navigation-search-margin) 0px;<br /> }<br /> <br /> .mw-body,<br /> .mw-footer {<br /> border-left-width: 0;<br /> border-right-width: 0;<br /> }<br /> <br /> .mw-body {<br /> margin-top: 0;<br /> padding-top:calc(var(--wiki-content-padding) + var(--wiki-navigation-search-height) + var(--wiki-navigation-bottom-padding) + (var(--wiki-navigation-search-margin) * 2));<br /> }<br /> <br /> #mw-data-after-content {<br /> margin-left:0;<br /> }<br /> <br /> #mw-panel {<br /> position: unset;<br /> width:100%;<br /> margin: 0px auto;<br /> padding: 0;<br /> top: 0;<br /> background-position:bottom right, top center;<br /> background-size:100% 0.5em, 100% 100%;<br /> float:unset;<br /> }<br /> <br /> .vector-menu-dropdown .vector-menu-content {<br /> right: 0;<br /> left: unset;<br /> }<br /> <br /> #mw-panel .vector-menu-portal {<br /> box-sizing:border-box;<br /> border-left-width:0;<br /> border-right-width:0;<br /> background-color: var(--wiki-sidebar-background-color);<br /> }<br /> <br /> table.wikitable,<br /> table.responsive-table {<br /> display: block;<br /> overflow-x: scroll;<br /> }<br /> <br /> .gallerybox,<br /> .gallerybox &gt; div,<br /> .gallerybox .thumb {<br /> max-width:100%;<br /> }<br /> <br /> /* disable float on RecentChanges legend */<br /> .mw-changeslist-legend {<br /> float: none;<br /> margin: 0 auto;<br /> }<br /> <br /> /* advanced search options */<br /> #mw-searchoptions table {<br /> float: none;<br /> }<br /> <br /> #mw-searchoptions table td {<br /> display: block;<br /> }<br /> <br /> /* popup when clicking the download button in multimediaviewer */<br /> .mw-mmv-dialog {<br /> width: unset;<br /> }<br /> <br /> /* turn math elements into scroll blocks unless they're an immediate child of a span */<br /> :not(span) &gt; math.mwe-math-element {<br /> overflow: auto hidden;<br /> max-width: 100%;<br /> }<br /> <br /> /* Expandable mobile navigation panel */<br /> body.has-vector-mobile-menu #mw-panel {<br /> position: absolute;<br /> top: var(--wiki-menu-top-offset);<br /> z-index: 3;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .mobile-nav-toggle {<br /> position: relative;<br /> z-index: 5;<br /> display: block;<br /> appearance: none;<br /> border: 1px solid var(--wiki-content-border-color);<br /> margin-left: var(--wiki-navigation-search-margin);<br /> margin-bottom: 2px;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .vector-menu-portal {<br /> display: none;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .mobile-nav-toggle.nav--expanded ~ .vector-menu-portal {<br /> display: block;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-navigation #mw-panel .vector-menu-portal {<br /> text-align: left;<br /> font-size: 110%;<br /> border-left-width: var(--wiki-sidebar-border-width, 1px);<br /> border-right-width: var(--wiki-sidebar-border-width, 1px);<br /> margin-inline: calc(var(--wiki-navigation-left-margin) + var(--wiki-menu-margin));<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-navigation #mw-panel .vector-menu-portal + .vector-menu-portal {<br /> border-top-width: 0;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-navigation #mw-panel .vector-menu-portal:not(:last-child) {<br /> border-bottom-width: 0;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .vector-menu-content-list {<br /> display: flex;<br /> flex-wrap: wrap;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .vector-menu-content-list a {<br /> display: block;<br /> padding: 0.2rem 0.5rem;<br /> border: 1px solid transparent;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel .vector-menu-content-list a:hover {<br /> border-color: var(--wiki-content-link-color);<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel a.feedlink {<br /> padding-left: 16px;<br /> }<br /> <br /> body.has-vector-mobile-menu #mw-panel #p-navigation-label {<br /> display: block;<br /> }<br /> <br /> body.has-vector-mobile-menu #p-logo {<br /> /* Logo's a part of the sidebar panel, which uses relative positioning for the expandable button. Offset the logo appropriately. */<br /> top: calc( -1 * var( --wiki-menu-top-offset ) + var( --wikigg-header-height ) );<br /> }<br /> <br /> .mobile-nav-toggle {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M1 3v2h18V3zm0 8h18V9H1zm0 6h18v-2H1z'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> body.has-vector-mobile-menu #p-tb .mw-list-item &gt; a {<br /> display: inline-flex;<br /> }<br /> <br /> body.has-vector-mobile-menu #p-tb .vector-menu-content-list {<br /> flex-direction: row;<br /> }<br /> <br /> /* Search adjustments for the expandable menu */<br /> body.has-vector-mobile-menu #p-search {<br /> /* reposition to the right when mobile sidebar menu is active */<br /> left: calc(var(--wiki-navigation-search-margin) * 3 + var(--wiki-head-icon-size) + var(--wiki-head-icon-padding));<br /> right: calc(var(--wiki-navigation-right-margin) + var(--wiki-navigation-search-margin));<br /> transform: none;<br /> }<br /> <br /> body.has-vector-mobile-menu #simpleSearch {<br /> width: 100%;<br /> margin: 0 auto;<br /> }<br /> <br /> /* icon navbar tabs + expandable nav panel icon */<br /> #mw-head {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #mw-head .vector-menu-tabs .mw-list-item a,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading,<br /> #mw-panel .mobile-nav-toggle {<br /> line-height:var(--wiki-head-icon-size);<br /> width: var(--wiki-head-icon-size); /* same as line height */<br /> height: var(--wiki-head-icon-size);<br /> box-sizing: content-box;<br /> padding: var(--wiki-head-icon-padding);<br /> color: transparent; /**&lt;&lt; for watch/unwatch, the text of &lt;a&gt; will be plain 'watch'/'unwatch' without &lt;span&gt; after clicking. **/<br /> }<br /> <br /> #mw-head .vector-menu-tabs .mw-list-item a::before,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading::before,<br /> #mw-panel .mobile-nav-toggle::before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: unset;<br /> background-image: none;<br /> width: var(--wiki-head-icon-size);<br /> height: var(--wiki-head-icon-size);<br /> margin: 0;<br /> --mask: var(--icon) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--wiki-navigation-text-color);<br /> }<br /> <br /> #mw-head .vector-menu-tabs .mw-list-item a:hover::before,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading:hover::before,<br /> #mw-panel .mobile-nav-toggle:hover::before,<br /> #mw-panel .mobile-nav-toggle.nav--expanded::before {<br /> background-color: var(--wiki-navigation-selected-text-color);<br /> }<br /> <br /> #mw-head .vector-menu-tabs .mw-list-item a span,<br /> #mw-head .vector-menu-dropdown .vector-menu-heading span {<br /> display: none;<br /> }<br /> <br /> #mw-head .vector-menu-dropdown .vector-menu-heading::after {<br /> display: none;<br /> }<br /> <br /> #ca-ve-edit,<br /> #ca-edit {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='m16.77 8 1.94-2a1 1 0 0 0 0-1.41l-3.34-3.3a1 1 0 0 0-1.41 0L12 3.23zM1 14.25V19h4.75l9.96-9.96-4.75-4.75z'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> #ca-ve-edit + #ca-edit {<br /> --icon: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20' height='20' viewBox='0 0 20 20' aria-hidden='true'%3E%3C!----%3E%3Cg%3E%3Cpath d='M1 3v14h3v-2H3V5h1V3zm4 0v14h4v-2H7V5h2V3zm11 0v2h1v10h-1v2h3V3zm-5 0v2h2v10h-2v2h4V3z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> #ca-view,<br /> #ca-view-foreign {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M10 14.5a4.5 4.5 0 1 1 4.5-4.5 4.5 4.5 0 0 1-4.5 4.5M10 3C3 3 0 10 0 10s3 7 10 7 10-7 10-7-3-7-10-7'/%3E%3Ccircle cx='10' cy='10' r='2.5'/%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> #left-navigation li[id^=ca-nstab-] {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E article %3C/title%3E%3Cpath d='M5 1a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm0 3h5v1H5zm0 2h5v1H5zm0 2h5v1H5zm10 7H5v-1h10zm0-2H5v-1h10zm0-2H5v-1h10zm0-2h-4V4h4z'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> #ca-history {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M9 6v5h.06l2.48 2.47 1.41-1.41L11 10.11V6z'/%3E%3Cpath d='M10 1a9 9 0 0 0-7.85 13.35L.5 16H6v-5.5l-2.38 2.38A7 7 0 1 1 10 17v2a9 9 0 0 0 0-18'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> #ca-talk {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #t-contributions {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #ca-addsection {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #ca-viewsource {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #p-variants {<br /> --icon: url(&quot;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&quot;);<br /> }<br /> <br /> #p-cactions {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Ccircle cx='3' cy='10' r='2'/%3E%3Ccircle cx='17' cy='10' r='2'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> #ca-watch {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M20 7h-7L10 .5 7 7H0l5.46 5.47-1.64 7 6.18-3.7 6.18 3.73-1.63-7zm-10 6.9-3.76 2.27 1-4.28L3.5 8.5h4.61L10 4.6l1.9 3.9h4.6l-3.73 3.4 1 4.28z'/%3E%3C/svg%3E%0A&quot;);<br /> }<br /> <br /> #ca-unwatch {<br /> --icon: url(&quot;data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' id='Outlined'%3E%3Cg style='fill:%23000000;fill-opacity:1' id='Fill'%3E%3Cpath style='fill:%23000000;fill-opacity:1' id='path1380' d='M 28.61,11.67 H 20 L 17.34,3.47 C 16.920093,2.1973942 15.119907,2.1973942 14.7,3.47 L 12,11.67 H 3.39 c -1.3409796,0.0031 -1.900508,1.71581 -0.82,2.51 l 7,5.07 -2.68,8.21 C 6.5980433,28.35747 7.2662365,29.278767 8.21,29.28 8.4953889,29.267666 8.7705436,29.170143 9,29 l 7,-5.07 7,5.07 c 0.236205,0.170386 0.518805,0.264586 0.81,0.27 0.943763,-0.0012 1.611957,-0.92253 1.32,-1.82 l -2.66,-8.21 7,-5.07 c 1.075277,-0.810084 0.486081,-2.522863 -0.86,-2.5 z' /%3E%3C/g%3E%3C/svg%3E&quot;);<br /> }<br /> <br /> .vector-menu-tabs #ca-watch.icon a:hover::before,<br /> .vector-menu-tabs #ca-unwatch.icon a:hover::before {<br /> background-image:none;<br /> }<br /> <br /> /* RecentChanges - prevent overflow on long summaries */<br /> .client-js .mw-changeslist ul,<br /> .client-js .mw-changeslist table.mw-enhanced-rc {<br /> margin-left:0;<br /> }<br /> <br /> .mw-changeslist-line-inner-comment,<br /> .mw-changeslist-line .comment {<br /> font-size:0.9em;<br /> }<br /> <br /> .mw-userlink {<br /> overflow-wrap:anywhere;<br /> }<br /> }<br /> <br /> /* Hide the expandable navigation button for desktop users */<br /> .mobile-nav-toggle {<br /> display: none;<br /> }<br /> <br /> /*************<br /> * End mobile *<br /> **************/<br /> <br /> <br /> /* All local skin customizations should go below this line */</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7802 2026-09-25T15:45:23Z

<p>Admin: 本家ReincarnatedのCSSのみに戻す</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.js&diff=7801 2026-09-25T12:54:20Z

<p>Admin: 誤ったtheme-dark追加を削除</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> /**<br /> * Pause animations on mouseover of a designated container (.animated-container and .mcui)<br /> *<br /> * This is so people have a chance to look at the image and click on pages they want to view.<br /> */<br /> $( '#mw-content-text' ).on( 'mouseenter mouseleave', '.animated-container, .mcui', function( e ) {<br /> $( this ).find( '.animated' ).toggleClass( 'animated-paused', e.type === 'mouseenter' );<br /> } );<br /> <br /> /**<br /> * Element animator<br /> *<br /> * Cycles through a set of elements (or &quot;frames&quot;) on a 2 second timer per frame<br /> * Add the &quot;animated&quot; class to the frame containing the elements to animate.<br /> * Optionally, add the &quot;animated-active&quot; class to the frame to display first.<br /> * Optionally, add the &quot;animated-subframe&quot; class to a frame, and the<br /> * &quot;animated-active&quot; class to a subframe within, in order to designate a set of<br /> * subframes which will only be cycled every time the parent frame is displayed.<br /> * Animations with the &quot;animated-paused&quot; class will be skipped each interval.<br /> */<br /> ( function() {<br /> var $content = $( '#mw-content-text' );<br /> <br /> // Helper function: advance the &quot;animated-active&quot; class to the next sibling<br /> var advanceFrame = function( parentElem, parentSelector ) {<br /> var curFrame = parentElem.querySelector( parentSelector + ' &gt; .animated-active' );<br /> $( curFrame ).removeClass( 'animated-active' );<br /> var $nextFrame = $( curFrame &amp;&amp; curFrame.nextElementSibling || parentElem.firstElementChild );<br /> return $nextFrame.addClass( 'animated-active' );<br /> };<br /> <br /> // Check if the tab is hidden (stop animating if user is in another tab)<br /> var hidden;<br /> if ( typeof document.hidden !== 'undefined' ) {<br /> hidden = 'hidden';<br /> } else if ( typeof document.msHidden !== 'undefined' ) {<br /> hidden = 'msHidden';<br /> } else if ( typeof document.webkitHidden !== 'undefined' ) {<br /> hidden = 'webkitHidden';<br /> }<br /> <br /> // Every 2 seconds, cycle through each .animated element<br /> setInterval( function() {<br /> // If the document is hidden, skip animating<br /> if ( hidden &amp;&amp; document[hidden] ) {<br /> return;<br /> }<br /> <br /> // For each .animated container...<br /> $content.find( '.animated' ).each( function() {<br /> // Skip if .animated-paused is present<br /> if ( $( this ).hasClass( 'animated-paused' ) ) {<br /> return;<br /> }<br /> <br /> // Advance the main frame<br /> var $nextFrame = advanceFrame( this, '.animated' );<br /> <br /> // If the new active frame is itself a .animated-subframe, advance that too<br /> if ( $nextFrame.hasClass( 'animated-subframe' ) ) {<br /> advanceFrame( $nextFrame[0], '.animated-subframe' );<br /> }<br /> } );<br /> }, 2000 );<br /> }() );<br /> <br /> <br /> /**<br /> * Set minimum height for animations to prevent moving the page if the frames differ in height<br /> */<br /> ( function() {<br /> // Mark them visible for a moment to measure<br /> var $animated = $( '.animated' ).addClass( 'animated-visible' );<br /> <br /> var animateds = [];<br /> $animated.each( function() {<br /> animateds.push( {<br /> $: $( this ).find( '&gt; .animated-subframe' ).addBack()<br /> .find( '&gt; *:not(.animated-subframe)' ),<br /> } );<br /> } );<br /> <br /> // Find max height among sibling frames<br /> $.each( animateds, function() {<br /> var minHeight = 0, differentHeights;<br /> this.$.each( function() {<br /> var height = this.offsetHeight;<br /> differentHeights = differentHeights || ( minHeight &amp;&amp; height !== minHeight );<br /> minHeight = Math.max( height, minHeight );<br /> } );<br /> if ( differentHeights ) {<br /> this.height = minHeight;<br /> }<br /> } );<br /> <br /> // Apply min-height, then hide them again<br /> $animated.each( function( i ) {<br /> $( this ).css( 'min-height', animateds[i].height );<br /> } ).removeClass( 'animated-visible' );<br /> <br /> // Optional lazy-loading for all frames once the animation is in view<br /> var animatedObserver = new IntersectionObserver( function( entries ) {<br /> entries.forEach( function( entry ) {<br /> if ( entry.isIntersecting &amp;&amp; !entry.target.classList.contains( 'animated-lazyloaded' ) ) {<br /> $( entry.target ).find( 'img' ).attr( 'loading', 'eager' );<br /> entry.target.classList.add( 'animated-lazyloaded' );<br /> animatedObserver.unobserve( entry.target );<br /> }<br /> } );<br /> } );<br /> <br /> $animated.each( function() {<br /> animatedObserver.observe( this );<br /> } );<br /> }() );<br /> <br /> document.addEventListener(&quot;DOMContentLoaded&quot;, function() {<br /> var hideTemplate = document.querySelector('.hide-content-template');<br /> if (hideTemplate) {<br /> // Hide all other content<br /> var bodyChildren = document.body.children;<br /> for (var i = 0; i &lt; bodyChildren.length; i++) {<br /> var child = bodyChildren[i];<br /> if (!child.classList.contains('hide-content-template')) {<br /> child.style.display = 'none';<br /> }<br /> }<br /> <br /> // Optionally, style the template container<br /> hideTemplate.style.position = 'relative';<br /> hideTemplate.style.zIndex = '1000';<br /> hideTemplate.style.background = 'white';<br /> hideTemplate.style.padding = '20px';<br /> hideTemplate.style.border = '2px solid #f00';<br /> }<br /> });<br /> <br /> /**<br /> * Creates Minecraft-style tooltips<br /> *<br /> * Replaces normal tooltips. Supports Minecraft [[formatting codes]] (except k), and a description with line breaks (/).<br /> */<br /> ( function() {<br /> var escapeChars = { '\\&amp;': '&amp;#38;', '&lt;': '&amp;#60;', '&gt;': '&amp;#62;' };<br /> var escape = function( text ) {<br /> // &quot;\&quot; must be escaped first<br /> return text.replace( /\\\\/g, '&amp;#92;' )<br /> .replace( /\\&amp;|[&lt;&gt;]/g, function( char ) { return escapeChars[char]; } );<br /> };<br /> var $tooltip = $();<br /> var $win = $( window ), winWidth, winHeight, width, height;<br /> <br /> $( '#mw-content-text' ).on( {<br /> 'mouseenter.minetip': function( e ) {<br /> $tooltip.remove();<br /> <br /> var $elem = $( this ), title = $elem.attr( 'data-minetip-title' );<br /> if ( title === undefined ) {<br /> title = $elem.attr( 'title' );<br /> if ( title !== undefined ) {<br /> title = $.trim( title.replace( /&amp;/g, '\\&amp;' ) );<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> }<br /> <br /> // No title or title only contains formatting codes<br /> if ( title === undefined || title !== '' &amp;&amp; title.replace( /&amp;([0-9a-jl-qs-vyzr]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/g, '' ) === '' ) {<br /> // Find deepest child title<br /> var childElem = $elem[0], childTitle;<br /> do {<br /> if ( childElem.hasAttribute( 'title' ) ) {<br /> childTitle = childElem.title;<br /> }<br /> childElem = childElem.firstChild;<br /> } while( childElem &amp;&amp; childElem.nodeType === 1 );<br /> if ( childTitle === undefined ) {<br /> return;<br /> }<br /> <br /> // Append child title as title may contain formatting codes<br /> if ( !title ) {<br /> title = '';<br /> }<br /> title += $.trim( childTitle.replace( /&amp;/g, '\\&amp;' ) );<br /> <br /> // Set the retrieved title as data for future use<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> <br /> if ( !$elem.data( 'minetip-ready' ) ) {<br /> // Remove title attributes so the native tooltip doesn't get in the way<br /> $elem.find( '[title]' ).addBack().removeAttr( 'title' );<br /> $elem.data( 'minetip-ready', true );<br /> }<br /> <br /> if ( title === '' ) {<br /> return;<br /> }<br /> <br /> var content = '&lt;span class=&quot;minetip-title&quot;&gt;' + escape( title ) + '&amp;r&lt;/span&gt;';<br /> <br /> var description = $.trim( $elem.attr( 'data-minetip-text' ) );<br /> if ( description ) {<br /> // Apply normal escaping plus &quot;/&quot;<br /> description = escape( description ).replace( /\\\//g, '&amp;#47;' );<br /> content += '&lt;span class=&quot;minetip-description&quot;&gt;' + description.replace( /\//g, '&lt;br&gt;' ) + '&amp;r&lt;/span&gt;';<br /> }<br /> <br /> // Add classes for Minecraft formatting codes<br /> while ( content.search( /&amp;(?:[0-9a-jl-qs-vyz]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/ ) &gt; -1 ) {<br /> content = content.replace( /&amp;([0-9a-jl-qs-vyz])(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-$1&quot;&gt;$2&lt;/span&gt;&amp;r' );<br /> content = content.replace( /&amp;(?:#([0-9a-fA-F]{6})|\$([0-9a-fA-F]{3}))(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-custom&quot; style=&quot;color: #$1$2;&quot;&gt;$3&lt;/span&gt;&amp;r' );<br /> }<br /> // Remove reset formatting<br /> content = content.replace( /&amp;r/g, '' );<br /> <br /> $tooltip = $( '&lt;div id=&quot;minetip-tooltip&quot;&gt;' );<br /> $tooltip.html( content ).appendTo( 'body' );<br /> <br /> // Cache current window and tooltip size<br /> winWidth = $win.width();<br /> winHeight = $win.height();<br /> width = $tooltip.outerWidth( true );<br /> height = $tooltip.outerHeight( true );<br /> <br /> // Trigger a mouse movement to position the tooltip<br /> $elem.trigger( 'mousemove', e );<br /> },<br /> 'mousemove.minetip': function( e, trigger ) {<br /> if ( !$tooltip.length ) {<br /> $( this ).trigger( 'mouseenter' );<br /> return;<br /> }<br /> <br /> // Get event data from remote trigger<br /> e = trigger || e;<br /> <br /> // Get mouse position and add default offsets<br /> var top = e.clientY - 34;<br /> var left = e.clientX + 14;<br /> <br /> // If going off the right of the screen, go to the left of the cursor<br /> if ( left + width &gt; winWidth ) {<br /> left -= width + 36;<br /> }<br /> <br /> // If now going off to the left of the screen, resort to going above the cursor<br /> if ( left &lt; 0 ) {<br /> left = 0;<br /> top -= height - 22;<br /> <br /> // Go below the cursor if too high<br /> if ( top &lt; 0 ) {<br /> top += height + 47;<br /> }<br /> // Don't go off the top of the screen<br /> } else if ( top &lt; 0 ) {<br /> top = 0;<br /> // Don't go off the bottom of the screen<br /> } else if ( top + height &gt; winHeight ) {<br /> top = winHeight - height;<br /> }<br /> <br /> // Apply the positions<br /> $tooltip.css( { top: top, left: left } );<br /> },<br /> 'mouseleave.minetip': function() {<br /> if ( !$tooltip.length ) {<br /> return;<br /> }<br /> <br /> $tooltip.remove();<br /> $tooltip = $();<br /> }<br /> }, '.minetip, .invslot-item' );<br /> }() );<br /> <br /> /* ==== Mysticism ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> <br /> <br /> // Remove the Abilities/Whatever<br /> <br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7800 2026-09-25T12:54:19Z

<p>Admin: 赤帯テスト削除</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> <br /> /* Local Vector 2022 bridge: Reincarnated の色指定を使用 */<br /> body.skin-vector-2022 {<br /> background-color: var(--wiki-body-background-color, #f6f6f6);<br /> background-image: var(--wiki-body-background-image, none);<br /> background-position: var(--wiki-body-background-position, center top);<br /> background-size: var(--wiki-body-background-size, cover);<br /> background-repeat: var(--wiki-body-background-repeat, no-repeat);<br /> background-attachment: var(--wiki-body-background-attachment, fixed);<br /> }<br /> .skin-vector-2022 .mw-page-container {<br /> background: transparent;<br /> }<br /> .skin-vector-2022 .vector-header-container,<br /> .skin-vector-2022 .mw-body {<br /> background-color: var(--wiki-content-background-color, #fff);<br /> color: var(--wiki-content-text-color, #202122);<br /> }<br /> .skin-vector-2022 .mw-body a {<br /> color: var(--wiki-content-link-color, #36c);<br /> }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7799 2026-09-25T12:51:33Z

<p>Admin: 背景画像をローカルURLに修正</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(&quot;/images/2/26/Background.png&quot;); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> <br /> /* Local Vector 2022 bridge: Reincarnated の色指定を使用 */<br /> body.skin-vector-2022 {<br /> background-color: var(--wiki-body-background-color, #f6f6f6);<br /> background-image: var(--wiki-body-background-image, none);<br /> background-position: var(--wiki-body-background-position, center top);<br /> background-size: var(--wiki-body-background-size, cover);<br /> background-repeat: var(--wiki-body-background-repeat, no-repeat);<br /> background-attachment: var(--wiki-body-background-attachment, fixed);<br /> }<br /> .skin-vector-2022 .mw-page-container {<br /> background: transparent;<br /> }<br /> .skin-vector-2022 .vector-header-container,<br /> .skin-vector-2022 .mw-body {<br /> background-color: var(--wiki-content-background-color, #fff);<br /> color: var(--wiki-content-text-color, #202122);<br /> }<br /> .skin-vector-2022 .mw-body a {<br /> color: var(--wiki-content-link-color, #36c);<br /> }<br /> body { border-top: 24px solid red !important; }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7798 2026-09-25T12:45:55Z

<p>Admin: 赤帯テスト</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> <br /> /* Local Vector 2022 bridge: Reincarnated の色指定を使用 */<br /> body.skin-vector-2022 {<br /> background-color: var(--wiki-body-background-color, #f6f6f6);<br /> background-image: var(--wiki-body-background-image, none);<br /> background-position: var(--wiki-body-background-position, center top);<br /> background-size: var(--wiki-body-background-size, cover);<br /> background-repeat: var(--wiki-body-background-repeat, no-repeat);<br /> background-attachment: var(--wiki-body-background-attachment, fixed);<br /> }<br /> .skin-vector-2022 .mw-page-container {<br /> background: transparent;<br /> }<br /> .skin-vector-2022 .vector-header-container,<br /> .skin-vector-2022 .mw-body {<br /> background-color: var(--wiki-content-background-color, #fff);<br /> color: var(--wiki-content-text-color, #202122);<br /> }<br /> .skin-vector-2022 .mw-body a {<br /> color: var(--wiki-content-link-color, #36c);<br /> }<br /> body { border-top: 24px solid red !important; }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7797 2026-09-25T12:42:43Z

<p>Admin: 本家CSSをベースにVector 2022用スタイルを整理</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> <br /> /* Local Vector 2022 bridge: Reincarnated の色指定を使用 */<br /> body.skin-vector-2022 {<br /> background-color: var(--wiki-body-background-color, #f6f6f6);<br /> background-image: var(--wiki-body-background-image, none);<br /> background-position: var(--wiki-body-background-position, center top);<br /> background-size: var(--wiki-body-background-size, cover);<br /> background-repeat: var(--wiki-body-background-repeat, no-repeat);<br /> background-attachment: var(--wiki-body-background-attachment, fixed);<br /> }<br /> .skin-vector-2022 .mw-page-container {<br /> background: transparent;<br /> }<br /> .skin-vector-2022 .vector-header-container,<br /> .skin-vector-2022 .mw-body {<br /> background-color: var(--wiki-content-background-color, #fff);<br /> color: var(--wiki-content-text-color, #202122);<br /> }<br /> .skin-vector-2022 .mw-body a {<br /> color: var(--wiki-content-link-color, #36c);<br /> }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7796 2026-09-25T12:36:01Z

<p>Admin: Vector向けブリッジCSS</p> <hr /> <div>/* =/* Reincarnated */= */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> /* =/* Mysticism */= */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> .navi-item--small {<br /> width: 100px;<br /> height: fit-content;<br /> }<br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /* =/* Nightmares */= */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }/* Gadgets/ranger/variables.css */<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> --navbox-pill-selflink-background: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);/* background of pills with selflink in them */ <br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> --navbox-pill-selflink-background: var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> /* Gadgets/ranger/main.css */<br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill-mobile .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/navbox.css */<br /> /** as of Module:navbox version 1.2.1 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: var(--navbox-group-background);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* further tweak to make text flow looks better for &lt;li&gt; in &lt;ol&gt; */<br /> .ranger-navbox.pill-mobile .hlist li:not(:has(li,ul,ol)){<br /> display: inline-block;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/custom.css */<br /> /* Custom RANGER styles can go here. Rules here will override rules of equal specificity in main.css *//* ==== Bridge: wiki.gg 変数 → 標準 Vector 2022 ==== */<br /> body { background-color: var(--wiki-body-background-color, #fff); background-image: var(--wiki-body-background-image, none); background-size: cover; background-attachment: fixed; }<br /> .mw-body, .vector-header-container, .vector-main-menu, .vector-page-toolbar, .vector-toc, .vector-sticky-pinned-container, .vector-dropdown-content, .vector-menu-content, .vector-pinnable-element<br /> { background-color: var(--wiki-content-background-color, #fff); color: var(--wiki-content-text-color, #111); border-color: var(--wiki-content-border-color, #a2a9b1); }<br /> .mw-body, .mw-body-content, .vector-body, h1, h2, h3, h4, h5, h6 { color: var(--wiki-content-text-color, #111); }<br /> .mw-body h1, .mw-body h2, .mw-body .mw-heading1, .mw-body .mw-heading2 { border-color: var(--wiki-content-border-color, #a2a9b1); }<br /> a, .vector-menu-content a, .mw-body a { color: var(--wiki-content-link-color, #36c); }<br /> a:visited { color: var(--wiki-content-link-color--visited, var(--wiki-content-link-color, #36c)); }<br /> a.new, a.new:visited { color: var(--wiki-content-redlink-color, #ba0000); }<br /> .wikitable, .wikitable &gt; * &gt; tr &gt; th, .wikitable &gt; * &gt; tr &gt; td, .mw-parser-output table { background-color: var(--wiki-content-background-color--secondary, var(--wiki-content-background-color, #f8f9fa)); border-color: var(--wiki-content-border-color, #a2a9b1); color: inherit; }<br /> .vector-header-container .mw-header, .vector-sticky-header { background-color: var(--wiki-navigation-background-color, var(--wiki-content-background-color, #fff)); }</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.js&diff=7795 2026-09-25T12:35:54Z

<p>Admin: テーマクラス付与</p> <hr /> <div>document.documentElement.classList.add('theme-dark');<br /> /* ==== Reincarnated ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> /**<br /> * Pause animations on mouseover of a designated container (.animated-container and .mcui)<br /> *<br /> * This is so people have a chance to look at the image and click on pages they want to view.<br /> */<br /> $( '#mw-content-text' ).on( 'mouseenter mouseleave', '.animated-container, .mcui', function( e ) {<br /> $( this ).find( '.animated' ).toggleClass( 'animated-paused', e.type === 'mouseenter' );<br /> } );<br /> <br /> /**<br /> * Element animator<br /> *<br /> * Cycles through a set of elements (or &quot;frames&quot;) on a 2 second timer per frame<br /> * Add the &quot;animated&quot; class to the frame containing the elements to animate.<br /> * Optionally, add the &quot;animated-active&quot; class to the frame to display first.<br /> * Optionally, add the &quot;animated-subframe&quot; class to a frame, and the<br /> * &quot;animated-active&quot; class to a subframe within, in order to designate a set of<br /> * subframes which will only be cycled every time the parent frame is displayed.<br /> * Animations with the &quot;animated-paused&quot; class will be skipped each interval.<br /> */<br /> ( function() {<br /> var $content = $( '#mw-content-text' );<br /> <br /> // Helper function: advance the &quot;animated-active&quot; class to the next sibling<br /> var advanceFrame = function( parentElem, parentSelector ) {<br /> var curFrame = parentElem.querySelector( parentSelector + ' &gt; .animated-active' );<br /> $( curFrame ).removeClass( 'animated-active' );<br /> var $nextFrame = $( curFrame &amp;&amp; curFrame.nextElementSibling || parentElem.firstElementChild );<br /> return $nextFrame.addClass( 'animated-active' );<br /> };<br /> <br /> // Check if the tab is hidden (stop animating if user is in another tab)<br /> var hidden;<br /> if ( typeof document.hidden !== 'undefined' ) {<br /> hidden = 'hidden';<br /> } else if ( typeof document.msHidden !== 'undefined' ) {<br /> hidden = 'msHidden';<br /> } else if ( typeof document.webkitHidden !== 'undefined' ) {<br /> hidden = 'webkitHidden';<br /> }<br /> <br /> // Every 2 seconds, cycle through each .animated element<br /> setInterval( function() {<br /> // If the document is hidden, skip animating<br /> if ( hidden &amp;&amp; document[hidden] ) {<br /> return;<br /> }<br /> <br /> // For each .animated container...<br /> $content.find( '.animated' ).each( function() {<br /> // Skip if .animated-paused is present<br /> if ( $( this ).hasClass( 'animated-paused' ) ) {<br /> return;<br /> }<br /> <br /> // Advance the main frame<br /> var $nextFrame = advanceFrame( this, '.animated' );<br /> <br /> // If the new active frame is itself a .animated-subframe, advance that too<br /> if ( $nextFrame.hasClass( 'animated-subframe' ) ) {<br /> advanceFrame( $nextFrame[0], '.animated-subframe' );<br /> }<br /> } );<br /> }, 2000 );<br /> }() );<br /> <br /> <br /> /**<br /> * Set minimum height for animations to prevent moving the page if the frames differ in height<br /> */<br /> ( function() {<br /> // Mark them visible for a moment to measure<br /> var $animated = $( '.animated' ).addClass( 'animated-visible' );<br /> <br /> var animateds = [];<br /> $animated.each( function() {<br /> animateds.push( {<br /> $: $( this ).find( '&gt; .animated-subframe' ).addBack()<br /> .find( '&gt; *:not(.animated-subframe)' ),<br /> } );<br /> } );<br /> <br /> // Find max height among sibling frames<br /> $.each( animateds, function() {<br /> var minHeight = 0, differentHeights;<br /> this.$.each( function() {<br /> var height = this.offsetHeight;<br /> differentHeights = differentHeights || ( minHeight &amp;&amp; height !== minHeight );<br /> minHeight = Math.max( height, minHeight );<br /> } );<br /> if ( differentHeights ) {<br /> this.height = minHeight;<br /> }<br /> } );<br /> <br /> // Apply min-height, then hide them again<br /> $animated.each( function( i ) {<br /> $( this ).css( 'min-height', animateds[i].height );<br /> } ).removeClass( 'animated-visible' );<br /> <br /> // Optional lazy-loading for all frames once the animation is in view<br /> var animatedObserver = new IntersectionObserver( function( entries ) {<br /> entries.forEach( function( entry ) {<br /> if ( entry.isIntersecting &amp;&amp; !entry.target.classList.contains( 'animated-lazyloaded' ) ) {<br /> $( entry.target ).find( 'img' ).attr( 'loading', 'eager' );<br /> entry.target.classList.add( 'animated-lazyloaded' );<br /> animatedObserver.unobserve( entry.target );<br /> }<br /> } );<br /> } );<br /> <br /> $animated.each( function() {<br /> animatedObserver.observe( this );<br /> } );<br /> }() );<br /> <br /> document.addEventListener(&quot;DOMContentLoaded&quot;, function() {<br /> var hideTemplate = document.querySelector('.hide-content-template');<br /> if (hideTemplate) {<br /> // Hide all other content<br /> var bodyChildren = document.body.children;<br /> for (var i = 0; i &lt; bodyChildren.length; i++) {<br /> var child = bodyChildren[i];<br /> if (!child.classList.contains('hide-content-template')) {<br /> child.style.display = 'none';<br /> }<br /> }<br /> <br /> // Optionally, style the template container<br /> hideTemplate.style.position = 'relative';<br /> hideTemplate.style.zIndex = '1000';<br /> hideTemplate.style.background = 'white';<br /> hideTemplate.style.padding = '20px';<br /> hideTemplate.style.border = '2px solid #f00';<br /> }<br /> });<br /> <br /> /**<br /> * Creates Minecraft-style tooltips<br /> *<br /> * Replaces normal tooltips. Supports Minecraft [[formatting codes]] (except k), and a description with line breaks (/).<br /> */<br /> ( function() {<br /> var escapeChars = { '\\&amp;': '&amp;#38;', '&lt;': '&amp;#60;', '&gt;': '&amp;#62;' };<br /> var escape = function( text ) {<br /> // &quot;\&quot; must be escaped first<br /> return text.replace( /\\\\/g, '&amp;#92;' )<br /> .replace( /\\&amp;|[&lt;&gt;]/g, function( char ) { return escapeChars[char]; } );<br /> };<br /> var $tooltip = $();<br /> var $win = $( window ), winWidth, winHeight, width, height;<br /> <br /> $( '#mw-content-text' ).on( {<br /> 'mouseenter.minetip': function( e ) {<br /> $tooltip.remove();<br /> <br /> var $elem = $( this ), title = $elem.attr( 'data-minetip-title' );<br /> if ( title === undefined ) {<br /> title = $elem.attr( 'title' );<br /> if ( title !== undefined ) {<br /> title = $.trim( title.replace( /&amp;/g, '\\&amp;' ) );<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> }<br /> <br /> // No title or title only contains formatting codes<br /> if ( title === undefined || title !== '' &amp;&amp; title.replace( /&amp;([0-9a-jl-qs-vyzr]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/g, '' ) === '' ) {<br /> // Find deepest child title<br /> var childElem = $elem[0], childTitle;<br /> do {<br /> if ( childElem.hasAttribute( 'title' ) ) {<br /> childTitle = childElem.title;<br /> }<br /> childElem = childElem.firstChild;<br /> } while( childElem &amp;&amp; childElem.nodeType === 1 );<br /> if ( childTitle === undefined ) {<br /> return;<br /> }<br /> <br /> // Append child title as title may contain formatting codes<br /> if ( !title ) {<br /> title = '';<br /> }<br /> title += $.trim( childTitle.replace( /&amp;/g, '\\&amp;' ) );<br /> <br /> // Set the retrieved title as data for future use<br /> $elem.attr( 'data-minetip-title', title );<br /> }<br /> <br /> if ( !$elem.data( 'minetip-ready' ) ) {<br /> // Remove title attributes so the native tooltip doesn't get in the way<br /> $elem.find( '[title]' ).addBack().removeAttr( 'title' );<br /> $elem.data( 'minetip-ready', true );<br /> }<br /> <br /> if ( title === '' ) {<br /> return;<br /> }<br /> <br /> var content = '&lt;span class=&quot;minetip-title&quot;&gt;' + escape( title ) + '&amp;r&lt;/span&gt;';<br /> <br /> var description = $.trim( $elem.attr( 'data-minetip-text' ) );<br /> if ( description ) {<br /> // Apply normal escaping plus &quot;/&quot;<br /> description = escape( description ).replace( /\\\//g, '&amp;#47;' );<br /> content += '&lt;span class=&quot;minetip-description&quot;&gt;' + description.replace( /\//g, '&lt;br&gt;' ) + '&amp;r&lt;/span&gt;';<br /> }<br /> <br /> // Add classes for Minecraft formatting codes<br /> while ( content.search( /&amp;(?:[0-9a-jl-qs-vyz]|#[0-9a-fA-F]{6}|\$[0-9a-fA-F]{3})/ ) &gt; -1 ) {<br /> content = content.replace( /&amp;([0-9a-jl-qs-vyz])(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-$1&quot;&gt;$2&lt;/span&gt;&amp;r' );<br /> content = content.replace( /&amp;(?:#([0-9a-fA-F]{6})|\$([0-9a-fA-F]{3}))(.*?)(&amp;r|$)/g, '&lt;span class=&quot;format-custom&quot; style=&quot;color: #$1$2;&quot;&gt;$3&lt;/span&gt;&amp;r' );<br /> }<br /> // Remove reset formatting<br /> content = content.replace( /&amp;r/g, '' );<br /> <br /> $tooltip = $( '&lt;div id=&quot;minetip-tooltip&quot;&gt;' );<br /> $tooltip.html( content ).appendTo( 'body' );<br /> <br /> // Cache current window and tooltip size<br /> winWidth = $win.width();<br /> winHeight = $win.height();<br /> width = $tooltip.outerWidth( true );<br /> height = $tooltip.outerHeight( true );<br /> <br /> // Trigger a mouse movement to position the tooltip<br /> $elem.trigger( 'mousemove', e );<br /> },<br /> 'mousemove.minetip': function( e, trigger ) {<br /> if ( !$tooltip.length ) {<br /> $( this ).trigger( 'mouseenter' );<br /> return;<br /> }<br /> <br /> // Get event data from remote trigger<br /> e = trigger || e;<br /> <br /> // Get mouse position and add default offsets<br /> var top = e.clientY - 34;<br /> var left = e.clientX + 14;<br /> <br /> // If going off the right of the screen, go to the left of the cursor<br /> if ( left + width &gt; winWidth ) {<br /> left -= width + 36;<br /> }<br /> <br /> // If now going off to the left of the screen, resort to going above the cursor<br /> if ( left &lt; 0 ) {<br /> left = 0;<br /> top -= height - 22;<br /> <br /> // Go below the cursor if too high<br /> if ( top &lt; 0 ) {<br /> top += height + 47;<br /> }<br /> // Don't go off the top of the screen<br /> } else if ( top &lt; 0 ) {<br /> top = 0;<br /> // Don't go off the bottom of the screen<br /> } else if ( top + height &gt; winHeight ) {<br /> top = winHeight - height;<br /> }<br /> <br /> // Apply the positions<br /> $tooltip.css( { top: top, left: left } );<br /> },<br /> 'mouseleave.minetip': function() {<br /> if ( !$tooltip.length ) {<br /> return;<br /> }<br /> <br /> $tooltip.remove();<br /> $tooltip = $();<br /> }<br /> }, '.minetip, .invslot-item' );<br /> }() );<br /> <br /> /* ==== Mysticism ==== */<br /> /* Any JavaScript here will be loaded for all users on every page load. */<br /> <br /> /* DRUID */<br /> $(function () {<br /> $(&quot;.druid-title-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-section-tab&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var $parent = $(this).closest(&quot;.druid-section-container&quot;);<br /> $parent.find(&quot;.druid-toggleable&quot;).removeClass(&quot;focused&quot;);<br /> var i = $(this).attr(&quot;data-druid&quot;);<br /> $parent.find(&quot;.druid-toggleable[data-druid=&quot; + i + &quot;]&quot;).addClass(&quot;focused&quot;);<br /> });<br /> <br /> $(&quot;.druid-collapsible&quot;).off(&quot;click&quot;)<br /> .on('click', function () {<br /> var kind = $(this).attr(&quot;data-druid-section&quot;);<br /> $(this).toggleClass(&quot;druid-collapsible-collapsed&quot;);<br /> $(this)<br /> .closest(&quot;.druid-container&quot;)<br /> .find(&quot;[data-druid-section-row=&quot; + kind + &quot;]&quot;)<br /> .toggleClass(&quot;druid-collapsed&quot;);<br /> });<br /> });<br /> /* End DRUID */<br /> <br /> /* [[Template:Spoiler]] */<br /> $(function () {<br /> $('.spoiler-content')<br /> .off('click') // in case this code is loaded twice<br /> .on('click', function(e){<br /> $(this).toggleClass('show');<br /> }).find('a').on('click', function(e){<br /> e.stopPropagation();<br /> });<br /> <br /> });<br /> /* End Template:Spoiler */<br /> <br /> <br /> /* Link to imported modules from Lua code */<br /> $(function() {<br /> var config = mw.config.get([<br /> 'wgCanonicalNamespace',<br /> 'wgFormattedNamespaces'<br /> ]);<br /> if (config.wgCanonicalNamespace !== 'Module') {<br /> return;<br /> }<br /> var localizedNamespace = config.wgFormattedNamespaces[828];<br /> $('.s1, .s2, .s').each(function() {<br /> var $this = $(this);<br /> var html = $this.html();<br /> var quote = html[0];<br /> var isLongStringQuote = quote === '[';<br /> var quoteRE = new RegExp('^\\' + quote + '|\\' + quote + '$', 'g');<br /> if (isLongStringQuote) {<br /> quoteRE = /^\[\[|\]\]$/g;<br /> }<br /> var name = html.replace(quoteRE, '');<br /> var isEnglishPrefix = name.startsWith('Module:');<br /> var isLocalizedPrefix = name.startsWith(localizedNamespace + ':');<br /> var isDevPrefix = name.startsWith('Dev:');<br /> if (isEnglishPrefix || isLocalizedPrefix || isDevPrefix) {<br /> var attrs = {<br /> href: mw.util.getUrl(name)<br /> };<br /> if (isDevPrefix) {<br /> attrs.href = 'https://commons.wiki.gg/wiki/Module:' + mw.util.wikiUrlencode(name.replace('Dev:', ''));<br /> attrs.target = '_blank';<br /> attrs.rel = 'noopener';<br /> }<br /> var link = mw.html.element('a', attrs, name);<br /> var str = quote + link + quote;<br /> if (isLongStringQuote) {<br /> str = '[[' + link + ']]';<br /> }<br /> $this.html(str);<br /> }<br /> });<br /> });<br /> <br /> <br /> /* CharInserts */<br /> <br /> $(function() {<br /> $('.mw-charinsert-item').each(function() {<br /> $(this).text($(this).closest('div').attr('data-ci-label'));<br /> $(this).css('display', 'inline-block');<br /> });<br /> $('.ci-loading-text').css('display','none');<br /> });<br /> <br /> /**<br /> * DiscordCompact.js<br /> * ----------------------<br /> * A very simple script to display a Discord widget.<br /> * Version 0.0.2<br /> * https://support.wiki.gg/wiki/DiscordCompact<br /> * ----------------------<br /> */<br /> <br /> $(function() {<br /> var widget = $(&quot;#content #discord-compact-widget&quot;);<br /> <br /> // Bail out if we didn't find a widget.<br /> if (!widget.length) return;<br /> <br /> var id = widget.attr(&quot;data-id&quot;);<br /> <br /> // Ensure that the id is not blank.<br /> if (id === &quot;&quot;) throw new Error(&quot;DiscordCompact has a blank server id!&quot;);<br /> // Ensure that the id consists only of numbers and is at least 17 characters long.<br /> if (!new RegExp(&quot;^[0-9]{17}[0-9]+$&quot;).test(id)) throw new Error(&quot;DiscordCompact has an invalid server id!&quot;);<br /> <br /> var apiBase = &quot;https://discord.com/api/guilds/&quot; + id;<br /> // Get some information about the server, such as online member count and invite url.<br /> // This also tells us if the server exists or has widgets disabled, so we look out for that too.<br /> $.ajax(apiBase + &quot;/widget.json&quot;).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status);<br /> switch (req.responseJSON.code) {<br /> case 10004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but no such server exists!&quot;);<br /> case 50004:<br /> throw new Error(&quot;DiscordCompact has a valid server id, but that server has widgets disabled!&quot;);<br /> default:<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.json (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }<br /> }).done(function(res){<br /> const inviteURL = res.instant_invite;<br /> <br /> // Warn if we can't get an invite URL.<br /> if (inviteURL == null) console.warn(&quot;DiscordCompact cannot get an invite URL; does this server have an invite channel set in Widget settings?&quot;);<br /> <br /> // Now get the widget image.<br /> $.ajax({url: apiBase + &quot;/widget.png?style=banner2&quot;, xhrFields: {responseType: &quot;blob&quot;}}).fail(function(req){<br /> if (!req.responseJSON) throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status);<br /> throw new Error(&quot;DiscordCompact encountered an unknown error whilst fetching widget.png! (status: &quot; + req.status + &quot;; code: &quot; + req.responseJSON.code + &quot;)&quot;);<br /> }).done(function(blob){<br /> // Convert the image data into base64. This prevents us having to make the client request it a second time.<br /> const imageReader = new FileReader();<br /> imageReader.readAsDataURL(blob);<br /> imageReader.onloadend = function() {<br /> const b64Data = imageReader.result;<br /> <br /> // Replace the widget with an &lt;a&gt; tag<br /> widget.replaceWith(function() {<br /> return $(&quot;&lt;a&gt;&quot;, {<br /> id: widget.attr(&quot;id&quot;),<br /> class: widget.attr(&quot;class&quot;),<br /> style: widget.attr(&quot;style&quot;),<br /> alt: &quot;Discord server widget&quot;,<br /> href: inviteURL<br /> });<br /> });<br /> <br /> // We need to grab the widget again to update it.<br /> widget = $(&quot;#discord-compact-widget&quot;);<br /> <br /> // Setup the CSS so that the image is displayed.<br /> widget.css(&quot;display&quot;, &quot;block&quot;);<br /> widget.css(&quot;max-height&quot;, &quot;76px&quot;);<br /> widget.css(&quot;max-width&quot;, &quot;320px&quot;);<br /> <br /> // Create the image.<br /> const widgetImage = document.createElement(&quot;img&quot;);<br /> widgetImage.src = b64Data;<br /> widgetImage.style.width = &quot;100%&quot;;<br /> widgetImage.style.height = &quot;100%&quot;;<br /> widgetImage.style.borderRadius = &quot;5px&quot;;<br /> widget.append(widgetImage);<br /> <br /> // Prevent image dragging.<br /> widget.on(&quot;dragstart&quot;, function(e) { e.preventDefault(); });<br /> <br /> // We're done here.<br /> console.log(&quot;DiscordCompact loaded successfully!&quot;);<br /> }<br /> });<br /> });<br /> });<br /> <br /> /**<br /> * based on https://dev.fandom.com/wiki/MediaWiki:DiscordIntegrator/code.js<br /> * <br /> * used by other wikis.<br /> */<br /> $(function() {<br /> 'use strict';<br /> var mconfig = mw.config.get([<br /> 'wgContentLanguage',<br /> 'wgUserLanguage',<br /> 'wgUserName'<br /> ]);<br /> if (window.DiscordIntegratorLoaded) {<br /> return;<br /> }<br /> window.DiscordIntegratorLoaded = true;<br /> /**<br /> * Main object<br /> * @static<br /> */<br /> var DiscordIntegrator = {<br /> <br /> /**<br /> * Initializing<br /> */<br /> init: function() {<br /> mw.hook('wikipage.content').add($.proxy(this.insertToContent, this));<br /> },<br /> /**<br /> * Finding the designated places in content<br /> * in which to place the widget and placing it<br /> */<br /> insertToContent: function($content) {<br /> $content.find('.DiscordIntegrator:not(.loaded)').each($.proxy(function(cabbage, el) {<br /> el = $(el);<br /> el.html(this.generateContent(el.data())).addClass('loaded');<br /> }, this));<br /> },<br /> /**<br /> * Determines the theme of the widget.<br /> * @param {string} config Configured theme<br /> * @return {string} 'light' or 'dark' depending on the wiki theme and configuration<br /> */<br /> determineTheme: function(config) {<br /> // If explicitly configured to light or dark.<br /> if (config === 'dark') {<br /> return 'dark';<br /> }<br /> if (config === 'light') {<br /> return 'light';<br /> }<br /> /** If not configured **/<br /> // try to determine based on wiki theme (set by themeToggle):<br /> var clas = $(':root').attr('class');<br /> var regex = /(^|\s)theme-(\w+)(\s|$)/;<br /> var match = clas.match(regex);<br /> if(match){<br /> var wikiThemeName = match[2];<br /> if(typeof(config) === 'object' &amp;&amp; config !== null){ //with json theme config<br /> if(config[wikiThemeName]){<br /> return config[wikiThemeName];<br /> }<br /> }<br /> if(wikiThemeName === 'light'){<br /> return 'light';<br /> }<br /> if(wikiThemeName === 'dark'){<br /> return 'dark';<br /> }<br /> }<br /> // Otherwise, default to dark.<br /> return 'dark';<br /> },<br /> /**<br /> * Generating widget content from an object<br /> * @return {string} Content of the widget<br /> */<br /> generateContent: function(config) {<br /> if (!config.id || !String(config.id).match(/\d{17,19}/)) {<br /> return &quot;Error: ID of the widget is malformed or not supplied, please see &lt;a href='https://support.wiki.gg/wiki/DiscordWidget' title='the instructions'&gt;the instructions&lt;/a&gt; for how to find your server's ID. Please make sure you are not inserting &lt;strong&gt;the DiscordIntegrator template&lt;/strong&gt; when asked for &lt;strong&gt;your widget ID&lt;/strong&gt;.&quot;;<br /> }<br /> if (<br /> (<br /> config.loggedIn === true ||<br /> Boolean(config['logged-in']) === true &amp;&amp;<br /> config['logged-in'] !== 'false' &amp;&amp;<br /> config['logged-in'] !== '{{{loggedIn}}}'<br /> ) &amp;&amp; !mconfig.wgUserName<br /> ) {<br /> return &quot;Please &lt;a href='/Special:UserLogin' title='log in'&gt;log in&lt;/a&gt; to see this widget.&quot;;<br /> }<br /> var username = config.username === '@disabled' ?<br /> '' :<br /> config.username === '@function' &amp;&amp;<br /> typeof window.DiscordIntegratorGetUsername === 'function' ?<br /> window.DiscordIntegratorGetUsername() :<br /> config.username || mconfig.wgUserName;<br /> return mw.html.element('iframe', {<br /> src: 'https://discord.com/widget?id=' + config.id +<br /> '&amp;theme=' + this.determineTheme(config.theme) +<br /> '&amp;username=' + encodeURIComponent(username),<br /> width: config.width || '100%',<br /> height: config.height || '400px',<br /> allowtransparency: 'true',<br /> frameborder: '0',<br /> title: &quot;Discord server widget&quot;<br /> });<br /> }<br /> };<br /> DiscordIntegrator.init();<br /> });<br /> <br /> <br /> // Remove the Abilities/Whatever<br /> <br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Magics/&quot; dynamically<br /> if (title.startsWith('Abilities/Magics/')) {<br /> $link.text(title.replace('Abilities/Magics/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Skills/&quot; dynamically<br /> if (title.startsWith('Abilities/Skills/')) {<br /> $link.text(title.replace('Abilities/Skills/', ''));<br /> }<br /> });<br /> });<br /> mw.hook('wikipage.content').add(function($content) {<br /> $content.find('.mw-category-group a').each(function() {<br /> var $link = $(this);<br /> var title = $link.text();<br /> // Strip the prefix &quot;Abilities/Battlewills/&quot; dynamically<br /> if (title.startsWith('Abilities/Battlewills/')) {<br /> $link.text(title.replace('Abilities/Battlewills/', ''));<br /> }<br /> });<br /> });<br /> <br /> $(document).ready(function () {<br /> $('.collapsible-header').click(function () {<br /> $(this).next('.collapsible-content').slideToggle();<br /> $(this).toggleClass('expanded');<br /> });<br /> });</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7794 2026-09-25T12:32:30Z

<p>Admin: CSS見出しをクリーン化</p> <hr /> <div>/* =/* Reincarnated */= */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> /* =/* Mysticism */= */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> .navi-item--small {<br /> width: 100px;<br /> height: fit-content;<br /> }<br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /* =/* Nightmares */= */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }/* Gadgets/ranger/variables.css */<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> --navbox-pill-selflink-background: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);/* background of pills with selflink in them */ <br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> --navbox-pill-selflink-background: var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> /* Gadgets/ranger/main.css */<br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill-mobile .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/navbox.css */<br /> /** as of Module:navbox version 1.2.1 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: var(--navbox-group-background);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* further tweak to make text flow looks better for &lt;li&gt; in &lt;ol&gt; */<br /> .ranger-navbox.pill-mobile .hlist li:not(:has(li,ul,ol)){<br /> display: inline-block;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/custom.css */<br /> /* Custom RANGER styles can go here. Rules here will override rules of equal specificity in main.css */</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7781 2026-09-25T12:28:42Z

<p>Admin: Ranger theme CSS を統合</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> /* ==== Mysticism ==== */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> .navi-item--small {<br /> width: 100px;<br /> height: fit-content;<br /> }<br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /* ==== Nightmares ==== */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }/* Gadgets/ranger/variables.css */<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> --navbox-pill-selflink-background: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);/* background of pills with selflink in them */ <br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> --navbox-pill-selflink-background: var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> /* Gadgets/ranger/main.css */<br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill-mobile .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/navbox.css */<br /> /** as of Module:navbox version 1.2.1 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: var(--navbox-group-background);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* further tweak to make text flow looks better for &lt;li&gt; in &lt;ol&gt; */<br /> .ranger-navbox.pill-mobile .hlist li:not(:has(li,ul,ol)){<br /> display: inline-block;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> /* Gadgets/ranger/custom.css */<br /> /* Custom RANGER styles can go here. Rules here will override rules of equal specificity in main.css */</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=MediaWiki:Common.css&diff=7780 2026-09-25T12:28:26Z

<p>Admin: Ranger theme CSS を統合</p> <hr /> <div>/* ==== Reincarnated ==== */<br /> /* CSS placed here will be applied to all skins */<br /> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&amp;display=swap');<br /> <br /> @font-face {<br /> font-family: 'Minecraft';<br /> font-style: normal;<br /> font-weight: 400;<br /> font-display: swap;<br /> src: url(filepath://JDGraphics_Minecraft.otf) format('opentype'); /**[[File:JDGraphics_Minecraft.otf]]*/<br /> }<br /> <br /> :root{<br /> :root {<br /> --main-page-layout--mobile: &quot;full&quot;;<br /> --main-page-layout--tablet: &quot;left right&quot;;<br /> --main-page-layout--desktop: &quot;left center right&quot;;<br /> <br /> --main-page-layout-columns--mobile: 100%;<br /> --main-page-layout-columns--tablet: 1fr 1fr;<br /> --main-page-layout-columns--desktop: 1fr 2fr 1fr;<br /> }<br /> <br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light theme, delete from here to &quot;end light theme&quot; if you don't want your wiki to support a light theme (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-color--rgb: 246,246,246;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-color--rgb: 255, 255, 255;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-background-color--secondary: #fbfbfb;<br /> --wiki-content-background-color--secondary--rgb: 251, 251, 251;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 167, 215, 249;<br /> --wiki-content-link-color: #0645ad;<br /> --wiki-content-link-color--rgb: 6, 69, 173;<br /> --wiki-content-text-mix-color: #646464;<br /> --wiki-content-text-mix-color--rgb: 100,100,100;<br /> --wiki-content-text-mix-color-95: #f3f3f3;<br /> --wiki-content-text-mix-color-95--rgb: 243,243,243;<br /> /* [ LIGHT THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #447ff5;<br /> --wiki-accent-color--hover--rgb: 68, 127, 245; <br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #D5FB51;<br /> --wiki-accent-link-color--rgb: 213, 251, 81;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #111111;<br /> --wiki-content-text-color--rgb: 17, 17, 17;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #ba0000;<br /> --wiki-content-redlink-color--rgb: 186,0,0;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ LIGHT THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-alert-color--rgb: 191,0,23;<br /> --wiki-warning-color: #cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #0c742f;<br /> --wiki-success-color--rgb: 12,116,47;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT THEME, if you are making a dark theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-link-label-color--rgb: 255,255,255;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--inverted--rgb: 255,255,255;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--rgb: 51,51,51;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;<br /> /* [ LIGHT THEME ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-alert-label-color--rgb: 255, 255, 255;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #ffffff;<br /> --wiki-success-label-color--rgb: 255, 255, 255;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light theme */<br /> <br /> /* Begin dark theme, delete from here to &quot;end dark theme&quot; if you don't want your wiki to support a dark theme (remove it from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-color--rgb: 23, 23, 23;<br /> --wiki-body-background-image: url(filepath://Background.png); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-color--rgb: 32,32,32;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-background-color--secondary: #2b2b2b;<br /> --wiki-content-background-color--secondary--rgb: 43,43,43;<br /> --wiki-content-border-color: #006EE6;<br /> --wiki-content-border-color--rgb: 0,110,230;<br /> --wiki-content-link-color: #6d8afb;<br /> --wiki-content-link-color--rgb: 109,138,251;<br /> --wiki-content-text-mix-color: #9b9b9b;<br /> --wiki-content-text-mix-color--rgb: 155,155,155;<br /> --wiki-content-text-mix-color-95: #2a2a2a;<br /> --wiki-content-text-mix-color-95--rgb: 42,42,42;<br /> /* [ DARK THEME ] */<br /> --wiki-accent-color: #274690;<br /> --wiki-accent-color--rgb: 39, 70, 144;<br /> --wiki-accent-color--hover: #3659ac;<br /> --wiki-accent-color--hover--rgb: 54, 89, 172;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-label-color--rgb: 255, 255, 255;<br /> --wiki-accent-link-color: #22214d;<br /> --wiki-accent-link-color--rgb: 34, 33, 77;<br /> <br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> <br /> /*******************<br /> * Maybe edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-text-color--rgb: 237,237,237;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-content-redlink-color: #FC483B;<br /> --wiki-content-redlink-color--rgb: 252,72,59;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> --wiki-content-heading-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-link-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> --wiki-sidebar-heading-color--rgb: var(--wiki-content-heading-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--secondary--rgb);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-background-color--secondary--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-text-color--hover--rgb: var(--wiki-content-link-color--hover--rgb);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-border-color--rgb: var(--wiki-navigation-border-color--rgb);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> --wiki-navigation-selected-text-color--rgb: var(--wiki-content-text-color--rgb);<br /> /* [ DARK THEME ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-neutral-color--rgb: var(--wiki-content-text-mix-color--rgb);<br /> --wiki-alert-color: #ff4d61;<br /> --wiki-alert-color--rgb: 255,77,97;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-warning-color--rgb: 207,114,28;<br /> --wiki-success-color: #13aa45;<br /> --wiki-success-color--rgb: 19,170,69;<br /> /**/<br /> <br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK THEME, if you are making a light theme edit the other block ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--rgb: 255,255,255;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--inverted--rgb: 0,0,0;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--rgb: 221,221,221;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted--rgb: 51,51,51;<br /> <br /> --wiki-content-border-color--secondary: rgba(var(--wiki-content-border-color--rgb), 0.5);<br /> --wiki-content-border-color--secondary--rgb: var(--wiki-content-border-color--rgb);<br /> --wiki-content-border-color--accent: rgba(var(--wiki-accent-color--rgb), 0.5);<br /> --wiki-content-border-color--accent--rgb: var(--wiki-accent-color--rgb);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-link-label-color--rgb: 0,0,0;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--rgb: 255, 255, 255;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--inverted--rgb: 0, 0, 0;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--rgb: 221, 221, 221;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted--rgb: 51, 51, 51;<br /> /* [ DARK THEME ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-alert-label-color--rgb: 0,0,0;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-warning-label-color--rgb: 0, 0, 0;<br /> --wiki-success-label-color: #000000;<br /> --wiki-success-label-color--rgb: 0,0,0;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark theme */<br /> <br /> /******************************************************<br /> * DO NOT EDIT THESE, used for backwards compatibility *<br /> *******************************************************/<br /> :root {<br /> --wiki-heading-color:var(--wiki-content-heading-color);<br /> --wiki-heading-color--rgb:var(--wiki-content-heading-color--rgb);<br /> }<br /> <br /> /****************************************<br /> * End backwards compatibility variables *<br /> *****************************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background--rgb: var(--wiki-accent-color--rgb);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:rgba(var(--pi-secondary-background--rgb), 0.75);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:rgba(var(--pi-secondary-background--rgb), 0.18);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> /* for mobile screens */<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile, 100%);<br /> gap:10px;<br /> }<br /> <br /> @media screen and (min-width:990px) {<br /> #mp-container {<br /> /* for narrow screens, between 990px and 1350px */<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet, 1fr 1fr);<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop, 2fr 1fr 2fr);<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-heading-color);<br /> }<br /> <br /> .mp-box .welcome-message {<br /> font-size: 200%;<br /> font-family: var(--wiki-heading-font-family);<br /> margin: 0;<br /> padding: 5px 0;<br /> color: #fff;<br /> filter: drop-shadow(0px 2px 3px #000);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(filepath://MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: rgba(var(--wiki-content-link-color--rgb), 0.2);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> --druid-border-color--rgb: var(--wiki-content-border-color--rgb, 167, 215, 249);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:rgba(var(--druid-secondary-background-color--rgb), 0.75);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:rgba(var(--druid-link-color--rgb), 0.25);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid rgba(var(--druid-border-color--rgb), 0.5);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: rgb(127, 127, 127);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> }<br /> <br /> .spoiler-content &gt; span {<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: rgba(127, 127, 127, 0);<br /> }<br /> <br /> .spoiler-content.show &gt; span {<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /********* [[Template:Diagram]] *********/<br /> table.diagram {<br /> border-spacing: 0;<br /> background: transparent;<br /> --connector-border-color: var(--theme-box-border-color);<br /> }<br /> table.diagram.diagramdoc {<br /> /* theme-text-color gives the connectors better visibility in the template documentation */<br /> --connector-border-color: var(--theme-text-color);<br /> border: 1px solid var(--theme-box-border-color-light);<br /> border-radius: 4px;<br /> padding: 0.5em;<br /> }<br /> table.diagram tr {<br /> height: 1px;<br /> text-align: center;<br /> }<br /> table.diagram td.l {<br /> border-style: none;<br /> border-width: 1px;<br /> border-color: var(--connector-border-color);<br /> padding: 0.5em;<br /> }<br /> table.diagram td.n {<br /> padding: 0;<br /> }<br /> table.diagram td.db {<br /> border-bottom-style: dashed;<br /> }<br /> table.diagram td.dr {<br /> border-right-style: dashed;<br /> }<br /> table.diagram td.sb {<br /> border-bottom-style: solid;<br /> }<br /> table.diagram td.sr {<br /> border-right-style: solid;<br /> }<br /> table.diagram td.nb {<br /> border-bottom-style: solid;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.nr {<br /> border-right-style: solid;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.cf {<br /> position: relative;<br /> }<br /> table.diagram td.cf:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0.9px;<br /> height: 1px;<br /> border-bottom: 1px solid var(--connector-border-color);<br /> right: 0;<br /> bottom: 0;<br /> }<br /> table.diagram td.alt {<br /> position: relative;<br /> }<br /> table.diagram td.alt:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: -1px;<br /> border-width: 3px 8px 1px 0;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.alb {<br /> position: relative;<br /> }<br /> table.diagram td.alb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 8px 3px 0;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.art {<br /> position: relative;<br /> }<br /> table.diagram td.art:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> bottom: -1px;<br /> border-width: 3px 0 1px 8px;<br /> border-top-color: transparent;<br /> }<br /> table.diagram td.arb {<br /> position: relative;<br /> }<br /> table.diagram td.arb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> border-width: 0 0 3px 8px;<br /> border-bottom-color: transparent;<br /> }<br /> table.diagram td.atl {<br /> position: relative;<br /> }<br /> table.diagram td.atl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> top: 0;<br /> border-width: 0 1px 8px 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.atr {<br /> position: relative;<br /> }<br /> table.diagram td.atr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> top: 0;<br /> border-width: 0 3px 8px 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.abl {<br /> position: relative;<br /> }<br /> table.diagram td.abl:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> border-width: 8px 1px 0 3px;<br /> border-left-color: transparent;<br /> }<br /> table.diagram td.abr {<br /> position: relative;<br /> }<br /> table.diagram td.abr:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> width: 0;<br /> height: 0;<br /> box-sizing: content-box;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> left: 0;<br /> bottom: 0;<br /> border-width: 8px 3px 0 0;<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct, table.diagram td.cb {<br /> position: relative;<br /> }<br /> table.diagram td.sr.cb {<br /> border-right-color: transparent;<br /> }<br /> table.diagram td.ct:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: 0;<br /> top: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.cb:before {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -1px;<br /> bottom: 0;<br /> width: 100%;<br /> height: calc(100% - 4px);<br /> border-width: 0 1px 0 0;<br /> }<br /> table.diagram td.ct:after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> border-style: solid;<br /> border-color: var(--connector-border-color);<br /> right: -4px;<br /> bottom: -5px;<br /> width: 5px;<br /> height: 9px;<br /> border-width: 1px 1px 1px 0;<br /> border-radius: 0 10px 10px 0;<br /> }<br /> table.diagram td.no-border {<br /> border: none;<br /> }<br /> table.diagram td.craft-station {<br /> border: none;<br /> padding: 2px 0;<br /> }<br /> <br /> .diagram-box {<br /> border-width: 2px;<br /> border-style: solid;<br /> border-color: var(--theme-box-border-color);<br /> border-radius: 7px;<br /> padding: 0.25em 0.5em;<br /> }<br /> .diagram-box .note-text {<br /> line-height: 1.25;<br /> margin-top: 0.25em;<br /> }<br /> .diagram-box &gt; .note-text:first-child {<br /> margin-top: auto;<br /> }<br /> .diagram-box &gt; img:first-child {<br /> margin-top: 2px;<br /> }<br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /** Template stylings **/<br /> /* [[Template:Inventory slot]] */<br /> .invslot {<br /> box-sizing: unset;<br /> position: relative;<br /> display: inline-block;<br /> background: #8B8B8B no-repeat center center / 32px 32px;<br /> border: 2px solid;<br /> border-color: #373737 #FFF #FFF #373737;<br /> width: 32px;<br /> height: 32px;<br /> font-size: 16px;<br /> line-height: 1;<br /> text-align: left;<br /> vertical-align: bottom;<br /> }<br /> .invslot::before,<br /> .invslot::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> background-color: #8B8B8B;<br /> height: 2px;<br /> width: 2px;<br /> pointer-events: none;<br /> }<br /> .invslot::before {<br /> bottom: -2px;<br /> left: -2px;<br /> }<br /> .invslot::after {<br /> top: -2px;<br /> right: -2px;<br /> }<br /> <br /> .invslot-large {<br /> padding: 8px;<br /> }<br /> <br /> .invslot-item,<br /> .invslot-item a:first-child {<br /> position: relative;<br /> display: block;<br /> margin: -2px;<br /> padding: 2px;<br /> width: 32px;<br /> height: 32px;<br /> }<br /> <br /> /* [[File:Grid Unknown.png]] */<br /> .invslot-item-image a.new:first-child {<br /> background: url('https://minecraft.wiki/images/Grid_Unknown.png') no-repeat content-box;<br /> width: 32px;<br /> height: 32px;<br /> text-indent: -9999px;<br /> overflow: hidden;<br /> }<br /> <br /> /* Styling for tooltip */<br /> .explain {<br /> border-bottom: 0;<br /> text-decoration: underline dotted;<br /> cursor: help;<br /> }<br /> <br /> /* Show help cursor when an abbr element has a title attribute */<br /> abbr[title] {<br /> cursor: help;<br /> }<br /> <br /> /* Element animator */<br /> .mw-body-content .animated &gt; *:not(.animated-active),<br /> .mw-body-content .animated &gt; .animated-subframe &gt; *:not(.animated-active) {<br /> display: none<br /> }<br /> .mw-body-content span.animated,<br /> .mw-body-content span.animated.animated-visible &gt; *,<br /> .mw-body-content span.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: inline-block;<br /> }<br /> .mw-body-content div.animated.animated-visible &gt; *,<br /> .mw-body-content div.animated.animated-visible &gt; .animated-subframe &gt; * {<br /> display: block;<br /> }<br /> <br /> /* Styling for minecraft style tooltip */<br /> #minetip-tooltip {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> background-color: #100010;<br /> background-color: rgba(16, 0, 16, 0.94);<br /> padding: 0.375em;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> word-spacing: 4px;<br /> white-space: nowrap;<br /> line-height: 1.25em;<br /> margin: 0.125em 0.25em;<br /> pointer-events: none;<br /> z-index: 9999;<br /> }<br /> <br /> #minetip-tooltip::before {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: -0.125em;<br /> bottom: 0.125em;<br /> left: -0.125em;<br /> border: 0.15em solid #100010;<br /> border-style: none solid;<br /> border-color: rgba(16, 0, 16, 0.94);<br /> }<br /> <br /> #minetip-tooltip::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> top: 0.125em;<br /> right: 0;<br /> bottom: 0.125em;<br /> left: 0;<br /> border: 0.125em solid #2D0A63;<br /> border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;<br /> }<br /> <br /> #minetip-tooltip &gt; .description,<br /> #minetip-tooltip &gt; .minetip-description {<br /> display: block;<br /> margin-top: 0.25em;<br /> }<br /> <br /> /* Classes corresponding to Minecraft formatting codes */<br /> .format-0 {<br /> color: #000;<br /> text-shadow: 0.125em 0.125em 0 #000;<br /> }<br /> .format-1 {<br /> color: #0000A8;<br /> text-shadow: 0.125em 0.125em 0 #00002A;<br /> }<br /> .format-2 {<br /> color: #00A800;<br /> text-shadow: 0.125em 0.125em 0 #002A00;<br /> }<br /> .format-3 {<br /> color: #00A8A8;<br /> text-shadow: 0.125em 0.125em 0 #002A2A;<br /> }<br /> .format-4 {<br /> color: #A80000;<br /> text-shadow: 0.125em 0.125em 0 #2A0000;<br /> }<br /> .format-5 {<br /> color: #A800A8;<br /> text-shadow: 0.125em 0.125em 0 #2A002A;<br /> }<br /> .format-6 {<br /> color: #FBA800;<br /> text-shadow: 0.125em 0.125em 0 #3E2A00;<br /> }<br /> .format-7 {<br /> color: #A8A8A8;<br /> text-shadow: 0.125em 0.125em 0 #2A2A2A;<br /> }<br /> .format-8 {<br /> color: #545454;<br /> text-shadow: 0.125em 0.125em 0 #151515;<br /> }<br /> .format-9 {<br /> color: #5454FB;<br /> text-shadow: 0.125em 0.125em 0 #15153E;<br /> }<br /> .format-a {<br /> color: #54FB54;<br /> text-shadow: 0.125em 0.125em 0 #153E15;<br /> }<br /> .format-b {<br /> color: #54FBFB;<br /> text-shadow: 0.125em 0.125em 0 #153E3E;<br /> }<br /> .format-c {<br /> color: #FB5454;<br /> text-shadow: 0.125em 0.125em 0 #3E1515;<br /> }<br /> .format-d {<br /> color: #FB54FB;<br /> text-shadow: 0.125em 0.125em 0 #3E153E;<br /> }<br /> .format-e {<br /> color: #FBFB54;<br /> text-shadow: 0.125em 0.125em 0 #3E3E15;<br /> }<br /> .format-f,<br /> #minetip-tooltip {<br /> color: #FBFBFB;<br /> text-shadow: 0.125em 0.125em 0 #3E3E3E;<br /> }<br /> .format-g {<br /> color: #DDD605;<br /> text-shadow: 0.125em 0.125em 0 #373501;<br /> }<br /> .format-h {<br /> color: #E3D4D1;<br /> text-shadow: 0.125em 0.125em 0 #383534;<br /> }<br /> .format-i {<br /> color: #CECACA;<br /> text-shadow: 0.125em 0.125em 0 #333232;<br /> }<br /> .format-j {<br /> color: #443A3B;<br /> text-shadow: 0.125em 0.125em 0 #110E0E;<br /> }<br /> .format-l {<br /> font-weight: bold;<br /> letter-spacing: 0.125em;<br /> }<br /> .format-m {<br /> text-decoration: line-through;<br /> }<br /> .format-n {<br /> text-decoration: underline;<br /> }<br /> .format-o {<br /> font-style: italic;<br /> }<br /> .format-p {<br /> color: #DEB12D;<br /> text-shadow: 0.125em 0.125em 0 #372C0B;<br /> }<br /> .format-q {<br /> color: #47A036;<br /> text-shadow: 0.125em 0.125em 0 #04280D;<br /> }<br /> .format-s {<br /> color: #2CBAA8;<br /> text-shadow: 0.125em 0.125em 0 #0B2E2A;<br /> }<br /> .format-t {<br /> color: #21497B;<br /> text-shadow: 0.125em 0.125em 0 #08121E;<br /> }<br /> .format-u {<br /> color: #9A5CC6;<br /> text-shadow: 0.125em 0.125em 0 #261731;<br /> }<br /> .format-v {<br /> color: #EB7114;<br /> text-shadow: 0.125em 0.125em 0 #3B1D05;<br /> }<br /> /* Custom color codes because §m and §n are used twice. */<br /> .format-y {<br /> color: #971607;<br /> text-shadow: 0.125em 0.125em 0 #250501;<br /> }<br /> .format-z {<br /> color: #B4684D;<br /> text-shadow: 0.125em 0.125em 0 #2D1A13;<br /> }<br /> <br /> <br /> /* Try to use nearest neighbour scaling for pixelated images */<br /> .mcwiki-header-grass,<br /> .ns-special .gallerybox img,<br /> .ns-14 .gallerybox img,<br /> .filehistory a img,<br /> .pixel-image,<br /> .invslot-item-image,<br /> .sprite {<br /> image-rendering: optimizeSpeed;<br /> image-rendering: -webkit-optimize-contrast;<br /> image-rendering: optimize-contrast;<br /> image-rendering: -moz-crisp-edges;<br /> image-rendering: -o-crisp-edges;<br /> image-rendering: crisp-edges;<br /> image-rendering: pixelated;<br /> -ms-interpolation-mode: nearest-neighbor;<br /> }<br /> <br /> .invslot-stacksize {<br /> position: absolute;<br /> right: 0;<br /> bottom: 0;<br /> font-family: Minecraft, serif; !important;<br /> font-weight: normal !important;<br /> color: #FFF !important;<br /> text-shadow: 2px 2px 0 #3F3F3F;<br /> filter: dropshadow(color=#3F3F3F, offx=2, offy=2);<br /> z-index: 2;<br /> }<br /> <br /> /* Plain slot with no border or background */<br /> .invslot-plain {<br /> background-color: transparent;<br /> border: 0;<br /> }<br /> .invslot-plain::before,<br /> .invslot-plain::after {<br /> content: none;<br /> }<br /> .invslot-plain &gt; .invslot-item,<br /> .invslot-plain &gt; .invslot-item a:first-child {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Default background images:<br /> [[File:Grid layout Head Empty.png]],<br /> [[File:Grid layout Chest Empty.png]],<br /> [[File:Grid layout Legs Empty.png]],<br /> [[File:Grid layout Feet Empty.png]],<br /> [[File:Grid layout Offhand Empty.png]],<br /> [[File:Grid layout Smithing Empty.png]],<br /> [[File:Grid layout Brewing Empty.png]],<br /> [[File:Grid layout Brewing Fuel Empty.png]] */<br /> .invslot-default-head {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Head_Empty.png');<br /> }<br /> .invslot-default-chest {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Chest_Empty.png');<br /> }<br /> .invslot-default-legs {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Legs_Empty.png');<br /> }<br /> .invslot-default-feet {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Feet_Empty.png');<br /> }<br /> .invslot-default-offhand {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Offhand_Empty.png');<br /> }<br /> .invslot-default-smithing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Smithing_Empty.png');<br /> }<br /> .invslot-default-brewing {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .invslot-default-brewing-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel_Empty.png');<br /> }<br /> <br /> /* [[Template:hp]] */<br /> .mc-hearts::before {<br /> content: ' (';<br /> }<br /> .mc-hearts::after {<br /> content: ')';<br /> }<br /> <br /> /* Generic Minecraft interface styling: [[Module:UI]] */<br /> .mcui {<br /> display: inline-block;<br /> position: relative;<br /> background-color: #C6C6C6;<br /> border: 2px solid;<br /> border-color: #DBDBDB #5B5B5B #5B5B5B #DBDBDB;<br /> padding: 6px;<br /> text-align: left;<br /> white-space: nowrap;<br /> vertical-align: bottom;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; *,<br /> .mcui-Furnace &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> <br /> /* [[Template:Crafting Table]]:<br /> [[File:Grid layout Arrow (small).png]], [[File:Grid layout Shapeless.png]], [[File:Grid layout Fixed.png]] */<br /> .mcui-Crafting_Table .mcui-row {<br /> display: block;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png') no-repeat;<br /> width: 32px;<br /> height: 26px;<br /> margin: 40px 4px 0;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Crafting_Table &gt; .mcui-icons {<br /> position: absolute;<br /> top: 6px;<br /> right: 6px;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless,<br /> .mcui-Crafting_Table .mcui-fixed {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 19px;<br /> height: 15px;<br /> cursor: help;<br /> }<br /> .mcui-Crafting_Table .mcui-shapeless {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Shapeless.png');<br /> }<br /> .mcui-Crafting_Table .mcui-fixed {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fixed.png');<br /> }<br /> <br /> <br /> /* [[Template:Furnace]]:<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (in-active).png]]<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Furnace .mcui-fuel {<br /> display: block;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Fire.png') no-repeat;<br /> width: 36px;<br /> height: 36px;<br /> }<br /> .mcui-Furnace .mcui-fuel.mcui-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png') no-repeat;<br /> width: 44px;<br /> height: 32px;<br /> margin: 36px 18px 0 14px;<br /> }<br /> .mcui-Furnace &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Crafting_Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-output {<br /> margin-top: 28px;<br /> }<br /> <br /> .mcui-Furnace &gt; .mcui-experience {<br /> position: absolute;<br /> top: 92px;<br /> left: 108px;<br /> text-align: center;<br /> width: 70px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-orb {<br /> display: inline-block;<br /> margin-top: 3px;<br /> width: 16px;<br /> height: 16px;<br /> vertical-align: top;<br /> background-size: 16px 16px;<br /> }<br /> <br /> .mcui-Furnace .mcui-experience-text {<br /> display: inline-block;<br /> vertical-align: top;<br /> font-family: Minecraft, sans-serif;<br /> font-size: 16px;<br /> color: #404040;<br /> }<br /> <br /> /* [[Template:Brewing Stand]]:<br /> [[File:Grid layout Brewing Bubbles.gif]], [[File:Grid layout Brewing Bubbles (In-active).png]],<br /> [[File:Grid layout Brewing Arrow.png]], [[File:Grid layout Brewing Arrow (In-active).png]],<br /> [[File:Grid layout Brewing Paths.png]], [[File:Grid layout Brewing Empty.png]] */<br /> .mcui-Brewing_Stand &gt; * {<br /> display: block;<br /> }<br /> <br /> .mcui-Brewing_Stand .invslot {<br /> vertical-align: top;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input {<br /> text-align: center;<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-input &gt; .invslot {<br /> margin-top: 3px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Brewing_Stand .mcui-arrow {<br /> display: inline-block;<br /> background-repeat: no-repeat;<br /> width: 24px;<br /> height: 57px;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles.gif');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-bubbling,<br /> .mcui-Inventory-Brewing_Stand-bubbles-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Bubbles_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow.png');<br /> }<br /> .mcui-Brewing_Stand &gt; .mcui-input.mcui-inactive &gt; .mcui-arrow,<br /> .mcui-Inventory-Brewing_Stand-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Arrow_%28In-active%29.png');<br /> }<br /> <br /> .mcui-Brewing_Stand &gt; .mcui-paths {<br /> position: relative;<br /> background: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths.png') no-repeat;<br /> width: 60px;<br /> height: 40px;<br /> margin: -20px auto -16px;<br /> z-index: 1;<br /> }<br /> <br /> .mcui-Brewing_Stand .mcui-output .invslot {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Empty.png');<br /> }<br /> .mcui-Brewing_Stand .mcui-output2 {<br /> margin: 14px 10px 0;<br /> }<br /> <br /> /* [[Template:Anvil]]:<br /> [[File:Anvil Hammer.png]], [[File:Anvil Plus.png]],<br /> [[File:Anvil_GUI_bar.png]], [[File:Anvil_GUI_bar_(in-active).png]],<br /> [[File:Grid layout Anvil crossed.png]], [[File:Grid layout Furnace Progress (in-active).png]] */<br /> .mcui-Anvil &gt; .mcui-hammer,<br /> .mcui-Inventory-Anvil-hammer {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Hammer.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-plus,<br /> .mcui-Anvil &gt; .mcui-plus,<br /> .mcui-Inventory-Anvil-plus {<br /> background-image: url('https://minecraft.wiki/images/Anvil_Plus.png');<br /> }<br /> <br /> .mcui-Anvil &gt; .mcui-input,<br /> .mcui-Inventory-Anvil-input {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar.png');<br /> }<br /> .mcui-Anvil &gt; .mcui-input.mcui-inactive,<br /> .mcui-Inventory-Anvil-input-inactive {<br /> background-image: url('https://minecraft.wiki/images/Anvil_GUI_bar_%28in-active%29.png');<br /> }<br /> <br /> .mcui-Smithing_Table &gt; .mcui-arrow,<br /> .mcui-Anvil &gt; .mcui-arrow,<br /> .mcui-Inventory-Anvil-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> background-position-y: -2px;<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Anvil &gt; .mcui-arrow.mcui-inactive,<br /> .mcui-Inventory-Anvil-arrow-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Anvil_crossed.png');<br /> background-position-y: unset;<br /> }<br /> <br /> /* [[Template:Smithing Table]], [[Template:Legacy Smithing Table]]:<br /> [[File:Smithing Table Hammer_JE2.png]] [[File:Smithing Table Hammer_JE1_BE1.png]] */<br /> .mcui-Smithing_Table &gt; .mcui-hammer,<br /> .mcui-Inventory-Smithing_Table-hammer {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE2.png');<br /> }<br /> .mcui-Smithing_Table &gt; .mcui-hammer-legacy {<br /> background-image: url('https://minecraft.wiki/images/Smithing_Table_Hammer_JE1_BE1.png');<br /> }<br /> <br /> /* [[Template:Hotbar]]:<br /> [[File:Hotbar.png]], [[File:Hotbar selector.png]] */<br /> .mcui-Hotbar {<br /> display: inline-block;<br /> position: relative;<br /> border: 0;<br /> padding: 0;<br /> background-color: transparent;<br /> }<br /> .mcui-Hotbar &gt; .mcui-selector {<br /> position: absolute;<br /> top: -2px;<br /> margin-left: -2px;<br /> }<br /> .mcui-Hotbar &gt; .mcui-slots {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> margin: 2px;<br /> }<br /> .mcui-Hotbar .invslot {<br /> margin: 4px;<br /> }<br /> .mcui-Hotbar-image {<br /> background: url('https://minecraft.wiki/images/Hotbar.png') no-repeat;<br /> }<br /> .mcui-Hotbar-image-selected {<br /> background: url('https://minecraft.wiki/images/Hotbar_selector.png') no-repeat;<br /> }<br /> <br /> /* [[Template:Loom]] */<br /> .mcui-Loom &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Loom &gt; .mcui-tapestry {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom.png') no-repeat;<br /> width: 98px;<br /> height: 108px;<br /> }<br /> .mcui-Loom &gt; .mcui-loomArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Loom_Arrow.png') no-repeat;<br /> width: 54px;<br /> height: 54px;<br /> margin: 28px 4px 0 4px;<br /> }<br /> .mcui-Loom &gt; .mcui-output {<br /> margin-top: 38px;<br /> }<br /> .mcui-Loom .mcui-inputBanner {<br /> margin: 22px 10px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputDye {<br /> margin: 22px 50px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-inputPattern {<br /> margin: 60px 30px;<br /> position: absolute;<br /> }<br /> .mcui-Loom .mcui-bannerSprite {<br /> margin-left: 4px;<br /> }<br /> <br /> <br /> /* [[Template:Grindstone]] */<br /> .mcui-Grindstone &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Grindstone &gt; .mcui-grindstone {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Grindstone.png') no-repeat;<br /> width: 108px;<br /> height: 112px;<br /> }<br /> .mcui-Grindstone .mcui-input1 {<br /> margin: 6px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone .mcui-input2 {<br /> margin: 48px 36px;<br /> position: absolute;<br /> }<br /> .mcui-Grindstone &gt; .mcui-arrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png') no-repeat;<br /> width: 44px;<br /> height: 34px;<br /> margin: 36px 22px 0 22px;<br /> }<br /> .mcui-Grindstone &gt; .mcui-output {<br /> margin-top: 34px;<br /> }<br /> <br /> <br /> /* [[Template:Stonecutter]] */<br /> .mcui-Stonecutter &gt; * {<br /> display: inline-block;<br /> vertical-align: top;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-stonecutterArrow {<br /> background: url('https://minecraft.wiki/images/Grid_layout_Stonecutter_Arrow.png') no-repeat;<br /> width: 58px;<br /> height: 60px;<br /> margin: 9px 4px 0 4px;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-output {<br /> margin: 28px 0 28px 0;<br /> }<br /> .mcui-Stonecutter &gt; .mcui-input {<br /> margin-top: 36px;<br /> }<br /> .mcui-Stonecutter .mcui-stonecutterSprite {<br /> margin: 4px 0 0 5px;<br /> }<br /> <br /> /* [[Template:Inventory]]: [[File:Steve inventory.png]]<br /> [[File:Grid layout Recipe Book Button.png]], [[File:Grid layout Arrow (small).png]],<br /> [[File:Grid layout Fire.png]], [[File:Grid layout Fire (inactive).png]],<br /> [[File:Grid layout Furnace Progress.png]], [[File:Grid layout Furnace Progress (inactive).png]],<br /> [[File:Grid layout Brewing Pipes.png]], [[File:Grid layout Brewing Paths Long.png]],<br /> [[File:Grid layout Brewing Fuel.png]], [[File:Inventory background.png]] */<br /> .mcui-Inventory-Player-Steve {<br /> background-image: url('https://minecraft.wiki/images/Steve_inventory.png');<br /> }<br /> .mcui-Inventory-Recipe_Book-button {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Recipe_Book_Button.png');<br /> }<br /> .mcui-Inventory-Table-arrow {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Arrow_%28small%29.png');<br /> }<br /> .mcui-Inventory-Furnace-fire {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire.png');<br /> }<br /> .mcui-Inventory-Furnace-fire-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Fire_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Furnace-progress {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress.png');<br /> }<br /> .mcui-Inventory-Furnace-progress-inactive {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Furnace_Progress_%28in-active%29.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-pipes {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Pipes.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-paths {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Paths_Long.png');<br /> }<br /> .mcui-Inventory-Brewing_Stand-fuel {<br /> background-image: url('https://minecraft.wiki/images/Grid_layout_Brewing_Fuel.png');<br /> }<br /> .mcui-Inventory-border {<br /> -webkit-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -moz-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> -o-border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> border-image: url('https://minecraft.wiki/images/Inventory_background.png') 4 fill repeat;<br /> }<br /> <br /> .wikitable.crafting *,<br /> .wikitable.crafting:after,<br /> .wikitable.crafting:before {<br /> -webkit-box-sizing: unset;<br /> box-sizing: unset;<br /> }<br /> <br /> <br /> /* Diagram box for Races */<br /> .diagram-box.prerequisite { <br /> border-style: dashed;<br /> border-radius: 0;<br /> }<br /> <br /> /* End of Diagram Box */<br /> <br /> .race-grid {<br /> display: flex;<br /> flex-wrap: wrap;<br /> gap: 20px;<br /> justify-content: center;<br /> margin: 20px 0;<br /> }<br /> <br /> .race-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px; /* Increase width to allow more space for text */<br /> border: 1px solid #ddd;<br /> padding: 10px;<br /> border-radius: 8px;<br /> background-color: #1d1e1e;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> line-height: 0; /* Prevents gaps caused by line height */<br /> }<br /> .race-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .race-item:hover {<br /> transform: scale(1.05);<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);<br /> }<br /> <br /> .race-item img {<br /> width: 150px;<br /> height: 150px;<br /> object-fit: cover;<br /> border-radius: 4px; /* Optional: Adds slightly rounded corners */<br /> display: block; /* Eliminates inline spacing */<br /> margin: 0 auto;<br /> }<br /> <br /> .race-name {<br /> font-size: 1em; /* Adjust font size for better fit */<br /> margin-top: 10px; /* Add some space above the text */<br /> font-weight: bold;<br /> word-wrap: break-word; /* Allow text to wrap if too long */<br /> }<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) {<br /> border-color: #47ff91;<br /> }<br /> .navi-item:has(img[alt=&quot;Aspectual Magic&quot;]) .navi-name a {<br /> color: #47ff91;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* True Demon Lord Gradient (Purple Variants) */<br /> .animated-text-gradient-demon {<br /> background: linear-gradient(to right, #800080, #a349a4, #9400d3, #a349a4, #800080);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> /* True Hero Gradient (Orange Variants) */<br /> .animated-text-gradient-hero {<br /> background: linear-gradient(to right, #ff8c00, #ffa500, #ff4500, #ffa500, #ff8c00);<br /> background-size: 200% auto;<br /> -webkit-background-clip: text;<br /> -webkit-text-fill-color: transparent;<br /> color: transparent;<br /> animation: animated-text-gradient 2s linear infinite;<br /> font-weight: bold;<br /> }<br /> <br /> @keyframes animated-text-gradient {<br /> to {<br /> background-position: -200% center;<br /> }<br /> }<br /> <br /> /* Keeps this at the bottom please, it determines the logo to use for main page */<br /> @media only screen and (max-width: 750px) {<br /> .no-mobile {<br /> display: none;<br /> }<br /> <br /> .mobile-only {<br /> display: inherit;<br /> }<br /> .navi-item {<br /> width: 100px;<br /> }<br /> <br /> .navi-item img {<br /> width: 64px;<br /> height: 64px;<br /> }<br /> }<br /> <br /> .notaninfobox {<br /> position: relative;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width: 300px;<br /> font-size: 90%;<br /> background: var(--wiki-content-background-color--secondary);<br /> float: right;<br /> border: 1px solid #CCC;<br /> padding: 2px;<br /> overflow: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> clear: left;<br /> float: left;<br /> margin: 0 1em 1em 0<br /> }<br /> <br /> @media all and (max-width: 511px) {<br /> .notaninfobox {<br /> float:none;<br /> margin-left: 0;<br /> width: auto<br /> }<br /> <br /> .mw-content-rtl .notaninfobox {<br /> float: none;<br /> margin-right: 0<br /> }<br /> }<br /> <br /> @media all and (max-width: 337px) {<br /> .notaninfobox {<br /> margin-left:-16px;<br /> margin-right: -16px;<br /> border-left: none;<br /> border-right: none<br /> }<br /> }<br /> <br /> .notaninfobox &gt; .infobox-title {<br /> font-weight: bold;<br /> text-align: center;<br /> font-size: 120%;<br /> border: none<br /> }<br /> <br /> .notaninfobox .infobox-rows .infobox-header {<br /> text-align: center;<br /> font-size: 100%<br /> }<br /> <br /> .notaninfobox th + td &gt; dl &gt; dd,.notaninfobox th + td &gt; ul {<br /> list-style: none;<br /> margin-left: unset<br /> }<br /> <br /> .infobox-imagearea {<br /> text-align: center;<br /> padding: 4px<br /> }<br /> <br /> .infobox-imagearea &gt; div:not(:first-child) {<br /> padding-top: 1em<br /> }<br /> <br /> .infobox-imagearea img {<br /> max-width: 100%;<br /> height: auto<br /> }<br /> <br /> .mw-body-content .infobox-imagearea .animated {<br /> display: inline-flex;<br /> align-items: center<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.thumb {<br /> background: none;<br /> border: none;<br /> margin: 0<br /> }<br /> <br /> .infobox-imagearea ul.gallery,.infobox-imagearea li.gallerybox,.infobox-imagearea li.gallerybox div.thumb &gt; div {<br /> margin: 0 !important<br /> }<br /> <br /> .infobox-imagearea li.gallerybox div.gallerytext {<br /> font-weight: bold;<br /> font-size: 100%;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea .tabber .tabbertab,.infobox-imagearea ul.tabbernav li a,.infobox-imagearea ul.tabbernav li.tabberactive a {<br /> background: none;<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav {<br /> font: inherit;<br /> font-size: 100%<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav li a:hover,.infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #000<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li a:hover,:where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav li.tabberactive a:hover {<br /> color: #fff<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li {<br /> margin-bottom: 5px;<br /> padding: 0<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #595959;<br /> padding-bottom: 1px;<br /> display: block<br /> }<br /> <br /> :where(body.wgl-theme-dark) .infobox-imagearea ul.tabbernav &gt; li &gt; a {<br /> color: #a9a9a9<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li &gt; a::before {<br /> display: block;<br /> content: attr(alt);<br /> font-weight: bold;<br /> height: 0;<br /> color: transparent;<br /> overflow: hidden;<br /> visibility: hidden<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive {<br /> border: none<br /> }<br /> <br /> .infobox-imagearea ul.tabbernav &gt; li.tabberactive &gt; a {<br /> font-weight: bold;<br /> border-bottom: 2px solid var(--infobox-header-background-color);<br /> color: var(--content-text-color)<br /> }<br /> <br /> .infobox-imagecaption {<br /> overflow: hidden;<br /> font-weight: bold;<br /> word-wrap: break-word<br /> }<br /> <br /> .notaninfobox .infobox-rows {<br /> display: table;<br /> margin: 0 !important;<br /> width: 100% !important;<br /> border-collapse: separate;<br /> border-spacing: 1px<br /> }<br /> <br /> .infobox-rows &gt; tbody &gt; tr &gt; th {<br /> text-align: left;<br /> white-space: nowrap<br /> }<br /> <br /> .mw-body-content .infobox-rows p {<br /> margin: 0<br /> }<br /> <br /> .infobox-rows dl + dl {<br /> margin-top: -0.4em<br /> }<br /> <br /> .infobox-rows dl:last-child {<br /> margin-bottom: 0.2em<br /> }<br /> <br /> .infobox-footer {<br /> text-align: center<br /> }<br /> <br /> body.wgl-theme-light .drop-shadow-light img,body.wgl-theme-light img.drop-shadow-light,.drop-shadow img,img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));<br /> background: none<br /> }<br /> <br /> body.wgl-theme-dark .drop-shadow-dark img,body.wgl-theme-dark img.drop-shadow-dark,body.wgl-theme-dark .drop-shadow img,body.wgl-theme-dark img.drop-shadow {<br /> -webkit-filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> filter: drop-shadow(0 0 5px rgba(195,195,195,0.4));<br /> background: none<br /> }<br /> <br /> .history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {<br /> display: none;<br /> }<br /> <br /> @media only screen and (min-width: 751px) {<br /> .no-mobile {<br /> display: inherit;<br /> }<br /> <br /> .mobile-only {<br /> display: none;<br /> }<br /> }<br /> <br /> /* ==== Mysticism ==== */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> .navi-item--small {<br /> width: 100px;<br /> height: fit-content;<br /> }<br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }<br /> <br /> /* ==== Nightmares ==== */<br /> /* CSS placed here will be applied to all skins */<br /> <br /> :root{<br /> /* start font settings */<br /> --wiki-body-font-family: sans-serif;<br /> --wiki-heading-font-family: 'Linux Libertine','Georgia','Times',serif;<br /> --wiki-sidebar-heading-font-family: sans-serif;<br /> /* end font settings */<br /> <br /> /* start design variables */<br /> --wiki-sidebar-border-radius:0px; /* these two variables must have units specified even if 0, ignore the warning */<br /> --wiki-sidebar-portal-spacing:0px;<br /> <br /> --wiki-content-border-width:1px;<br /> --wiki-sidebar-border-width:1px;<br /> /* end design variables */<br /> }<br /> <br /> /* the rest of the variables will modify some type of color, either text color, background color, border color, etc. */<br /> <br /> :root,<br /> /* Begin light styles, delete from here to &quot;end light styles&quot; if you don't want your wiki to support any light themes (remove from [[Mediawiki:Theme-definitions]] too, or ask wiki.gg staff for help doing this) */<br /> /* FYI: .view- will affect any theme marked |kind=light, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-light {<br /> /**********************<br /> * Probably edit these * [ LIGHT VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #F6F6F6;<br /> --wiki-body-background-image: url(/images/8/80/Site-background.jpg); /* please find the file path by viewing the image directly (click the image from the File: page) */<br /> <br /> --wiki-content-background-color: #ffffff;<br /> --wiki-content-background-opacity: 100%;<br /> --wiki-content-border-color: #a7d7f9;<br /> --wiki-content-link-color: #0645ad; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ LIGHT VIEW ] */<br /> --wiki-accent-color: #3366cc;<br /> --wiki-accent-label-color: #ffffff;<br /> --wiki-accent-link-color: #D5FB51;<br /> <br /> --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ LIGHT VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #111111;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #ba0000;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 95%, var(--wiki-accent-label-color));<br /> /* [ LIGHT VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ LIGHT VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #bf0017;<br /> --wiki-warning-color: #b05f30;<br /> --wiki-success-color: #0c742f;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ LIGHT VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #000000;<br /> --wiki-body-dynamic-color--inverted: #ffffff;<br /> --wiki-body-dynamic-color--secondary: #333333;<br /> --wiki-body-dynamic-color--secondary--inverted: #dddddd;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #ffffff;<br /> --wiki-content-dynamic-color: #000000;<br /> --wiki-content-dynamic-color--inverted: #ffffff;<br /> --wiki-content-dynamic-color--secondary: #333333;<br /> --wiki-content-dynamic-color--secondary--inverted: #dddddd;<br /> /* [ LIGHT VIEW ] */<br /> --wiki-alert-label-color: #ffffff;<br /> --wiki-warning-label-color: #ffffff;<br /> --wiki-success-label-color: #ffffff;<br /> <br /> --wiki-icon-general-filter: ; /* do not set this to none, ignore the &quot;unexpected token&quot; error */<br /> /**/<br /> }<br /> /* end light styles */<br /> <br /> /* Begin dark styles, delete from here to &quot;end dark styles&quot; 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) */<br /> /* FYI: .view- will affect any theme marked |kind=dark, */<br /> /* individual themes are prefixed with .theme- instead */<br /> .view-dark {<br /> /**********************<br /> * Probably edit these * [ DARK VIEW ]<br /> ***********************/<br /> --wiki-body-background-color: #171717;<br /> --wiki-body-background-image: url(/images/c/c4/Site-background-dark.jpg); /* please find the file path by viewing the image directly (not at the File: page) */<br /> <br /> --wiki-content-background-color: #202020;<br /> --wiki-content-background-opacity: 90%;<br /> --wiki-content-border-color: #991A51;<br /> --wiki-content-link-color: #6d8afb; /* if changing this, remember to change --wiki-icon-to-link-filter as well!!! */<br /> /* [ DARK VIEW ] */<br /> --wiki-accent-color: #ff4d9d;<br /> --wiki-accent-label-color: #000;<br /> --wiki-accent-link-color: #1e1e43;<br /> <br /> --wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%); /* put your --wiki-content-link-color into https://mrpie5.gitlab.io/css-filter-generator/ */<br /> /**/<br /> <br /> /*******************<br /> * Maybe edit these * [ DARK VIEW ]<br /> ********************/<br /> --wiki-body-background-position: top center;<br /> --wiki-body-background-size:cover;<br /> --wiki-body-background-repeat: no-repeat;<br /> --wiki-body-background-attachment: fixed;<br /> <br /> --wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));<br /> --wiki-content-text-color: #ededed;<br /> --wiki-content-link-color--visited: var(--wiki-content-link-color);<br /> --wiki-content-link-color--hover: var(--wiki-content-link-color);<br /> --wiki-content-redlink-color: #FC5B4F;<br /> <br /> --wiki-content-heading-color: var(--wiki-content-text-color);<br /> <br /> --wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));<br /> /* [ DARK VIEW ] */<br /> --wiki-sidebar-background-color: var(--wiki-content-background-color);<br /> --wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);<br /> --wiki-sidebar-border-color: var(--wiki-content-border-color);<br /> --wiki-sidebar-link-color: var(--wiki-content-link-color);<br /> --wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-sidebar-heading-color: var(--wiki-content-heading-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-navigation-background-color: var(--wiki-content-background-color--secondary);<br /> --wiki-navigation-background-color--secondary: var(--wiki-content-background-color);<br /> --wiki-navigation-border-color: var(--wiki-content-border-color);<br /> --wiki-navigation-text-color: var(--wiki-content-link-color);<br /> --wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);<br /> --wiki-navigation-selected-background-color: var(--wiki-content-background-color);<br /> --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);<br /> --wiki-navigation-selected-text-color: var(--wiki-content-text-color);<br /> /* [ DARK VIEW ] */<br /> --wiki-neutral-color: var(--wiki-content-text-mix-color);<br /> --wiki-alert-color: #ff576a;<br /> --wiki-warning-color:#cf721c;<br /> --wiki-success-color: #13aa45;<br /> /**/<br /> <br /> /***********************************<br /> * Likely do not need to edit these * [ DARK VIEW ]<br /> ************************************/<br /> --wiki-body-dynamic-color: #ffffff;<br /> --wiki-body-dynamic-color--inverted: #000000;<br /> --wiki-body-dynamic-color--secondary: #dddddd;<br /> --wiki-body-dynamic-color--secondary--inverted: #333333;<br /> <br /> --wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);<br /> --wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);<br /> --wiki-content-link-label-color: #000;<br /> --wiki-content-dynamic-color: #ffffff;<br /> --wiki-content-dynamic-color--inverted: #000000;<br /> --wiki-content-dynamic-color--secondary: #dddddd;<br /> --wiki-content-dynamic-color--secondary--inverted: #333333;<br /> /* [ DARK VIEW ] */<br /> --wiki-alert-label-color: #000000;<br /> --wiki-warning-label-color: #000000;<br /> --wiki-success-label-color: #000000;<br /> <br /> --wiki-icon-general-filter: invert(100%);<br /> }<br /> <br /> /* End dark styles */<br /> <br /> /**************************************<br /> * Shared styles *<br /> * You likely don't need to edit these *<br /> ***************************************/<br /> :root{<br /> --wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);<br /> --wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));<br /> }<br /> /********************<br /> * End shared styles *<br /> *********************/<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> * DONT EDIT THIS *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .view-dark,<br /> .view-light,<br /> :root {<br /> --wiki-content-text-mix-color: var(--wiki-content-text-color);<br /> --wiki-content-text-mix-color-95: var(--wiki-content-background-color);<br /> --wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);<br /> --wiki-content-border-color--secondary: var(--wiki-content-border-color);<br /> --wiki-content-border-color--accent: var(--wiki-accent-color);<br /> --wiki-accent-color--hover: var(--wiki-accent-color);<br /> }<br /> }<br /> /*****************************<br /> * End older browser fallback *<br /> ******************************/<br /> <br /> /*****************************<br /> * PortableInfoboxes *<br /> ******************************/<br /> :root {<br /> --pi-background: var(--wiki-content-background-color);<br /> --pi-secondary-background: var(--wiki-accent-color);<br /> --pi-secondary-background-label: var(--wiki-accent-label-color);<br /> --pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-title,<br /> .portable-infobox .pi-header {<br /> text-align:center;<br /> font-size:1.5em;<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);<br /> color:var(--pi-secondary-background-label);<br /> }<br /> <br /> .portable-infobox .pi-data {<br /> background:var(--pi-secondary-background); /* fallback */<br /> background:color-mix(in srgb, var(--pi-secondary-background) 18%, transparent);<br /> }<br /> <br /> .portable-infobox .pi-image {<br /> padding: 8px;<br /> }<br /> <br /> .pi-image-thumbnail {<br /> max-width:100%;<br /> }<br /> <br /> .pi-caption {<br /> color: var(--wiki-content-text-mix-color);<br /> }<br /> <br /> .pi-section-navigation .pi-section-tab.pi-section-active,<br /> .pi-section-navigation .pi-section-tab.current,<br /> .pi-media-collection .pi-tab-link.current {<br /> background: var(--pi-secondary-background);<br /> color: var(--pi-secondary-background-label);<br /> }<br /> <br /> /* overqualify these to overwrite normal content heading styles */<br /> .mw-body .portable-infobox h2,<br /> .mw-body .portable-infobox h3 {<br /> border-bottom: 0;<br /> font-family: inherit;<br /> font-weight: 700;<br /> margin: 0;<br /> }<br /> /*****************************<br /> * End PortableInfoboxes *<br /> ******************************/<br /> <br /> <br /> /*******************<br /> * Main page layout *<br /> ********************/<br /> <br /> #mp-container {<br /> display:grid;<br /> gap:10px;<br /> }<br /> <br /> @media screen and (max-width:990px) {<br /> /* for mobile screens */<br /> #mp-container{<br /> grid-template-areas:var(--main-page-layout--mobile);<br /> grid-template-columns:var(--main-page-layout-columns--mobile,100%);<br /> }<br /> <br /> .mp-box.mp-hide-on-mobile {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:990px) and (max-width:1350px) {<br /> /* for narrow screens, between 990px and 1350px */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--tablet);<br /> grid-template-columns:var(--main-page-layout-columns--tablet,1fr 1fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-tablet {<br /> display:none;<br /> }<br /> }<br /> <br /> @media screen and (min-width:1350px) {<br /> /* for all other screens, 1350px and wider */<br /> #mp-container {<br /> grid-template-areas:var(--main-page-layout--desktop);<br /> grid-template-columns:var(--main-page-layout-columns--desktop,2fr 1fr 2fr);<br /> }<br /> <br /> .mp-box.mp-hide-on-desktop {<br /> display:none;<br /> }<br /> }<br /> <br /> .mp-box {<br /> position:relative;<br /> display:flex;<br /> flex-flow:column nowrap;<br /> width: calc(100% - 2px);<br /> box-sizing: border-box;<br /> background:var(--wiki-content-background-color--secondary); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-background-color--secondary) 25%, transparent);<br /> border:1px solid var(--wiki-content-border-color);<br /> padding:0px;<br /> }<br /> <br /> .mp-body {<br /> height: 100%;<br /> display: flex;<br /> padding:0.5em;<br /> flex-flow: column nowrap;<br /> }<br /> <br /> .mp-box.centered-content .mp-body {<br /> height: 100%;<br /> display: flex;<br /> flex-flow: column nowrap;<br /> justify-content: space-evenly;<br /> }<br /> <br /> .mp-box.has-floating-image {<br /> display:block;<br /> }<br /> <br /> .mp-box.has-floating-image .mp-body {<br /> height:unset;<br /> display:block;<br /> }<br /> <br /> /* overqualified to override normal heading styles */<br /> .mw-body .mp-box h2 {<br /> text-align:center;<br /> font-weight:bold;<br /> font-family:var(--wiki-heading-font-family);<br /> overflow: initial;<br /> border-bottom: 1px solid var(--wiki-content-border-color);<br /> font-size: 150%;<br /> margin: 0;<br /> padding: 5px 0;<br /> color:var(--wiki-content-heading-color);<br /> }<br /> <br /> #mp-box-welcome {<br /> text-align:center;<br /> position:relative;<br /> overflow:hidden;<br /> }<br /> <br /> #mp-box-welcome h2{<br /> font-size: 200%;<br /> }<br /> <br /> #mp-welcome {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> position: relative;<br /> height: 100%;<br /> z-index: 2;<br /> box-sizing: border-box;<br /> }<br /> <br /> #mp-welcome .welcome-subtitle {<br /> height: 100%;<br /> background:var(--wiki-content-dynamic-color--inverted); /* fallback */<br /> background:color-mix(in srgb, var(--wiki-content-dynamic-color--inverted) 85%, transparent);<br /> padding:0.5em;<br /> }<br /> <br /> #mp-banner {<br /> position: absolute;<br /> width: 100%;<br /> height: 100%;<br /> filter: blur(5px);<br /> z-index: -1;<br /> background: url(/images/e/e0/MP_banner.jpg);<br /> background-size: cover;<br /> background-repeat: no-repeat;<br /> background-position: top center;<br /> }<br /> <br /> .view-dark #mp-banner {<br /> filter: blur(5px) brightness(50%);<br /> }<br /> <br /> .view-light #mp-banner {<br /> filter: blur(5px) contrast(50%);<br /> }<br /> <br /> /* [[Template:MP_link]] */<br /> .mp-links {<br /> --gap:10px;<br /> }<br /> <br /> .mp-links &gt; ul {<br /> display: flex;<br /> flex-flow: row wrap;<br /> justify-content: space-evenly;<br /> margin: 2px;<br /> gap:var(--gap);<br /> }<br /> <br /> .mp-links &gt; ul &gt; li {<br /> display:flex;<br /> flex-flow:column nowrap;<br /> align-items:stretch;<br /> text-align: center;<br /> box-sizing:border-box;<br /> flex: max(calc(50% - var(--gap)), 5em) 1 1;<br /> outline:1px solid var(--wiki-content-link-color);<br /> transition:0.1s ease-in;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li:hover {<br /> background-color:var(--wiki-content-link-color); /* fallback */<br /> background-color:color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-links.columns-1 &gt; ul &gt; li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-2 &gt; ul &gt; li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-3 &gt; ul &gt; li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-4 &gt; ul &gt; li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-5 &gt; ul &gt; li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-6 &gt; ul &gt; li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-7 &gt; ul &gt; li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}<br /> .mp-links.columns-max &gt; ul &gt; li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}<br /> <br /> .mp-links &gt; ul &gt; li:hover a {<br /> text-decoration: underline;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> height:100%;<br /> flex:1 1 auto;<br /> box-sizing:border-box;<br /> padding:5px;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:first-child {<br /> height:100%;<br /> }<br /> <br /> .mp-links &gt; ul &gt; li &gt; a:last-child:not(:first-child) {<br /> height:unset;<br /> }<br /> <br /> .mp-links.stretch,<br /> .mp-links.stretch &gt; ul {<br /> height:100%;<br /> }<br /> <br /> .mp-links.side-image li {<br /> flex-flow:row nowrap;<br /> }<br /> <br /> .mp-links.plain &gt; ul &gt; li {<br /> outline-color:transparent;<br /> }<br /> <br /> /* MP icon lists */<br /> .mp-iconlists {<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 20px;<br /> }<br /> <br /> .mp-iconlists &gt; .mp-iconlist {<br /> flex: 1;<br /> min-width: fit-content;<br /> }<br /> <br /> .mp-iconlist &gt; h3 {<br /> padding: 0;<br /> margin: 0;<br /> }<br /> <br /> .mp-iconlist &gt; ul {<br /> list-style: none;<br /> margin: 0;<br /> }<br /> <br /> /* MP gallery */<br /> .mp-box ul.gallery.gallery.gallery { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display: flex;<br /> flex-flow: wrap;<br /> gap: 5px 10px;<br /> align-items: flex-end;<br /> justify-content: space-evenly;<br /> margin: auto;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext {<br /> margin-top: 1em;<br /> padding: 0;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> border: 1px solid var(--wiki-content-link-color);<br /> }<br /> <br /> .mp-box .gallerybox:hover .gallerytext {<br /> background-color: var(--wiki-content-link-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext &gt; p {<br /> margin: 0;<br /> }<br /> <br /> .mp-box ul.gallery .gallerytext a {<br /> display: block;<br /> padding: .5em 0;<br /> }<br /> <br /> /***********************<br /> * End main page layout *<br /> ************************/<br /> <br /> /****************************************/<br /> /******* Start DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> .druid-container {<br /> /* These variables are designed to inherit from your wiki's color variables.<br /> If your wiki uses a different naming scheme, change the inner names to match yours.<br /> If your wiki doesn't use color variables you should consider doing so,<br /> otherwise you can replace the inner variables or the fallback values with colors that match your wiki.<br /> */<br /> --druid-background-color: var(--wiki-content-background-color, #ffffff);<br /> <br /> --druid-secondary-background-color: var(--wiki-accent-color, #36c);<br /> --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);<br /> <br /> --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);<br /> <br /> --druid-border-color: var(--wiki-content-border-color, #a7d7f9);<br /> <br /> --druid-link-color: var(--wiki-content-link-color, #0645ad);<br /> --druid-link-label-color: var(--wiki-content-link-label-color, #fff);<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Safe to edit ABOVE this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Do not edit below this line */<br /> /* --------------------------------- */<br /> <br /> .druid-container {<br /> border: 4px solid var(--druid-border-color);<br /> border-radius: 3px;<br /> background: var(--druid-background-color);<br /> float: right;<br /> clear: right;<br /> margin: 0 0 1em 1em;<br /> width:100%;<br /> max-width:22em;<br /> box-sizing: border-box;<br /> border-collapse: collapse;<br /> }<br /> <br /> @media screen and (max-width: 720px) {<br /> .druid-container {<br /> float: none;<br /> margin: 0.5rem auto;<br /> }<br /> }<br /> <br /> .druid-main-images-file,<br /> .druid-main-image {<br /> text-align:center;<br /> }<br /> <br /> .druid-infobox .druid-title,<br /> .druid-infobox .druid-section {<br /> background:var(--druid-secondary-background-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-secondary-background-color) 75%, transparent);<br /> color:var(--druid-secondary-background-label-color);<br /> text-align:center;<br /> font-size:1.5em;<br /> padding:1px;<br /> }<br /> <br /> .druid-infobox .druid-section {<br /> font-size: 1.25em;<br /> font-weight: 500;<br /> }<br /> <br /> .druid-infobox .druid-collapsible .druid-section {<br /> flex-grow: 1;<br /> }<br /> <br /> .druid-label {<br /> font-weight:bold;<br /> text-align: right;<br /> box-sizing: border-box;<br /> }<br /> <br /> .druid-row &gt; .druid-label {<br /> width: 48%;<br /> flex-shrink: 0;<br /> }<br /> <br /> .druid-row &gt; .druid-label,<br /> .druid-row &gt; .druid-data {<br /> padding-inline: 0.3em;<br /> }<br /> <br /> .druid-main-image,<br /> .druid-main-images {<br /> padding:5px;<br /> }<br /> <br /> .druid-main-image img, <br /> .druid-main-images img {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .druid-main-images-labels {<br /> display:flex;<br /> flex-direction:row;<br /> flex-wrap:wrap;<br /> justify-content: space-evenly;<br /> margin:0.25em;<br /> gap:0.25em;<br /> }<br /> <br /> .druid-main-images-label {<br /> cursor:pointer;<br /> flex:1 1 auto;<br /> text-align:center;<br /> transition:.1s ease-in;<br /> outline:1px solid var(--druid-link-color);<br /> }<br /> <br /> .druid-main-images-label.focused {<br /> background:var(--druid-link-color);<br /> color:var(--druid-link-label-color);<br /> }<br /> <br /> .druid-main-images-label:not(.focused):hover {<br /> background:var(--druid-link-color); /* fallback */<br /> background:color-mix(in srgb, var(--druid-link-color) 25%, transparent);<br /> }<br /> <br /> .druid-toggleable-data:not(.focused),<br /> .druid-main-images-file:not(.focused),<br /> .druid-toggleable-heading:not(.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-section:has(.druid-toggleable-heading-empty.focused) {<br /> display:none;<br /> }<br /> <br /> .druid-grid {<br /> display:grid;<br /> gap: 0.3em;<br /> padding: 0.35em;<br /> }<br /> <br /> .druid-grid-item {<br /> background:var(--druid-tertiary-background-color);<br /> padding:0.25em;<br /> border:1px solid var(--druid-border-color); /* fallback */<br /> border:1px solid color-mix(in srgb, var(--druid-border-color) 50%, transparent);<br /> border-radius: 2px;<br /> }<br /> <br /> .druid-grid-item .druid-label,<br /> .druid-grid-item .druid-data {<br /> text-align: center;<br /> }<br /> <br /> .druid-data-wide {<br /> width:100%;<br /> }<br /> <br /> .druid-section-container &gt; .druid-collapsible {<br /> display: flex;<br /> justify-content: space-between;<br /> align-items: center;<br /> }<br /> <br /> .druid-collapsed {<br /> display:none!important;<br /> }<br /> <br /> .druid-collapsible {<br /> cursor:pointer;<br /> position:relative;<br /> }<br /> <br /> .druid-collapsible::after {<br /> content: &quot;&quot;;<br /> display: block;<br /> position: absolute;<br /> right: 10px;<br /> width: 20px;<br /> height: 20px;<br /> --mask: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E collapse %3C/title%3E%3Cpath d='M1 13.75l1.5 1.5 7.5-7.5 7.5 7.5 1.5-1.5-9-9-9 9z'/%3E%3C/svg%3E&quot;) no-repeat;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--druid-secondary-background-label-color);<br /> }<br /> <br /> .druid-collapsible-collapsed::after {<br /> transform: rotate(180deg);<br /> }<br /> <br /> .druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {<br /> display: none;<br /> }<br /> <br /> /*****************************************<br /> Div support<br /> *****************************************/<br /> <br /> div.druid-row {<br /> display:flex;<br /> margin-block: 1px;<br /> }<br /> <br /> div.druid-row + div.druid-row {<br /> margin-top: 0;<br /> }<br /> <br /> div.druid-row &gt; .druid-label {<br /> background: var(--druid-tertiary-background-color);<br /> }<br /> <br /> .druid-infobox .druid-title {<br /> font-weight: 700;<br /> }<br /> <br /> .druid-infobox #toc {<br /> display:none;<br /> }<br /> <br /> <br /> /********<br /> Custom display classes<br /> *********/<br /> <br /> div.druid-stacked.druid-row,<br /> .druid-stacked div.druid-row {<br /> flex-direction: column;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-label,<br /> .druid-stacked .druid-row &gt; .druid-label {<br /> text-align: left;<br /> width: 100%;<br /> flex-basis:unset;<br /> }<br /> <br /> .druid-stacked.druid-row &gt; .druid-data,<br /> .druid-stacked .druid-row &gt; .druid-data {<br /> padding-left: .75em;<br /> }<br /> <br /> /* --------------------------------- */<br /> /* Do not edit above this line */<br /> /* --------------------------------- */<br /> <br /> /* --------------------------------- */<br /> /* Local overrides go below this line */<br /> /* --------------------------------- */<br /> <br /> <br /> /****************************************/<br /> /******* End DRUID CSS rules *********/<br /> /****************************************/<br /> <br /> /*** Miscellaneous ***/<br /> .responsive-image {<br /> max-width:100%;<br /> height:auto;<br /> }<br /> <br /> .view-dark .invert-on-dark,<br /> .view-light .invert-on-light {<br /> filter:invert(100%);<br /> }<br /> <br /> .pixelated {<br /> image-rendering:pixelated;<br /> }<br /> <br /> @media screen and (min-width:720px) {<br /> .mobileonly {<br /> display:none;<br /> }<br /> }<br /> @media screen and (max-width:720px) {<br /> .nomobile {<br /> display:none;<br /> }<br /> }<br /> <br /> /*** Utility classes for standard MW galleries ***/<br /> /* it's important that spaced comes before centered in the sheet */<br /> .gallery.gallery.gallery.spaced { /* this selector looks ridiculous but is actually part of stock Vector and therefore a necessary override */<br /> display:flex;<br /> flex-flow:row wrap;<br /> justify-content:space-evenly;<br /> margin-left:unset;<br /> }<br /> <br /> .gallery.centered {<br /> text-align:center;<br /> }<br /> <br /> /**************************<br /> * Start Modular Templates *<br /> **************************/<br /> <br /> /********* [[Template:Ambox]] *********/<br /> .ambox {<br /> --ambox-color:var(--wiki-accent-color);<br /> <br /> border: 1px solid var(--wiki-content-border-color);<br /> border-left: 10px solid var(--ambox-color);<br /> border-radius: 2px;<br /> display: flex;<br /> align-items: center;<br /> gap: .6em;<br /> margin: 1em 0;<br /> padding: 3px .6em;<br /> background-color: var(--wiki-content-background-color--secondary);<br /> box-shadow: 2px 2px 5px 0px #0002;<br /> }<br /> <br /> @media (min-width: 720px) {<br /> .ambox {<br /> margin-inline: 10%;<br /> }<br /> }<br /> <br /> .ambox.tiny {<br /> padding: .04rem .5em;<br /> margin-inline: 0;<br /> width: fit-content;<br /> }<br /> <br /> .ambox + .ambox {<br /> margin-top: -.6em;<br /> }<br /> <br /> .ambox-content p {<br /> margin: .15em 0;<br /> }<br /> <br /> .ambox-title {<br /> font-weight: bold;<br /> }<br /> <br /> /********* [[Template:Hatnote]] *********/<br /> .hatnote {<br /> padding: 1px 0 1px 1.6em;<br /> margin-bottom: 0.5em;<br /> font-style: italic;<br /> border-top: 1px solid var(--wiki-content-border-color--secondary);<br /> border-bottom: 1px solid var(--wiki-content-border-color--secondary);<br /> }<br /> <br /> .hatnote.icon {<br /> padding-left: 0; <br /> }<br /> <br /> /********* [[Template:Spoiler]] *********/<br /> .spoiler-content {<br /> background-color: var(--wiki-content-dynamic-color); /* fallback */<br /> background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);<br /> transition: all 0.3s;<br /> cursor: pointer;<br /> overflow:auto;<br /> }<br /> <br /> .spoiler-content &gt; * {<br /> pointer-events:none;<br /> opacity: 0;<br /> transition: all 0.3s;<br /> }<br /> <br /> .spoiler-content.show {<br /> background-color: transparent;<br /> }<br /> <br /> .spoiler-content.show &gt; * {<br /> pointer-events:unset;<br /> opacity: 1;<br /> }<br /> <br /> /********* [[Template:Link icon]] *********/<br /> .link-icon {<br /> --link-icon-line-height: 1.5em;<br /> --link-icon-size: 1.5em; <br /> display: inline-flex; <br /> align-items: center;<br /> height: var(--link-icon-line-height);<br /> vertical-align: bottom;<br /> }<br /> <br /> .link-icon .regular {<br /> align-self: center;<br /> }<br /> <br /> .link-icon .regular a {<br /> display: flex;<br /> }<br /> <br /> .link-icon .regular img {<br /> height: var(--link-icon-size);<br /> max-width: var(--link-icon-size);<br /> }<br /> <br /> .link-icon .fallback {<br /> outline: 1px solid var(--wiki-content-text-color);<br /> border-radius: 50%;<br /> text-align: center;<br /> width: var(--link-icon-size);<br /> line-height: var(--link-icon-size);<br /> }<br /> <br /> .link-icon.notext .fallback {<br /> display: inline-block;<br /> }<br /> <br /> .link-icon.notext {<br /> display: inline;<br /> }<br /> <br /> /********* [[Template:Quote]] *********/<br /> .quote {<br /> background: var(--wiki-content-background-color--secondary);<br /> border-radius: 5px;<br /> border: 2px solid var(--wiki-content-border-color);<br /> margin: .5em 0;<br /> padding: .5em;<br /> overflow-y: hidden;<br /> }<br /> <br /> .quote .block {<br /> display: block;<br /> }<br /> <br /> .quote .title {<br /> font-size: large;<br /> font-weight: bold;<br /> }<br /> <br /> .quote .content {<br /> font-style: italic;<br /> }<br /> <br /> .quote .author {<br /> font-weight: bold;<br /> text-align: end;<br /> }<br /> <br /> .quote .marks-wrapper {<br /> display: flex;<br /> gap: 5px;<br /> }<br /> <br /> .quote .marks-wrapper::before,<br /> .quote .marks-wrapper::after {<br /> font-size: 100px;<br /> line-height: 0px;<br /> }<br /> <br /> .quote .marks-wrapper::before {<br /> content: &quot;\201C&quot;;<br /> margin-top: 40px;<br /> }<br /> <br /> .quote .marks-wrapper::after {<br /> content: &quot;\201D&quot;;<br /> align-self: end;<br /> margin-bottom: -10px;<br /> }<br /> <br /> .client-js .mw-charinsert-item {<br /> display:none;<br /> }<br /> <br /> /************************<br /> * End Modular Templates *<br /> *************************/<br /> <br /> /*****************************<br /> * Used by [[Template:Color]] *<br /> ******************************/<br /> .color__splotch {<br /> display:inline-block;<br /> height:1em;<br /> width:1em;<br /> box-sizing:border-box;<br /> vertical-align:text-top;<br /> border-radius:50%;<br /> border:1px solid var(--wiki-content-text-color); <br /> }<br /> /*********************<br /> * End Template:Color *<br /> **********************/<br /> <br /> /* Navi Grid Stuff */<br /> <br /> .navi-grid {<br /> display: flex;<br /> flex-wrap: wrap; /* Allows items to wrap to the next row */<br /> gap: 30px; /* Space between items */<br /> justify-content: center; /* Center-align the grid */<br /> margin: 20px 0; /* Add vertical spacing */<br /> }<br /> <br /> .navi-item {<br /> position: relative;<br /> text-align: center;<br /> width: 200px;<br /> padding: 10px;<br /> background-color: #1d1e1e;<br /> border: 2px solid #ddd;<br /> border-radius: 8px;<br /> transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;<br /> overflow: hidden;<br /> }<br /> <br /> .navi-item a::after {<br /> content: &quot;&quot;;<br /> position: absolute;<br /> inset: 0;<br /> }<br /> <br /> .navi-item:hover {<br /> transform: scale(1.05); /* Slight zoom-in effect on hover */<br /> background-color: #323434; /* Change background on hover */<br /> box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow on hover */<br /> }<br /> <br /> /* Add padding to the image to expand the clickable area */<br /> .navi-item img {<br /> width: calc(100% - 20px); /* Adjust width to fit within the box */<br /> height: auto; /* Maintain aspect ratio */<br /> padding: 10px; /* Expand clickable area */<br /> object-fit: cover; /* Ensures the image fits perfectly */<br /> display: block; /* Removes extra inline spacing */<br /> }<br /> <br /> .navi-name {<br /> font-size: 1.1em; /* Font size for the name */<br /> margin-top: 10px; /* Space between the image and the text */<br /> font-weight: bold; /* Bold text */<br /> text-align: center;<br /> color: #fff; /* Text color */<br /> word-wrap: break-word; /* Handles long names */<br /> }<br /> <br /> /* Skills */<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) {<br /> border-color: #A600D3;<br /> }<br /> .navi-item:has(img[alt=&quot;Skills&quot;]) .navi-name a {<br /> color: #A600D3;<br /> }<br /> <br /> /* Magics */<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) {<br /> border-color: #398BC2;<br /> }<br /> .navi-item:has(img[alt=&quot;Magics&quot;]) .navi-name a {<br /> color: #398BC2;<br /> }<br /> <br /> /* Battlewills */<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) {<br /> border-color: #FFA500;<br /> }<br /> .navi-item:has(img[alt=&quot;Battlewills&quot;]) .navi-name a {<br /> color: #FFA500;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) {<br /> border-color: #7349B3;<br /> }<br /> .navi-item:has(img[alt=&quot;Spiritual Magic&quot;]) .navi-name a {<br /> color: #7349B3;<br /> }<br /> <br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) {<br /> border-color: #3B62BB;<br /> }<br /> .navi-item:has(img[alt=&quot;Summoning Magic&quot;]) .navi-name a {<br /> color: #3B62BB;<br /> }<br /> <br /> /* Resistances */<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) {<br /> border-color: #00a8a8;<br /> }<br /> .navi-item:has(img[alt=&quot;Resistances&quot;]) .navi-name a {<br /> color: #00a8a8;<br /> }<br /> <br /> /* Intrinsic Skills */<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) {<br /> border-color: #54fcfc;<br /> }<br /> .navi-item:has(img[alt=&quot;Intrinsic Skills&quot;]) .navi-name a {<br /> color: #54fcfc;<br /> }<br /> <br /> /* Common Skills */<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) {<br /> border-color: #54fc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Common Skills&quot;]) .navi-name a {<br /> color: #54fc54;<br /> }<br /> <br /> /* Extra Skills */<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) {<br /> border-color: #fcfc54;<br /> }<br /> .navi-item:has(img[alt=&quot;Extra Skills&quot;]) .navi-name a {<br /> color: #fcfc54;<br /> }<br /> <br /> /* Unique Skills */<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) {<br /> border-color: #fca800;<br /> }<br /> .navi-item:has(img[alt=&quot;Unique Skills&quot;]) .navi-name a {<br /> color: #fca800;<br /> }<br /> <br /> /* Ultimate Skills */<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) {<br /> border-color: #fc5454;<br /> }<br /> .navi-item:has(img[alt=&quot;Ultimate Skills&quot;]) .navi-name a {<br /> color: #fc5454;<br /> }<br /> <br /> <br /> .animated &gt; * {<br /> display: none;<br /> }<br /> .animated &gt; .animated-active {<br /> display: block;<br /> }<br /> .animated-subframe &gt; * {<br /> display: none;<br /> }<br /> .animated-subframe &gt; .animated-active {<br /> display: block;<br /> }<br /> <br /> /* End of Navi Grid */<br /> <br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> <br /> /* Collapsed Section @/<br /> /* Default state: collapsed with arrow right (▶) */<br /> .collapsible-header::after {<br /> content: &quot; ▶&quot;; /* Arrow for collapsed */<br /> color: #007acc; /* Default arrow color */<br /> }<br /> <br /> /* Expanded state: arrow down (▼) */<br /> .collapsible-header.expanded::after {<br /> content: &quot; ▼&quot;; /* Arrow for expanded */<br /> color: #ff5722; /* Color for expanded arrow */<br /> }<br /> <br /> /* Collapsible content hidden by default */<br /> .collapsible-content {<br /> display: none;<br /> margin-left: 20px; /* Optional indentation */<br /> }<br /> <br /> /* Optional: Styling for the clickable header */<br /> .collapsible-header {<br /> cursor: pointer;<br /> font-weight: bold;<br /> color: #007acc; /* Header text color */<br /> }<br /> <br /> /* Optional: Hover effect for the header */<br /> .collapsible-header:hover {<br /> color: #005999; /* Change color on hover */<br /> }=== Gadgets/ranger/variables.css ===<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: color-mix(in srgb, var(--wiki-accent-color) 30%, transparent);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> --navbox-pill-selflink-background: color-mix(in srgb, var(--wiki-accent-color) 15%, transparent);/* background of pills with selflink in them */ <br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> --navbox-tree-line-color：var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> --navbox-pill-selflink-background: var(--wiki-content-background-color--secondary);<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> === Gadgets/ranger/main.css ===<br /> /** as of Module:navbox version 1.2.2 **/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /* pill with selflink<br /> *<br /> * Only select the deepest level for nested lists.<br /> * We have to use :has() to pick pills with selflink and<br /> * all browsers which support :has() should also support :is() and :not(),<br /> * therefore we can use :is() and :not() here safely.<br /> */<br /> .ranger-navbox.pill-mobile .hlist .ranger-list :is(li,dt,dd):has(.mw-selflink):not(:has(li, dt, dd)){ <br /> background: var(--navbox-pill-selflink-background);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> === Gadgets/ranger/navbox.css ===<br /> /** as of Module:navbox version 1.2.1 **/<br /> <br /> /*********************************************************************************************************************<br /> * Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *<br /> **********************************************************************************************************************/<br /> .hlist dl,<br /> .hlist ol,<br /> .hlist ul {<br /> margin: 0;<br /> padding: 0;<br /> }<br /> <br /> /* Display list items inline */<br /> .hlist dd,<br /> .hlist dt,<br /> .hlist li {<br /> /*<br /> * don't trust the note that says margin doesn't work with inline<br /> * removing margin: 0 makes dds have margins again<br /> * We also want to reset margin-right in Minerva<br /> */<br /> margin: 0; <br /> display: inline;<br /> }<br /> <br /> /* Display requested top-level lists inline */<br /> .hlist.inline,<br /> .hlist.inline dl,<br /> .hlist.inline ol,<br /> .hlist.inline ul,<br /> /* Display nested lists inline */<br /> .hlist dl dl,<br /> .hlist dl ol,<br /> .hlist dl ul,<br /> .hlist ol dl,<br /> .hlist ol ol,<br /> .hlist ol ul,<br /> .hlist ul dl,<br /> .hlist ul ol,<br /> .hlist ul ul {<br /> display: inline;<br /> }<br /> <br /> /* Hide empty list items */<br /> .hlist .mw-empty-li {<br /> display: none;<br /> }<br /> <br /> /* TODO: :not() can maybe be used here to remove the later rule. naive test<br /> * seems to work. more testing needed. like so: */<br /> .hlist dt:not(:last-child)::after {<br /> content: &quot;:\20&quot;;<br /> }<br /> .hlist dd:not(:last-child)::after,<br /> .hlist li:not(:last-child)::after {<br /> /* &quot;space, Middle Dot, space&quot; <br /> We use unicode numbers instead of the raw characters due to a Firefox encoding bug on unicode characters.<br /> The space is also encoded because raw spaces combined with a unicode number strips the spaces under some conditions such as single-line lists */<br /> /* content: &quot;\20\00B7\20&quot;; font-weight: bold; */<br /> /* &quot;space &amp;nbsp; • &amp;nbsp; space&quot; <br /> There may (and likely) be an extra whitespace between &lt;li&gt;s, <br /> therefore we have to use a space character as last character of this sequence. <br /> By this way, the last space and the next whitespce will collapse as a single space,<br /> to make the whitespace on both sides of the middle dot the same width.<br /> */<br /> content: &quot;\20\A0\2022\A0\20&quot;; <br /> font-weight: inherit;<br /> }<br /> <br /> /* Add parentheses around nested lists */<br /> .hlist dd ol::before,<br /> .hlist dd ul::before,<br /> .hlist dd dl::before,<br /> .hlist dt ol::before,<br /> .hlist dt ul::before,<br /> .hlist dt dl::before,<br /> .hlist li ol::before,<br /> .hlist li ul::before,<br /> .hlist li dl::before {<br /> content: &quot;\20(&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> .hlist dd ol::after,<br /> .hlist dd ul::after,<br /> .hlist dd dl::after,<br /> .hlist dt ol::after,<br /> .hlist dt ul::after,<br /> .hlist dt dl::after,<br /> .hlist li ol::after,<br /> .hlist li ul::after,<br /> .hlist li dl::after {<br /> content: &quot;)&quot;;<br /> font-weight: inherit;<br /> }<br /> <br /> /* Put ordinals in front of ordered list items */<br /> .hlist ol {<br /> counter-reset: listitem;<br /> }<br /> <br /> .hlist ol &gt; li {<br /> counter-increment: listitem;<br /> }<br /> <br /> .hlist ol &gt; li::before {<br /> content: &quot; &quot; counter(listitem) &quot;.\20&quot;;<br /> }<br /> <br /> /* Progressive enhancement:<br /> * try to make the dot always follow the list item in same line<br /> */<br /> .hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))){<br /> display: inline-block;<br /> }<br /> <br /> /********************************************<br /> * End semantically-correct horizontal lists *<br /> *********************************************/<br /> <br /> /**********************************************************<br /> * Template:Navbox (RANGER) (needs semantic horizontal lists above) *<br /> ***********************************************************/<br /> .ranger-navbox{<br /> --navbox-background: none; /* for entire navbox */<br /> --navbox-margin: 0.5em auto;<br /> --navbox-padding: 4px;<br /> --navbox-gap: 3px; /* when using zero-value, it must be 0px */<br /> --navbox-outer-border-color: var(--wiki-content-border-color--accent);<br /> --navbox-outer-border-width: 1px;<br /> --navbox-outer-border-style: solid;<br /> --navbox-outer-border-radius: 0px;<br /> --navbox-font-size: calc(1em - 2px);<br /> --navbox-title-color: var(--wiki-accent-label-color);<br /> --navbox-title-font-size: calc(125%);<br /> --navbox-title-background: var(--wiki-accent-color);<br /> --navbox-title-icon-color: var(--wiki-accent-label-color);<br /> --navbox-title-link-color: var(--navbox-title-color);<br /> --navbox-title-link-color--visited: var(--navbox-title-link-color);<br /> --navbox-title-link-color--hover: var(--wiki-accent-link-color);<br /> --navbox-title-redlink-color: var(--navbox-title-link-color);<br /> --navbox-title-link-decoration: underline solid;<br /> --navbox-title-redlink-decoration: underline wavy;<br /> --navbox-title-padding--y: 0.5em;<br /> --navbox-above-background: color-mix(in srgb, var(--wiki-content-text-color) 15%, transparent);<br /> --navbox-above-color: var(--wiki-content-text-color);<br /> --navbox-above-padding: var(--navbox-list-padding);<br /> --navbox-below-background: var(--navbox-above-background);<br /> --navbox-below-color: var(--navbox-above-color);<br /> --navbox-below-padding: var(--navbox-above-padding);<br /> --navbox-header-color: var(--navbox-title-color);<br /> --navbox-header-font-size: calc(110%);<br /> --navbox-header-background: var(--navbox-title-background);<br /> --navbox-header-icon-color: var(--navbox-title-icon-color);<br /> --navbox-header-link-color: var(--navbox-title-link-color);<br /> --navbox-header-link-color--visited: var(--navbox-title-link-color--visited);<br /> --navbox-header-link-color--hover: var(--navbox-title-link-color--hover);<br /> --navbox-header-redlink-color: var(--navbox-title-redlink-color);<br /> --navbox-header-link-decoration: var(--navbox-title-link-decoration);<br /> --navbox-header-redlink-decoration: var(--navbox-title-redlink-decoration);<br /> --navbox-header-padding--y: 0.3em;<br /> --navbox-subheader-font-size: calc(100%);<br /> --navbox-subheader-padding--y: calc(var(--navbox-header-padding--y)/2);<br /> --navbox-list-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 8%, transparent);<br /> --navbox-list-color: var(--wiki-content-text-color);<br /> --navbox-list-padding: 0.25em 0.5em;<br /> /* --navbox-group-* also apply to .ranger-subgroup */<br /> --navbox-group-text-align: left;<br /> --navbox-group-text-align--mobile: left; /* only for mobile view */<br /> --navbox-group-background: color-mix(in srgb, var(--wiki-accent-color) 20%, transparent);<br /> --navbox-group-color: var(--wiki-content-text-color);<br /> --navbox-group-padding: var(--navbox-list-padding);<br /> --navbox-tree-line-color: var(--navbox-group-background);<br /> --navbox-tree-line-width: 2px;<br /> --navbox-tree-indent: 1em;<br /> --navbox-tree-line-indent: 0.5em;<br /> --navbox-tree-line-spacing: var(--navbox-gap);<br /> --icon-chevron-down: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-chevron-down' 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='M6 9l6 6l6 -6'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --icon-metalinks: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-edit' 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='M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1'%3E%3C/path%3E%3Cpath d='M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z'%3E%3C/path%3E%3Cpath d='M16 5l3 3'%3E%3C/path%3E%3C/svg%3E&quot;);<br /> --navbox-icon-offset--x: 0.5rem; /* should be an absolute length (rem-based or px-based) */<br /> }<br /> .ranger-navbox.pill, <br /> .ranger-navbox.pill-mobile{<br /> /** vars for the &quot;pill&quot; style only (`.pill` and &quot;.pill-mobile&quot; clases) **/<br /> --navbox-pill-gap: 0.3em;<br /> --navbox-pill-padding: 0.25em 0.75em;<br /> --navbox-pill-border-radius: 3px;<br /> --navbox-pill-box-shadow: none;<br /> --navbox-pill-background: color-mix(in srgb, var(--wiki-content-text-color) 5%, transparent);<br /> --navbox-pill-box-shadow--hover: inset 0 0 3px var(--navbox-list-color);<br /> --navbox-pill-background--hover: var(--navbox-pill-background);<br /> /* remove list cell background */<br /> --navbox-list-background: none;<br /> --navbox-list-background--striped: color-mix(in srgb, var(--wiki-content-text-color) 3%, transparent);<br /> }<br /> .ranger-navbox.no-underline-title-links{<br /> --navbox-title-link-color: var(--wiki-accent-link-color);<br /> --navbox-title-link-decoration: none;<br /> --navbox-title-redlink-decoration: none;<br /> }<br /> .ranger-navbox.noborder,<br /> .ranger-navbox.no-border{<br /> --navbox-padding: 0px;<br /> --navbox-outer-border-width: 0px;<br /> }<br /> <br /> /******************************<br /> * Fallback for older browsers *<br /> *******************************/<br /> @supports not (color:color-mix(in srgb, #000, transparent)) {<br /> .ranger-navbox {<br /> --navbox-above-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background: transparent;<br /> --navbox-list-background--striped: var(--wiki-content-background-color--secondary);<br /> --navbox-group-background: var(--wiki-content-background-color--secondary);<br /> }<br /> .ranger-navbox.pill {<br /> --navbox-pill-background: var(--wiki-content-background-color--secondary);<br /> --navbox-list-background--striped: transparent;<br /> }<br /> }<br /> /***************<br /> * End fallback *<br /> ****************/<br /> <br /> .ranger-navbox{<br /> border-color: var(--navbox-outer-border-color);<br /> border-style: var(--navbox-outer-border-style);<br /> border-width: var(--navbox-outer-border-width);<br /> border-radius: var(--navbox-outer-border-radius);<br /> padding: var(--navbox-padding);<br /> font-size: var(--navbox-font-size);<br /> margin: var(--navbox-margin);<br /> background: var(--navbox-background);<br /> line-height: 1.5;<br /> clear:both;<br /> }<br /> <br /> .ranger-navbox * {<br /> border: 0;<br /> }<br /> .ranger-navbox .center *{<br /> margin-left: unset;<br /> margin-right: unset;<br /> }<br /> .ranger-navbox, <br /> .ranger-navbox .ranger-section,<br /> .ranger-navbox .ranger-listbox{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-title,<br /> .ranger-navbox .ranger-header{<br /> text-align: center;<br /> min-height: 1.5em;<br /> position: relative;<br /> z-index: 0;<br /> font-weight: bold;<br /> }<br /> .ranger-navbox .ranger-title{<br /> color: var(--navbox-title-color);<br /> background: var(--navbox-title-background);<br /> font-size: var(--navbox-title-font-size);<br /> padding: var(--navbox-title-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a:visited,<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited,<br /> .ranger-navbox .ranger-title a.external:hover {<br /> text-decoration: var(--navbox-title-link-decoration);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited {<br /> text-decoration: var(--navbox-title-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-title a,<br /> .ranger-navbox .ranger-title a.external,<br /> .ranger-navbox .ranger-title a.external:visited {<br /> color: var(--navbox-title-link-color);<br /> }<br /> .ranger-navbox .ranger-title a:visited{<br /> color: var(--navbox-title-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-title a.new,<br /> .ranger-navbox .ranger-title a.new:visited{<br /> color:var(--navbox-title-redlink-color);<br /> }<br /> .ranger-navbox .ranger-title a:hover,<br /> .ranger-navbox .ranger-title a:visited:hover,<br /> .ranger-navbox .ranger-title a.external:hover,<br /> .ranger-navbox .ranger-title a.external:visited:hover {<br /> color:var(--navbox-title-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-header{<br /> color: var(--navbox-header-color);<br /> background: var(--navbox-header-background);<br /> font-size: var(--navbox-header-font-size);<br /> padding: var(--navbox-header-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header{<br /> font-size: var(--navbox-subheader-font-size);<br /> padding: var(--navbox-subheader-padding--y) calc(1.5em + var(--navbox-icon-offset--x)); /* left and right padding equal to the size and position of the edit/collapse buttons */<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a:visited,<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited,<br /> .ranger-navbox .ranger-header a.external:hover {<br /> text-decoration: var(--navbox-header-link-decoration);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited {<br /> text-decoration: var(--navbox-header-redlink-decoration);<br /> }<br /> .ranger-navbox .ranger-header a,<br /> .ranger-navbox .ranger-header a.external,<br /> .ranger-navbox .ranger-header a.external:visited {<br /> color: var(--navbox-header-link-color);<br /> }<br /> .ranger-navbox .ranger-header a:visited{<br /> color: var(--navbox-header-link-color--visited);<br /> }<br /> .ranger-navbox .ranger-header a.new,<br /> .ranger-navbox .ranger-header a.new:visited{<br /> color:var(--navbox-header-redlink-color);<br /> }<br /> .ranger-navbox .ranger-header a:hover,<br /> .ranger-navbox .ranger-header a:visited:hover,<br /> .ranger-navbox .ranger-header a.external:hover,<br /> .ranger-navbox .ranger-header a.external:visited:hover {<br /> color:var(--navbox-header-link-color--hover);<br /> }<br /> .ranger-navbox .ranger-meta{<br /> font-size: var(--navbox-title-font-size);<br /> position: absolute;<br /> left: var(--navbox-icon-offset--x);<br /> top: calc(var(--navbox-title-padding--y) + 0.08em); /* 0.08em: vertial offset tweak based on the icon graph */<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-meta .nv{<br /> --mask: var(--icon-metalinks);<br /> display: block;<br /> width: 0.84em; /* based on the icon graph */<br /> height: 0.84em;<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> opacity: 0;<br /> }<br /> .ranger-navbox .ranger-meta .nv &gt; a &gt; span{<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow: hidden;<br /> }<br /> .ranger-navbox .ranger-meta:has(.mw-selflink){<br /> display: none;<br /> }<br /> .ranger-navbox,<br /> .ranger-navbox .ranger-section{<br /> position: relative;<br /> }<br /> .ranger .mw-collapsible-toggle-placeholder{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text{<br /> pointer-events: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .ranger-title-text a,<br /> .ranger-navbox .ranger-header &gt; .ranger-header-text a{<br /> pointer-events: auto;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle{<br /> --mask: var(--icon-chevron-down);<br /> position: absolute;<br /> right: 0;<br /> top: 0;<br /> z-index: -1;<br /> display: block;<br /> width: 100%;<br /> height: 100%;<br /> overflow:hidden;<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> width: 1.5em;<br /> height: 1.5em;<br /> right: var(--navbox-icon-offset--x);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> content: &quot;&quot;;<br /> display: block;<br /> width: 1.5em;<br /> height: 1.5em;<br /> position: absolute;<br /> right: var(--navbox-icon-offset--x);<br /> -webkit-mask: var(--mask);<br /> mask: var(--mask);<br /> -webkit-mask-size: 100% 100%;<br /> mask-size: 100% 100%;<br /> -webkit-mask-position: center center;<br /> mask-position: center center;<br /> background-color: var(--navbox-title-icon-color);<br /> transform: scaleY(-1);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-title-padding--y);<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-header-padding--y);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: var(--navbox-subheader-padding--y);<br /> }<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-title &gt; .mw-collapsible-toggle::before,<br /> .ranger-navbox.small-collapsible-toggle-click-area .ranger-header &gt; .mw-collapsible-toggle::before{<br /> top: 0;<br /> right: 0;<br /> }<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::before{<br /> background-color: var(--navbox-header-icon-color);<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle.mw-collapsible-toggle-collapsed::before{<br /> transform: none;<br /> }<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-title &gt; .mw-collapsible-toggle::after,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle *,<br /> .ranger-navbox .ranger-header &gt; .mw-collapsible-toggle::after{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-list{<br /> width: unset;<br /> padding: var(--navbox-list-padding);<br /> }<br /> .ranger-navbox .ranger-above{<br /> background: var(--navbox-above-background);<br /> color: var(--navbox-above-color);<br /> padding: var(--navbox-above-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-below{<br /> background: var(--navbox-below-background);<br /> color: var(--navbox-below-color);<br /> padding: var(--navbox-below-padding);<br /> width: unset;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> display: flex;<br /> flex-direction: column;<br /> gap: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-section-body{<br /> display: grid;<br /> gap: var(--navbox-gap);<br /> grid-template-columns: auto minmax(0,1fr);<br /> }<br /> /* gap fix for collapsed content */<br /> .ranger-navbox [class^=&quot;ranger-&quot;][hidden=&quot;until-found&quot;]{<br /> margin-top: calc(0px - var(--navbox-gap)) !important;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: contents;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align);<br /> white-space: nowrap;<br /> font-weight: bold;<br /> background: var(--navbox-group-background);<br /> color: var(--navbox-group-color);<br /> padding: var(--navbox-group-padding);<br /> width: unset;<br /> }<br /> /* for desktop view */<br /> .ranger-navbox.group-align-left .ranger-group,<br /> .ranger-navbox.group-align-left .ranger-subgroup{<br /> --navbox-group-text-align: left;<br /> }<br /> .ranger-navbox.group-align-center .ranger-group,<br /> .ranger-navbox.group-align-center .ranger-subgroup{<br /> --navbox-group-text-align: center;<br /> }<br /> .ranger-navbox.group-align-right .ranger-group,<br /> .ranger-navbox.group-align-right .ranger-subgroup{<br /> --navbox-group-text-align: right;<br /> }<br /> /* for mobile view */<br /> .ranger-navbox.mobile-group-align-left .ranger-group,<br /> .ranger-navbox.mobile-group-align-left .ranger-subgroup{<br /> --navbox-group-text-align--mobile: left;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-center .ranger-group,<br /> .ranger-navbox.mobile-group-align-center .ranger-subgroup{<br /> --navbox-group-text-align--mobile: center;<br /> }<br /> <br /> .ranger-navbox.mobile-group-align-right .ranger-group,<br /> .ranger-navbox.mobile-group-align-right .ranger-subgroup{<br /> --navbox-group-text-align--mobile: right;<br /> }<br /> <br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> background: var(--navbox-list-background);<br /> color: var(--navbox-list-color);<br /> flex-grow: 1;<br /> }<br /> .ranger-navbox .ranger-sublist{<br /> flex-grow: var(--count);<br /> }<br /> .ranger-navbox .ranger-listbox:first-child{ /* A list-n without group-n */<br /> grid-column-end: span 2;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox &gt; .ranger-wrap{<br /> display: grid;<br /> justify-items: stretch;<br /> align-items: center;<br /> }<br /> .ranger-navbox.striped-even .ranger-even,<br /> .ranger-navbox.striped-odd .ranger-odd{<br /> background: var(--navbox-list-background--striped);<br /> }<br /> /* make links use full line height (larger click box)*/<br /> .ranger-navbox .hlist a{<br /> display: inline-block;<br /> }<br /> <br /> .ranger-navbox .align-left,<br /> .ranger-navbox .alignleft{<br /> text-align: left;<br /> }<br /> .ranger-navbox .align-center,<br /> .ranger-navbox .aligncenter{<br /> text-align: center;<br /> }<br /> .ranger-navbox .align-right,<br /> .ranger-navbox .alignright{<br /> text-align: right;<br /> }<br /> <br /> /* responsive */<br /> @media screen and (max-width: 720px) {<br /> .ranger-navbox .ranger-section-body,<br /> .ranger-navbox .ranger-sublist {<br /> display: flex;<br /> flex-flow: column;<br /> }<br /> .ranger-navbox .ranger-row{<br /> display: block;<br /> }<br /> .ranger-navbox .ranger-group + .ranger-listbox &gt; .ranger-sublist:first-child,<br /> .ranger-navbox .ranger-subgroup + .ranger-listbox &gt; .ranger-sublist:first-child{<br /> margin-top: var(--navbox-gap);<br /> }<br /> .ranger-navbox .ranger-listbox.empty{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-group,<br /> .ranger-navbox .ranger-subgroup{<br /> text-align: var(--navbox-group-text-align--mobile);<br /> white-space: normal;<br /> }<br /> <br /> .ranger-navbox .ranger-sublist {<br /> padding-left: var(--navbox-tree-indent);<br /> margin-left: var(--navbox-tree-line-indent);<br /> }<br /> .ranger-navbox .ranger-subgroup,<br /> .ranger-navbox .ranger-listbox {<br /> position:relative;<br /> }<br /> .ranger-navbox .ranger-group br,<br /> .ranger-navbox .ranger-subgroup br{<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist &gt; .ranger-section &gt; .ranger-header{<br /> margin-left: calc( 0px - var(--navbox-tree-indent) - var(--navbox-tree-line-indent));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; ::before{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent));<br /> top: 0;<br /> width: var(--navbox-tree-line-width);<br /> height: 100%;<br /> content: '';<br /> display: block;<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row &gt; .ranger-listbox::before,<br /> .ranger-navbox .ranger-row.empty-list &gt; .ranger-subgroup::before{<br /> height: calc(100% + var(--navbox-gap));<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; ::before {<br /> display: none;<br /> }<br /> .ranger-navbox .ranger-sublist .ranger-row:last-child &gt; :first-child::before {<br /> display: block;<br /> height: calc(50% + var(--navbox-tree-line-width)/2);<br /> }<br /> .ranger-navbox .ranger-subgroup::after,<br /> .ranger-navbox .empty-group &gt; .ranger-listbox &gt; .ranger-wrap::after{<br /> position: absolute;<br /> left: calc(0px - var(--navbox-tree-indent) + var(--navbox-tree-line-width));<br /> width: calc(var(--navbox-tree-indent) - var(--navbox-tree-line-spacing) - var(--navbox-tree-line-width));<br /> height: var(--navbox-tree-line-width);<br /> content: '';<br /> background-color: var(--navbox-tree-line-color);<br /> }<br /> /* increase height for links */<br /> .ranger-navbox .hlist{<br /> line-height: 2;<br /> }<br /> }<br /> /**** `.pill` class: the &quot;pill&quot; style ****/<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill .hlist dd ol::before,<br /> .ranger-navbox.pill .hlist dd ul::before,<br /> .ranger-navbox.pill .hlist dd dl::before,<br /> .ranger-navbox.pill .hlist dt ol::before,<br /> .ranger-navbox.pill .hlist dt ul::before,<br /> .ranger-navbox.pill .hlist dt dl::before,<br /> .ranger-navbox.pill .hlist li ol::before,<br /> .ranger-navbox.pill .hlist li ul::before,<br /> .ranger-navbox.pill .hlist li dl::before,<br /> .ranger-navbox.pill .hlist dd ol::after,<br /> .ranger-navbox.pill .hlist dd ul::after,<br /> .ranger-navbox.pill .hlist dd dl::after,<br /> .ranger-navbox.pill .hlist dt ol::after,<br /> .ranger-navbox.pill .hlist dt ul::after,<br /> .ranger-navbox.pill .hlist dt dl::after,<br /> .ranger-navbox.pill .hlist li ol::after,<br /> .ranger-navbox.pill .hlist li ul::after,<br /> .ranger-navbox.pill .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill .hlist ul,<br /> .ranger-navbox.pill .hlist ol,<br /> .ranger-navbox.pill .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill .hlist li,<br /> .ranger-navbox.pill .hlist dt,<br /> .ranger-navbox.pill .hlist dd{<br /> padding: var(--navbox-pill-padding);<br /> border-radius: var(--navbox-pill-border-radius);<br /> box-shadow: var(--navbox-pill-box-shadow);<br /> background: var(--navbox-pill-background);<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap); <br /> flex-wrap: wrap;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill .hlist dd:hover,<br /> .ranger-navbox.pill .hlist dd:focus,<br /> .ranger-navbox.pill .hlist dt:hover,<br /> .ranger-navbox.pill .hlist dt:focus,<br /> .ranger-navbox.pill .hlist li:hover,<br /> .ranger-navbox.pill .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> /**** `.pill-mobile` class: only apply the &quot;pill&quot; style on mobile ****/<br /> @media screen and (max-width: 720px) {<br /> /* remove middle dots betweem items */<br /> .ranger-navbox.pill-mobile .hlist dd:not(:last-child)::after,<br /> .ranger-navbox.pill-mobile .hlist li:not(:last-child)::after{<br /> display: none;<br /> }<br /> /* remove parentheses around nested lists*/<br /> .ranger-navbox.pill-mobile .hlist dd ol::before,<br /> .ranger-navbox.pill-mobile .hlist dd ul::before,<br /> .ranger-navbox.pill-mobile .hlist dd dl::before,<br /> .ranger-navbox.pill-mobile .hlist dt ol::before,<br /> .ranger-navbox.pill-mobile .hlist dt ul::before,<br /> .ranger-navbox.pill-mobile .hlist dt dl::before,<br /> .ranger-navbox.pill-mobile .hlist li ol::before,<br /> .ranger-navbox.pill-mobile .hlist li ul::before,<br /> .ranger-navbox.pill-mobile .hlist li dl::before,<br /> .ranger-navbox.pill-mobile .hlist dd ol::after,<br /> .ranger-navbox.pill-mobile .hlist dd ul::after,<br /> .ranger-navbox.pill-mobile .hlist dd dl::after,<br /> .ranger-navbox.pill-mobile .hlist dt ol::after,<br /> .ranger-navbox.pill-mobile .hlist dt ul::after,<br /> .ranger-navbox.pill-mobile .hlist dt dl::after,<br /> .ranger-navbox.pill-mobile .hlist li ol::after,<br /> .ranger-navbox.pill-mobile .hlist li ul::after,<br /> .ranger-navbox.pill-mobile .hlist li dl::after {<br /> display: none;<br /> }<br /> /* make lists inline-flex */<br /> .ranger-navbox.pill-mobile .hlist ul,<br /> .ranger-navbox.pill-mobile .hlist ol,<br /> .ranger-navbox.pill-mobile .hlist dl{<br /> display: inline-flex;<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* &quot;pill&quot; style for items */<br /> .ranger-navbox.pill-mobile .hlist li,<br /> .ranger-navbox.pill-mobile .hlist dt,<br /> .ranger-navbox.pill-mobile .hlist dd{<br /> /* 100% height */<br /> display: flex;<br /> align-items: center;<br /> /* for nested lists */<br /> gap: var(--navbox-pill-gap);<br /> flex-wrap: wrap;<br /> }<br /> /* further tweak to make text flow looks better for &lt;li&gt; in &lt;ol&gt; */<br /> .ranger-navbox.pill-mobile .hlist li:not(:has(li,ul,ol)){<br /> display: inline-block;<br /> }<br /> /* Add a hover / focus feedback style */<br /> .ranger-navbox.pill-mobile .hlist dd:hover,<br /> .ranger-navbox.pill-mobile .hlist dd:focus,<br /> .ranger-navbox.pill-mobile .hlist dt:hover,<br /> .ranger-navbox.pill-mobile .hlist dt:focus,<br /> .ranger-navbox.pill-mobile .hlist li:hover,<br /> .ranger-navbox.pill-mobile .hlist li:focus {<br /> box-shadow: var(--navbox-pill-box-shadow--hover);<br /> background: var(--navbox-pill-background--hover);<br /> }<br /> }<br /> /*********************<br /> * End Template:Navbox*<br /> **********************/<br /> <br /> === Gadgets/ranger/custom.css ===<br /> /* Custom RANGER styles can go here. Rules here will override rules of equal specificity in main.css */</div>

Admin https://wiki.you107657.duckdns.org/index.php?title=Tensura_Wiki&diff=7779 2026-09-25T12:19:08Z

<p>Admin: 統合ホーム作成</p> <hr /> <div>__NOTOC__<br /> {| class=&quot;wikitable&quot; style=&quot;width:100%;text-align:center;font-size:120%&quot;<br /> ! [[Tensura: Reincarnated Wiki|Reincarnated（本家）]]<br /> ! [[Tensura Reincarnated: Mysticism Wiki|Mysticism]]<br /> ! [[Tensura: Nightmares Wiki|Nightmares]]<br /> |}<br /> <br /> == よく使うページ ==<br /> * [[Races]] ・ [[Abilities]] ・ [[Abilities/Skills]] ・ [[Abilities/Magics]]<br /> * [[Items]] ・ [[Mobs]] ・ [[Mechanics]] ・ [[Getting Started]]<br /> * [[:Category:Unique Skills]] ・ [[:Category:Ultimate Skills]] ・ [[:Category:Extra Skills]]</div>

Admin