Mafia Closed Circle

MediaWiki:Common.css: відмінності між версіями

Повідомлення Обговорення

MediaWiki:Common.css (переглянути вихідний код)

Версія за 08:30, 25 грудня 2025

7520 байтів додано ,  Учора о 08:30
нема опису редагування
Немає опису редагування
Мітка: Скасовано
Немає опису редагування
 
(Не показані 154 проміжні версії цього користувача)
Рядок 1: Рядок 1:
/** Розміщений тут CSS буде застосовуватися до всіх тем оформлення */
/** Розміщений тут CSS буде застосовуватися до всіх тем оформлення */
/* ==================================================== */
/* ЗАГАЛЬНІ СТИЛІ ТА UI */
/* ==================================================== */
@media (max-width: 720px) {
@media (max-width: 720px) {
   .r-box {
   .r-box { float:none !important; margin-left:0 !important; }
  float:none !important;
   .content table { display:table !important; }
  margin-left:0 !important;
  }
   .content table {
    display:table !important;
  }
}
}


.overlay.search-overlay .search-content {
.overlay.search-overlay .search-content {
background-color: #18151e;
    background-color: #18151e;
border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
    border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
color: #a19ce0!important;
    color: #a19ce0!important;
 
}
}


.page-Main_Page .mw-first-heading {
.page-Main_Page .mw-first-heading { display: none!important; }
display: none!important;
.page-Головна_сторінка .mw-first-heading { display: none!important; }
}


.overlay.search-overlay .search-content .caption {
.overlay.search-overlay .search-content .caption { padding-left: 30px!important; }
padding-left: 30px!important;
}


.page-list li, .topic-title-list li, .site-link-list li {
.page-list li, .topic-title-list li, .site-link-list li {
border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
    border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
}
}


.mw-ui-icon-mf-articlesSearch { visibility: hidden!important; display:none!important; background-image:none!important; }


.mw-ui-icon-mf-articlesSearch {
body {
visibility: hidden!important;
    background-color: #15151f !important;
display:none!important;
    background-image: url('/images/a/a1/Background_x%402x.png') !important;
background-image:none!important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-attachment: fixed !important;
}
}


 
#mw-mf-viewport,
#mw-mf-page-center,
#content,
.mw-body {
    background-color: transparent !important;
}


.header-container.header-chrome {
.header-container.header-chrome {
background-color: #18151e!important;
    background-color: rgba(30, 30, 42, 0.85) !important;
box-shadow: none!important;
    backdrop-filter: blur(12px) !important;
display: none!important;
    -webkit-backdrop-filter: blur(12px) !important;
}
}


body {
.list-thumb.list-thumb-none { background-color: #18151e!important; }
background-color: #15151f!important;
}
 
.list-thumb.list-thumb-none {
background-color: #18151e!important;
}


.overlay.search-overlay .results, .overlay.search-overlay .search-feedback {
.overlay.search-overlay .results, .overlay.search-overlay .search-feedback {
background-color: #18151e!important;
    background-color: #18151e!important;
color: white!important;
    color: white!important;
}
}


.overlay.search-overlay .results {
.overlay.search-overlay .results { box-shadow: none!important; }
box-shadow: none!important;
}


.minerva-header .branding-box a {
.minerva-header .branding-box a { color: #b7b4bf!important; }
    color: #b7b4bf!important;
}


.minerva-header .branding-box {
.minerva-header .branding-box { opacity: 1.0!important; }
opacity: 1.0!important;
}


.minerva-icon--menu-base20, .minerva-icon--menu {
.minerva-icon--menu-base20, .minerva-icon--menu {
invert(100%) sepia(100%) saturate(100%) hue-rotate(250deg) brightness(0%) contrast(101%);
    filter: invert(100%) sepia(100%) saturate(100%) hue-rotate(250deg) brightness(0%) contrast(101%);
}
}


Рядок 76: Рядок 69:
     background-color: #15151f!important;
     background-color: #15151f!important;
     color: #b7b4bf!important;
     color: #b7b4bf!important;
    padding-top: 20px!important;
     padding-bottom: 140px!important;
     padding-bottom: 140px!important;
}
}


@media (max-width: 767px) {
@media (max-width: 767px) {
     .overlay-enabled, .mw-body {
     .overlay-enabled, .mw-body {
        padding-top: 20px!important;
         padding-bottom: 80px!important;
         padding-bottom: 80px!important;
     }
     }
}
}


/* .overlay-enabled, .mw-body {
a.new { color: #ff7777!important; }
background-image: url(https://mafiacc.site/images/2/26/Background.png);
a.new:hover { color: #ff7777!important; }
    background-repeat: no-repeat;
a.new:visited { color: #ff7777!important; }
    background-size: contain;
background-position: center;
} */


a { color: #a19ce0!important; }
a:hover { color: #a19ce0!important; }
a:visited { color: #a19ce0!important; }


a.new {
.minerva-footer {
color: #ff7777!important;
    background-color: #15151f!important;
    color: #b7b4bf!important;
    display: none!important;
}


h4 {
    opacity: 0.5!important;
    font-weight: 400!important;
}
}


a.new:hover {
.minerva__tab-container { display:none!important; }
color: #ff7777!important;
 
#mw-mf-page-center { background-color: #15151f!important; }


.content .mw-parser-output > h2, .content .section-heading {
    border-bottom: 1px solid #232b3a!important;
    padding-top: 30px!important;
    padding-bottom: 10px!important;
}
}


a.new:visited {
.search-box .search {
color: #ff7777!important;
    background-color: #15151f!important;
    box-shadow: none!important;
    border: 1px solid #232b3a!important;
    color: white!important;
}


b, strong { font-weight: 400!important; color: #ebebeb!important; }
.page-actions-menu {
    box-sizing: border-box;
    border-top: 1px solid #232b3a!important;
    border-bottom: 1px solid #232b3a!important;
    margin-top: -1px;
    display: none!important;
}
}


.content ul { list-style-type: none!important; padding-left: 0em!important; }


.toc { background-color: #18151e!important; border: none!important; }


a {
.content kbd, .content samp, .content code, .content pre { border: none!important; }
    color: #a19ce0!important;


.content pre {
    padding-left: 0px!important;
    padding-top: 10px!important;
    padding-right: 0px!important;
    padding-bottom: 10px!important;
}
}


a:hover {
.content .mw-parser-output h1 .mw-editsection, .content .mw-parser-output h2 .mw-editsection, .content .mw-parser-output h3 .mw-editsection, .content .mw-parser-output h4 .mw-editsection, .content .mw-parser-output h5 .mw-editsection, .content .mw-parser-output h6 .mw-editsection {
     color: #a19ce0!important;
    visibility:hidden!important;
     display:none!important;
}
}


a:active {
.page-Main_Page #page-secondary-actions a { display:none!important; }
 
.page-Головна_сторінка #page-secondary-actions a { display:none!important; }
 
.mw-ui-icon-mf-expand { background-image:none!important; }
 
.mw-ui-icon-mf-expand:before {
    content: "+";
    color: white;
    font-size: 16px;
    font-weight: bold;
    display: inline-block;
    width: 16px;
    height: 16px;
    line-height: 1em;
    text-align: center;
    vertical-align: middle;
}
}


a:focus {
.mf-icon, .mf-icon--small, .mf-icon--large { display: inline-flex; align-items: center; justify-content: center; }
 
 
}
.mf-mw-ui-icon-rotate-flip { transform: rotate(45deg)!important; }


a:visited {
li.gallerybox div.thumb { background-color: #18151e!important; border: none!important; }
    color: #a19ce0!important;
}


.image-details.is-visible { display: none!important; }


.minerva-footer {
.content table, .content .infobox { text-align: center!important; }
background-color: #15151f!important;
    color: #b7b4bf!important;
    display: none!important;
}


.minerva__tab-container {
.minerva-header .navigation-drawer .toggle-list__toggle { display:none!important; }
display:none!important;
}


#mw-mf-page-center {
.minerva-user-navigation .minerva-notifications { display:none!important; }
background-color: #15151f!important;
}
.content .mw-parser-output > h2, .content .section-heading {
border-bottom: 1px solid #232b3a!important;
}


.minerva-user-navigation > *:last-child { display: none!important; }


/* ==================================================== */
/* HEADER - ФІКСОВАНИЙ НА ВСЮ ШИРИНУ */
/* ==================================================== */


.search-box .search {
.header-container.header-chrome {
background-color: #15151f!important;
    background-color: rgba(30, 30, 42, 0.85) !important;
box-shadow: none!important;
    backdrop-filter: blur(12px) !important;
border: 1px solid #232b3a!important;
    -webkit-backdrop-filter: blur(12px) !important;
color: white!important;
    box-shadow: 5px 12px 24px rgba(0, 0, 0, 0.05) !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    padding: 0 20px !important;
    margin-left: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
}


b, strong {
.minerva-header {
font-weight: 400!important;
    display: flex !important;
color: #ebebeb!important;
    align-items: center !important;
}  
    justify-content: space-between !important;
    width: 100% !important;
    max-width: none !important;
    padding: 10px 0 !important;
    gap: 20px !important;
    margin-left: 0 !important;
}


.page-actions-menu {
/* Branding box - логотип + назва зліва */
     box-sizing: border-box;
.minerva-header .branding-box {
     border-top: 1px solid #232b3a!important;
     display: flex !important;
     border-bottom: 1px solid #232b3a!important;
     align-items: center !important;
     margin-top: -1px;
     gap: 12px !important;
    display: none!important;  
     flex-shrink: 0 !important;
}
}


.overlay.search-overlay {
.minerva-header .branding-box a {
background: #15151f!important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    text-decoration: none !important;
}
}


.content ul {
/* Логотип */
     list-style-type: none!important;
/* Логотип */
     padding-left: 0em!important;
.minerva-header .branding-box a::before {
    content: '' !important;
    display: block !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('/images/d/d7/MafiaClosedCircleLogo.png') !important;
    background-size: contain !important;
     background-repeat: no-repeat !important;
    background-position: center !important;
     flex-shrink: 0 !important;
}
}


/* Назва сайту */
.minerva-header .branding-box a span {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #fff !important;
    white-space: nowrap !important;
}


.content .mw-parser-output > h2, .content .section-heading {
/* Пошук - розтягується праворуч */
     border-bottom: 1px solid #232b3a !important;
.minerva-header .minerva-search-form {
     padding-top: 30px!important;
     flex-grow: 1 !important;
     padding-bottom: 10px!important;
     max-width: 400px !important;
     margin-left: auto !important;
}


.minerva-header .search-box {
    width: 100% !important;
    position: relative !important;
}
}


.toc {
.minerva-header .search-box .search {
background-color: #18151e!important;
    width: 100% !important;
border: none!important;
    padding: 10px 16px 10px 40px !important;
    border-radius: 8px !important;
    background-color: #15151f !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
}


.wikitable > tr > th, .wikitable > tr > td,
.minerva-header .search-box .search::placeholder {
.wikitable > * > tr > th, .wikitable > * > tr > td {
     color: rgba(255, 255, 255, 0.4) !important;
     border: 1px solid;
    border-color: rgba(84, 89, 93, 0.3);
    padding: 0.2em;
    padding-left: 6px;
    background: none;
}
}


.minerva-header .search-box .search:focus {
    border-color: #a19ce0 !important;
    outline: none !important;
}


.wikitable > tr:nth-child(odd) > th,
/* Іконка лупи */
.wikitable > tr:nth-child(odd) > td,  
.minerva-header .search-box::before {
.wikitable > * > tr:nth-child(odd) > th,
    content: '' !important;
.wikitable > * > tr:nth-child(odd) > td {
    position: absolute !important;
background-color: none;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23888'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    z-index: 1 !important;
    pointer-events: none !important;
}


 
/* Прибираємо стандартну іконку пошуку */
.minerva-header .search-box .search.minerva-icon--search {
    background-image: none !important;
}
}




.wikitable > tr:nth-child(even) > th,
/* Ховаємо меню та user navigation */
.wikitable > tr:nth-child(even) > td,
.minerva-header .navigation-drawer {
.wikitable > * > tr:nth-child(even) > th,
    display: none !important;
.wikitable > * > tr:nth-child(even) > td {
}


background-color: #18151e!important;
.minerva-user-navigation {
    display: none !important;
}
}


.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
/* ==================================================== */
border: 1px solid rgba(255, 255, 255, 0.05)!important;
/* СТИЛІ ТАБЛИЦЬ У СТИЛІ LIQUIPEDIA */
}
/* ==================================================== */


.wikitable {
.wikitable {
border: none!important;
    border: none !important;
border-color: none!important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100%;
    background-color: transparent !important;
}
}


.minerva-header .navigation-drawer .toggle-list__toggle {
.wikitable .external {
display:none!important;
    background: none !important;
    padding-right: 0 !important;
}
}


.minerva-user-navigation .minerva-notifications {
.wikitable a.external::after {
display:none!important;
    content: '' !important;
    display: none !important;
}
}


.minerva-user-navigation > *:last-child {
.wikitable > tr > th,
display: none!important;
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 8px 12px !important;
    background: none;
}
}


.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
.wikitable > thead > tr > th,
background-color: #18151e!important;
.wikitable > * > tr:first-child > th {
    background-color: rgba(24, 21, 30, 0.6) !important;
    border-bottom: 2px solid rgba(161, 156, 224, 0.3) !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding: 10px 12px !important;
}
}


.content kbd, .content samp, .content code, .content pre {
.wikitable > tbody > tr:nth-child(odd) > td,
border: none!important;
.wikitable > * > tr:nth-child(odd) > td {
    background-color: rgba(24, 21, 30, 0.3) !important;
}
}


content pre {
.wikitable > tbody > tr:nth-child(even) > td,
    padding-left: 0px!important;
.wikitable > * > tr:nth-child(even) > td {
    padding-top: 10px!important;
     background-color: rgba(24, 21, 30, 0.5) !important;
    padding-right: 0px!important;
     padding-bottom: 10px!important;
}
}


.content .mw-parser-output h1 .mw-editsection, .content .mw-parser-output h2 .mw-editsection, .content .mw-parser-output h3 .mw-editsection, .content .mw-parser-output h4 .mw-editsection, .content .mw-parser-output h5 .mw-editsection, .content .mw-parser-output h6 .mw-editsection {
.wikitable > tbody > tr:hover > td,
.wikitable > * > tr:hover > td {
    background-color: rgba(25, 87, 255, 0.15) !important;
    transition: background-color 0.2s ease;
}


visibility:hidden!important;
/* ==================================================== */
}
/* SORTABLE СТРІЛОЧКИ */
/* ==================================================== */


.page-Main_Page #page-secondary-actions a {
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable),
display:none!important;
.jquery-tablesorter th.headerSort {
    background-color: rgba(24, 21, 30, 0.6) !important;
    color: white !important;
    font-weight: 500 !important;
    padding: 10px 12px !important;
    padding-right: 24px !important;
    background-image: none !important;
    cursor: pointer;
    position: relative;
    user-select: none;
}
}


.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable)::after,
background-image: none!important;
.jquery-tablesorter th.headerSort::after {
    content: "⇅";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.3);
    font-weight: normal;
}
}


 
.jquery-tablesorter th.headerSortUp::after {
 
    content: "▲";
.mw-ui-icon-mf-expand {
    color: #a19ce0 !important;
background-image:none!important;
    font-size: 12px;
}
}


.mw-ui-icon-mf-expand:before {
.jquery-tablesorter th.headerSortDown::after {
     content: "+";
     content: "▼";
     color: white;
     color: #a19ce0 !important;
     font-size: 16p;
     font-size: 12px;
    font-weight: bold;
    display: inline-block;
    width: 16px;
    height: 16px;
    line-height: 1em;
    text-align: center;
    vertical-align: middle;
}
}


.mf-icon, .mf-icon--small, .mf-icon--large {
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable):hover,
    display: inline-flex;
.jquery-tablesorter th.headerSort:hover {
    align-items: center;
    background-color: rgba(25, 87, 255, 0.4) !important;
    justify-content: center;
    transition: background-color 0.2s ease;
}
 
.mf-mw-ui-icon-rotate-flip {
transform: rotate(45deg)!important;
}
}


.content .mw-parser-output h1 .mw-editsection, .content .mw-parser-output h2 .mw-editsection, .content .mw-parser-output h3 .mw-editsection, .content .mw-parser-output h4 .mw-editsection, .content .mw-parser-output h5 .mw-editsection, .content .mw-parser-output h6 .mw-editsection {
.wikitable > tbody > tr:first-child > td,
display:none!important;
.wikitable > * > tr:first-child > td {
    border-top: none !important;
}
}


body {
.wikitable > tbody > tr:last-child > td,
     color: #b7b4bf!important;
.wikitable > * > tr:last-child > td {
 
     border-bottom: none !important;
}
}


li.gallerybox div.thumb {
.wikitable td {
background-color: #18151e!important;
    vertical-align: middle !important;
border: none!important;
}
}


.image-details.is-visible {
@media (max-width: 768px) {
display: none!important;
    .wikitable > tr > th,
    .wikitable > tr > td,
    .wikitable > * > tr > th,
    .wikitable > * > tr > td {
        padding: 6px 8px !important;
        font-size: 13px;
    }
   
    .client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable),
    .jquery-tablesorter th.headerSort {
        padding: 8px 8px !important;
        padding-right: 20px !important;
        font-size: 11px;
    }
}
}


.content table, .content .infobox {
/* ==================================================== */
text-align: center!important;
/* HOME PAGE BLOCKS */
}
/* ==================================================== */


.flex__block {
.flex__block {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
     display: flex;
     display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
     justify-content: space-between;
     justify-content: space-between;
     align-items: center
     align-items: center
Рядок 366: Рядок 476:
     background-size: cover;
     background-size: cover;
}
}
.home_block-image-block::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(https://mafiacc.site/images/b/b1/Nic_01.png);
    background-size: cover;
    opacity: 0.5; /* Adjust the opacity of the background image */
    z-index: -1; /* Ensure it stays behind the text */
}


.home__block-image {
.home__block-image {
Рядок 424: Рядок 520:


.home__block-content-title {
.home__block-content-title {
line-height: 1;
    line-height: 1;
padding-bottom: 10px;
    padding-bottom: 10px;
}
}


.home__block-content-inner pre {
.home__block-content-inner pre {
font-family: 'Helvetica'!important;
    font-family: 'Helvetica'!important;
padding: 0!important;
    padding: 0!important;
display: block!important;
    display: block!important;
}
}


 
.home__block-content-title .content p {
.home__block-content-title .content p {
    margin: 0!important;
margin: 0!important;
}
}


@media (max-width: 768px) {
@media (max-width: 768px) {
.home__blocks {
    .home__blocks {
display:block;
        display:block;
padding-top: 10px;
        padding-top: 10px;
}
    }


.home__block-content-title {
    .home__block-content-title {
padding-bottom: 10px;
        padding-bottom: 10px;
}
    }


.home__block {
    .home__block {
width:100%;
        width:100%;
}
    }


.home__block-content-inner {  
    .home__block-content-inner {  
margin-bottom: 10px;
        margin-bottom: 10px;
    }
}
}


}
/* ==================================================== */
/* BACKGROUND */
/* ==================================================== */


#mw-mf-viewport, #content, .header-container, .mw-body {
#mw-mf-viewport, #content, .header-container, .mw-body {
    background-image: url('/images/5/5b/Bg_new.png') !important;
     background-size: cover !important;
     background-size: cover !important;
     background-repeat: no-repeat !important;
     background-repeat: no-repeat !important;
     background-position: center center !important;
     background-position: center center !important;
     background-attachment: fixed !important;
     background-attachment: fixed !important;
}
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort:hover {
    background-color: #1957FF !important;
    color: black !important;
}
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
color: white!important;
font-weight: 400!important;
}
}


Рядок 484: Рядок 569:
   }
   }
}
}
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
padding-right: 0px!important;
}
/** Розміщений тут CSS буде застосовуватися до всіх тем оформлення */


/* ==================================================== */
/* ==================================================== */
/* ЗАГАЛЬНІ СТИЛІ ТА UI (Без змін від вашого попереднього коду) */
/* ГЕРОЇ */
/* ==================================================== */
/* ==================================================== */


@media (max-width: 720px) {
.mcc-heroes-list {
   .r-box { float:none !important; margin-left:0 !important; }
   padding-top: 20px!important;
   .content table { display:table !important; }
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
   margin: 0;
}
}


.overlay.search-overlay .search-content {
.mcc-heroes-list li {
    background-color: #18151e;
  margin: 0;
    border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
  padding: 0;
    color: #a19ce0!important;
  width: calc((100% - 32px) / 5);
}
}


.page-Main_Page .mw-first-heading { display: none!important; }
.mcc-hero-card {
  position: relative;
  display: block;
  width: 100%;
  border-radius: 0;
  overflow: hidden;
  background: #1a1a2e;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}


.overlay.search-overlay .search-content .caption { padding-left: 30px!important; }
.mcc-hero-card:hover {
 
  transform: translateY(-4px);
.page-list li, .topic-title-list li, .site-link-list li {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
}
}


.mw-ui-icon-mf-articlesSearch { visibility: hidden!important; display:none!important; background-image:none!important; }
.mcc-hero-card .hero-image-wiki,
 
.mcc-hero-card .hero-image-wiki img,
.header-container.header-chrome {
.mcc-hero-card .mw-file-element,
    background-color: #18151e!important;
.mcc-hero-card a.mw-file-description {
    box-shadow: none!important;
  display: block;
    display: none!important;
  width: 100%;
  height: auto;
}
}


body {
.mcc-hero-info {
    background-color: #15151f!important;
  position: absolute;
}
  bottom: 0;
 
  left: 0;
.list-thumb.list-thumb-none { background-color: #18151e!important; }
  right: 0;
 
  padding: 0px 12px 12px;
.overlay.search-overlay .results, .overlay.search-overlay .search-feedback {
  background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, transparent 100%);
    background-color: #18151e!important;
  color: #fff;
    color: white!important;
}
}


.overlay.search-overlay .results { box-shadow: none!important; }
.mcc-hero-nickname {
 
  font-weight: 700;
.minerva-header .branding-box a { color: #b7b4bf!important; }
  font-size: 1.1em;
 
.minerva-header .branding-box { opacity: 1.0!important; }
 
.minerva-icon--menu-base20, .minerva-icon--menu {
    filter: invert(100%) sepia(100%) saturate(100%) hue-rotate(250deg) brightness(0%) contrast(101%);
}
}


.overlay-enabled, .mw-body {
.mcc-hero-nickname a,
    background-color: #15151f!important;
.mcc-hero-nickname a:visited {
    color: #b7b4bf!important;
  color: #fff !important;
    padding-top: 20px!important;
  text-decoration: none;
    padding-bottom: 140px!important;
  background: none !important;
  padding-right: 0 !important;
}
}


@media (max-width: 767px) {
.mcc-hero-nickname a:hover {
    .overlay-enabled, .mw-body {
  text-decoration: underline;
        padding-top: 20px!important;
  color: #fff !important;
        padding-bottom: 80px!important;
    }
}
}


a.new { color: #ff7777!important; }
.mcc-hero-nickname a.external,
a.new:hover { color: #ff7777!important; }
.mcc-hero-nickname a.external:after,
a.new:visited { color: #ff7777!important; }
.mcc-hero-nickname a.extiw,
 
.mcc-hero-nickname a.extiw:after {
a { color: #a19ce0!important; }
  background-image: none !important;
a:hover { color: #a19ce0!important; }
  padding-right: 0 !important;
a:visited { color: #a19ce0!important; }
 
.minerva-footer {
    background-color: #15151f!important;
    color: #b7b4bf!important;
    display: none!important;
}
}


.minerva__tab-container { display:none!important; }
.mcc-hero-nickname a.external::after,
 
.mcc-hero-nickname a.extiw::after {
#mw-mf-page-center { background-color: #15151f!important; }
  content: none !important;
 
  display: none !important;
.content .mw-parser-output > h2, .content .section-heading {
    border-bottom: 1px solid #232b3a!important;
}
}


.search-box .search {
.mcc-hero-role {
    background-color: #15151f!important;
  color: #ffd700;
    box-shadow: none!important;
  font-size: 0.85em;
    border: 1px solid #232b3a!important;
  font-weight: 600;
    color: white!important;
}
}


b, strong { font-weight: 400!important; color: #ebebeb!important; }
.mcc-hero-date {
 
  font-size: 0.85em;
.page-actions-menu {
  opacity: 0.7;
    box-sizing: border-box;
    border-top: 1px solid #232b3a!important;
    border-bottom: 1px solid #232b3a!important;
    margin-top: -1px;
    display: none!important;  
}
}


.overlay.search-overlay { background: #15151f!important; }
.mcc-champion-card {
 
  box-shadow: 0 0 0 0.5px orange;
.content ul { list-style-type: none!important; padding-left: 0em!important; }
 
.content .mw-parser-output > h2, .content .section-heading {
    border-bottom: 1px solid #232b3a !important;
    padding-top: 30px!important;
    padding-bottom: 10px!important;
}
}


.toc { background-color: #18151e!important; border: none!important; }
.mcc-champion-card:hover {
 
  box-shadow: 0 0 0 1px #ffd700, 0 8px 24px rgba(0, 0, 0, 0.4);
.wikitable > tr > th, .wikitable > tr > td,
.wikitable > * > tr > th, .wikitable > * > tr > td {
    border: 1px solid;
    border-color: rgba(84, 89, 93, 0.3);
    padding: 0.2em;
    padding-left: 6px;
    background: none;
}
}


.wikitable > tr:nth-child(even) > th,
@media (max-width: 768px) {
.wikitable > tr:nth-child(even) > td,
  .mcc-heroes-list {
.wikitable > * > tr:nth-child(even) > th,
    padding: 0;
.wikitable > * > tr:nth-child(even) > td {
    gap: 12px;
     background-color: #18151e!important;
  }
 
  .mcc-heroes-list li {
    width: calc((100% - 12px) / 2);
  }
 
  .mcc-hero-info {
    padding: 30px 8px 8px;
  }
 
  .mcc-hero-nickname {
    font-size: 1em;
  }
 
  .mcc-hero-date {
     font-size: 0.75em;
  }
}
}


.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
@media (max-width: 360px) {
     border: 1px solid rgba(255, 255, 255, 0.05)!important;
  .mcc-heroes-list {
    padding: 0 12px;
    gap: 8px;
  }
 
  .mcc-heroes-list li {
    width: calc((100% - 8px) / 2);
  }
 
  .mcc-hero-nickname {
     font-size: 0.9em;
  }
}
}


.wikitable { border: none!important; border-color: none!important; }
/* ==================================================== */
/* КНОПКА ЗАПИСУ ГРИ */
/* ==================================================== */


.minerva-header .navigation-drawer .toggle-list__toggle { display:none!important; }
.game-record-btn {
    display: inline-block;
    padding: 4px 8px;
    background-color: #d02f2f;
    color: white;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    transition: opacity 0.2s;
}


.minerva-user-navigation .minerva-notifications { display:none!important; }
.game-record-btn:hover {
 
    opacity: 0.7;
.minerva-user-navigation > *:last-child { display: none!important; }
}


.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
.game-record-btn a {
    background-color: #18151e!important;
     color: white !important;
     color: white!important;
     text-decoration: none !important;
     font-weight: 400!important;
    padding-right: 0px!important;
    background-image: none!important;
}
}


.content kbd, .content samp, .content code, .content pre { border: none!important; }
/* ==================================================== */
/* НАВІГАЦІЯ - ГРАВЦІ, ТУРНІРИ, СЕРІЇ, ЧЕМПІОНАТИ */
/* ==================================================== */


.content .mw-parser-output h1 .mw-editsection, .content .mw-parser-output h2 .mw-editsection, .content .mw-parser-output h3 .mw-editsection, .content .mw-parser-output h4 .mw-editsection, .content .mw-parser-output h5 .mw-editsection, .content .mw-parser-output h6 .mw-editsection {
.player-nav,
     visibility:hidden!important;
.tournament-nav,
     display:none!important;
.series-nav,
.championship-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    margin-bottom: 10px;
    font-size: 14px;
     background-color: #18151e;
     border-radius: 10px;
}
}


.page-Main_Page #page-secondary-actions a { display:none!important; }
.player-nav-prev, .player-nav-next,
 
.tournament-nav-prev, .tournament-nav-next,
.mw-ui-icon-mf-expand { background-image:none!important; }
.series-nav-prev, .series-nav-next,
 
.championship-nav-prev, .championship-nav-next {
.mw-ui-icon-mf-expand:before {
     font-size: 20px;
    content: "+";
    color: white;
     font-size: 16px;
     font-weight: bold;
     font-weight: bold;
     display: inline-block;
     min-width: 30px;
    width: 16px;
    height: 16px;
    line-height: 1em;
     text-align: center;
     text-align: center;
    vertical-align: middle;
}
}


.mf-icon, .mf-icon--small, .mf-icon--large { display: inline-flex; align-items: center; justify-content: center; }
.player-nav-prev a, .player-nav-next a,
 
.tournament-nav-prev a, .tournament-nav-next a,
.mf-mw-ui-icon-rotate-flip { transform: rotate(45deg)!important; }
.series-nav-prev a, .series-nav-next a,
 
.championship-nav-prev a, .championship-nav-next a {
body { color: #b7b4bf!important; }
    color: white !important;
 
    text-decoration: none;
li.gallerybox div.thumb { background-color: #18151e!important; border: none!important; }
    transition: opacity 0.2s;
 
}
.image-details.is-visible { display: none!important; }


.content table, .content .infobox { text-align: center!important; }
.player-nav-prev a:hover, .player-nav-next a:hover,
 
.tournament-nav-prev a:hover, .tournament-nav-next a:hover,
/* ... (Ваші стилі для flex__block, home__blocks, home__block-inner і т.д. залишаються без змін) ... */
.series-nav-prev a:hover, .series-nav-next a:hover,
 
.championship-nav-prev a:hover, .championship-nav-next a:hover {
#mw-mf-viewport, #content, .header-container, .mw-body {
     opacity: 0.7;
    background-image: url('/images/5/5b/Bg_new.png') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
     background-attachment: fixed !important;
}
}


.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort:hover {
.player-nav-name,
     background-color: #1957FF !important;
.tournament-nav-name,
     color: black !important;
.series-nav-name,
.championship-nav-name {
    flex: 1;
    text-align: center;
     font-weight: bold;
    color: white;
     font-size: 16px;
}
}
/** Розміщений тут CSS буде застосовуватися до всіх тем оформлення */


/* ==================================================== */
/* ==================================================== */
/* ЗАГАЛЬНІ СТИЛІ ТА UI (Без змін від вашого попереднього коду) */
/* L-BOX МЕНЮ */
/* ==================================================== */
/* ==================================================== */


@media (max-width: 720px) {
.l-box {
  .r-box { float:none !important; margin-left:0 !important; }
    position: fixed;
  .content table { display:table !important; }
    top: 100px !important;
    left: 20px;
    z-index: 100;
    width: 220px;
    background: none;
    border-radius: 4px;
    font-size: 13px;
    max-height: calc(100vh - 100px) !important;
    overflow-y: auto;
}
}


.overlay.search-overlay .search-content {
.l-box-item {
     background-color: #18151e;
     padding: 12px 20px;
     border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
     border-bottom: 1px solid rgba(255,255,255,0.05);
     color: #a19ce0!important;
    border-left: 3px solid transparent;
     color: #8ab4f8;
    cursor: pointer;
    transition: all 0.15s;
}
}


.page-Main_Page .mw-first-heading { display: none!important; }
.l-box-item-last {
    border-bottom: none;
}


.overlay.search-overlay .search-content .caption { padding-left: 30px!important; }
.l-box-item:hover {
    background: #373752;
    border-left-color: #555;
    color: #fff;
}


.page-list li, .topic-title-list li, .site-link-list li {
.l-box-item.active {
     border-bottom: 0.2px solid rgba(255, 255, 255, 0.07)!important;
    background: #373752;
     border-left-color: #8ab4f8;
    color: #fff;
}
}


.mw-ui-icon-mf-articlesSearch { visibility: hidden!important; display:none!important; background-image:none!important; }
@media (max-width: 1400px) {
 
    .l-box {
.header-container.header-chrome {
        display: none !important;
    background-color: #18151e!important;
     }
    box-shadow: none!important;
     display: none!important;
}
}


body {
/* ==================================================== */
    background-color: #15151f!important;
/* R-BOX ПАНЕЛІ */
}
/* ==================================================== */


.list-thumb.list-thumb-none { background-color: #18151e!important; }
.r-box, .tournament-box, .series-box {
    top: 100px !important;
    max-height: calc(100vh - 100px) !important;
}


.overlay.search-overlay .results, .overlay.search-overlay .search-feedback {
@media (max-width: 1200px) {
    background-color: #18151e!important;
    .r-box, .tournament-box, .series-box {
    color: white!important;
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        top: auto !important;
        right: auto !important;
        max-height: none !important;
        overflow-y: visible !important;
    }
}
}


.overlay.search-overlay .results { box-shadow: none!important; }
/* ==================================================== */
/* PROFILE LINKS */
/* ==================================================== */


.minerva-header .branding-box a { color: #b7b4bf!important; }
.profile-links {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-bottom: 10px;
}


.minerva-header .branding-box { opacity: 1.0!important; }
.profile-links-title {
 
    text-align: center;
.minerva-icon--menu-base20, .minerva-icon--menu {
    font-size: 13px;
     filter: invert(100%) sepia(100%) saturate(100%) hue-rotate(250deg) brightness(0%) contrast(101%);
     color: #888;
    margin-bottom: 10px;
}
}


.overlay-enabled, .mw-body {
.profile-links-icons {
     background-color: #15151f!important;
     display: flex;
     color: #b7b4bf!important;
    flex-direction: row;
     padding-top: 20px!important;
     justify-content: center;
     padding-bottom: 140px!important;
     align-items: center;
     gap: 10px;
}
}


@media (max-width: 767px) {
.profile-icon {
     .overlay-enabled, .mw-body {
     display: inline-flex;
        padding-top: 20px!important;
    align-items: center;
        padding-bottom: 80px!important;
    justify-content: center;
     }
     padding: 4px;
}
}


a.new { color: #ff7777!important; }
.profile-icon img {
a.new:hover { color: #ff7777!important; }
     display: block;
a.new:visited { color: #ff7777!important; }
     height: 24px;
 
     width: auto;
a { color: #a19ce0!important; }
a:hover { color: #a19ce0!important; }
a:visited { color: #a19ce0!important; }
 
.minerva-footer {
     background-color: #15151f!important;
     color: #b7b4bf!important;
     display: none!important;
}
}


.minerva__tab-container { display:none!important; }
/* ==================================================== */
/* TOC */
/* ==================================================== */


#mw-mf-page-center { background-color: #15151f!important; }
#toc, .toc {
 
     display: none !important;
.content .mw-parser-output > h2, .content .section-heading {
     border-bottom: 1px solid #232b3a!important;
}
}


.search-box .search {
.r-box ~ * #toc,
     background-color: #15151f!important;
.r-box ~ * .toc {
    box-shadow: none!important;
     display: none !important;
    border: 1px solid #232b3a!important;
    color: white!important;
}
}


b, strong { font-weight: 400!important; color: #ebebeb!important; }
/* ==================================================== */
/* КОНТЕНТ - MARGIN-LEFT ДЛЯ СТОРІНОК З МЕНЮ */
/* ==================================================== */


.page-actions-menu {
@media screen and (min-width: 1000px) {
     box-sizing: border-box;
    .banner-container,
     border-top: 1px solid #232b3a!important;
    .minerva-anon-talk-message,
     border-bottom: 1px solid #232b3a!important;
    .page-header-bar,
    margin-top: -1px;
    .overlay-header,
    display: none!important;  
    .content,
    .overlay-content,
    .content-unstyled,
     .pre-content,
    .post-content,
     #mw-content-text > form {
        margin-left: 300px !important;
     }
   
    .page-Головна_сторінка .banner-container,
    .page-Головна_сторінка .minerva-anon-talk-message,
    .page-Головна_сторінка .page-header-bar,
    .page-Головна_сторінка .overlay-header,
    .page-Головна_сторінка .content,
    .page-Головна_сторінка .overlay-content,
    .page-Головна_сторінка .content-unstyled,
    .page-Головна_сторінка .pre-content,
    .page-Головна_сторінка .post-content,
    .page-Головна_сторінка #mw-content-text > form {
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 1200px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}
}


.overlay.search-overlay { background: #15151f!important; }
/* ==================================================== */
/* МОБІЛЬНА ВЕРСІЯ HEADER */
/* ==================================================== */
 


.content ul { list-style-type: none!important; padding-left: 0em!important; }
/* ==================================================== */
/* ФІКС ПОШУКУ - БЛОКУВАННЯ OVERLAY ТА СТРИБАННЯ */
/* ==================================================== */


.content .mw-parser-output > h2, .content .section-heading {
/* Фіксуємо scroll */
     border-bottom: 1px solid #232b3a !important;
html {
    padding-top: 30px!important;
     overflow-y: scroll !important;
     padding-bottom: 10px!important;
     scrollbar-gutter: stable !important;
}
}


.toc { background-color: #18151e!important; border: none!important; }
/* Блокуємо зміни body при overlay */
body,
body.overlay-enabled,
body.search-enabled,
body[class*="overlay"],
body[class*="search"] {
    overflow: auto !important;
    position: static !important;
    height: auto !important;
    width: 100% !important;
    top: auto !important;
    left: auto !important;
}


.wikitable > tr > th, .wikitable > tr > td,  
/* Фіксуємо viewport */
.wikitable > * > tr > th, .wikitable > * > tr > td {
#mw-mf-viewport,
     border: 1px solid;
#mw-mf-page-center {
     border-color: rgba(84, 89, 93, 0.3);
     transform: none !important;
    padding: 0.2em;
     transition: none !important;
     padding-left: 6px;
     position: static !important;
     background: none;
     overflow: visible !important;
}
}


.wikitable > tr:nth-child(even) > th,  
/* Блокуємо зміни при overlay */
.wikitable > tr:nth-child(even) > td,  
.overlay-enabled #mw-mf-viewport,
.wikitable > * > tr:nth-child(even) > th,  
.overlay-enabled #mw-mf-page-center,
.wikitable > * > tr:nth-child(even) > td {
.overlay-enabled .mw-body,
     background-color: #18151e!important;
.overlay-enabled #content {
     transform: none !important;
    margin: 0 !important;
    position: static !important;
}
}


.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
/* Контент завжди має правильний padding-top */
     border: 1px solid rgba(255, 255, 255, 0.05)!important;
.mw-body {
     padding-top: 70px !important;
}
}


.wikitable { border: none!important; border-color: none!important; }
@media (max-width: 767px) {
 
     .mw-body {
.minerva-header .navigation-drawer .toggle-list__toggle { display:none!important; }
        padding-top: 60px !important;
 
     }
.minerva-user-navigation .minerva-notifications { display:none!important; }
 
.minerva-user-navigation > *:last-child { display: none!important; }
 
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
     background-color: #18151e!important;
    color: white!important;
    font-weight: 400!important;
    padding-right: 0px!important;
     background-image: none!important;
}
}


.content kbd, .content samp, .content code, .content pre { border: none!important; }
/* Ховаємо всі overlay елементи */
 
.overlay,
.content .mw-parser-output h1 .mw-editsection, .content .mw-parser-output h2 .mw-editsection, .content .mw-parser-output h3 .mw-editsection, .content .mw-parser-output h4 .mw-editsection, .content .mw-parser-output h5 .mw-editsection, .content .mw-parser-output h6 .mw-editsection {
.search-overlay,
     visibility:hidden!important;
.overlay.search-overlay,
     display:none!important;
.overlay-header,
.overlay-content,
.mw-mf-page-center__mask {
    display: none !important;
    position: absolute !important;
    left: -9999px !important;
     visibility: hidden !important;
     opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    width: 0 !important;
}
}


.page-Main_Page #page-secondary-actions a { display:none!important; }
/* Поле пошуку - завжди активне */
 
#searchInput {
.mw-ui-icon-mf-expand { background-image:none!important; }
    pointer-events: auto !important;
 
     cursor: text !important;
.mw-ui-icon-mf-expand:before {
     -webkit-user-select: text !important;
    content: "+";
     user-select: text !important;
     color: white;
    font-size: 16px;
     font-weight: bold;
    display: inline-block;
    width: 16px;
    height: 16px;
    line-height: 1em;
    text-align: center;
     vertical-align: middle;
}
}


.mf-icon, .mf-icon--small, .mf-icon--large { display: inline-flex; align-items: center; justify-content: center; }
/* Вимикаємо тригер overlay */
 
.skin-minerva-search-trigger {
.mf-mw-ui-icon-rotate-flip { transform: rotate(45deg)!important; }
     pointer-events: none !important;
 
body { color: #b7b4bf!important; }
 
li.gallerybox div.thumb { background-color: #18151e!important; border: none!important; }
 
.image-details.is-visible { display: none!important; }
 
.content table, .content .infobox { text-align: center!important; }
 
/* ... (Ваші стилі для flex__block, home__blocks, home__block-inner і т.д. залишаються без змін) ... */
 
#mw-mf-viewport, #content, .header-container, .mw-body {
     background-image: url('/images/5/5b/Bg_new.png') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-attachment: fixed !important;
}
}


.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort:hover {
/* Але input активний */
     background-color: #1957FF !important;
.minerva-header .search-box input.search {
     color: black !important;
     pointer-events: auto !important;
     cursor: text !important;
}
}


/* --- СТРУКТУРА СПИСКУ --- */
/* ==================================================== */
/* ШИРОКІ ТАБЛИЦІ - ПОВНА ШИРИНА */
/* ==================================================== */


.mcc-heroes-list {
/* Сторінки з широкими таблицями - перезаписуємо Minerva стилі */
     display: flex;
@media screen and (min-width: 1000px) {
     flex-wrap: wrap;
    .page-Ігри .content,
     justify-content: space-between;
    .page-Ігри .pre-content,
    list-style: none;
    .page-Ігри .post-content,
    padding: 0;
    .page-Ігри .banner-container,
    margin: 20px 0;
    .page-Статистика .content,
    .page-Статистика .pre-content,
    .page-Статистика .post-content,
    .page-Статистика .banner-container,
    .page-Гравці .content,
    .page-Гравці .pre-content,
    .page-Гравці .post-content,
    .page-Гравці .banner-container,
    .page-Фундація .content,
    .page-Фундація .pre-content,
    .page-Фундація .post-content,
    .page-Фундація .banner-container,
    .page-Призовий_фонд .content,
    .page-Призовий_фонд .pre-content,
    .page-Призовий_фонд .post-content,
    .page-Призовий_фонд .banner-container,
    .page-Призові .content,
    .page-Призові .pre-content,
    .page-Призові .post-content,
    .page-Призові .banner-container,
    .page-Фіналіст .content,
    .page-Фіналіст .pre-content,
    .page-Фіналіст .post-content,
    .page-Фіналіст .banner-container,
    .page-Титули .content,
    .page-Титули .pre-content,
    .page-Титули .post-content,
    .page-Титули .banner-container,
    .page-Період .content,
    .page-Період .pre-content,
    .page-Період .post-content,
    .page-Період .banner-container,
     .page-Перша_статистика .content,
     .page-Перша_статистика .pre-content,
     .page-Перша_статистика .post-content,
    .page-Перша_статистика .banner-container {
        margin-left: 16px !important;
        margin-right: 16px !important;
        width: calc(100% - 32px) !important;
        max-width: none !important;
    }
}
}


.mcc-heroes-list li {
/* Широка таблиця - компактний стиль */
     width: 18.5%; /* 5 карток на рядок (5 * 18.5% = 92.5%. Решта - простір між ними) */
.wide-table,
     margin-bottom: 20px;
.page-Ігри .wikitable,
.page-Статистика .wikitable,
.page-Гравці .wikitable,
.page-Фундація .wikitable,
.page-Призовий_фонд .wikitable,
.page-Призові .wikitable,
.page-Фіналіст .wikitable,
.page-Титули .wikitable,
.page-Період .wikitable,
.page-Перша_статистика .wikitable {
     width: 100% !important;
    font-size: 12px !important;
     table-layout: auto !important;
}
}


/* --- СТИЛІ КАРТКИ: ОСНОВНИЙ КОНТЕЙНЕР --- */
.wide-table th,
 
.wide-table td,
.mcc-hero-card {
.page-Ігри .wikitable th,
    height: 242px;
.page-Ігри .wikitable td,
    width: 100%;
.page-Статистика .wikitable th,
    border: 1px solid rgba(255, 255, 255, 0.1);
.page-Статистика .wikitable td,
    border-radius: 12px;
.page-Гравці .wikitable th,
    overflow: hidden;
.page-Гравці .wikitable td,
    position: relative;
.page-Фундація .wikitable th,
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
.page-Фундація .wikitable td,
     background-color: #333;
.page-Призовий_фонд .wikitable th,
     transition: box-shadow 0.3s ease-in-out;
.page-Призовий_фонд .wikitable td,
.page-Призові .wikitable th,
.page-Призові .wikitable td,
.page-Фіналіст .wikitable th,
.page-Фіналіст .wikitable td,
.page-Титули .wikitable th,
.page-Титули .wikitable td,
.page-Період .wikitable th,
.page-Період .wikitable td,
.page-Перша_статистика .wikitable th,
.page-Перша_статистика .wikitable td {
    padding: 6px 8px !important;
     white-space: nowrap !important;
     font-size: 12px !important;
}
}


.mcc-champion-card {
/* Заголовки компактніші */
    height: 242px;
.wide-table th,
    width: 100%;
.page-Ігри .wikitable th,
    border: 2px solid yellow;
.page-Статистика .wikitable th,
    border-radius: 12px;
.page-Гравці .wikitable th,
    overflow: hidden;
.page-Фундація .wikitable th,
     position: relative;
.page-Призовий_фонд .wikitable th,
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
.page-Призові .wikitable th,
     background-color: #333;
.page-Фіналіст .wikitable th,
     transition: box-shadow 0.3s ease-in-out;
.page-Титули .wikitable th,
.page-Період .wikitable th,
.page-Перша_статистика .wikitable th {
     font-size: 11px !important;
     padding: 8px 6px !important;
     text-transform: uppercase !important;
     letter-spacing: 0.3px !important;
}
}


/* Ефект наведення на картку */
/* Горизонтальний скрол якщо не влазить */
.mcc-hero-card:hover {
.page-Ігри .mw-parser-output,
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.6);
.page-Статистика .mw-parser-output,
.page-Гравці .mw-parser-output,
.page-Фундація .mw-parser-output,
.page-Призовий_фонд .mw-parser-output,
.page-Призові .mw-parser-output,
.page-Фіналіст .mw-parser-output,
.page-Титули .mw-parser-output,
.page-Період .mw-parser-output,
.page-Перша_статистика .mw-parser-output {
    overflow-x: auto !important;
}
}


/* --- СТИЛІ ПОСИЛАННЯ (Контейнер вмісту) --- */
/* ==================================================== */
/* PLAYER TABS - LIQUIPEDIA STYLE */
/* ==================================================== */


.mcc-hero-link {
.player-tabs {
     display: block;
     display: flex;
     height: 100%;
     border-bottom: 2px solid #3a3a4a;
    width: 100%;
     margin-bottom: 20px;
    position: relative;
     margin-top: 20px;
     text-decoration: none;
     gap: 0;
    color: white;
     z-index: 2; /* Вище зображення, але нижче градієнта/інфо */
     overflow: hidden;
}
}


/* --- ПОЗИЦІОНУВАННЯ ТА АНІМАЦІЯ ЗОБРАЖЕННЯ --- */
.player-tab {
 
    padding: 12px 24px;
/* 1. SPAN контейнер: позиціонування */
    cursor: pointer;
.mcc-hero-card .hero-image-wiki {
     color: #888;
     position: absolute;
     font-size: 14px;
     top: 0;
     font-weight: 500;
     left: 0;
     border-bottom: 2px solid transparent;
     width: 100%;
     margin-bottom: -2px;
     height: 100%;
     transition: all 0.2s ease;
     z-index: 0; /* Найнижчий шар */
     user-select: none;
     overflow: hidden;
}
}


/* 2. IMG елемент: масштабування та ефекти */
.player-tab:hover {
.mcc-hero-card .hero-image-wiki img {
     color: #fff;
     width: 100%;
     background: rgba(255, 255, 255, 0.05);
    height: 100%;
     object-fit: cover;
    transform: scale(1);
    /* Анімує збільшення, фільтри та прозорість */
    transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
}


/* Анімація при наведенні: стандартне збільшення зображення */
.player-tab.active {
.mcc-hero-card:hover .hero-image-wiki img {
    color: #fff;
     transform: scale(1.1);
    border-bottom-color: #a19ce0;
     background: rgba(161, 156, 224, 0.1);
}
}


/* --- ГРАДІЄНТ --- */
.player-tab-content {
 
     display: none;
.mcc-hero-link::after {
     content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Градієнт від прозорого (згори) до чорного (знизу) */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.0) 50%);
    z-index: 1.5; /* Над зображенням, під інформацією */
}
}


/* --- ІНФОРМАЦІЙНИЙ БЛОК (Нікнейм та Дата) --- */
.player-tab-content.active {
 
     display: block;
.mcc-hero-info {
     animation: fadeIn 0.3s ease;
     position: absolute;
    bottom: 10px;
    width: 100%;
     text-align: center;
    padding: 0 5px;
    box-sizing: border-box;
    z-index: 3; /* Найвищий шар */
}
}


.mcc-hero-nickname {
@keyframes fadeIn {
     font-size: 14px;
     from { opacity: 0; transform: translateY(10px); }
    color: white;
     to { opacity: 1; transform: translateY(0); }
     font-weight: bold;
    line-height: 1.2;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
}
}


.mcc-hero-date {
.tab-loader {
    text-align: center;
    padding: 40px;
    color: #888;
     font-size: 14px;
     font-size: 14px;
    color: yellow;
    opacity: 0.9;
    line-height: 1.2;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
}
}


/* ==================================================== */
.tab-loader::before {
/* СТИЛІ СТАНУ: БЕЗ СТОРІНКИ (.no-page-card) */
    content: '';
/* Використовується, коли для героя немає сторінки */
    display: block;
/* ==================================================== */
    width: 32px;
 
    height: 32px;
.mcc-hero-card.no-page-card .hero-image-wiki img {
    margin: 0 auto 16px;
     filter: grayscale(100%); /* Чорно-біле */
    border: 3px solid rgba(161, 156, 224, 0.2);
     opacity: 0.7; /* Приглушене */
    border-top-color: #a19ce0;
     border-radius: 50%;
     animation: spin 1s linear infinite;
}
}


.mcc-hero-card.no-page-card .mcc-hero-link {
@keyframes spin {
     cursor: default; /* Змінюємо курсор */
     to { transform: rotate(360deg); }
}
}


/* Скасування анімації збільшення при наведенні для цього стану */
@media (max-width: 768px) {
.mcc-hero-card.no-page-card:hover .hero-image-wiki img {
    .player-tabs {
    transform: scale(1);
        flex-wrap: wrap;
}
    }
 
   
/* Скасування анімації тіні при наведенні для цього стану */
    .player-tab {
.mcc-hero-card.no-page-card:hover {
        padding: 10px 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        font-size: 13px;
        flex: 1;
        text-align: center;
    }
}
}


/* ==================================================== */
/* ==================================================== */
/* СТИЛІ СТАНУ: ЧЕМПІОН (.champion-card) */
/* МОБІЛЬНА ВЕРСІЯ - КРОК 1: ПОШУК ТА КОМПАКТНИЙ ХЕДЕР */
/* ==================================================== */
/* ==================================================== */


/* Застосовується до .mcc-hero-card, якщо він також має клас .champion-card */
@media (max-width: 768px) {
.mcc-hero-card.champion-card {
   
     border: 3px solid #FFD700; /* Золота рамка */
    /* Менші відступи в хедері */
     border-radius: 12px;
    .header-container.header-chrome {
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.5); /* Золоте світіння */
        padding: 6px 12px !important;
    }
   
    .minerva-header {
        padding: 4px 0 !important;
        gap: 8px !important;
    }
   
    /* Менше лого */
    .minerva-header .branding-box a::before {
        width: 28px !important;
        height: 28px !important;
    }
   
    /* Менший текст */
    .minerva-header .branding-box a span {
        font-size: 13px !important;
    }
   
    /* Ховаємо звичайний пошук */
    .minerva-header .minerva-search-form {
        display: none !important;
    }
   
    /* Показуємо кнопку пошуку */
     .minerva-header #searchIcon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        border-radius: 8px !important;
        margin-left: auto !important;
    }
   
    .minerva-header #searchIcon .minerva-icon--search-base20 {
        filter: brightness(2) !important;
    }
   
    /* Мобільний пошук (спочатку прихований) */
     .mobile-search-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1001;
        background: rgba(21, 21, 31, 0.98);
        padding: 12px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    }
   
    .mobile-search-overlay.active {
        display: flex;
        align-items: center;
        gap: 10px;
    }
   
    .mobile-search-overlay input {
        flex: 1;
        padding: 12px 16px;
        font-size: 16px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        border-radius: 8px;
        background: #23232c;
        color: white;
        outline: none;
    }
   
    .mobile-search-overlay input:focus {
        border-color: #a19ce0;
    }
   
    .mobile-search-overlay input::placeholder {
        color: rgba(255, 255, 255, 0.4);
    }
   
    .mobile-search-close {
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        color: #888;
        cursor: pointer;
        flex-shrink: 0;
    }
   
    .mobile-search-close:hover {
        color: white;
    }
   
    /* Менший padding-top для контенту */
    .mw-body {
        padding-top: 52px !important;
    }
}
}


/* Збільшення зображення чемпіона при наведенні (трохи більше) */
/* Ще менші екрани - ховаємо назву сайту */
.mcc-hero-card.champion-card:hover .hero-image-wiki img {
@media (max-width: 400px) {
    transform: scale(1.15);
    .minerva-header .branding-box a span {
        display: none !important;
    }
}
}
 
@media (max-width: 768px) {
/* Більш виражене світіння при наведенні на картку чемпіона */
    body .header-container .minerva-header #searchIcon {
.mcc-hero-card.champion-card:hover {
        display: flex !important;
    box-shadow: 0 0 25px rgba(255, 215, 0, 0.9);
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        border-radius: 8px !important;
        margin-left: auto !important;
        cursor: pointer !important;
    }
}
}
Отримано з https://mafiacc.site/index.php/Спеціальна:Мобільна_різниця_версій/3627...5533