Space Stories Wiki - Вклад [ru]

MediaWiki:Common.css

2026-04-06T20:30:41Z

MetalSage:

/* Загрузка лого морпехов */
.second-mw-logo img.mw-logo-icon {
object-fit: contain;
}

/*Химия*/
@media (max-width: 1280px) {
.chem-heading {
display: none;
}
}
@media screen and (min-width: 1120px) {
body.page-Тест .citizen-body-container {
grid-template-areas: 'void header header' 'sidebar content toc' 'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
max-width: none;
}
}
.chem-cards-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin: 20px 0;
width: 100%;
box-sizing: border-box;
}
.chem-card {
background-color: #121212;
border: 3px solid var(--card-border, #444);
border-radius: 12px;
padding: 0;
color: #e0e0e0;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
overflow: hidden;
}
.chem-name-header {
background-color: var(--card-accent);
color: #ffffff;
font-size: 22px;
font-weight: 700;
padding: 14px 20px;
text-align: center;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
margin: 0;
}
.chem-heading {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 16px;
background: rgba(255,255,255,0.06);
border-top: 1px solid rgba(255,255,255,0.1);
cursor: pointer;
}
.chem-heading-content {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}
.heading-text {
font-size: 15px;
font-weight: 600;
color: var(--card-accent, #8cf);
}
.collapse-btn {
border: 2px dotted #ffd700;
padding: 2px 12px;
border-radius: 9999px;
font-size: 13px;
color: #ffd700;
background: rgba(0,0,0,0.3);
}
.collapsible {
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
max-height: 0;
}
.collapsible.expanded {
max-height: 3000px;
}
.chem-recipe-block,
.chem-effects-block {
text-align: center;
}
.chem-recipe-steps,
.chem-effects {
padding: 12px 16px 24px;
}
.recipe-variant-header {
font-size: 15px;
font-weight: 700;
color: #ffd700;
text-align: center;
padding: 8px 0;
border-bottom: 1px dashed rgba(255,215,0,0.3);
margin-bottom: 12px;
}
.chem-recipe {
width: 100%;
max-width: 780px;
margin: 20px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 24px;
box-sizing: border-box;
}
.recipe-inputs,
.recipe-outputs {
flex: 1 1 280px;
min-width: 240px;
display: flex;
flex-direction: column;
gap: 10px;
}
.recipe-action {
flex: 0 0 160px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 0;
}
.recipe-action-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
}
.recipe-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255,255,255,0.08);
border-radius: 6px;
padding: 8px 12px;
border-left: 4px solid var(--card-accent, #8cf);
white-space: normal;
word-break: break-word;
}
.chem-reagent-icon,
.chem-beaker {
width: 36px;
height: 36px;
flex-shrink: 0;
object-fit: contain;
}
.action-sprite .chem-reagent-icon,
.action-sprite .chem-beaker {
width: 46px;
height: 46px;
}
.action-text {
font-weight: 700;
color: #ffd700;
font-style: italic;
font-size: 15px;
line-height: 1.3;
}
.chem-effects .chem-effect-line {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.45;
padding-left: 4px;
}
.chem-desc {
margin: 12px 16px;
padding: 12px;
background: rgba(255,255,255,0.03);
border-radius: 6px;
border-left: 4px solid var(--card-accent, #8cf);
font-size: 14px;
color: #aaa;
}
@media (max-width: 1024px) {
.chem-cards-container {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.chem-cards-container {
grid-template-columns: 1fr;
}
.chem-recipe {
flex-direction: column;
align-items: center;
gap: 16px;
max-width: 100%;
padding: 0 12px;
}
.recipe-action {
flex: 0 0 auto;
min-width: auto;
}
}
/*Химия*/

/*=Блок лора=*/
/*Хронолония */
.timeline {
width: 100%;
margin: 20px 0;
background-color: transparent;
}

.timeline-entry {
padding: 10px;
border-bottom: 1px solid #555;
background-color: var(--timeline-entry-bg, #333);
}

.timeline-header {
font-size: 18px;
font-weight: bold;
color: var(--timeline-header-color, #fff);
cursor: pointer;
}

.timeline-content {
padding: 10px;
font-size: 16px;
color: var(--timeline-content-color, #ddd);
background-color: var(--timeline-content-bg, #444);
display: none;
}

.timeline-entry:nth-child(even) {
background-color: var(--timeline-entry-bg-even, #222);
}

.timeline-entry:hover {
background-color: var(--timeline-entry-bg-hover, #555);
}

.timeline-entry a {
color: var(--timeline-link-color, #ff9800);
text-decoration: none;
}

.timeline-entry a:hover {
text-decoration: underline;
}

/*=Таблица планет=*/
.planets-table-wrapper {
width: 100%;
overflow-x: auto;
margin: 0 auto;
}

.planets-table {
width: 100%;
max-width: 150%;
border-collapse: separate;
border-spacing: 0;
font-family: "Segoe UI", Arial, sans-serif;
background: linear-gradient(to bottom, #0d1117, #161b22);
border: 1px solid #5a5a5a;
border-radius: 12px;
color: #b0b0b0;
overflow: hidden;
}

.planets-table th {
background-color: #3a3a3a;
color: #dcdcdc;
text-align: center;
padding: 12px;
font-size: 18px;
font-weight: bold;
border-bottom: 1px solid #5a5a5a;
}

.planets-table td {
text-align: center;
padding: 12px;
font-size: 16px;
border-top: 1px solid #5a5a5a;
}

.planets-table td img {
border-radius: 50%;
margin: 10px 0;
width: 80px;
height: 80px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6);
}

.planets-table tr:first-child th:first-child {
border-top-left-radius: 12px;
}

.planets-table tr:first-child th:last-child {
border-top-right-radius: 12px;
}

.planets-table tr:last-child td:first-child {
border-bottom-left-radius: 12px;
}

.planets-table tr:last-child td:last-child {
border-bottom-right-radius: 12px;
}

.planets-table tr:nth-child(even) {
background-color: rgba(255, 255, 255, 0.03);
}

.planets-table tr:nth-child(odd) {
background-color: rgba(255, 255, 255, 0.06);
}

.planets-table th:nth-child(2),
.planets-table td:nth-child(2) {
text-align: center;
}

.planets-table caption {
margin: 10px 0;
font-size: 20px;
font-weight: bold;
color: #a0a0a0;
text-align: left;
}

/*=Карточки планет=*/

.planets-row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
margin: 20px 0;
}

.planet-card {
width: 220px;
border: 2px solid #555;
border-radius: 15px;
overflow: hidden;
background-color: #333;
color: #fff;
text-align: center;
padding: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.7);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.planet-card img {
width: 100%;
height: 180px;
object-fit: cover;
border-bottom: 2px solid #555;
border-radius: 8px;
}

.planet-card h3 {
font-size: 1.3em;
margin: 15px 0 10px;
color: #ffcc00;
text-transform: uppercase;
letter-spacing: 1px;
}

.planet-card p {
font-size: 1em;
color: #ddd;
margin: 0;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
text-overflow: ellipsis;
}

.planet-card:hover {
transform: scale(1.05);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.8);
}

.planet-card .more-info {
margin-top: 10px;
padding: 5px;
background-color: #ffcc00;
color: #222;
border-radius: 5px;
font-weight: bold;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.3s ease;
}

.planet-card .more-info:hover {
background-color: #ffaa00;
}

@media (max-width: 768px) {
.planets-row {
justify-content: center;
}

.planet-card {
width: 90%;
max-width: 280px;
}
}

@media (max-width: 480px) {
.planet-card {
width: 100%;
}
}

/*=Меню лора=*/
:root { --transition-duration: 0.4s; --primary-bg-color: #1c1c1c; --secondary-bg-color: #2c2c2c; --item-bg-color: #2e2e2e; --item-hover-bg-color: #444444; --border-color: #666; --text-color: #dcdcdc; --hover-text-color: #ffffff; --font-family: 'Arial', sans-serif; --menu-border-radius: 25px; --header-padding: 30px; --item-height: 180px; --icon-size: 72px; --text-font-size: 18px; } .custom-lore-menu { max-width: 1200px; margin: 30px auto; padding: 40px; border-radius: var(--menu-border-radius); background: linear-gradient(145deg, #1b1b1b, #252525); display: grid; grid-template-columns: 1fr; gap: 30px; font-family: var(--font-family); box-shadow: 0 10px 30px rgba(0,0,0,0.6); } .custom-header { text-align: center; background-color: var(--secondary-bg-color); padding: var(--header-padding); border-bottom: 2px solid var(--border-color); color: var(--text-color); font-size: 26px; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); } .custom-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 25px; padding: 25px; justify-items: center; align-items: stretch; } .custom-item { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: var(--item-height); text-align: center; border: 1px solid var(--border-color); border-radius: 20px; background: linear-gradient(145deg, #2a2a2a, #333333); transition: transform var(--transition-duration), background var(--transition-duration), box-shadow var(--transition-duration); cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); } .custom-item:hover { background: linear-gradient(145deg, #3a3a3a, #555555); transform: scale(1.08); box-shadow: 0 10px 20px rgba(0,0,0,0.5); } .custom-item a { text-decoration: none; color: var(--text-color); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; transition: color var(--transition-duration), text-shadow var(--transition-duration); font-size: var(--text-font-size); font-weight: bold; } .custom-item a:hover { color: var(--hover-text-color); text-shadow: 0 0 8px #fff; } .custom-icon { width: var(--icon-size); height: var(--icon-size); margin-bottom: 12px; flex-shrink: 0; filter: drop-shadow(1px 1px 3px rgba(0,0,0,0.7)); } @media (max-width: 768px) { .custom-lore-menu { padding: 20px; } .custom-links { grid-template-columns: 1fr; } .custom-item { height: auto; padding: 20px 10px; } .custom-item a { font-size: 16px; } }

/*=Блок лора=*/

/*=Блок лор Colonial marines=*/

body.page-Лор_СМ #siteSub,
body.page-Лор_СМ #contentSub,
body.page-Лор_СМ h1.firstHeading
{display:none !important}

.CMMainFigure {
height: 130px;
width: 575px;
background: #292f2d;
border-radius: 6px;
}

.CMMainText {
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: #a1a2a5;
padding-top: 6px;
padding-left: 9px;
}

.CMMainButton {
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton2 {
transform: translate(190px,-94px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton3 {
transform: translate(380px,-188px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButtonText {
display: inline-block;
width: 100%;
height: 100%;
text-align: center;
padding-top: 7px;
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: white;
text-decoration: none;
}

/*=Блок лора Маршалов CM=*/

body.page-Провост_Маршал .mw-page-title-main,
body.page-Провост_Маршал #siteSub,
body.page-Провост_Маршал .mw-body-header,
body.page-Провост_Маршал .citizen-header
{display:none !important}

body.page-Провост_Маршал .citizen-page-container
{background: rgb(20,24,31);
background: linear-gradient(90deg, rgba(20,24,31,1) 0%, rgba(40,11,15,1) 75%, rgba(82,0,0,1) 100%);}

.rectangleCM {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 20px);
}

.rectangleCM2 {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 30px);
}

.rectangleCM3 {
width: 800px;
height: 130px;
background: #590000;
position: relative;
transform: translate(0px, -100px);
}

.rectangleCM4 {
width: 1085px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(0px, -90px);
}

.rectangleCMTwo {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.rectangleCMTwo2 {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.classifieldCM {
color: #bebebe;
position: relative;
transform: translate(15px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.75em;
font-weight: 500;
}

.classifieldCMRisk {
color: #bebebe;
position: relative;
transform: translate(17.5px, 6px);
font-family: "Gill Sans", sans-serif;
font-size: calc(11px +(12 - 8)*((100vw - 400px) /(800 - 400)));
font-weight: bold;
}

.rectangleCMTwo3 {
width: 10px;
height: 130px;
background: #ce0000;
position: relative;
transform: translate(0px, -79px);
}

.classifieldCM3 {
color: #bebebe;
position: relative;
transform: translate(17.5px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.9em;
font-weight: 500;
}

.classifieldCMRisk3 {
color: #bebebe;
position: relative;
transform: translate(20px, 21px);
font-family: "Gill Sans", sans-serif;
font-size: 35px;
font-weight: bold;
}

.triangle-bottomrightCM {
width: 450px;
height: 0;
border-bottom: 130px solid #700;
border-left: 100px solid transparent;
position: relative;
transform: translate(350px,-210px);
}

.MarshalsLogoCM {
right: 0;
bottom: 0;
position: absolute;
}

/*=Не лор маршалов=*/
.hrCMLore {
border: none;
border-top: 1.5px solid #C6C3B5; /* Линия теперь будет красного цвета */
}

.second_block {
display: none;
}

.imggg {
float: right ;
}

.home-card:hover .second_block {
display: block;
font-family: "Gill Sans", sans-serif;
}

.divisionis {
color: #C6C3B5;
opacity: 1;
text-align: center;
font-family: system-ui;
font-size: 30px;
}

.loreCMwelcom {
color: #C6C3B5;
opacity: 0.5;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMwelcomWork {
color: #C6C3B5;
opacity: 0.75;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMtext {
color: white;
text-align: left;
font-family: system-ui;
font-size: 30px;
font-weight: bold;
}

.home-grid {
display: grid;
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
grid-auto-rows: minmax( 3rem, auto );
grid-gap: calc(0.5 * 1rem);
font-family: "Gill Sans", sans-serif;
}

.home-grid--col2 {
grid-template-columns: 1fr 1fr;
}

.home-grid a.external {
background-image: none;
}

.home-card {
position: relative;
padding: 1rem;
background: hsl(220,25%,12%);
border: 1px solid rgba(255,255,255,0.05);
border-radius: 8px;
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
font-size: 0.875rem;
}

.home-card table.timeline {
margin-top: 0.2rem;
}

.home-card--col2 {
grid-column: span 2;
}

.home-card--row3 {
grid-row: span 3;
}

.home-card--row4 {
grid-row: span 4;
}

.home-card--row8 {
grid-row: span 8 / auto;
}

.home-card__label {
color: #72777d;
font-size: 0.8125rem;
letter-spacing: 0.75px;
}

.home-card__header {
color: #202122;
font-size: 1rem;
font-weight: 600;
line-height: 1.25;
}

.home-card__header a {
display: flex;
align-items: center;
justify-content: space-between;
}

.home-card__header a:after {
content: '▶';
font-size: 0.8125rem;
}

.home-card__background {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #242a31;
border-radius: 8px;
}

.home-card__background:after {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: block;
background: linear-gradient(to right,#000,transparent);
content: "";
}

.home-card__background picture,
.home-card__background img {
width: 100%;
height: 100%;
}

.home-card__background img {
object-fit: cover;
object-position: center;
}

.home-card__foreground {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: calc(0.25 * 1rem);
color: #fff;
line-height: 1.25;
}

.home-card__foreground .home-card__header {
color: #fff;
}

.home-card__foreground .home-card__label {
color: #bababa;
}

.home-card p {
/* margin-top: calc(0.5 * 1rem); */
margin-top: calc(0 * 1rem);
font-size: 0.875rem;
}

.home-card.home-card--button {
overflow: hidden;
padding: 0;
background: #242a31;
border: 0;
}

.home-card--button a {
display: flex;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button--navigation a {
/* display: flex; */
display: contents;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button .home-card__background a {
padding: 0;
}

.home-card--button img {
transition: transform 0.2s ease;
}

.home-card--button:hover img {
transform: scale(1.1);
}

.home-link {
display: grid;
margin-top: calc(0.5 * 1rem);
font-size: 0.875rem;
font-weight: 500;
grid-gap: calc(0.5 * 1rem);
text-align: center;
}

.home-link__button {
display: flex;
}

.home-link__button a {
flex-grow: 1;
padding: calc(0.5 * 1rem);
border: 1px solid rgba(255,255,255,0.05);
background: hsl(220,25%,15%);
border-radius: 8px;
color: #fff !important;
line-height: 1.25;
text-decoration: none !important;
}

.home-link__button a:hover {
background: hsl(220,30%,19%);
}

.home-link__button a:active {
background: hsl(220,30%,11%);
}

#home-content {
margin-top: calc(1.25 * 1rem);
}

.home-card .template-statsbar {
margin: 0;
}

.home-footer {
font-size: 0.8125rem;
font-family: monospace;
text-align: center;
}

#home-nav {
margin-top: 1rem;
}

#home-nav .home-card__foreground {
font-weight: 500;
}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
#ss-art-gallery.ss-wrap{ --ss-bg:#0e0f14; --ss-fg:#e9e9e9; --ss-muted:#a9b0bd; --ss-accent:#dca01b; --ss-card:#171a21; --ss-ring:#2b3241; --ss-chip:#1e2330; --ss-shadow:0 10px 28px rgba(0,0,0,.4); background:var(--ss-bg); color:var(--ss-fg); padding:20px; border-radius:18px; font-family:"Segoe UI",sans-serif }
#ss-art-gallery .ss-header{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; text-align:center }
#ss-art-gallery .ss-title{ font-size:30px; line-height:1.2; font-weight:700; color:var(--ss-accent) }
#ss-art-gallery .ss-sub{ font-size:15px; color:var(--ss-muted) }
#ss-art-gallery .ss-filters{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:10px }
#ss-art-gallery .ss-chip{ user-select:none; cursor:pointer; background:var(--ss-chip); padding:8px 14px; border-radius:999px; border:1px solid var(--ss-ring); box-shadow:var(--ss-shadow); font-size:13px; transition: transform .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-chip-active{ border-color:var(--ss-accent); background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-section{ margin:28px 0 }
#ss-art-gallery .ss-section-title{ font-size:22px; font-weight:700; margin:10px 0 18px; text-align:left; color:var(--ss-accent) }
#ss-art-gallery .ss-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); gap:24px; margin-top:12px }
#ss-art-gallery .ss-card{ background:var(--ss-card); border:1px solid var(--ss-ring); border-radius:16px; box-shadow:var(--ss-shadow); padding:16px; display:flex; flex-direction:column; gap:10px; transform:translateZ(0); transition:transform .2s ease,border-color .2s ease }
#ss-art-gallery .ss-card:hover{ transform:translateY(-4px); border-color:var(--ss-accent) }
#ss-art-gallery .ss-card-title{ font-size:16px; font-weight:600; color:var(--ss-muted); text-align:center }
#ss-art-gallery .ss-card img{
width:auto!important;
height:auto!important;
max-width:100%;
border-radius:12px;
display:block;
margin:0 auto;
image-rendering: auto !important; /* убираем пикселизацию — включаем плавное масштабирование спрайтов */
}
#ss-art-gallery .ss-hidden{ display:none!important }
#ss-art-gallery .ss-modal{ position:fixed; inset:0; background:rgba(0,0,0,.88); display:none; align-items:center; justify-content:center; z-index:9999 }
#ss-art-gallery .ss-modal.open{display:flex}
#ss-art-gallery .ss-modal-inner{ max-width:92vw; max-height:92vh; animation:ss-fade .25s ease }
#ss-art-gallery .ss-modal-img{
max-width:90vw;
max-height:90vh;
border-radius:14px;
box-shadow:0 0 24px rgba(0,0,0,.7);
image-rendering: auto !important; /* убираем пикселизацию в модальном окне */
}
#ss-art-gallery .ss-modal-close{ position:fixed; top:16px; right:18px; background:var(--ss-chip); border:1px solid var(--ss-ring); padding:8px 14px; border-radius:10px; cursor:pointer; transition: transform .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent); color:#000 }
@keyframes ss-fade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/
.nt-card {
float: right;
margin: 0 0 12px 12px;
display: grid;
gap: 8px;
width: 220px;
padding: 10px;
border: 1px solid rgba(120,120,120,.35);
border-radius: 10px;
background: rgba(20,20,20,.05);
box-shadow: 0 2px 6px rgba(0,0,0,.05);
text-align: center;
}
.nt-card .nt-title {
font-weight: 700;
font-size: 1rem;
}
.nt-card .nt-sprite {
display: grid;
place-items: center;
width: 64px;
height: 64px;
margin: 0 auto;
border-radius: 6px;
background: rgba(0,0,0,.04);
}
.nt-card .nt-sprite img {
image-rendering: pixelated;
width: 56px;
height: 56px;
}
.nt-card .nt-desc {
font-size: .88rem;
line-height: 1.35;
}
.nt-card .nt-stats {
display: grid;
gap: 3px;
font-size: .85rem;
margin-top: 4px;
text-align: left;
}
.nt-card .nt-stat {
padding: 3px 5px;
border-radius: 5px;
background: rgba(0,0,0,.06);
}
.nt-card .nt-src {
margin-top: 2px;
font-size: .8rem;
opacity: .85;
text-align: left;
}

/* адаптация под телефоны */
@media (max-width: 600px) {
.nt-card {
float: none;
margin: 12px 0;
width: auto;
max-width: 100%;
display: block;
text-align: center;
}
.nt-card .nt-stats,
.nt-card .nt-src {
text-align: center;
}
}

/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/

/*------------------------------------------------Блок вики-----------------------------------------------------------------------------*/

.tabber {
border: 1px solid #20242a !important;
border-radius: 10px !important; /* Закругление углов у всего таба */
overflow: hidden; /* Чтобы закругление работало для содержимого */
}

.tabber__tab {
background: #19191d !important;
padding: 8px 16px;
}

.tabber__panel {
padding: 0 12px;
border-radius: 8px !important; /* Закругление углов для панели */
}

/* Все табсы должны быть заменены на табберы! */
.tabs-tabbox {
background: rgba(255,0,0,0.07) !important;
border-radius: 8px !important; /* Закругление углов */
}

/*------------------------------------------------Tabl-Сейчас 2 версии табл новая и старая, струю не убирать иначе все ломается-----------*/

/* Анимация градиента для JobHeader */
@keyframes gradient-animation {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}

/* Стиль заголовка профессии */
.job_header {
font-family: Arial, sans-serif;
border: 3px solid var(--border-color, #465298);
border-radius: 0.5em;
background-color: #27272e;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
overflow: hidden;
margin: 0 0 10px 5px;
}

.job_header .header-title {
text-align: center;
padding: 5px 10px;
margin: 0;
background: linear-gradient(135deg, var(--header-color-start, #465298), var(--header-color-end, #27272e));
background-size: 300% 300%;
color: #fff;
font-weight: bold;
font-size: 1.1em;
letter-spacing: 0.5px;
text-transform: uppercase;
animation: gradient-animation 6s ease infinite;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Контейнер для изображения профессии */
.job_header .sprite-container {
text-align: center;
padding: 3px 0;
margin: 0;
background: linear-gradient(135deg, var(--sprite-color-start, #465298), var(--sprite-color-end, #27272e));
background-size: 300% 300%;
animation: gradient-animation 6s ease infinite;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.4);
}

.job_header .sprite-container img {
/* width: 128px; */
/* height: auto; */
border-radius: 0.2em;
}

/* Элементы внутри JobHeader */
.job_header div {
padding: 3px 10px;
margin: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
color: #ddd;
transition: background-color 0.3s ease;
}

.job_header div:last-child {
border-bottom: none;
}

.job_header .label {
font-weight: bold;
color: #ddd;
}

.job_header .value {
color: #bbb;
font-size: 0.95em;
}

/* Скрываемые элементы для JobHeader */
.job_collapsible {
cursor: pointer;
color: lightblue;
text-decoration: underline;
margin-top: 10px;
}

.job_collapsible_content {
display: none;
padding: 10px;
color: #bbb;
transition: transform 0.3s ease, background-color 0.3s ease;
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для pre (цитатки)
Shegare */

pre {
display: inline-block;
white-space: pre-wrap;
}

/* End стиль для pre (цитатки)
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin ClearUnset
Shegare */

span.ClearUnset > figure.mw-halign-right {
clear: unset;
}

/* End ClearUnset
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для collapsible button
Shegare */

.collapsible_align > tbody > tr > th > span {
padding: 7px 5px;
}
.mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #dbdbdb;
box-shadow: 0 0 5px 0px;
border: 2px solid;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible.mw-made-collapsible .mw-collapsible-text {
color: #ffffff;
border: 2px dotted;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible-toggle-default:before {
content: unset;
}
.mw-collapsible-toggle-default:after {
content: unset;
}

/* End стиль для collapsible button
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/* ===============================
Begin стиль для Grid — Shegare
=============================== */

@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

.citizen-body {
margin-left: 10px;
}

/* ===============================
End стиль для Grid — Shegare
=============================== */

/* ==================================================
Begin стиль для JobsTable — Shegare
================================================== */
/* === Общие стили === */
.citizen-body {
margin-left: 10px;
}

#IdJobsTableContainer2 {
flex-basis: 280px;
padding: 0 15px;
position: sticky;
top: 20px;
align-self: flex-start;
max-height: calc(100vh - 40px);
overflow-y: auto;
z-index: 100;
box-sizing: border-box;
transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out; /* Плавное изменение свойств */
}

.JobsTable {
border: 2px solid black;
border-radius: 10px;
margin-bottom: 2px;
width: auto;
height: fit-content;
background: #28303e;
transition: background 0.3s ease; /* Плавная смена фона */
}

.JobsTableList li a {
color: white;
font-size: 16px;
background: #232323;
display: block;
border: 2px solid black;
margin-bottom: 5px;
padding: 3px 5px;
text-decoration: none;
transition: background 0.3s ease, transform 0.3s ease; /* Плавная смена фона и эффект нажатия */
}

.JobsTableList li a:hover {
background: #3b3b3b;
transform: scale(1.05); /* Эффект увеличения при наведении */
}

.JobsTableHeadImg {
margin: 0 5px 0 15px;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

.JobsTableHeadLink {
margin-right: auto;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

#IdJobsTableContainer1 {
display: none;
}

.JobsTable .mw-collapsible-toggle {
margin-top: -35px;
}

.JobsTable .mw-collapsible-toggle-default:before,
.JobsTable .mw-collapsible-toggle-default:after {
content: none;
}

.JobsTable .mw-collapsible-text {
background: black;
border: 2px solid;
padding: 2px;
margin-right: 5px;
font-weight: 700;
transition: color 0.3s ease, box-shadow 0.3s ease; /* Плавное изменение цвета и тени */
}

.JobsTable .mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #00ffff9e;
box-shadow: 0 0 10px #00b9b978;
}

.JobsTableList.closed {
max-height: 0 !important;
opacity: 0;
overflow: hidden;
transition: opacity 0.5s ease, max-height 0.5s ease; /* Плавное исчезновение */
transition-delay: 1s;
}

/* Скрытие иконок по умолчанию */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 0;
}

/* === Мобильные стили (до 1440px) === */
@media screen and (max-width: 1440px) {
#IdJobsTableContainer2 {
display: none;
}

#IdJobsTableContainer1 {
display: block;
}

.JobsTableHeadImg {
margin-left: 0;
}

.JobsTableHeadLink {
margin-right: 55px;
}

/* Отображение иконок сворачивания */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 1;
}
}

@media screen and (max-width: 1439px) {
.JobsTable div:first-child {
padding-left: 15px;
}
}

/* === ПК стили (от 1120px и выше) === */
@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

@media screen and (min-width: 1440px) {
.JobsTable .mw-collapsible.mw-collapsed {
display: block;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* Задержка при закрытии */
}

.JobsTable div:hover ~ .mw-collapsible.mw-collapsed,
.JobsTable .mw-collapsible.mw-collapsed:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s; /* Мгновенно при открытии */
}

}

.JobsTable div:hover ~ .custom-collapsible.hidden,
.JobsTable .custom-collapsible.hidden:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s;
}
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

#IdJobsTableContainer2 {
z-index: auto;
scrollbar-width: none; /* Для Firefox */
-ms-overflow-style: none; /* Для IE и Edge */
}

.JobsTable .mw-collapsible {
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* задержка закрытия */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

/* ==================================================
End стиль для JobsTable — Shegare
================================================== */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Заголовки стиль
Shegare */

.citizen-sections-enabled .citizen-section-heading .mw-headline {
border-bottom: 2px solid;
border-image: linear-gradient(to right top, #5d5d5d, #272727);
border-image-slice: 1;
}

.citizen-sections-enabled .citizen-section-heading .mw-headline:empty {
border: unset;
}

.citizen-sections-enabled .citizen-section-heading--collapsed .mw-headline {
border: unset;
}

.mw-ui-icon-wikimedia-collapse:before {
opacity: unset;
}

.citizen-sections-enabled .citizen-section-indicator {
width: 25px;
height: 25px;
position: absolute;
padding: 3px;
background: rgb(162 162 162 / 60%);
box-shadow: 0 0 20px 0px rgb(162 162 162 / 20%);
border: 1px solid #000000;
border-radius: 50%;
transition: 0.3s;
margin-left: -30px;
margin-right: 5px;
}

@media screen and (max-width: 1119px) {
.citizen-sections-enabled .citizen-section-indicator {
margin-left: 0px;
}
.citizen-sections-enabled .citizen-section-indicator {
width: 21px;
height: 21px;
}
.citizen-sections-enabled .citizen-section-heading .mw-headline {
padding-left: 25px;
}
}

.citizen-sections-enabled .citizen-section-heading--collapsed .citizen-section-indicator {
background: #000000;
opacity: 50%;
box-shadow: unset;
transition: 0.3s;
}

.citizen-section-collapsible p {
margin-bottom: 1.5em;
margin-top: 0px;
}

/* Begin Заголовки стиль
Shegare */

/* Begin Подзаголовки стиль
Shegare */

/*.citizen-section-collapsible > h2, h3, h4, h5, h6 {
border-bottom: 2px dashed #5d5d5d;
width: fit-content;
}*/

/* Begin Подзаголовки стиль
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin элементы таблицы "|" не подсвечиваются при наведении
Shegare */

:root.skin-citizen-dark {
--background-color-quiet--hover: unset
}

/* End элементы таблицы "|" не подсвечиваются при наведении
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin header не скрывается
Shegare */

@media screen and (max-width: 1119px) {
.citizen-scroll--down .citizen-header {
transform: unset;
}
}

/* End header не скрывается
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin TooltipTable
Shegare */

.citizen-overflow--right {
-webkit-mask-image: unset;
}

@media screen and (min-width: 1421px) {
.citizen-table-wrapper {
overflow: unset;
}
}

@media screen and (max-width:1421px) {
.citizen-table-wrapper,
.citizen-overflow--left.citizen-overflow--right,
.citizen-overflow--left,
.citizen-overflow--right {
-webkit-mask-image: unset;
overflow: auto;
}
}

/* End TooltipTable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Отмена пикселизации
Shegare */

.citizen-header__logo img, .logo img {
image-rendering: unset;
}
.nopixelated img {
image-rendering: unset;
}

/* End оформление заголовков
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin mobile_bigtable
Shegare */

@media screen and (max-width: 1025px) {
mobile_bigtable {
font-size: 16px;
}
}
@media screen and (max-width: 1024px) {
mobile_bigtable {
font-size: 10px;
}
}

/* Begin mobile_bigtable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin главное меню
Данте ( и немного Shegare >w< )
*/

/* Общее форматирование ячеек таблицы */
.standard-link th,
.standard-link td {
vertical-align: middle;
border: 2px solid black;
background-color: #212126;
}

/* Скругление углов только у первой и последней ячеек в строке заголовка */
.standard-link th {
border-radius: 15px 0 0 15px;
}

/* Форматирование ссылок в заголовках таблицы */
.standard-link th a {
margin: 7px;
}

/* Форматирование ссылок в ячейках таблицы */
.standard-link td a {
margin: 5px 10px;
padding: 17px;
}

/* Общие стили для всех ссылок */
.standard-link a {
text-decoration: none;
font: small-caps bold 25px sans-serif;
color: #ffffff;
border: 2px solid black;
display: flex;
align-items: center;
background-color: #141417;
transition: background-color 1.0s ease, border-color 1.0s ease, color 1.0s ease;
}

/* Стили для мобильных устройств */
@media screen and (max-width:850px) {
.standard-link a {
transition: none;
}
.standard-link td {
border-radius: 0px 15px 15px 0px;
}
}

/* Стили при наведении курсора на строку таблицы */
.standard-link tr:hover a {
background-color: black;
color: #fff;
border-color: #e23229;
}

/* End главное меню
Данте ( и немного Shegare >w< )
*/
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Данте Морпехи */
/* Основные стили для контейнера меню */
.main-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

/* Общие стили для секций меню */
.menu-section {
flex-basis: 23%;
margin-bottom: 15px;
padding: 10px;
border-radius: 8px;
background-color: #14171f; /* Фон не покрашенных блоков */
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.1); /* Уменьшенная белая обводка для блоков */
}

/* Индивидуальные цвета для секций */
.marines-section {
background-color: #222424;
}

.xenos-section {
background-color: #2b2e44;
}

.other-section {
background-color: #341d1d; /* Цвет для блока "Другие фракции" */
}

/* Стили для заголовков секций */
.menu-section h3 {
padding: 5px;
margin: 0;
font-size: 18px;
text-align: center;
color: #fff;
}

/* Стили для списка */
.menu-section ul {
list-style-type: none;
padding: 0;
margin: 10px 0 0 0;
}

/* Стили для элементов списка */
.menu-section ul li {
margin: 10px 0;
text-align: center;
}

/* Стили для кнопок (ссылок) */
.menu-section ul li a {
display: block;
width: 100%;
padding: 10px;
border-radius: 8px;
text-align: center;
background-color: #1a1e29; /* Цвет фона кнопок */
color: white;
font-weight: bold;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.menu-section ul li a:hover {
background-color: #666;
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Стили для секции с картами */
.maps-section {
color: white; /* Устанавливаем белый цвет текста для всей секции */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для секции с картами */
.maps-section {
color: white !important; /* Добавление !important */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для элементов списка в секции карт */
.maps-section ul li {
flex-basis: 48%; /* Уменьшаем до 48%, чтобы уместить 2 карты в ряд с отступами */
list-style: none; /* Убираем маркеры списка */
}

/* Стили для ссылок в секции карт */
.maps-section ul li a {
display: block;
padding: 10px;
background-color: #1a1e29; /* Цвет фона кнопок в секции карт */
color: white !important; /* Устанавливаем белый цвет текста */
border-radius: 8px;
text-align: center;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.maps-section ul li a:hover {
background-color: #666; /* Цвет фона при наведении на ссылку в секции карт */
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Убираем иконку внешней ссылки в блоке карт */
.maps-section ul li a::after {
content: none !important; /* Убираем псевдоэлемент */
}

/* Стили для контейнера заголовка */
.header-container {
display: flex;
align-items: center;
background-color: #1b1e26;
padding: 20px 30px;
border-radius: 8px;
}

/* Стили для логотипа */
.logo img {
border-radius: 50%;
width: 100px;
height: auto;
}

/* Стили для текста заголовка */
.title-text {
margin-left: 30px;
color: #ffffff;
}

.title-text h1 {
margin: 0;
font-size: 32px;
font-weight: bold;
}

.title-text p {
margin: 5px 0 0;
font-size: 18px;
}

/* Стили для разделителя */
.separator {
border-bottom: 2px solid #A9A9A9;
margin: 10px 0 20px;
}

/* Адаптивные стили для мобильных устройств */
@media (max-width: 599px) {
.main-container {
flex-direction: column;
align-items: stretch;
}

.menu-section {
flex-basis: 100%;
margin-bottom: 15px;
display: flex;
flex-direction: column;
align-items: stretch;
}

.menu-section ul {
flex-grow: 1;
justify-content: space-between;
padding: 0;
}

.menu-section ul li {
flex-grow: 1;
width: 100%;
text-align: center;
margin-bottom: 10px; /* Отступы между элементами */
}

.menu-section ul li a {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
padding: 10px 0;
}

.maps-section ul {
flex-wrap: wrap;
gap: 10px;
}

.maps-section ul li {
flex-basis: 48%; /* Карты будут располагаться по 2 на ряд */
margin-bottom: 10px; /* Отступы между картами */
}

.header-container {
flex-direction: column;
text-align: center;
padding: 10px;
}

.logo img {
width: 80px;
}

.title-text {
margin-left: 0;
margin-top: 10px;
}

.title-text h1 {
font-size: 24px;
}

.title-text p {
font-size: 16px;
}
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* код оформление для Командование и тд Данте! */
/* Контейнер для карточек */
.command-wrapper {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
padding: 20px;
}

/* Основные стили карточек */
.card {
background-color: #2b2b2b; /* Темный фон карточки */
border-radius: 10px;
width: 220px;
height: auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
display: flex;
flex-direction: column;
justify-content: flex-start; /* Элементы начинают сверху */
align-items: center;
padding: 8px; /* Уменьшаем padding */
text-align: center;
position: relative;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 4px solid transparent;
color: #ffffff; /* Белый текст */
overflow: hidden; /* Скрываем все, что выходит за пределы карточки */
}

/* Цветные обводки для разных ролей */
.card.Captain {
border-color: #B0B7C3; /* Серебристый для Капитана */
}
.card.HeadOfSecurity {
border-color: #FF0000; /* Красный для Главы Безопасности */
}
.card.HeadOfPersonnel {
border-color: #00FF00; /* Зеленый для Главы Персонала */
}
.card.Engineer {
border-color: #FFA500; /* Оранжевый для Старшего Инженера */
}
.card.Scientist {
border-color: #800080; /* Фиолетовый для Научного Руководителя */
}
.card.Doctor {
border-color: #127BB7; /* Синий для Главного Врача */
}
.card.Quartermaster {
border-color: #FFD700; /* Золотой для Квартирмейстера */
}

/* Стили для текста и заголовков */
.card .role-name {
font-weight: bold;
font-size: 1.4em;
color: #ffffff; /* Белый текст */
margin-bottom: 3px;
white-space: normal; /* Разрешить перенос слов */
overflow: hidden;
text-overflow: ellipsis;
text-align: center; /* Центрирование текста */
word-wrap: break-word; /* Перенос слов при необходимости */
display: grid;
grid-template-columns: 212px;
grid-template-rows: 75px;
}
.role-name a {
color: #ccc;
}

/* Стили для изображения */
.card img {
max-width: 160px;
max-height: 160px;
margin-bottom: 3px; /* Уменьшаем отступ снизу */
}

/* Стили для описания роли */
.card .role-description {
font-size: 0.9em;
flex-grow: 1;
margin: 3px 0; /* Минимальные отступы сверху и снизу */
color: #dcdcdc; /* Более светлый текст */
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal; /* Текст переносится */
}

/* Ссылка на СРП */
.card .role-guide {
font-size: 0.85em;
margin-top: 3px; /* Минимальный отступ сверху */
text-align: center; /* Центрируем текст */
}

.card .role-guide a {
color: #00bfff; /* Цвет ссылки */
text-decoration: none;
}

.card .role-guide a:hover {
text-decoration: underline;
}

/* Hover эффект для карточек */
.card:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

* { font-family: Arial }

body {
color: #FAFAFA;
}

img {
image-rendering: pixelated;
}

.flex-container {
display: flex;
align-items: flex-start;
}

.flex-image {
flex-shrink: 0;
margin-right: 20px;
}

.flex-image-description {
flex-grow: 1;
}

.uplinkbuybutton {
background: #464966;
width: 62px;
height: 27px;
color: white;
text-align: center;
font-weight: bolder;
float: right;
padding-top: 4px;
clip-path: polygon(0px 0px, 0px 18px, 9px 27px, 62px 27px, 62px 10px, 53px 0px);
}

.tooltip {
position: relative;
display: inline;
}

.tooltiptext {
position: absolute;
display: initial;
z-index: 99999;
width: 295px;
left: -120px;
top: 42px;
padding: 5px;
pointer-events: none;
visibility: hidden;
opacity: 0;
white-space: normal;
text-align: left;
transition: transform 0.2s, background-color 0.2s;
border: 1px solid #b80000;
border-radius: 10px;
background-color: #24242a;
box-shadow: 0 0 5px #b80000;
}

.tooltip:hover > .tooltiptext {
visibility: visible;
opacity: 0.98;
}

.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
text-align: left;
}

.wikitable > tr > th,
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
border: 1px solid black;
}

.wikitable > * > tr > th {
background: #27272e;
color: white;
}

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

.job_header {
float: right;
width: 25%;
}
}

@media screen and (max-width: 1420px) {
.tooltiptext {
box-shadow: 0px 0px 100vw 100vh rgb(0 0 0 / 60%);
position: fixed;
width: 80vw;
top: 40vh;
left: 0;
margin: 0 auto;
right: 0;
}
}

@media screen and (max-width: 850px) {
.nomobile {
display: none;
}
.mobilefont {
font-size: 80%;
}
.mobile_sprite,
.mobile_text {
transform: scale(0.75);
}
}

.hover_img_special {
top: 0;
left: 0;
display: none;
}

.img_special:hover .hover_img_special {
display: inline;
}

.img_special:hover .img_spec {
display: none;
}

.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt {
border-color: #fc3;
background-color: #fef6e7;
}

html body.mediawiki .mbox-small {
clear: right;
float: right;
margin: 4px 0 4px 1em;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}

.messagebox.small {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
}

.messagebox.small-talk {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
background-color: #f8eaba;
}

.infobox {
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
color: black;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
float: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
.infobox th,
.infobox td {
vertical-align: top;
}

.infobox-label,
.infobox-data,
.infobox th,
.infobox td {
text-align: left;
}

.infobox .infobox-above,
.infobox .infobox-title,
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}

.infobox-title,
.infobox caption {
padding: 0.2em;
}

.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}

.infobox .infobox-navbar {
text-align: right;
}

.mw-default-size {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-default-size img {
border-color: black !important;
}

.mw-default-size figcaption {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-halign-right {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-right img {
border-color: black !important;
}

.mw-halign-right figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left img {
border-color: black !important;
}

.mw-halign-left figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center img {
border-color: black !important;
}

.mw-halign-center figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

th.navbox-group {
white-space: nowrap;
text-align: right;
}

.mw-parser-output .mw-collapsible-toggle {
font-weight: normal;
text-align: right;
}

td.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}

td.mbox-imageright {
border: none;
padding: 2px 0.9em 2px 0;
text-align: center;
}

#p-namespaces {
float: left;
width: 100%;
}

p {
margin-bottom: 1.5em;
}

.infobox-table {
z-index: 3 !important;
width: 400px;
max-width: 100%;
margin-bottom: 1rem;
padding-bottom: 20px !important;
background: hsl(205, 25%, 15%);
border-radius: 8px;
border-spacing: 0;
font-size: 0.875rem;
text-align: left;
}

.infobox-table tr:not(#infobox-table-img-bg) {
display: flex;
margin-top: 10px;
}

.infobox-table th,
.infobox-table td {
padding: 0 15px !important;
}

.infobox-table th,
th.infobox-table-name {
color: hsl(205, 80%, 95%);
}

.infobox-table th {
padding-top: 15px !important;
border-top: 1px solid rgba(255, 255, 255, 0.05);
font-size: 1rem;
text-align: left !important;
}

th.infobox-table-name {
padding-top: 0 !important;
border: 0 !important;
margin-top: 10px;
margin-bottom: 5px;
font-size: 1.4rem !important;
line-height: 1.4;
}

.infobox-table-img img {
max-width: 100%;
height: auto !important;
}

.infobox-table-img img[src$='.svg'] {
background: #eaecf0;
}

.infobox-table .image:hover img {
transform: scale(1.1);
}

.infobox-button {
display: block;
width: 100%;
}

.infobox-button > div {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

@media only screen and (max-width: 720px) {
.infobox-table {
margin-right: auto;
margin-left: auto;
}
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Данте страница*/
body.page-Участник_Дantes {
font-family: 'Consolas', 'Courier New', monospace;
background-color: #0f0f0f;
color: #e0e0e0;
overflow-x: hidden;
}

.glitch-text {
position: relative;
color: #ffcc00;
text-align: center;
animation: glitch 1.5s infinite;
font-size: 1.8em;
letter-spacing: 1px;
margin-bottom: 12px;
}

@keyframes glitch {
0% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
25% { text-shadow: -2px 2px #00ff00, 2px -2px #ff00ff; }
50% { text-shadow: 2px -2px #ff0000, -2px 2px #00ffff; }
75% { text-shadow: -2px -2px #ff00ff, 2px 2px #00ff00; }
100% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
}

.nt-dossier {
margin: 20px auto;
max-width: 600px;
background: linear-gradient(145deg, #1a1a1a, #111111);
border: 1px solid #ffcc00;
border-radius: 12px;
box-shadow: 0 0 20px rgba(255,204,0,0.4);
position: relative;
padding-bottom: 20px;
animation: fadeIn 1s ease-out forwards;
opacity: 0;
}

.nt-dossier-table {
width: 100%;
border-collapse: collapse;
}

.nt-dossier-table th, .nt-dossier-table td {
padding: 12px;
border-bottom: 1px solid #444;
}

.nt-dossier-table th {
background: #2c2c2c;
color: #ffcc00;
width: 40%;
text-align: left;
transition: background 0.3s;
}

.nt-dossier-table th:hover {
background: #333;
}

.scan-row {
opacity: 0;
transform: translateX(-20px);
transition: transform 0.6s ease-out, background-color 0.6s ease-out;
}

.scan-row.visible {
opacity: 1;
transform: translateX(0);
}

.threat {
color: #ff4444;
font-weight: bold;
animation: blink 1s infinite alternate;
text-transform: uppercase;
}

@keyframes blink {
0% { opacity: 1; }
50% { opacity: 0.3; }
100% { opacity: 1; }
}

.status-indicator {
width: 16px;
height: 16px;
background: #ff4444;
border-radius: 50%;
position: absolute;
bottom: 12px;
right: 12px;
animation: pulse 1.5s infinite;
}

@keyframes pulse {
0% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
50% { box-shadow: 0 0 15px #ff0000; transform: scale(1.3); }
100% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
}

.nt-tabs {
margin: 20px auto;
max-width: 600px;
text-align: center;
animation: fadeIn 1.2s forwards;
opacity: 0;
}

.nt-tab {
display: inline-block;
background: #2c2c2c;
border: 1px solid #444;
color: #ffcc00;
padding: 10px 16px;
cursor: pointer;
margin: 0 6px;
border-radius: 6px;
user-select: none;
transition: transform 0.3s ease, background-color 0.3s ease;
}

.nt-tab.active {
background: #444;
border-color: #ffcc00;
box-shadow: 0 0 10px #ffcc00 inset;
}

.nt-tab:hover {
background: #555;
transform: scale(1.05);
}

.nt-tab-content {
display: none;
max-width: 600px;
margin: 15px auto;
padding: 15px;
background: #1a1a1a;
border: 1px solid #444;
border-radius: 10px;
animation: fadeIn 0.5s forwards;
opacity: 0;
}

.nt-tab-content.active {
display: block;
opacity: 1;
}

@keyframes fadeIn {
to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
* { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.job_header .header-title,
.job_header .sprite-container {
animation: none !important;
}
}

/*МИНИ часть блока лора что бы не ломать вики государств*/
:root{
--cf-federation-color:#6e0e0e;
--cf-confederation-color:#0c0361;
--cf-sssp-color:#801828;
--cf-minor-color:#07520b;
--cf-corp-color:#0e2847;
--cf-bg-card:#1e1e1e;
--cf-text-light:#f0f0f0;
--cf-text-muted:#a0a0a0;
}

/* Структура карточек фракций (префикс cf- чтобы не ломать сайт) */
.cf-page-header{ text-align:center; margin-bottom:20px; padding:6px 10px; }
.cf-factions-wrapper{ display:flex; flex-direction:column; gap:18px; max-width:1400px; margin:0 auto; padding:6px; box-sizing:border-box; }

.cf-faction-category{ width:100%; }
.cf-category-title{ font-size:1.6rem; margin:6px 0 12px; padding-bottom:6px; border-bottom:2px solid; text-align:center; }

.cf-cards-row{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

.cf-faction-card{ background-color:var(--cf-bg-card); border-radius:10px; overflow:hidden; width:100%; max-width:520px; box-shadow:0 6px 14px rgba(0,0,0,0.45); transition:transform .22s ease, box-shadow .22s ease; }
.cf-faction-card:hover{ transform:translateY(-6px); box-shadow:0 14px 26px rgba(0,0,0,0.6); }

.cf-card-header{ padding:14px 16px; text-align:center; position:relative; }
.cf-card-header::after{ content:''; position:absolute; bottom:6px; left:8%; width:84%; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent); }

.cf-card-logo{ display:block; margin:0 auto 10px; max-width:240px; max-height:120px; }
.cf-card-title{ font-size:1.25rem; margin:0; font-weight:700; color:var(--cf-text-light); }

.cf-card-content{ padding:14px 16px; color:var(--cf-text-light); }
.cf-faction-desc{ font-size:0.95rem; color:var(--cf-text-muted); line-height:1.45; }

/* Цвета для типов */
.cf-federation{ border-top:5px solid var(--cf-federation-color); }
.cf-federation .cf-card-header{ background:linear-gradient(90deg,#6e0e0e 0%, #470303 100%); }

.cf-confederation{ border-top:5px solid var(--cf-confederation-color); }
.cf-confederation .cf-card-header{ background:linear-gradient(90deg,#0c0361 0%, #0a034a 100%); }

.cf-sssp{ border-top:5px solid var(--cf-sssp-color); }
.cf-sssp .cf-card-header{ background:linear-gradient(90deg,#801828 0%, #4f121b 100%); }

.cf-minor-states{ border-top:5px solid var(--cf-minor-color); }
.cf-minor-states .cf-card-header{ background:linear-gradient(90deg,#07520b 0%, #032b05 100%); }

.cf-corporations{ border-top:5px solid var(--cf-corp-color); }
.cf-corporations .cf-card-header{ background:linear-gradient(90deg,#0e2847 0%, #081524 100%); }

/* Адаптивность */
@media (max-width:900px){
.cf-card-logo{ max-width:180px; max-height:100px; }
.cf-faction-card{ max-width:100%; }
.cf-cards-row{ gap:10px; }
}

MediaWiki:Common.js

2026-04-06T20:29:23Z

MetalSage:

/* Загрузка лого морпехов */
$(document).ready(function() {
var secondUrl = "https://spacestories.club/Marine_Corps";

var secondLogoImgUrl = "https://spacestories.club/images/0/0d/CMlog.png";

if ($('.second-mw-logo').length === 0) {

var $secondLogo = $('<a>', {
href: secondUrl,
class: 'second-mw-logo citizen-cdx-button--size-large cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--icon-only cdx-button--weight-quiet',
title: 'Перейти на заглавную страницу Marines Corps',
}).append(
$('<img>', {
class: 'mw-logo-icon',
src: secondLogoImgUrl,
alt: 'Второе лого',
'aria-hidden': 'true',
height: '32',
width: '32'
})
);

$('.mw-logo').after($secondLogo);
}
});

/* Аудиоплееры */
(function(){
var players = document.getElementsByClassName('audio-player');
for(var i=0;i<players.length;i++){
(function(p){
var src = p.getAttribute('data-src');
if(src){
var audio = document.createElement('audio');
audio.setAttribute('controls','controls');
audio.setAttribute('preload','none');
var source = document.createElement('source');
source.setAttribute('src',src);
source.setAttribute('type','audio/mpeg');
audio.appendChild(source);
p.appendChild(audio);
}
})(players[i]);
}
})();

/* Подгрузка внешних CSS/JS */
(function(){
if(typeof mw === 'undefined') return;

function getFilesFromUrl(param){
if(!param) return [];
return param.split('|').map(function(file){ return file.trim(); });
}

function getBaseUrl(){
var server = mw.config.get('wgServer').replace(/^http:/,'https:');
var script = mw.config.get('wgScript');
return server + script + '?action=raw&ctype=text/';
}

function isValidExtension(ext){ return ext === 'js' || ext === 'css'; }

function getFileUrl(file){
var prefix = file.indexOf('MediaWiki:') === 0 ? 'MediaWiki:' : 'User:' + (mw.config.get('wgUserName') || '') + '/';
var fullName = file.indexOf(':') > -1 ? file : prefix + file;
var ext = file.split('.').pop().toLowerCase();
if(!isValidExtension(ext)){
console.error('Недопустимое расширение файла:', file);
return null;
}
var timestamp = new Date().getTime();
return getBaseUrl() + (ext==='js' ? 'javascript' : 'css') + '&title=' + encodeURIComponent(fullName) + '&_=' + timestamp;
}

function loadFiles(files){
for(var i=0;i<files.length;i++){
var url = getFileUrl(files[i]);
if(url){
var ext = files[i].split('.').pop().toLowerCase();
mw.loader.load(url,'text/' + (ext==='js' ? 'javascript' : 'css'));
}
}
}

mw.loader.using('mediawiki.util', function(){
var params = mw.util.getParamValue('use');
var files = getFilesFromUrl(params);
loadFiles(files);
});
})();

/* Перенос page-info и цвет заголовков */
(function(){
var footerPlaces = document.getElementById('footer-places');
var pageInfo = document.querySelector('.page-info');
if(footerPlaces && pageInfo){
footerPlaces.insertAdjacentElement('afterend', pageInfo.cloneNode(true));
pageInfo.parentNode.removeChild(pageInfo);
}

var headerColorElement = document.querySelector('.headerColor');
if(headerColorElement){
var content = headerColorElement.textContent.split('|');
if(content.length === 2){
var headers = document.querySelectorAll('.citizen-section-heading, .citizen-section-heading--collapsed');
for(var hi=0; hi<headers.length; hi++){
var header = headers[hi],
indicator = header.querySelector('.citizen-section-indicator'),
headline = header.querySelector('.mw-headline');
if(!indicator || !headline) continue;
if(header.classList.contains('citizen-section-heading--collapsed')){
indicator.style.cssText = 'background: black; box-shadow: unset;';
} else {
indicator.style.cssText = 'background: ' + content[1] + '; box-shadow: 0 0 20px 0px ' + content[1] + 'cc;';
headline.style.cssText = 'border-image: linear-gradient(to right top,' + content[0] + ', black); border-image-slice:1;';
}
}
}
}
})();

/* Sidebar для ролей */
(function(){
var jobsContainer = document.querySelector('.JobsTableContainer');
if(jobsContainer && jobsContainer.innerHTML.trim()){
var bodyContent = document.getElementById('bodyContent');
if(bodyContent){
bodyContent.insertAdjacentHTML('beforebegin', jobsContainer.innerHTML);
var jobTable = document.getElementById('IdJobsTableContainer1');
if(jobTable) jobTable.id = 'IdJobsTableContainer2';
}
}
})();

/* Хронология */
(function(){
if(!window.jQuery) return;
jQuery(function($){
$('.timeline-header').on('click', function(){
$(this).next('.timeline-content').slideToggle();
}).trigger('click');
});
})();

/* Галерея */
(function(){
var root = document.getElementById('ss-art-gallery');
if(!root) return;

function q(a,b){ return a.querySelector(b); }
function qa(a,b){ return Array.prototype.slice.call(a.querySelectorAll(b)); }

var chips = qa(root,'.ss-chip');

function setFilter(val){
for(var ci=0; ci<chips.length; ci++){
var c = chips[ci];
var active = (c.getAttribute('data-filter')===val || (val==='all' && c.getAttribute('data-filter')==='all'));
c.classList.toggle('ss-chip-active', active);
}

var sections = qa(root,'.ss-section');
for(var si=0; si<sections.length; si++){
var section = sections[si];
var cards = qa(section,'.ss-card');
var visibleCount = 0;
for(var cj=0; cj<cards.length; cj++){
var card = cards[cj];
var show = (val==='all' || val===card.getAttribute('data-artist'));
card.classList.toggle('ss-hidden', !show);
if(show) visibleCount++;
}
section.style.display = (val==='all' || visibleCount>0)?'block':'none';
}
}

for(var i=0;i<chips.length;i++){
(function(ch){
ch.addEventListener('click', function(){ setFilter(ch.getAttribute('data-filter')); });
})(chips[i]);
}
setFilter('all');

var modal = document.createElement('div');
modal.className = 'ss-modal';
modal.innerHTML = '<div class="ss-modal-inner"><img class="ss-modal-img" alt=""/></div><div class="ss-modal-close" role="button">✖ Закрыть</div>';
root.appendChild(modal);

var modalImg = q(modal,'.ss-modal-img');

function originalFromThumb(u){
if(!u) return u;
if(u.indexOf('/thumb/')>-1){
var s = u.replace('/thumb/','/');
s = s.replace(/\/[^\/]*$/,'');
return s;
}
return u;
}

var images = qa(root,'.ss-card img');
for(var ii=0; ii<images.length; ii++){
(function(img){
img.style.cursor='zoom-in';
img.addEventListener('click', function(e){
e.preventDefault();
var src = originalFromThumb(img.getAttribute('src')) || img.getAttribute('src');
modalImg.setAttribute('src',src);
modalImg.style.maxWidth='90vw';
modalImg.style.maxHeight='90vh';
modal.classList.add('open');
});
})(images[ii]);
}

function closeModal(){ modal.classList.remove('open'); }
modal.addEventListener('click', function(e){ if(e.target===modal||e.target.classList.contains('ss-modal-close')) closeModal(); });
document.addEventListener('keydown', function(e){ if(e.key==='Escape') closeModal(); });
})();

/* Меню лора */
(function(){
var items = document.querySelectorAll('.custom-item');
for(var mi=0; mi<items.length; mi++){
(function(item){
var icon = item.querySelector('.custom-icon');
var linkEl = item.querySelector('a');
if(!linkEl) return;

var href = linkEl.getAttribute('href');
item.style.cursor='pointer';

item.onclick = function(){ window.location.href = href; };
item.onmousemove = function(e){
var rect = item.getBoundingClientRect();
var x = e.clientX - rect.left;
var y = e.clientY - rect.top;
var moveX = (x - rect.width/2)*0.02;
var moveY = (y - rect.height/2)*0.02;
item.style.backgroundPosition = (50 + moveX) + '% ' + (50 + moveY) + '%';
if(icon) icon.style.transform = 'translateY(-8px) scale(1.08)';
var hue = Math.round((x/rect.width)*360);
item.style.boxShadow =
'0 0 15px hsla(' + hue + ',100%,60%,0.7), ' +
'0 0 30px hsla(' + ((hue+30)%360) + ',100%,50%,0.4), ' +
'0 8px 20px rgba(0,0,0,0.5)';
};
item.onmouseleave = function(){
item.style.backgroundPosition='50% 50%';
if(icon) icon.style.transform='translateY(0) scale(1)';
item.style.boxShadow='0 4px 10px rgba(0,0,0,0.3)';
};
})(items[mi]);
}
})();

/* Химия */
(function() {
if (typeof mw === 'undefined' || !window.document) return;

function initCollapse() {
var headings = document.querySelectorAll('.chem-heading');
var hi = 0;
var len = headings.length;
for (; hi < len; hi++) {
(function(node) {
if (node.getAttribute('data-chem-attached')) return;
node.setAttribute('data-chem-attached', '1');
node.style.cursor = 'pointer';
node.addEventListener('click', function() {
var kind = node.getAttribute('data-kind') || '';
var wrapper = findWrapper(node, kind);
if (!wrapper) return;
var btn = node.querySelector('.collapse-btn');

if (wrapper.classList.contains('collapsed')) {
wrapper.style.maxHeight = wrapper.scrollHeight + 'px';
wrapper.classList.remove('collapsed');
wrapper.classList.add('expanded');
if (btn) btn.textContent = 'свернуть';

var cleanup = function() {
wrapper.style.maxHeight = '';
wrapper.removeEventListener('transitionend', cleanup);
};
wrapper.addEventListener('transitionend', cleanup);
} else {
var currentHeight = wrapper.scrollHeight;
wrapper.style.maxHeight = currentHeight + 'px';
wrapper.offsetHeight;
wrapper.style.maxHeight = '0px';
wrapper.classList.remove('expanded');
wrapper.classList.add('collapsed');
if (btn) btn.textContent = 'развернуть';
}
});
})(headings[hi]);
}
}

function findWrapper(node, kind) {
var parent = node.parentNode;
if (!parent) return null;
var wrappers = parent.querySelectorAll('.collapsible');
var wi = 0;
var wlen = wrappers.length;
for (; wi < wlen; wi++) {
if (wrappers[wi].getAttribute('data-kind') === kind) {
return wrappers[wi];
}
}
return null;
}

if (document.readyState === 'complete' || document.readyState === 'interactive') {
initCollapse();
} else {
document.addEventListener('DOMContentLoaded', initCollapse);
}
})();

MediaWiki:Common.js

2026-04-06T20:26:01Z

MetalSage:

/* Загрузка лого морпехов */
$(document).ready(function() {
var secondUrl = "https://spacestories.club/Marine_Corps";

var secondLogoImgUrl = "https://spacestories.club/images/0/0d/CMlog.png";

if ($('.second-custom-logo').length === 0) {

var $secondLogo = $('<a>', {
href: secondUrl,
class: 'second-custom-logo',
title: 'Перейти на заглавную страницу Marines Corps',
}).append($('<img>', {
src: secondLogoImgUrl,
alt: 'MC'
}));

$('.mw-logo').after($secondLogo);
}
});

/* Аудиоплееры */
(function(){
var players = document.getElementsByClassName('audio-player');
for(var i=0;i<players.length;i++){
(function(p){
var src = p.getAttribute('data-src');
if(src){
var audio = document.createElement('audio');
audio.setAttribute('controls','controls');
audio.setAttribute('preload','none');
var source = document.createElement('source');
source.setAttribute('src',src);
source.setAttribute('type','audio/mpeg');
audio.appendChild(source);
p.appendChild(audio);
}
})(players[i]);
}
})();

/* Подгрузка внешних CSS/JS */
(function(){
if(typeof mw === 'undefined') return;

function getFilesFromUrl(param){
if(!param) return [];
return param.split('|').map(function(file){ return file.trim(); });
}

function getBaseUrl(){
var server = mw.config.get('wgServer').replace(/^http:/,'https:');
var script = mw.config.get('wgScript');
return server + script + '?action=raw&ctype=text/';
}

function isValidExtension(ext){ return ext === 'js' || ext === 'css'; }

function getFileUrl(file){
var prefix = file.indexOf('MediaWiki:') === 0 ? 'MediaWiki:' : 'User:' + (mw.config.get('wgUserName') || '') + '/';
var fullName = file.indexOf(':') > -1 ? file : prefix + file;
var ext = file.split('.').pop().toLowerCase();
if(!isValidExtension(ext)){
console.error('Недопустимое расширение файла:', file);
return null;
}
var timestamp = new Date().getTime();
return getBaseUrl() + (ext==='js' ? 'javascript' : 'css') + '&title=' + encodeURIComponent(fullName) + '&_=' + timestamp;
}

function loadFiles(files){
for(var i=0;i<files.length;i++){
var url = getFileUrl(files[i]);
if(url){
var ext = files[i].split('.').pop().toLowerCase();
mw.loader.load(url,'text/' + (ext==='js' ? 'javascript' : 'css'));
}
}
}

mw.loader.using('mediawiki.util', function(){
var params = mw.util.getParamValue('use');
var files = getFilesFromUrl(params);
loadFiles(files);
});
})();

/* Перенос page-info и цвет заголовков */
(function(){
var footerPlaces = document.getElementById('footer-places');
var pageInfo = document.querySelector('.page-info');
if(footerPlaces && pageInfo){
footerPlaces.insertAdjacentElement('afterend', pageInfo.cloneNode(true));
pageInfo.parentNode.removeChild(pageInfo);
}

var headerColorElement = document.querySelector('.headerColor');
if(headerColorElement){
var content = headerColorElement.textContent.split('|');
if(content.length === 2){
var headers = document.querySelectorAll('.citizen-section-heading, .citizen-section-heading--collapsed');
for(var hi=0; hi<headers.length; hi++){
var header = headers[hi],
indicator = header.querySelector('.citizen-section-indicator'),
headline = header.querySelector('.mw-headline');
if(!indicator || !headline) continue;
if(header.classList.contains('citizen-section-heading--collapsed')){
indicator.style.cssText = 'background: black; box-shadow: unset;';
} else {
indicator.style.cssText = 'background: ' + content[1] + '; box-shadow: 0 0 20px 0px ' + content[1] + 'cc;';
headline.style.cssText = 'border-image: linear-gradient(to right top,' + content[0] + ', black); border-image-slice:1;';
}
}
}
}
})();

/* Sidebar для ролей */
(function(){
var jobsContainer = document.querySelector('.JobsTableContainer');
if(jobsContainer && jobsContainer.innerHTML.trim()){
var bodyContent = document.getElementById('bodyContent');
if(bodyContent){
bodyContent.insertAdjacentHTML('beforebegin', jobsContainer.innerHTML);
var jobTable = document.getElementById('IdJobsTableContainer1');
if(jobTable) jobTable.id = 'IdJobsTableContainer2';
}
}
})();

/* Хронология */
(function(){
if(!window.jQuery) return;
jQuery(function($){
$('.timeline-header').on('click', function(){
$(this).next('.timeline-content').slideToggle();
}).trigger('click');
});
})();

/* Галерея */
(function(){
var root = document.getElementById('ss-art-gallery');
if(!root) return;

function q(a,b){ return a.querySelector(b); }
function qa(a,b){ return Array.prototype.slice.call(a.querySelectorAll(b)); }

var chips = qa(root,'.ss-chip');

function setFilter(val){
for(var ci=0; ci<chips.length; ci++){
var c = chips[ci];
var active = (c.getAttribute('data-filter')===val || (val==='all' && c.getAttribute('data-filter')==='all'));
c.classList.toggle('ss-chip-active', active);
}

var sections = qa(root,'.ss-section');
for(var si=0; si<sections.length; si++){
var section = sections[si];
var cards = qa(section,'.ss-card');
var visibleCount = 0;
for(var cj=0; cj<cards.length; cj++){
var card = cards[cj];
var show = (val==='all' || val===card.getAttribute('data-artist'));
card.classList.toggle('ss-hidden', !show);
if(show) visibleCount++;
}
section.style.display = (val==='all' || visibleCount>0)?'block':'none';
}
}

for(var i=0;i<chips.length;i++){
(function(ch){
ch.addEventListener('click', function(){ setFilter(ch.getAttribute('data-filter')); });
})(chips[i]);
}
setFilter('all');

var modal = document.createElement('div');
modal.className = 'ss-modal';
modal.innerHTML = '<div class="ss-modal-inner"><img class="ss-modal-img" alt=""/></div><div class="ss-modal-close" role="button">✖ Закрыть</div>';
root.appendChild(modal);

var modalImg = q(modal,'.ss-modal-img');

function originalFromThumb(u){
if(!u) return u;
if(u.indexOf('/thumb/')>-1){
var s = u.replace('/thumb/','/');
s = s.replace(/\/[^\/]*$/,'');
return s;
}
return u;
}

var images = qa(root,'.ss-card img');
for(var ii=0; ii<images.length; ii++){
(function(img){
img.style.cursor='zoom-in';
img.addEventListener('click', function(e){
e.preventDefault();
var src = originalFromThumb(img.getAttribute('src')) || img.getAttribute('src');
modalImg.setAttribute('src',src);
modalImg.style.maxWidth='90vw';
modalImg.style.maxHeight='90vh';
modal.classList.add('open');
});
})(images[ii]);
}

function closeModal(){ modal.classList.remove('open'); }
modal.addEventListener('click', function(e){ if(e.target===modal||e.target.classList.contains('ss-modal-close')) closeModal(); });
document.addEventListener('keydown', function(e){ if(e.key==='Escape') closeModal(); });
})();

/* Меню лора */
(function(){
var items = document.querySelectorAll('.custom-item');
for(var mi=0; mi<items.length; mi++){
(function(item){
var icon = item.querySelector('.custom-icon');
var linkEl = item.querySelector('a');
if(!linkEl) return;

var href = linkEl.getAttribute('href');
item.style.cursor='pointer';

item.onclick = function(){ window.location.href = href; };
item.onmousemove = function(e){
var rect = item.getBoundingClientRect();
var x = e.clientX - rect.left;
var y = e.clientY - rect.top;
var moveX = (x - rect.width/2)*0.02;
var moveY = (y - rect.height/2)*0.02;
item.style.backgroundPosition = (50 + moveX) + '% ' + (50 + moveY) + '%';
if(icon) icon.style.transform = 'translateY(-8px) scale(1.08)';
var hue = Math.round((x/rect.width)*360);
item.style.boxShadow =
'0 0 15px hsla(' + hue + ',100%,60%,0.7), ' +
'0 0 30px hsla(' + ((hue+30)%360) + ',100%,50%,0.4), ' +
'0 8px 20px rgba(0,0,0,0.5)';
};
item.onmouseleave = function(){
item.style.backgroundPosition='50% 50%';
if(icon) icon.style.transform='translateY(0) scale(1)';
item.style.boxShadow='0 4px 10px rgba(0,0,0,0.3)';
};
})(items[mi]);
}
})();

/* Химия */
(function() {
if (typeof mw === 'undefined' || !window.document) return;

function initCollapse() {
var headings = document.querySelectorAll('.chem-heading');
var hi = 0;
var len = headings.length;
for (; hi < len; hi++) {
(function(node) {
if (node.getAttribute('data-chem-attached')) return;
node.setAttribute('data-chem-attached', '1');
node.style.cursor = 'pointer';
node.addEventListener('click', function() {
var kind = node.getAttribute('data-kind') || '';
var wrapper = findWrapper(node, kind);
if (!wrapper) return;
var btn = node.querySelector('.collapse-btn');

if (wrapper.classList.contains('collapsed')) {
wrapper.style.maxHeight = wrapper.scrollHeight + 'px';
wrapper.classList.remove('collapsed');
wrapper.classList.add('expanded');
if (btn) btn.textContent = 'свернуть';

var cleanup = function() {
wrapper.style.maxHeight = '';
wrapper.removeEventListener('transitionend', cleanup);
};
wrapper.addEventListener('transitionend', cleanup);
} else {
var currentHeight = wrapper.scrollHeight;
wrapper.style.maxHeight = currentHeight + 'px';
wrapper.offsetHeight;
wrapper.style.maxHeight = '0px';
wrapper.classList.remove('expanded');
wrapper.classList.add('collapsed');
if (btn) btn.textContent = 'развернуть';
}
});
})(headings[hi]);
}
}

function findWrapper(node, kind) {
var parent = node.parentNode;
if (!parent) return null;
var wrappers = parent.querySelectorAll('.collapsible');
var wi = 0;
var wlen = wrappers.length;
for (; wi < wlen; wi++) {
if (wrappers[wi].getAttribute('data-kind') === kind) {
return wrappers[wi];
}
}
return null;
}

if (document.readyState === 'complete' || document.readyState === 'interactive') {
initCollapse();
} else {
document.addEventListener('DOMContentLoaded', initCollapse);
}
})();

MediaWiki:Common.css

2026-04-06T20:25:43Z

MetalSage:

/* Загрузка лого морпехов */
.second-custom-logo {
display: inline-flex;
align-items: center;
align-self: center;
margin-left: 12px;
vertical-align: middle;
line-height: 1;
position: relative;
}

.second-custom-logo img {
height: 32px;
width: auto;
object-fit: contain;
display: block;
}

.second-custom-logo:hover img {
opacity: 0.8;
}

@media screen and (max-width: 720px) {
.second-custom-logo {
margin-left: 8px;
}
.second-custom-logo img {
height: 24px;
}
}

/*Химия*/
@media (max-width: 1280px) {
.chem-heading {
display: none;
}
}
@media screen and (min-width: 1120px) {
body.page-Тест .citizen-body-container {
grid-template-areas: 'void header header' 'sidebar content toc' 'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
max-width: none;
}
}
.chem-cards-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin: 20px 0;
width: 100%;
box-sizing: border-box;
}
.chem-card {
background-color: #121212;
border: 3px solid var(--card-border, #444);
border-radius: 12px;
padding: 0;
color: #e0e0e0;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
overflow: hidden;
}
.chem-name-header {
background-color: var(--card-accent);
color: #ffffff;
font-size: 22px;
font-weight: 700;
padding: 14px 20px;
text-align: center;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
margin: 0;
}
.chem-heading {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 16px;
background: rgba(255,255,255,0.06);
border-top: 1px solid rgba(255,255,255,0.1);
cursor: pointer;
}
.chem-heading-content {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}
.heading-text {
font-size: 15px;
font-weight: 600;
color: var(--card-accent, #8cf);
}
.collapse-btn {
border: 2px dotted #ffd700;
padding: 2px 12px;
border-radius: 9999px;
font-size: 13px;
color: #ffd700;
background: rgba(0,0,0,0.3);
}
.collapsible {
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
max-height: 0;
}
.collapsible.expanded {
max-height: 3000px;
}
.chem-recipe-block,
.chem-effects-block {
text-align: center;
}
.chem-recipe-steps,
.chem-effects {
padding: 12px 16px 24px;
}
.recipe-variant-header {
font-size: 15px;
font-weight: 700;
color: #ffd700;
text-align: center;
padding: 8px 0;
border-bottom: 1px dashed rgba(255,215,0,0.3);
margin-bottom: 12px;
}
.chem-recipe {
width: 100%;
max-width: 780px;
margin: 20px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 24px;
box-sizing: border-box;
}
.recipe-inputs,
.recipe-outputs {
flex: 1 1 280px;
min-width: 240px;
display: flex;
flex-direction: column;
gap: 10px;
}
.recipe-action {
flex: 0 0 160px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 0;
}
.recipe-action-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
}
.recipe-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255,255,255,0.08);
border-radius: 6px;
padding: 8px 12px;
border-left: 4px solid var(--card-accent, #8cf);
white-space: normal;
word-break: break-word;
}
.chem-reagent-icon,
.chem-beaker {
width: 36px;
height: 36px;
flex-shrink: 0;
object-fit: contain;
}
.action-sprite .chem-reagent-icon,
.action-sprite .chem-beaker {
width: 46px;
height: 46px;
}
.action-text {
font-weight: 700;
color: #ffd700;
font-style: italic;
font-size: 15px;
line-height: 1.3;
}
.chem-effects .chem-effect-line {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.45;
padding-left: 4px;
}
.chem-desc {
margin: 12px 16px;
padding: 12px;
background: rgba(255,255,255,0.03);
border-radius: 6px;
border-left: 4px solid var(--card-accent, #8cf);
font-size: 14px;
color: #aaa;
}
@media (max-width: 1024px) {
.chem-cards-container {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.chem-cards-container {
grid-template-columns: 1fr;
}
.chem-recipe {
flex-direction: column;
align-items: center;
gap: 16px;
max-width: 100%;
padding: 0 12px;
}
.recipe-action {
flex: 0 0 auto;
min-width: auto;
}
}
/*Химия*/

/*=Блок лора=*/
/*Хронолония */
.timeline {
width: 100%;
margin: 20px 0;
background-color: transparent;
}

.timeline-entry {
padding: 10px;
border-bottom: 1px solid #555;
background-color: var(--timeline-entry-bg, #333);
}

.timeline-header {
font-size: 18px;
font-weight: bold;
color: var(--timeline-header-color, #fff);
cursor: pointer;
}

.timeline-content {
padding: 10px;
font-size: 16px;
color: var(--timeline-content-color, #ddd);
background-color: var(--timeline-content-bg, #444);
display: none;
}

.timeline-entry:nth-child(even) {
background-color: var(--timeline-entry-bg-even, #222);
}

.timeline-entry:hover {
background-color: var(--timeline-entry-bg-hover, #555);
}

.timeline-entry a {
color: var(--timeline-link-color, #ff9800);
text-decoration: none;
}

.timeline-entry a:hover {
text-decoration: underline;
}

/*=Таблица планет=*/
.planets-table-wrapper {
width: 100%;
overflow-x: auto;
margin: 0 auto;
}

.planets-table {
width: 100%;
max-width: 150%;
border-collapse: separate;
border-spacing: 0;
font-family: "Segoe UI", Arial, sans-serif;
background: linear-gradient(to bottom, #0d1117, #161b22);
border: 1px solid #5a5a5a;
border-radius: 12px;
color: #b0b0b0;
overflow: hidden;
}

.planets-table th {
background-color: #3a3a3a;
color: #dcdcdc;
text-align: center;
padding: 12px;
font-size: 18px;
font-weight: bold;
border-bottom: 1px solid #5a5a5a;
}

.planets-table td {
text-align: center;
padding: 12px;
font-size: 16px;
border-top: 1px solid #5a5a5a;
}

.planets-table td img {
border-radius: 50%;
margin: 10px 0;
width: 80px;
height: 80px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6);
}

.planets-table tr:first-child th:first-child {
border-top-left-radius: 12px;
}

.planets-table tr:first-child th:last-child {
border-top-right-radius: 12px;
}

.planets-table tr:last-child td:first-child {
border-bottom-left-radius: 12px;
}

.planets-table tr:last-child td:last-child {
border-bottom-right-radius: 12px;
}

.planets-table tr:nth-child(even) {
background-color: rgba(255, 255, 255, 0.03);
}

.planets-table tr:nth-child(odd) {
background-color: rgba(255, 255, 255, 0.06);
}

.planets-table th:nth-child(2),
.planets-table td:nth-child(2) {
text-align: center;
}

.planets-table caption {
margin: 10px 0;
font-size: 20px;
font-weight: bold;
color: #a0a0a0;
text-align: left;
}

/*=Карточки планет=*/

.planets-row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
margin: 20px 0;
}

.planet-card {
width: 220px;
border: 2px solid #555;
border-radius: 15px;
overflow: hidden;
background-color: #333;
color: #fff;
text-align: center;
padding: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.7);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.planet-card img {
width: 100%;
height: 180px;
object-fit: cover;
border-bottom: 2px solid #555;
border-radius: 8px;
}

.planet-card h3 {
font-size: 1.3em;
margin: 15px 0 10px;
color: #ffcc00;
text-transform: uppercase;
letter-spacing: 1px;
}

.planet-card p {
font-size: 1em;
color: #ddd;
margin: 0;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
text-overflow: ellipsis;
}

.planet-card:hover {
transform: scale(1.05);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.8);
}

.planet-card .more-info {
margin-top: 10px;
padding: 5px;
background-color: #ffcc00;
color: #222;
border-radius: 5px;
font-weight: bold;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.3s ease;
}

.planet-card .more-info:hover {
background-color: #ffaa00;
}

@media (max-width: 768px) {
.planets-row {
justify-content: center;
}

.planet-card {
width: 90%;
max-width: 280px;
}
}

@media (max-width: 480px) {
.planet-card {
width: 100%;
}
}

/*=Меню лора=*/
:root { --transition-duration: 0.4s; --primary-bg-color: #1c1c1c; --secondary-bg-color: #2c2c2c; --item-bg-color: #2e2e2e; --item-hover-bg-color: #444444; --border-color: #666; --text-color: #dcdcdc; --hover-text-color: #ffffff; --font-family: 'Arial', sans-serif; --menu-border-radius: 25px; --header-padding: 30px; --item-height: 180px; --icon-size: 72px; --text-font-size: 18px; } .custom-lore-menu { max-width: 1200px; margin: 30px auto; padding: 40px; border-radius: var(--menu-border-radius); background: linear-gradient(145deg, #1b1b1b, #252525); display: grid; grid-template-columns: 1fr; gap: 30px; font-family: var(--font-family); box-shadow: 0 10px 30px rgba(0,0,0,0.6); } .custom-header { text-align: center; background-color: var(--secondary-bg-color); padding: var(--header-padding); border-bottom: 2px solid var(--border-color); color: var(--text-color); font-size: 26px; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); } .custom-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 25px; padding: 25px; justify-items: center; align-items: stretch; } .custom-item { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: var(--item-height); text-align: center; border: 1px solid var(--border-color); border-radius: 20px; background: linear-gradient(145deg, #2a2a2a, #333333); transition: transform var(--transition-duration), background var(--transition-duration), box-shadow var(--transition-duration); cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); } .custom-item:hover { background: linear-gradient(145deg, #3a3a3a, #555555); transform: scale(1.08); box-shadow: 0 10px 20px rgba(0,0,0,0.5); } .custom-item a { text-decoration: none; color: var(--text-color); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; transition: color var(--transition-duration), text-shadow var(--transition-duration); font-size: var(--text-font-size); font-weight: bold; } .custom-item a:hover { color: var(--hover-text-color); text-shadow: 0 0 8px #fff; } .custom-icon { width: var(--icon-size); height: var(--icon-size); margin-bottom: 12px; flex-shrink: 0; filter: drop-shadow(1px 1px 3px rgba(0,0,0,0.7)); } @media (max-width: 768px) { .custom-lore-menu { padding: 20px; } .custom-links { grid-template-columns: 1fr; } .custom-item { height: auto; padding: 20px 10px; } .custom-item a { font-size: 16px; } }

/*=Блок лора=*/

/*=Блок лор Colonial marines=*/

body.page-Лор_СМ #siteSub,
body.page-Лор_СМ #contentSub,
body.page-Лор_СМ h1.firstHeading
{display:none !important}

.CMMainFigure {
height: 130px;
width: 575px;
background: #292f2d;
border-radius: 6px;
}

.CMMainText {
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: #a1a2a5;
padding-top: 6px;
padding-left: 9px;
}

.CMMainButton {
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton2 {
transform: translate(190px,-94px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton3 {
transform: translate(380px,-188px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButtonText {
display: inline-block;
width: 100%;
height: 100%;
text-align: center;
padding-top: 7px;
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: white;
text-decoration: none;
}

/*=Блок лора Маршалов CM=*/

body.page-Провост_Маршал .mw-page-title-main,
body.page-Провост_Маршал #siteSub,
body.page-Провост_Маршал .mw-body-header,
body.page-Провост_Маршал .citizen-header
{display:none !important}

body.page-Провост_Маршал .citizen-page-container
{background: rgb(20,24,31);
background: linear-gradient(90deg, rgba(20,24,31,1) 0%, rgba(40,11,15,1) 75%, rgba(82,0,0,1) 100%);}

.rectangleCM {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 20px);
}

.rectangleCM2 {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 30px);
}

.rectangleCM3 {
width: 800px;
height: 130px;
background: #590000;
position: relative;
transform: translate(0px, -100px);
}

.rectangleCM4 {
width: 1085px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(0px, -90px);
}

.rectangleCMTwo {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.rectangleCMTwo2 {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.classifieldCM {
color: #bebebe;
position: relative;
transform: translate(15px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.75em;
font-weight: 500;
}

.classifieldCMRisk {
color: #bebebe;
position: relative;
transform: translate(17.5px, 6px);
font-family: "Gill Sans", sans-serif;
font-size: calc(11px +(12 - 8)*((100vw - 400px) /(800 - 400)));
font-weight: bold;
}

.rectangleCMTwo3 {
width: 10px;
height: 130px;
background: #ce0000;
position: relative;
transform: translate(0px, -79px);
}

.classifieldCM3 {
color: #bebebe;
position: relative;
transform: translate(17.5px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.9em;
font-weight: 500;
}

.classifieldCMRisk3 {
color: #bebebe;
position: relative;
transform: translate(20px, 21px);
font-family: "Gill Sans", sans-serif;
font-size: 35px;
font-weight: bold;
}

.triangle-bottomrightCM {
width: 450px;
height: 0;
border-bottom: 130px solid #700;
border-left: 100px solid transparent;
position: relative;
transform: translate(350px,-210px);
}

.MarshalsLogoCM {
right: 0;
bottom: 0;
position: absolute;
}

/*=Не лор маршалов=*/
.hrCMLore {
border: none;
border-top: 1.5px solid #C6C3B5; /* Линия теперь будет красного цвета */
}

.second_block {
display: none;
}

.imggg {
float: right ;
}

.home-card:hover .second_block {
display: block;
font-family: "Gill Sans", sans-serif;
}

.divisionis {
color: #C6C3B5;
opacity: 1;
text-align: center;
font-family: system-ui;
font-size: 30px;
}

.loreCMwelcom {
color: #C6C3B5;
opacity: 0.5;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMwelcomWork {
color: #C6C3B5;
opacity: 0.75;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMtext {
color: white;
text-align: left;
font-family: system-ui;
font-size: 30px;
font-weight: bold;
}

.home-grid {
display: grid;
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
grid-auto-rows: minmax( 3rem, auto );
grid-gap: calc(0.5 * 1rem);
font-family: "Gill Sans", sans-serif;
}

.home-grid--col2 {
grid-template-columns: 1fr 1fr;
}

.home-grid a.external {
background-image: none;
}

.home-card {
position: relative;
padding: 1rem;
background: hsl(220,25%,12%);
border: 1px solid rgba(255,255,255,0.05);
border-radius: 8px;
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
font-size: 0.875rem;
}

.home-card table.timeline {
margin-top: 0.2rem;
}

.home-card--col2 {
grid-column: span 2;
}

.home-card--row3 {
grid-row: span 3;
}

.home-card--row4 {
grid-row: span 4;
}

.home-card--row8 {
grid-row: span 8 / auto;
}

.home-card__label {
color: #72777d;
font-size: 0.8125rem;
letter-spacing: 0.75px;
}

.home-card__header {
color: #202122;
font-size: 1rem;
font-weight: 600;
line-height: 1.25;
}

.home-card__header a {
display: flex;
align-items: center;
justify-content: space-between;
}

.home-card__header a:after {
content: '▶';
font-size: 0.8125rem;
}

.home-card__background {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #242a31;
border-radius: 8px;
}

.home-card__background:after {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: block;
background: linear-gradient(to right,#000,transparent);
content: "";
}

.home-card__background picture,
.home-card__background img {
width: 100%;
height: 100%;
}

.home-card__background img {
object-fit: cover;
object-position: center;
}

.home-card__foreground {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: calc(0.25 * 1rem);
color: #fff;
line-height: 1.25;
}

.home-card__foreground .home-card__header {
color: #fff;
}

.home-card__foreground .home-card__label {
color: #bababa;
}

.home-card p {
/* margin-top: calc(0.5 * 1rem); */
margin-top: calc(0 * 1rem);
font-size: 0.875rem;
}

.home-card.home-card--button {
overflow: hidden;
padding: 0;
background: #242a31;
border: 0;
}

.home-card--button a {
display: flex;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button--navigation a {
/* display: flex; */
display: contents;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button .home-card__background a {
padding: 0;
}

.home-card--button img {
transition: transform 0.2s ease;
}

.home-card--button:hover img {
transform: scale(1.1);
}

.home-link {
display: grid;
margin-top: calc(0.5 * 1rem);
font-size: 0.875rem;
font-weight: 500;
grid-gap: calc(0.5 * 1rem);
text-align: center;
}

.home-link__button {
display: flex;
}

.home-link__button a {
flex-grow: 1;
padding: calc(0.5 * 1rem);
border: 1px solid rgba(255,255,255,0.05);
background: hsl(220,25%,15%);
border-radius: 8px;
color: #fff !important;
line-height: 1.25;
text-decoration: none !important;
}

.home-link__button a:hover {
background: hsl(220,30%,19%);
}

.home-link__button a:active {
background: hsl(220,30%,11%);
}

#home-content {
margin-top: calc(1.25 * 1rem);
}

.home-card .template-statsbar {
margin: 0;
}

.home-footer {
font-size: 0.8125rem;
font-family: monospace;
text-align: center;
}

#home-nav {
margin-top: 1rem;
}

#home-nav .home-card__foreground {
font-weight: 500;
}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
#ss-art-gallery.ss-wrap{ --ss-bg:#0e0f14; --ss-fg:#e9e9e9; --ss-muted:#a9b0bd; --ss-accent:#dca01b; --ss-card:#171a21; --ss-ring:#2b3241; --ss-chip:#1e2330; --ss-shadow:0 10px 28px rgba(0,0,0,.4); background:var(--ss-bg); color:var(--ss-fg); padding:20px; border-radius:18px; font-family:"Segoe UI",sans-serif }
#ss-art-gallery .ss-header{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; text-align:center }
#ss-art-gallery .ss-title{ font-size:30px; line-height:1.2; font-weight:700; color:var(--ss-accent) }
#ss-art-gallery .ss-sub{ font-size:15px; color:var(--ss-muted) }
#ss-art-gallery .ss-filters{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:10px }
#ss-art-gallery .ss-chip{ user-select:none; cursor:pointer; background:var(--ss-chip); padding:8px 14px; border-radius:999px; border:1px solid var(--ss-ring); box-shadow:var(--ss-shadow); font-size:13px; transition: transform .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-chip-active{ border-color:var(--ss-accent); background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-section{ margin:28px 0 }
#ss-art-gallery .ss-section-title{ font-size:22px; font-weight:700; margin:10px 0 18px; text-align:left; color:var(--ss-accent) }
#ss-art-gallery .ss-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); gap:24px; margin-top:12px }
#ss-art-gallery .ss-card{ background:var(--ss-card); border:1px solid var(--ss-ring); border-radius:16px; box-shadow:var(--ss-shadow); padding:16px; display:flex; flex-direction:column; gap:10px; transform:translateZ(0); transition:transform .2s ease,border-color .2s ease }
#ss-art-gallery .ss-card:hover{ transform:translateY(-4px); border-color:var(--ss-accent) }
#ss-art-gallery .ss-card-title{ font-size:16px; font-weight:600; color:var(--ss-muted); text-align:center }
#ss-art-gallery .ss-card img{
width:auto!important;
height:auto!important;
max-width:100%;
border-radius:12px;
display:block;
margin:0 auto;
image-rendering: auto !important; /* убираем пикселизацию — включаем плавное масштабирование спрайтов */
}
#ss-art-gallery .ss-hidden{ display:none!important }
#ss-art-gallery .ss-modal{ position:fixed; inset:0; background:rgba(0,0,0,.88); display:none; align-items:center; justify-content:center; z-index:9999 }
#ss-art-gallery .ss-modal.open{display:flex}
#ss-art-gallery .ss-modal-inner{ max-width:92vw; max-height:92vh; animation:ss-fade .25s ease }
#ss-art-gallery .ss-modal-img{
max-width:90vw;
max-height:90vh;
border-radius:14px;
box-shadow:0 0 24px rgba(0,0,0,.7);
image-rendering: auto !important; /* убираем пикселизацию в модальном окне */
}
#ss-art-gallery .ss-modal-close{ position:fixed; top:16px; right:18px; background:var(--ss-chip); border:1px solid var(--ss-ring); padding:8px 14px; border-radius:10px; cursor:pointer; transition: transform .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent); color:#000 }
@keyframes ss-fade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/
.nt-card {
float: right;
margin: 0 0 12px 12px;
display: grid;
gap: 8px;
width: 220px;
padding: 10px;
border: 1px solid rgba(120,120,120,.35);
border-radius: 10px;
background: rgba(20,20,20,.05);
box-shadow: 0 2px 6px rgba(0,0,0,.05);
text-align: center;
}
.nt-card .nt-title {
font-weight: 700;
font-size: 1rem;
}
.nt-card .nt-sprite {
display: grid;
place-items: center;
width: 64px;
height: 64px;
margin: 0 auto;
border-radius: 6px;
background: rgba(0,0,0,.04);
}
.nt-card .nt-sprite img {
image-rendering: pixelated;
width: 56px;
height: 56px;
}
.nt-card .nt-desc {
font-size: .88rem;
line-height: 1.35;
}
.nt-card .nt-stats {
display: grid;
gap: 3px;
font-size: .85rem;
margin-top: 4px;
text-align: left;
}
.nt-card .nt-stat {
padding: 3px 5px;
border-radius: 5px;
background: rgba(0,0,0,.06);
}
.nt-card .nt-src {
margin-top: 2px;
font-size: .8rem;
opacity: .85;
text-align: left;
}

/* адаптация под телефоны */
@media (max-width: 600px) {
.nt-card {
float: none;
margin: 12px 0;
width: auto;
max-width: 100%;
display: block;
text-align: center;
}
.nt-card .nt-stats,
.nt-card .nt-src {
text-align: center;
}
}

/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/

/*------------------------------------------------Блок вики-----------------------------------------------------------------------------*/

.tabber {
border: 1px solid #20242a !important;
border-radius: 10px !important; /* Закругление углов у всего таба */
overflow: hidden; /* Чтобы закругление работало для содержимого */
}

.tabber__tab {
background: #19191d !important;
padding: 8px 16px;
}

.tabber__panel {
padding: 0 12px;
border-radius: 8px !important; /* Закругление углов для панели */
}

/* Все табсы должны быть заменены на табберы! */
.tabs-tabbox {
background: rgba(255,0,0,0.07) !important;
border-radius: 8px !important; /* Закругление углов */
}

/*------------------------------------------------Tabl-Сейчас 2 версии табл новая и старая, струю не убирать иначе все ломается-----------*/

/* Анимация градиента для JobHeader */
@keyframes gradient-animation {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}

/* Стиль заголовка профессии */
.job_header {
font-family: Arial, sans-serif;
border: 3px solid var(--border-color, #465298);
border-radius: 0.5em;
background-color: #27272e;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
overflow: hidden;
margin: 0 0 10px 5px;
}

.job_header .header-title {
text-align: center;
padding: 5px 10px;
margin: 0;
background: linear-gradient(135deg, var(--header-color-start, #465298), var(--header-color-end, #27272e));
background-size: 300% 300%;
color: #fff;
font-weight: bold;
font-size: 1.1em;
letter-spacing: 0.5px;
text-transform: uppercase;
animation: gradient-animation 6s ease infinite;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Контейнер для изображения профессии */
.job_header .sprite-container {
text-align: center;
padding: 3px 0;
margin: 0;
background: linear-gradient(135deg, var(--sprite-color-start, #465298), var(--sprite-color-end, #27272e));
background-size: 300% 300%;
animation: gradient-animation 6s ease infinite;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.4);
}

.job_header .sprite-container img {
/* width: 128px; */
/* height: auto; */
border-radius: 0.2em;
}

/* Элементы внутри JobHeader */
.job_header div {
padding: 3px 10px;
margin: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
color: #ddd;
transition: background-color 0.3s ease;
}

.job_header div:last-child {
border-bottom: none;
}

.job_header .label {
font-weight: bold;
color: #ddd;
}

.job_header .value {
color: #bbb;
font-size: 0.95em;
}

/* Скрываемые элементы для JobHeader */
.job_collapsible {
cursor: pointer;
color: lightblue;
text-decoration: underline;
margin-top: 10px;
}

.job_collapsible_content {
display: none;
padding: 10px;
color: #bbb;
transition: transform 0.3s ease, background-color 0.3s ease;
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для pre (цитатки)
Shegare */

pre {
display: inline-block;
white-space: pre-wrap;
}

/* End стиль для pre (цитатки)
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin ClearUnset
Shegare */

span.ClearUnset > figure.mw-halign-right {
clear: unset;
}

/* End ClearUnset
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для collapsible button
Shegare */

.collapsible_align > tbody > tr > th > span {
padding: 7px 5px;
}
.mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #dbdbdb;
box-shadow: 0 0 5px 0px;
border: 2px solid;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible.mw-made-collapsible .mw-collapsible-text {
color: #ffffff;
border: 2px dotted;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible-toggle-default:before {
content: unset;
}
.mw-collapsible-toggle-default:after {
content: unset;
}

/* End стиль для collapsible button
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/* ===============================
Begin стиль для Grid — Shegare
=============================== */

@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

.citizen-body {
margin-left: 10px;
}

/* ===============================
End стиль для Grid — Shegare
=============================== */

/* ==================================================
Begin стиль для JobsTable — Shegare
================================================== */
/* === Общие стили === */
.citizen-body {
margin-left: 10px;
}

#IdJobsTableContainer2 {
flex-basis: 280px;
padding: 0 15px;
position: sticky;
top: 20px;
align-self: flex-start;
max-height: calc(100vh - 40px);
overflow-y: auto;
z-index: 100;
box-sizing: border-box;
transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out; /* Плавное изменение свойств */
}

.JobsTable {
border: 2px solid black;
border-radius: 10px;
margin-bottom: 2px;
width: auto;
height: fit-content;
background: #28303e;
transition: background 0.3s ease; /* Плавная смена фона */
}

.JobsTableList li a {
color: white;
font-size: 16px;
background: #232323;
display: block;
border: 2px solid black;
margin-bottom: 5px;
padding: 3px 5px;
text-decoration: none;
transition: background 0.3s ease, transform 0.3s ease; /* Плавная смена фона и эффект нажатия */
}

.JobsTableList li a:hover {
background: #3b3b3b;
transform: scale(1.05); /* Эффект увеличения при наведении */
}

.JobsTableHeadImg {
margin: 0 5px 0 15px;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

.JobsTableHeadLink {
margin-right: auto;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

#IdJobsTableContainer1 {
display: none;
}

.JobsTable .mw-collapsible-toggle {
margin-top: -35px;
}

.JobsTable .mw-collapsible-toggle-default:before,
.JobsTable .mw-collapsible-toggle-default:after {
content: none;
}

.JobsTable .mw-collapsible-text {
background: black;
border: 2px solid;
padding: 2px;
margin-right: 5px;
font-weight: 700;
transition: color 0.3s ease, box-shadow 0.3s ease; /* Плавное изменение цвета и тени */
}

.JobsTable .mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #00ffff9e;
box-shadow: 0 0 10px #00b9b978;
}

.JobsTableList.closed {
max-height: 0 !important;
opacity: 0;
overflow: hidden;
transition: opacity 0.5s ease, max-height 0.5s ease; /* Плавное исчезновение */
transition-delay: 1s;
}

/* Скрытие иконок по умолчанию */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 0;
}

/* === Мобильные стили (до 1440px) === */
@media screen and (max-width: 1440px) {
#IdJobsTableContainer2 {
display: none;
}

#IdJobsTableContainer1 {
display: block;
}

.JobsTableHeadImg {
margin-left: 0;
}

.JobsTableHeadLink {
margin-right: 55px;
}

/* Отображение иконок сворачивания */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 1;
}
}

@media screen and (max-width: 1439px) {
.JobsTable div:first-child {
padding-left: 15px;
}
}

/* === ПК стили (от 1120px и выше) === */
@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

@media screen and (min-width: 1440px) {
.JobsTable .mw-collapsible.mw-collapsed {
display: block;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* Задержка при закрытии */
}

.JobsTable div:hover ~ .mw-collapsible.mw-collapsed,
.JobsTable .mw-collapsible.mw-collapsed:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s; /* Мгновенно при открытии */
}

}

.JobsTable div:hover ~ .custom-collapsible.hidden,
.JobsTable .custom-collapsible.hidden:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s;
}
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

#IdJobsTableContainer2 {
z-index: auto;
scrollbar-width: none; /* Для Firefox */
-ms-overflow-style: none; /* Для IE и Edge */
}

.JobsTable .mw-collapsible {
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* задержка закрытия */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

/* ==================================================
End стиль для JobsTable — Shegare
================================================== */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Заголовки стиль
Shegare */

.citizen-sections-enabled .citizen-section-heading .mw-headline {
border-bottom: 2px solid;
border-image: linear-gradient(to right top, #5d5d5d, #272727);
border-image-slice: 1;
}

.citizen-sections-enabled .citizen-section-heading .mw-headline:empty {
border: unset;
}

.citizen-sections-enabled .citizen-section-heading--collapsed .mw-headline {
border: unset;
}

.mw-ui-icon-wikimedia-collapse:before {
opacity: unset;
}

.citizen-sections-enabled .citizen-section-indicator {
width: 25px;
height: 25px;
position: absolute;
padding: 3px;
background: rgb(162 162 162 / 60%);
box-shadow: 0 0 20px 0px rgb(162 162 162 / 20%);
border: 1px solid #000000;
border-radius: 50%;
transition: 0.3s;
margin-left: -30px;
margin-right: 5px;
}

@media screen and (max-width: 1119px) {
.citizen-sections-enabled .citizen-section-indicator {
margin-left: 0px;
}
.citizen-sections-enabled .citizen-section-indicator {
width: 21px;
height: 21px;
}
.citizen-sections-enabled .citizen-section-heading .mw-headline {
padding-left: 25px;
}
}

.citizen-sections-enabled .citizen-section-heading--collapsed .citizen-section-indicator {
background: #000000;
opacity: 50%;
box-shadow: unset;
transition: 0.3s;
}

.citizen-section-collapsible p {
margin-bottom: 1.5em;
margin-top: 0px;
}

/* Begin Заголовки стиль
Shegare */

/* Begin Подзаголовки стиль
Shegare */

/*.citizen-section-collapsible > h2, h3, h4, h5, h6 {
border-bottom: 2px dashed #5d5d5d;
width: fit-content;
}*/

/* Begin Подзаголовки стиль
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin элементы таблицы "|" не подсвечиваются при наведении
Shegare */

:root.skin-citizen-dark {
--background-color-quiet--hover: unset
}

/* End элементы таблицы "|" не подсвечиваются при наведении
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin header не скрывается
Shegare */

@media screen and (max-width: 1119px) {
.citizen-scroll--down .citizen-header {
transform: unset;
}
}

/* End header не скрывается
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin TooltipTable
Shegare */

.citizen-overflow--right {
-webkit-mask-image: unset;
}

@media screen and (min-width: 1421px) {
.citizen-table-wrapper {
overflow: unset;
}
}

@media screen and (max-width:1421px) {
.citizen-table-wrapper,
.citizen-overflow--left.citizen-overflow--right,
.citizen-overflow--left,
.citizen-overflow--right {
-webkit-mask-image: unset;
overflow: auto;
}
}

/* End TooltipTable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Отмена пикселизации
Shegare */

.citizen-header__logo img, .logo img {
image-rendering: unset;
}
.nopixelated img {
image-rendering: unset;
}

/* End оформление заголовков
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin mobile_bigtable
Shegare */

@media screen and (max-width: 1025px) {
mobile_bigtable {
font-size: 16px;
}
}
@media screen and (max-width: 1024px) {
mobile_bigtable {
font-size: 10px;
}
}

/* Begin mobile_bigtable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin главное меню
Данте ( и немного Shegare >w< )
*/

/* Общее форматирование ячеек таблицы */
.standard-link th,
.standard-link td {
vertical-align: middle;
border: 2px solid black;
background-color: #212126;
}

/* Скругление углов только у первой и последней ячеек в строке заголовка */
.standard-link th {
border-radius: 15px 0 0 15px;
}

/* Форматирование ссылок в заголовках таблицы */
.standard-link th a {
margin: 7px;
}

/* Форматирование ссылок в ячейках таблицы */
.standard-link td a {
margin: 5px 10px;
padding: 17px;
}

/* Общие стили для всех ссылок */
.standard-link a {
text-decoration: none;
font: small-caps bold 25px sans-serif;
color: #ffffff;
border: 2px solid black;
display: flex;
align-items: center;
background-color: #141417;
transition: background-color 1.0s ease, border-color 1.0s ease, color 1.0s ease;
}

/* Стили для мобильных устройств */
@media screen and (max-width:850px) {
.standard-link a {
transition: none;
}
.standard-link td {
border-radius: 0px 15px 15px 0px;
}
}

/* Стили при наведении курсора на строку таблицы */
.standard-link tr:hover a {
background-color: black;
color: #fff;
border-color: #e23229;
}

/* End главное меню
Данте ( и немного Shegare >w< )
*/
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Данте Морпехи */
/* Основные стили для контейнера меню */
.main-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

/* Общие стили для секций меню */
.menu-section {
flex-basis: 23%;
margin-bottom: 15px;
padding: 10px;
border-radius: 8px;
background-color: #14171f; /* Фон не покрашенных блоков */
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.1); /* Уменьшенная белая обводка для блоков */
}

/* Индивидуальные цвета для секций */
.marines-section {
background-color: #222424;
}

.xenos-section {
background-color: #2b2e44;
}

.other-section {
background-color: #341d1d; /* Цвет для блока "Другие фракции" */
}

/* Стили для заголовков секций */
.menu-section h3 {
padding: 5px;
margin: 0;
font-size: 18px;
text-align: center;
color: #fff;
}

/* Стили для списка */
.menu-section ul {
list-style-type: none;
padding: 0;
margin: 10px 0 0 0;
}

/* Стили для элементов списка */
.menu-section ul li {
margin: 10px 0;
text-align: center;
}

/* Стили для кнопок (ссылок) */
.menu-section ul li a {
display: block;
width: 100%;
padding: 10px;
border-radius: 8px;
text-align: center;
background-color: #1a1e29; /* Цвет фона кнопок */
color: white;
font-weight: bold;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.menu-section ul li a:hover {
background-color: #666;
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Стили для секции с картами */
.maps-section {
color: white; /* Устанавливаем белый цвет текста для всей секции */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для секции с картами */
.maps-section {
color: white !important; /* Добавление !important */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для элементов списка в секции карт */
.maps-section ul li {
flex-basis: 48%; /* Уменьшаем до 48%, чтобы уместить 2 карты в ряд с отступами */
list-style: none; /* Убираем маркеры списка */
}

/* Стили для ссылок в секции карт */
.maps-section ul li a {
display: block;
padding: 10px;
background-color: #1a1e29; /* Цвет фона кнопок в секции карт */
color: white !important; /* Устанавливаем белый цвет текста */
border-radius: 8px;
text-align: center;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.maps-section ul li a:hover {
background-color: #666; /* Цвет фона при наведении на ссылку в секции карт */
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Убираем иконку внешней ссылки в блоке карт */
.maps-section ul li a::after {
content: none !important; /* Убираем псевдоэлемент */
}

/* Стили для контейнера заголовка */
.header-container {
display: flex;
align-items: center;
background-color: #1b1e26;
padding: 20px 30px;
border-radius: 8px;
}

/* Стили для логотипа */
.logo img {
border-radius: 50%;
width: 100px;
height: auto;
}

/* Стили для текста заголовка */
.title-text {
margin-left: 30px;
color: #ffffff;
}

.title-text h1 {
margin: 0;
font-size: 32px;
font-weight: bold;
}

.title-text p {
margin: 5px 0 0;
font-size: 18px;
}

/* Стили для разделителя */
.separator {
border-bottom: 2px solid #A9A9A9;
margin: 10px 0 20px;
}

/* Адаптивные стили для мобильных устройств */
@media (max-width: 599px) {
.main-container {
flex-direction: column;
align-items: stretch;
}

.menu-section {
flex-basis: 100%;
margin-bottom: 15px;
display: flex;
flex-direction: column;
align-items: stretch;
}

.menu-section ul {
flex-grow: 1;
justify-content: space-between;
padding: 0;
}

.menu-section ul li {
flex-grow: 1;
width: 100%;
text-align: center;
margin-bottom: 10px; /* Отступы между элементами */
}

.menu-section ul li a {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
padding: 10px 0;
}

.maps-section ul {
flex-wrap: wrap;
gap: 10px;
}

.maps-section ul li {
flex-basis: 48%; /* Карты будут располагаться по 2 на ряд */
margin-bottom: 10px; /* Отступы между картами */
}

.header-container {
flex-direction: column;
text-align: center;
padding: 10px;
}

.logo img {
width: 80px;
}

.title-text {
margin-left: 0;
margin-top: 10px;
}

.title-text h1 {
font-size: 24px;
}

.title-text p {
font-size: 16px;
}
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* код оформление для Командование и тд Данте! */
/* Контейнер для карточек */
.command-wrapper {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
padding: 20px;
}

/* Основные стили карточек */
.card {
background-color: #2b2b2b; /* Темный фон карточки */
border-radius: 10px;
width: 220px;
height: auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
display: flex;
flex-direction: column;
justify-content: flex-start; /* Элементы начинают сверху */
align-items: center;
padding: 8px; /* Уменьшаем padding */
text-align: center;
position: relative;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 4px solid transparent;
color: #ffffff; /* Белый текст */
overflow: hidden; /* Скрываем все, что выходит за пределы карточки */
}

/* Цветные обводки для разных ролей */
.card.Captain {
border-color: #B0B7C3; /* Серебристый для Капитана */
}
.card.HeadOfSecurity {
border-color: #FF0000; /* Красный для Главы Безопасности */
}
.card.HeadOfPersonnel {
border-color: #00FF00; /* Зеленый для Главы Персонала */
}
.card.Engineer {
border-color: #FFA500; /* Оранжевый для Старшего Инженера */
}
.card.Scientist {
border-color: #800080; /* Фиолетовый для Научного Руководителя */
}
.card.Doctor {
border-color: #127BB7; /* Синий для Главного Врача */
}
.card.Quartermaster {
border-color: #FFD700; /* Золотой для Квартирмейстера */
}

/* Стили для текста и заголовков */
.card .role-name {
font-weight: bold;
font-size: 1.4em;
color: #ffffff; /* Белый текст */
margin-bottom: 3px;
white-space: normal; /* Разрешить перенос слов */
overflow: hidden;
text-overflow: ellipsis;
text-align: center; /* Центрирование текста */
word-wrap: break-word; /* Перенос слов при необходимости */
display: grid;
grid-template-columns: 212px;
grid-template-rows: 75px;
}
.role-name a {
color: #ccc;
}

/* Стили для изображения */
.card img {
max-width: 160px;
max-height: 160px;
margin-bottom: 3px; /* Уменьшаем отступ снизу */
}

/* Стили для описания роли */
.card .role-description {
font-size: 0.9em;
flex-grow: 1;
margin: 3px 0; /* Минимальные отступы сверху и снизу */
color: #dcdcdc; /* Более светлый текст */
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal; /* Текст переносится */
}

/* Ссылка на СРП */
.card .role-guide {
font-size: 0.85em;
margin-top: 3px; /* Минимальный отступ сверху */
text-align: center; /* Центрируем текст */
}

.card .role-guide a {
color: #00bfff; /* Цвет ссылки */
text-decoration: none;
}

.card .role-guide a:hover {
text-decoration: underline;
}

/* Hover эффект для карточек */
.card:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

* { font-family: Arial }

body {
color: #FAFAFA;
}

img {
image-rendering: pixelated;
}

.flex-container {
display: flex;
align-items: flex-start;
}

.flex-image {
flex-shrink: 0;
margin-right: 20px;
}

.flex-image-description {
flex-grow: 1;
}

.uplinkbuybutton {
background: #464966;
width: 62px;
height: 27px;
color: white;
text-align: center;
font-weight: bolder;
float: right;
padding-top: 4px;
clip-path: polygon(0px 0px, 0px 18px, 9px 27px, 62px 27px, 62px 10px, 53px 0px);
}

.tooltip {
position: relative;
display: inline;
}

.tooltiptext {
position: absolute;
display: initial;
z-index: 99999;
width: 295px;
left: -120px;
top: 42px;
padding: 5px;
pointer-events: none;
visibility: hidden;
opacity: 0;
white-space: normal;
text-align: left;
transition: transform 0.2s, background-color 0.2s;
border: 1px solid #b80000;
border-radius: 10px;
background-color: #24242a;
box-shadow: 0 0 5px #b80000;
}

.tooltip:hover > .tooltiptext {
visibility: visible;
opacity: 0.98;
}

.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
text-align: left;
}

.wikitable > tr > th,
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
border: 1px solid black;
}

.wikitable > * > tr > th {
background: #27272e;
color: white;
}

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

.job_header {
float: right;
width: 25%;
}
}

@media screen and (max-width: 1420px) {
.tooltiptext {
box-shadow: 0px 0px 100vw 100vh rgb(0 0 0 / 60%);
position: fixed;
width: 80vw;
top: 40vh;
left: 0;
margin: 0 auto;
right: 0;
}
}

@media screen and (max-width: 850px) {
.nomobile {
display: none;
}
.mobilefont {
font-size: 80%;
}
.mobile_sprite,
.mobile_text {
transform: scale(0.75);
}
}

.hover_img_special {
top: 0;
left: 0;
display: none;
}

.img_special:hover .hover_img_special {
display: inline;
}

.img_special:hover .img_spec {
display: none;
}

.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt {
border-color: #fc3;
background-color: #fef6e7;
}

html body.mediawiki .mbox-small {
clear: right;
float: right;
margin: 4px 0 4px 1em;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}

.messagebox.small {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
}

.messagebox.small-talk {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
background-color: #f8eaba;
}

.infobox {
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
color: black;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
float: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
.infobox th,
.infobox td {
vertical-align: top;
}

.infobox-label,
.infobox-data,
.infobox th,
.infobox td {
text-align: left;
}

.infobox .infobox-above,
.infobox .infobox-title,
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}

.infobox-title,
.infobox caption {
padding: 0.2em;
}

.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}

.infobox .infobox-navbar {
text-align: right;
}

.mw-default-size {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-default-size img {
border-color: black !important;
}

.mw-default-size figcaption {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-halign-right {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-right img {
border-color: black !important;
}

.mw-halign-right figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left img {
border-color: black !important;
}

.mw-halign-left figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center img {
border-color: black !important;
}

.mw-halign-center figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

th.navbox-group {
white-space: nowrap;
text-align: right;
}

.mw-parser-output .mw-collapsible-toggle {
font-weight: normal;
text-align: right;
}

td.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}

td.mbox-imageright {
border: none;
padding: 2px 0.9em 2px 0;
text-align: center;
}

#p-namespaces {
float: left;
width: 100%;
}

p {
margin-bottom: 1.5em;
}

.infobox-table {
z-index: 3 !important;
width: 400px;
max-width: 100%;
margin-bottom: 1rem;
padding-bottom: 20px !important;
background: hsl(205, 25%, 15%);
border-radius: 8px;
border-spacing: 0;
font-size: 0.875rem;
text-align: left;
}

.infobox-table tr:not(#infobox-table-img-bg) {
display: flex;
margin-top: 10px;
}

.infobox-table th,
.infobox-table td {
padding: 0 15px !important;
}

.infobox-table th,
th.infobox-table-name {
color: hsl(205, 80%, 95%);
}

.infobox-table th {
padding-top: 15px !important;
border-top: 1px solid rgba(255, 255, 255, 0.05);
font-size: 1rem;
text-align: left !important;
}

th.infobox-table-name {
padding-top: 0 !important;
border: 0 !important;
margin-top: 10px;
margin-bottom: 5px;
font-size: 1.4rem !important;
line-height: 1.4;
}

.infobox-table-img img {
max-width: 100%;
height: auto !important;
}

.infobox-table-img img[src$='.svg'] {
background: #eaecf0;
}

.infobox-table .image:hover img {
transform: scale(1.1);
}

.infobox-button {
display: block;
width: 100%;
}

.infobox-button > div {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

@media only screen and (max-width: 720px) {
.infobox-table {
margin-right: auto;
margin-left: auto;
}
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Данте страница*/
body.page-Участник_Дantes {
font-family: 'Consolas', 'Courier New', monospace;
background-color: #0f0f0f;
color: #e0e0e0;
overflow-x: hidden;
}

.glitch-text {
position: relative;
color: #ffcc00;
text-align: center;
animation: glitch 1.5s infinite;
font-size: 1.8em;
letter-spacing: 1px;
margin-bottom: 12px;
}

@keyframes glitch {
0% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
25% { text-shadow: -2px 2px #00ff00, 2px -2px #ff00ff; }
50% { text-shadow: 2px -2px #ff0000, -2px 2px #00ffff; }
75% { text-shadow: -2px -2px #ff00ff, 2px 2px #00ff00; }
100% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
}

.nt-dossier {
margin: 20px auto;
max-width: 600px;
background: linear-gradient(145deg, #1a1a1a, #111111);
border: 1px solid #ffcc00;
border-radius: 12px;
box-shadow: 0 0 20px rgba(255,204,0,0.4);
position: relative;
padding-bottom: 20px;
animation: fadeIn 1s ease-out forwards;
opacity: 0;
}

.nt-dossier-table {
width: 100%;
border-collapse: collapse;
}

.nt-dossier-table th, .nt-dossier-table td {
padding: 12px;
border-bottom: 1px solid #444;
}

.nt-dossier-table th {
background: #2c2c2c;
color: #ffcc00;
width: 40%;
text-align: left;
transition: background 0.3s;
}

.nt-dossier-table th:hover {
background: #333;
}

.scan-row {
opacity: 0;
transform: translateX(-20px);
transition: transform 0.6s ease-out, background-color 0.6s ease-out;
}

.scan-row.visible {
opacity: 1;
transform: translateX(0);
}

.threat {
color: #ff4444;
font-weight: bold;
animation: blink 1s infinite alternate;
text-transform: uppercase;
}

@keyframes blink {
0% { opacity: 1; }
50% { opacity: 0.3; }
100% { opacity: 1; }
}

.status-indicator {
width: 16px;
height: 16px;
background: #ff4444;
border-radius: 50%;
position: absolute;
bottom: 12px;
right: 12px;
animation: pulse 1.5s infinite;
}

@keyframes pulse {
0% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
50% { box-shadow: 0 0 15px #ff0000; transform: scale(1.3); }
100% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
}

.nt-tabs {
margin: 20px auto;
max-width: 600px;
text-align: center;
animation: fadeIn 1.2s forwards;
opacity: 0;
}

.nt-tab {
display: inline-block;
background: #2c2c2c;
border: 1px solid #444;
color: #ffcc00;
padding: 10px 16px;
cursor: pointer;
margin: 0 6px;
border-radius: 6px;
user-select: none;
transition: transform 0.3s ease, background-color 0.3s ease;
}

.nt-tab.active {
background: #444;
border-color: #ffcc00;
box-shadow: 0 0 10px #ffcc00 inset;
}

.nt-tab:hover {
background: #555;
transform: scale(1.05);
}

.nt-tab-content {
display: none;
max-width: 600px;
margin: 15px auto;
padding: 15px;
background: #1a1a1a;
border: 1px solid #444;
border-radius: 10px;
animation: fadeIn 0.5s forwards;
opacity: 0;
}

.nt-tab-content.active {
display: block;
opacity: 1;
}

@keyframes fadeIn {
to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
* { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.job_header .header-title,
.job_header .sprite-container {
animation: none !important;
}
}

/*МИНИ часть блока лора что бы не ломать вики государств*/
:root{
--cf-federation-color:#6e0e0e;
--cf-confederation-color:#0c0361;
--cf-sssp-color:#801828;
--cf-minor-color:#07520b;
--cf-corp-color:#0e2847;
--cf-bg-card:#1e1e1e;
--cf-text-light:#f0f0f0;
--cf-text-muted:#a0a0a0;
}

/* Структура карточек фракций (префикс cf- чтобы не ломать сайт) */
.cf-page-header{ text-align:center; margin-bottom:20px; padding:6px 10px; }
.cf-factions-wrapper{ display:flex; flex-direction:column; gap:18px; max-width:1400px; margin:0 auto; padding:6px; box-sizing:border-box; }

.cf-faction-category{ width:100%; }
.cf-category-title{ font-size:1.6rem; margin:6px 0 12px; padding-bottom:6px; border-bottom:2px solid; text-align:center; }

.cf-cards-row{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

.cf-faction-card{ background-color:var(--cf-bg-card); border-radius:10px; overflow:hidden; width:100%; max-width:520px; box-shadow:0 6px 14px rgba(0,0,0,0.45); transition:transform .22s ease, box-shadow .22s ease; }
.cf-faction-card:hover{ transform:translateY(-6px); box-shadow:0 14px 26px rgba(0,0,0,0.6); }

.cf-card-header{ padding:14px 16px; text-align:center; position:relative; }
.cf-card-header::after{ content:''; position:absolute; bottom:6px; left:8%; width:84%; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent); }

.cf-card-logo{ display:block; margin:0 auto 10px; max-width:240px; max-height:120px; }
.cf-card-title{ font-size:1.25rem; margin:0; font-weight:700; color:var(--cf-text-light); }

.cf-card-content{ padding:14px 16px; color:var(--cf-text-light); }
.cf-faction-desc{ font-size:0.95rem; color:var(--cf-text-muted); line-height:1.45; }

/* Цвета для типов */
.cf-federation{ border-top:5px solid var(--cf-federation-color); }
.cf-federation .cf-card-header{ background:linear-gradient(90deg,#6e0e0e 0%, #470303 100%); }

.cf-confederation{ border-top:5px solid var(--cf-confederation-color); }
.cf-confederation .cf-card-header{ background:linear-gradient(90deg,#0c0361 0%, #0a034a 100%); }

.cf-sssp{ border-top:5px solid var(--cf-sssp-color); }
.cf-sssp .cf-card-header{ background:linear-gradient(90deg,#801828 0%, #4f121b 100%); }

.cf-minor-states{ border-top:5px solid var(--cf-minor-color); }
.cf-minor-states .cf-card-header{ background:linear-gradient(90deg,#07520b 0%, #032b05 100%); }

.cf-corporations{ border-top:5px solid var(--cf-corp-color); }
.cf-corporations .cf-card-header{ background:linear-gradient(90deg,#0e2847 0%, #081524 100%); }

/* Адаптивность */
@media (max-width:900px){
.cf-card-logo{ max-width:180px; max-height:100px; }
.cf-faction-card{ max-width:100%; }
.cf-cards-row{ gap:10px; }
}

MediaWiki:Common.css

2026-04-06T20:24:01Z

MetalSage:

/* Загрузка лого морпехов */
.second-custom-logo {
display: inline-flex;
align-items: center;
margin-left: 16px;
vertical-align: middle;
height: 100%;
}

.second-custom-logo img {
height: 32px;
width: auto;
object-fit: contain;
transition: opacity 0.2s ease;
}

.second-custom-logo:hover img {
opacity: 0.8;
}

@media screen and (max-width: 720px) {
.second-custom-logo {
margin-left: 8px;
}
.second-custom-logo img {
height: 24px;
}
}

/*Химия*/
@media (max-width: 1280px) {
.chem-heading {
display: none;
}
}
@media screen and (min-width: 1120px) {
body.page-Тест .citizen-body-container {
grid-template-areas: 'void header header' 'sidebar content toc' 'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
max-width: none;
}
}
.chem-cards-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin: 20px 0;
width: 100%;
box-sizing: border-box;
}
.chem-card {
background-color: #121212;
border: 3px solid var(--card-border, #444);
border-radius: 12px;
padding: 0;
color: #e0e0e0;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
overflow: hidden;
}
.chem-name-header {
background-color: var(--card-accent);
color: #ffffff;
font-size: 22px;
font-weight: 700;
padding: 14px 20px;
text-align: center;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
margin: 0;
}
.chem-heading {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 16px;
background: rgba(255,255,255,0.06);
border-top: 1px solid rgba(255,255,255,0.1);
cursor: pointer;
}
.chem-heading-content {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}
.heading-text {
font-size: 15px;
font-weight: 600;
color: var(--card-accent, #8cf);
}
.collapse-btn {
border: 2px dotted #ffd700;
padding: 2px 12px;
border-radius: 9999px;
font-size: 13px;
color: #ffd700;
background: rgba(0,0,0,0.3);
}
.collapsible {
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
max-height: 0;
}
.collapsible.expanded {
max-height: 3000px;
}
.chem-recipe-block,
.chem-effects-block {
text-align: center;
}
.chem-recipe-steps,
.chem-effects {
padding: 12px 16px 24px;
}
.recipe-variant-header {
font-size: 15px;
font-weight: 700;
color: #ffd700;
text-align: center;
padding: 8px 0;
border-bottom: 1px dashed rgba(255,215,0,0.3);
margin-bottom: 12px;
}
.chem-recipe {
width: 100%;
max-width: 780px;
margin: 20px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 24px;
box-sizing: border-box;
}
.recipe-inputs,
.recipe-outputs {
flex: 1 1 280px;
min-width: 240px;
display: flex;
flex-direction: column;
gap: 10px;
}
.recipe-action {
flex: 0 0 160px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 0;
}
.recipe-action-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
}
.recipe-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255,255,255,0.08);
border-radius: 6px;
padding: 8px 12px;
border-left: 4px solid var(--card-accent, #8cf);
white-space: normal;
word-break: break-word;
}
.chem-reagent-icon,
.chem-beaker {
width: 36px;
height: 36px;
flex-shrink: 0;
object-fit: contain;
}
.action-sprite .chem-reagent-icon,
.action-sprite .chem-beaker {
width: 46px;
height: 46px;
}
.action-text {
font-weight: 700;
color: #ffd700;
font-style: italic;
font-size: 15px;
line-height: 1.3;
}
.chem-effects .chem-effect-line {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.45;
padding-left: 4px;
}
.chem-desc {
margin: 12px 16px;
padding: 12px;
background: rgba(255,255,255,0.03);
border-radius: 6px;
border-left: 4px solid var(--card-accent, #8cf);
font-size: 14px;
color: #aaa;
}
@media (max-width: 1024px) {
.chem-cards-container {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.chem-cards-container {
grid-template-columns: 1fr;
}
.chem-recipe {
flex-direction: column;
align-items: center;
gap: 16px;
max-width: 100%;
padding: 0 12px;
}
.recipe-action {
flex: 0 0 auto;
min-width: auto;
}
}
/*Химия*/

/*=Блок лора=*/
/*Хронолония */
.timeline {
width: 100%;
margin: 20px 0;
background-color: transparent;
}

.timeline-entry {
padding: 10px;
border-bottom: 1px solid #555;
background-color: var(--timeline-entry-bg, #333);
}

.timeline-header {
font-size: 18px;
font-weight: bold;
color: var(--timeline-header-color, #fff);
cursor: pointer;
}

.timeline-content {
padding: 10px;
font-size: 16px;
color: var(--timeline-content-color, #ddd);
background-color: var(--timeline-content-bg, #444);
display: none;
}

.timeline-entry:nth-child(even) {
background-color: var(--timeline-entry-bg-even, #222);
}

.timeline-entry:hover {
background-color: var(--timeline-entry-bg-hover, #555);
}

.timeline-entry a {
color: var(--timeline-link-color, #ff9800);
text-decoration: none;
}

.timeline-entry a:hover {
text-decoration: underline;
}

/*=Таблица планет=*/
.planets-table-wrapper {
width: 100%;
overflow-x: auto;
margin: 0 auto;
}

.planets-table {
width: 100%;
max-width: 150%;
border-collapse: separate;
border-spacing: 0;
font-family: "Segoe UI", Arial, sans-serif;
background: linear-gradient(to bottom, #0d1117, #161b22);
border: 1px solid #5a5a5a;
border-radius: 12px;
color: #b0b0b0;
overflow: hidden;
}

.planets-table th {
background-color: #3a3a3a;
color: #dcdcdc;
text-align: center;
padding: 12px;
font-size: 18px;
font-weight: bold;
border-bottom: 1px solid #5a5a5a;
}

.planets-table td {
text-align: center;
padding: 12px;
font-size: 16px;
border-top: 1px solid #5a5a5a;
}

.planets-table td img {
border-radius: 50%;
margin: 10px 0;
width: 80px;
height: 80px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6);
}

.planets-table tr:first-child th:first-child {
border-top-left-radius: 12px;
}

.planets-table tr:first-child th:last-child {
border-top-right-radius: 12px;
}

.planets-table tr:last-child td:first-child {
border-bottom-left-radius: 12px;
}

.planets-table tr:last-child td:last-child {
border-bottom-right-radius: 12px;
}

.planets-table tr:nth-child(even) {
background-color: rgba(255, 255, 255, 0.03);
}

.planets-table tr:nth-child(odd) {
background-color: rgba(255, 255, 255, 0.06);
}

.planets-table th:nth-child(2),
.planets-table td:nth-child(2) {
text-align: center;
}

.planets-table caption {
margin: 10px 0;
font-size: 20px;
font-weight: bold;
color: #a0a0a0;
text-align: left;
}

/*=Карточки планет=*/

.planets-row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
margin: 20px 0;
}

.planet-card {
width: 220px;
border: 2px solid #555;
border-radius: 15px;
overflow: hidden;
background-color: #333;
color: #fff;
text-align: center;
padding: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.7);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.planet-card img {
width: 100%;
height: 180px;
object-fit: cover;
border-bottom: 2px solid #555;
border-radius: 8px;
}

.planet-card h3 {
font-size: 1.3em;
margin: 15px 0 10px;
color: #ffcc00;
text-transform: uppercase;
letter-spacing: 1px;
}

.planet-card p {
font-size: 1em;
color: #ddd;
margin: 0;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
text-overflow: ellipsis;
}

.planet-card:hover {
transform: scale(1.05);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.8);
}

.planet-card .more-info {
margin-top: 10px;
padding: 5px;
background-color: #ffcc00;
color: #222;
border-radius: 5px;
font-weight: bold;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.3s ease;
}

.planet-card .more-info:hover {
background-color: #ffaa00;
}

@media (max-width: 768px) {
.planets-row {
justify-content: center;
}

.planet-card {
width: 90%;
max-width: 280px;
}
}

@media (max-width: 480px) {
.planet-card {
width: 100%;
}
}

/*=Меню лора=*/
:root { --transition-duration: 0.4s; --primary-bg-color: #1c1c1c; --secondary-bg-color: #2c2c2c; --item-bg-color: #2e2e2e; --item-hover-bg-color: #444444; --border-color: #666; --text-color: #dcdcdc; --hover-text-color: #ffffff; --font-family: 'Arial', sans-serif; --menu-border-radius: 25px; --header-padding: 30px; --item-height: 180px; --icon-size: 72px; --text-font-size: 18px; } .custom-lore-menu { max-width: 1200px; margin: 30px auto; padding: 40px; border-radius: var(--menu-border-radius); background: linear-gradient(145deg, #1b1b1b, #252525); display: grid; grid-template-columns: 1fr; gap: 30px; font-family: var(--font-family); box-shadow: 0 10px 30px rgba(0,0,0,0.6); } .custom-header { text-align: center; background-color: var(--secondary-bg-color); padding: var(--header-padding); border-bottom: 2px solid var(--border-color); color: var(--text-color); font-size: 26px; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); } .custom-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 25px; padding: 25px; justify-items: center; align-items: stretch; } .custom-item { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: var(--item-height); text-align: center; border: 1px solid var(--border-color); border-radius: 20px; background: linear-gradient(145deg, #2a2a2a, #333333); transition: transform var(--transition-duration), background var(--transition-duration), box-shadow var(--transition-duration); cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); } .custom-item:hover { background: linear-gradient(145deg, #3a3a3a, #555555); transform: scale(1.08); box-shadow: 0 10px 20px rgba(0,0,0,0.5); } .custom-item a { text-decoration: none; color: var(--text-color); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; transition: color var(--transition-duration), text-shadow var(--transition-duration); font-size: var(--text-font-size); font-weight: bold; } .custom-item a:hover { color: var(--hover-text-color); text-shadow: 0 0 8px #fff; } .custom-icon { width: var(--icon-size); height: var(--icon-size); margin-bottom: 12px; flex-shrink: 0; filter: drop-shadow(1px 1px 3px rgba(0,0,0,0.7)); } @media (max-width: 768px) { .custom-lore-menu { padding: 20px; } .custom-links { grid-template-columns: 1fr; } .custom-item { height: auto; padding: 20px 10px; } .custom-item a { font-size: 16px; } }

/*=Блок лора=*/

/*=Блок лор Colonial marines=*/

body.page-Лор_СМ #siteSub,
body.page-Лор_СМ #contentSub,
body.page-Лор_СМ h1.firstHeading
{display:none !important}

.CMMainFigure {
height: 130px;
width: 575px;
background: #292f2d;
border-radius: 6px;
}

.CMMainText {
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: #a1a2a5;
padding-top: 6px;
padding-left: 9px;
}

.CMMainButton {
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton2 {
transform: translate(190px,-94px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton3 {
transform: translate(380px,-188px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButtonText {
display: inline-block;
width: 100%;
height: 100%;
text-align: center;
padding-top: 7px;
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: white;
text-decoration: none;
}

/*=Блок лора Маршалов CM=*/

body.page-Провост_Маршал .mw-page-title-main,
body.page-Провост_Маршал #siteSub,
body.page-Провост_Маршал .mw-body-header,
body.page-Провост_Маршал .citizen-header
{display:none !important}

body.page-Провост_Маршал .citizen-page-container
{background: rgb(20,24,31);
background: linear-gradient(90deg, rgba(20,24,31,1) 0%, rgba(40,11,15,1) 75%, rgba(82,0,0,1) 100%);}

.rectangleCM {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 20px);
}

.rectangleCM2 {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 30px);
}

.rectangleCM3 {
width: 800px;
height: 130px;
background: #590000;
position: relative;
transform: translate(0px, -100px);
}

.rectangleCM4 {
width: 1085px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(0px, -90px);
}

.rectangleCMTwo {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.rectangleCMTwo2 {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.classifieldCM {
color: #bebebe;
position: relative;
transform: translate(15px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.75em;
font-weight: 500;
}

.classifieldCMRisk {
color: #bebebe;
position: relative;
transform: translate(17.5px, 6px);
font-family: "Gill Sans", sans-serif;
font-size: calc(11px +(12 - 8)*((100vw - 400px) /(800 - 400)));
font-weight: bold;
}

.rectangleCMTwo3 {
width: 10px;
height: 130px;
background: #ce0000;
position: relative;
transform: translate(0px, -79px);
}

.classifieldCM3 {
color: #bebebe;
position: relative;
transform: translate(17.5px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.9em;
font-weight: 500;
}

.classifieldCMRisk3 {
color: #bebebe;
position: relative;
transform: translate(20px, 21px);
font-family: "Gill Sans", sans-serif;
font-size: 35px;
font-weight: bold;
}

.triangle-bottomrightCM {
width: 450px;
height: 0;
border-bottom: 130px solid #700;
border-left: 100px solid transparent;
position: relative;
transform: translate(350px,-210px);
}

.MarshalsLogoCM {
right: 0;
bottom: 0;
position: absolute;
}

/*=Не лор маршалов=*/
.hrCMLore {
border: none;
border-top: 1.5px solid #C6C3B5; /* Линия теперь будет красного цвета */
}

.second_block {
display: none;
}

.imggg {
float: right ;
}

.home-card:hover .second_block {
display: block;
font-family: "Gill Sans", sans-serif;
}

.divisionis {
color: #C6C3B5;
opacity: 1;
text-align: center;
font-family: system-ui;
font-size: 30px;
}

.loreCMwelcom {
color: #C6C3B5;
opacity: 0.5;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMwelcomWork {
color: #C6C3B5;
opacity: 0.75;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMtext {
color: white;
text-align: left;
font-family: system-ui;
font-size: 30px;
font-weight: bold;
}

.home-grid {
display: grid;
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
grid-auto-rows: minmax( 3rem, auto );
grid-gap: calc(0.5 * 1rem);
font-family: "Gill Sans", sans-serif;
}

.home-grid--col2 {
grid-template-columns: 1fr 1fr;
}

.home-grid a.external {
background-image: none;
}

.home-card {
position: relative;
padding: 1rem;
background: hsl(220,25%,12%);
border: 1px solid rgba(255,255,255,0.05);
border-radius: 8px;
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
font-size: 0.875rem;
}

.home-card table.timeline {
margin-top: 0.2rem;
}

.home-card--col2 {
grid-column: span 2;
}

.home-card--row3 {
grid-row: span 3;
}

.home-card--row4 {
grid-row: span 4;
}

.home-card--row8 {
grid-row: span 8 / auto;
}

.home-card__label {
color: #72777d;
font-size: 0.8125rem;
letter-spacing: 0.75px;
}

.home-card__header {
color: #202122;
font-size: 1rem;
font-weight: 600;
line-height: 1.25;
}

.home-card__header a {
display: flex;
align-items: center;
justify-content: space-between;
}

.home-card__header a:after {
content: '▶';
font-size: 0.8125rem;
}

.home-card__background {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #242a31;
border-radius: 8px;
}

.home-card__background:after {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: block;
background: linear-gradient(to right,#000,transparent);
content: "";
}

.home-card__background picture,
.home-card__background img {
width: 100%;
height: 100%;
}

.home-card__background img {
object-fit: cover;
object-position: center;
}

.home-card__foreground {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: calc(0.25 * 1rem);
color: #fff;
line-height: 1.25;
}

.home-card__foreground .home-card__header {
color: #fff;
}

.home-card__foreground .home-card__label {
color: #bababa;
}

.home-card p {
/* margin-top: calc(0.5 * 1rem); */
margin-top: calc(0 * 1rem);
font-size: 0.875rem;
}

.home-card.home-card--button {
overflow: hidden;
padding: 0;
background: #242a31;
border: 0;
}

.home-card--button a {
display: flex;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button--navigation a {
/* display: flex; */
display: contents;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button .home-card__background a {
padding: 0;
}

.home-card--button img {
transition: transform 0.2s ease;
}

.home-card--button:hover img {
transform: scale(1.1);
}

.home-link {
display: grid;
margin-top: calc(0.5 * 1rem);
font-size: 0.875rem;
font-weight: 500;
grid-gap: calc(0.5 * 1rem);
text-align: center;
}

.home-link__button {
display: flex;
}

.home-link__button a {
flex-grow: 1;
padding: calc(0.5 * 1rem);
border: 1px solid rgba(255,255,255,0.05);
background: hsl(220,25%,15%);
border-radius: 8px;
color: #fff !important;
line-height: 1.25;
text-decoration: none !important;
}

.home-link__button a:hover {
background: hsl(220,30%,19%);
}

.home-link__button a:active {
background: hsl(220,30%,11%);
}

#home-content {
margin-top: calc(1.25 * 1rem);
}

.home-card .template-statsbar {
margin: 0;
}

.home-footer {
font-size: 0.8125rem;
font-family: monospace;
text-align: center;
}

#home-nav {
margin-top: 1rem;
}

#home-nav .home-card__foreground {
font-weight: 500;
}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
#ss-art-gallery.ss-wrap{ --ss-bg:#0e0f14; --ss-fg:#e9e9e9; --ss-muted:#a9b0bd; --ss-accent:#dca01b; --ss-card:#171a21; --ss-ring:#2b3241; --ss-chip:#1e2330; --ss-shadow:0 10px 28px rgba(0,0,0,.4); background:var(--ss-bg); color:var(--ss-fg); padding:20px; border-radius:18px; font-family:"Segoe UI",sans-serif }
#ss-art-gallery .ss-header{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; text-align:center }
#ss-art-gallery .ss-title{ font-size:30px; line-height:1.2; font-weight:700; color:var(--ss-accent) }
#ss-art-gallery .ss-sub{ font-size:15px; color:var(--ss-muted) }
#ss-art-gallery .ss-filters{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:10px }
#ss-art-gallery .ss-chip{ user-select:none; cursor:pointer; background:var(--ss-chip); padding:8px 14px; border-radius:999px; border:1px solid var(--ss-ring); box-shadow:var(--ss-shadow); font-size:13px; transition: transform .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-chip-active{ border-color:var(--ss-accent); background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-section{ margin:28px 0 }
#ss-art-gallery .ss-section-title{ font-size:22px; font-weight:700; margin:10px 0 18px; text-align:left; color:var(--ss-accent) }
#ss-art-gallery .ss-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); gap:24px; margin-top:12px }
#ss-art-gallery .ss-card{ background:var(--ss-card); border:1px solid var(--ss-ring); border-radius:16px; box-shadow:var(--ss-shadow); padding:16px; display:flex; flex-direction:column; gap:10px; transform:translateZ(0); transition:transform .2s ease,border-color .2s ease }
#ss-art-gallery .ss-card:hover{ transform:translateY(-4px); border-color:var(--ss-accent) }
#ss-art-gallery .ss-card-title{ font-size:16px; font-weight:600; color:var(--ss-muted); text-align:center }
#ss-art-gallery .ss-card img{
width:auto!important;
height:auto!important;
max-width:100%;
border-radius:12px;
display:block;
margin:0 auto;
image-rendering: auto !important; /* убираем пикселизацию — включаем плавное масштабирование спрайтов */
}
#ss-art-gallery .ss-hidden{ display:none!important }
#ss-art-gallery .ss-modal{ position:fixed; inset:0; background:rgba(0,0,0,.88); display:none; align-items:center; justify-content:center; z-index:9999 }
#ss-art-gallery .ss-modal.open{display:flex}
#ss-art-gallery .ss-modal-inner{ max-width:92vw; max-height:92vh; animation:ss-fade .25s ease }
#ss-art-gallery .ss-modal-img{
max-width:90vw;
max-height:90vh;
border-radius:14px;
box-shadow:0 0 24px rgba(0,0,0,.7);
image-rendering: auto !important; /* убираем пикселизацию в модальном окне */
}
#ss-art-gallery .ss-modal-close{ position:fixed; top:16px; right:18px; background:var(--ss-chip); border:1px solid var(--ss-ring); padding:8px 14px; border-radius:10px; cursor:pointer; transition: transform .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent); color:#000 }
@keyframes ss-fade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/
.nt-card {
float: right;
margin: 0 0 12px 12px;
display: grid;
gap: 8px;
width: 220px;
padding: 10px;
border: 1px solid rgba(120,120,120,.35);
border-radius: 10px;
background: rgba(20,20,20,.05);
box-shadow: 0 2px 6px rgba(0,0,0,.05);
text-align: center;
}
.nt-card .nt-title {
font-weight: 700;
font-size: 1rem;
}
.nt-card .nt-sprite {
display: grid;
place-items: center;
width: 64px;
height: 64px;
margin: 0 auto;
border-radius: 6px;
background: rgba(0,0,0,.04);
}
.nt-card .nt-sprite img {
image-rendering: pixelated;
width: 56px;
height: 56px;
}
.nt-card .nt-desc {
font-size: .88rem;
line-height: 1.35;
}
.nt-card .nt-stats {
display: grid;
gap: 3px;
font-size: .85rem;
margin-top: 4px;
text-align: left;
}
.nt-card .nt-stat {
padding: 3px 5px;
border-radius: 5px;
background: rgba(0,0,0,.06);
}
.nt-card .nt-src {
margin-top: 2px;
font-size: .8rem;
opacity: .85;
text-align: left;
}

/* адаптация под телефоны */
@media (max-width: 600px) {
.nt-card {
float: none;
margin: 12px 0;
width: auto;
max-width: 100%;
display: block;
text-align: center;
}
.nt-card .nt-stats,
.nt-card .nt-src {
text-align: center;
}
}

/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/

/*------------------------------------------------Блок вики-----------------------------------------------------------------------------*/

.tabber {
border: 1px solid #20242a !important;
border-radius: 10px !important; /* Закругление углов у всего таба */
overflow: hidden; /* Чтобы закругление работало для содержимого */
}

.tabber__tab {
background: #19191d !important;
padding: 8px 16px;
}

.tabber__panel {
padding: 0 12px;
border-radius: 8px !important; /* Закругление углов для панели */
}

/* Все табсы должны быть заменены на табберы! */
.tabs-tabbox {
background: rgba(255,0,0,0.07) !important;
border-radius: 8px !important; /* Закругление углов */
}

/*------------------------------------------------Tabl-Сейчас 2 версии табл новая и старая, струю не убирать иначе все ломается-----------*/

/* Анимация градиента для JobHeader */
@keyframes gradient-animation {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}

/* Стиль заголовка профессии */
.job_header {
font-family: Arial, sans-serif;
border: 3px solid var(--border-color, #465298);
border-radius: 0.5em;
background-color: #27272e;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
overflow: hidden;
margin: 0 0 10px 5px;
}

.job_header .header-title {
text-align: center;
padding: 5px 10px;
margin: 0;
background: linear-gradient(135deg, var(--header-color-start, #465298), var(--header-color-end, #27272e));
background-size: 300% 300%;
color: #fff;
font-weight: bold;
font-size: 1.1em;
letter-spacing: 0.5px;
text-transform: uppercase;
animation: gradient-animation 6s ease infinite;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Контейнер для изображения профессии */
.job_header .sprite-container {
text-align: center;
padding: 3px 0;
margin: 0;
background: linear-gradient(135deg, var(--sprite-color-start, #465298), var(--sprite-color-end, #27272e));
background-size: 300% 300%;
animation: gradient-animation 6s ease infinite;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.4);
}

.job_header .sprite-container img {
/* width: 128px; */
/* height: auto; */
border-radius: 0.2em;
}

/* Элементы внутри JobHeader */
.job_header div {
padding: 3px 10px;
margin: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
color: #ddd;
transition: background-color 0.3s ease;
}

.job_header div:last-child {
border-bottom: none;
}

.job_header .label {
font-weight: bold;
color: #ddd;
}

.job_header .value {
color: #bbb;
font-size: 0.95em;
}

/* Скрываемые элементы для JobHeader */
.job_collapsible {
cursor: pointer;
color: lightblue;
text-decoration: underline;
margin-top: 10px;
}

.job_collapsible_content {
display: none;
padding: 10px;
color: #bbb;
transition: transform 0.3s ease, background-color 0.3s ease;
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для pre (цитатки)
Shegare */

pre {
display: inline-block;
white-space: pre-wrap;
}

/* End стиль для pre (цитатки)
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin ClearUnset
Shegare */

span.ClearUnset > figure.mw-halign-right {
clear: unset;
}

/* End ClearUnset
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для collapsible button
Shegare */

.collapsible_align > tbody > tr > th > span {
padding: 7px 5px;
}
.mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #dbdbdb;
box-shadow: 0 0 5px 0px;
border: 2px solid;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible.mw-made-collapsible .mw-collapsible-text {
color: #ffffff;
border: 2px dotted;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible-toggle-default:before {
content: unset;
}
.mw-collapsible-toggle-default:after {
content: unset;
}

/* End стиль для collapsible button
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/* ===============================
Begin стиль для Grid — Shegare
=============================== */

@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

.citizen-body {
margin-left: 10px;
}

/* ===============================
End стиль для Grid — Shegare
=============================== */

/* ==================================================
Begin стиль для JobsTable — Shegare
================================================== */
/* === Общие стили === */
.citizen-body {
margin-left: 10px;
}

#IdJobsTableContainer2 {
flex-basis: 280px;
padding: 0 15px;
position: sticky;
top: 20px;
align-self: flex-start;
max-height: calc(100vh - 40px);
overflow-y: auto;
z-index: 100;
box-sizing: border-box;
transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out; /* Плавное изменение свойств */
}

.JobsTable {
border: 2px solid black;
border-radius: 10px;
margin-bottom: 2px;
width: auto;
height: fit-content;
background: #28303e;
transition: background 0.3s ease; /* Плавная смена фона */
}

.JobsTableList li a {
color: white;
font-size: 16px;
background: #232323;
display: block;
border: 2px solid black;
margin-bottom: 5px;
padding: 3px 5px;
text-decoration: none;
transition: background 0.3s ease, transform 0.3s ease; /* Плавная смена фона и эффект нажатия */
}

.JobsTableList li a:hover {
background: #3b3b3b;
transform: scale(1.05); /* Эффект увеличения при наведении */
}

.JobsTableHeadImg {
margin: 0 5px 0 15px;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

.JobsTableHeadLink {
margin-right: auto;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

#IdJobsTableContainer1 {
display: none;
}

.JobsTable .mw-collapsible-toggle {
margin-top: -35px;
}

.JobsTable .mw-collapsible-toggle-default:before,
.JobsTable .mw-collapsible-toggle-default:after {
content: none;
}

.JobsTable .mw-collapsible-text {
background: black;
border: 2px solid;
padding: 2px;
margin-right: 5px;
font-weight: 700;
transition: color 0.3s ease, box-shadow 0.3s ease; /* Плавное изменение цвета и тени */
}

.JobsTable .mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #00ffff9e;
box-shadow: 0 0 10px #00b9b978;
}

.JobsTableList.closed {
max-height: 0 !important;
opacity: 0;
overflow: hidden;
transition: opacity 0.5s ease, max-height 0.5s ease; /* Плавное исчезновение */
transition-delay: 1s;
}

/* Скрытие иконок по умолчанию */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 0;
}

/* === Мобильные стили (до 1440px) === */
@media screen and (max-width: 1440px) {
#IdJobsTableContainer2 {
display: none;
}

#IdJobsTableContainer1 {
display: block;
}

.JobsTableHeadImg {
margin-left: 0;
}

.JobsTableHeadLink {
margin-right: 55px;
}

/* Отображение иконок сворачивания */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 1;
}
}

@media screen and (max-width: 1439px) {
.JobsTable div:first-child {
padding-left: 15px;
}
}

/* === ПК стили (от 1120px и выше) === */
@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

@media screen and (min-width: 1440px) {
.JobsTable .mw-collapsible.mw-collapsed {
display: block;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* Задержка при закрытии */
}

.JobsTable div:hover ~ .mw-collapsible.mw-collapsed,
.JobsTable .mw-collapsible.mw-collapsed:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s; /* Мгновенно при открытии */
}

}

.JobsTable div:hover ~ .custom-collapsible.hidden,
.JobsTable .custom-collapsible.hidden:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s;
}
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

#IdJobsTableContainer2 {
z-index: auto;
scrollbar-width: none; /* Для Firefox */
-ms-overflow-style: none; /* Для IE и Edge */
}

.JobsTable .mw-collapsible {
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* задержка закрытия */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

/* ==================================================
End стиль для JobsTable — Shegare
================================================== */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Заголовки стиль
Shegare */

.citizen-sections-enabled .citizen-section-heading .mw-headline {
border-bottom: 2px solid;
border-image: linear-gradient(to right top, #5d5d5d, #272727);
border-image-slice: 1;
}

.citizen-sections-enabled .citizen-section-heading .mw-headline:empty {
border: unset;
}

.citizen-sections-enabled .citizen-section-heading--collapsed .mw-headline {
border: unset;
}

.mw-ui-icon-wikimedia-collapse:before {
opacity: unset;
}

.citizen-sections-enabled .citizen-section-indicator {
width: 25px;
height: 25px;
position: absolute;
padding: 3px;
background: rgb(162 162 162 / 60%);
box-shadow: 0 0 20px 0px rgb(162 162 162 / 20%);
border: 1px solid #000000;
border-radius: 50%;
transition: 0.3s;
margin-left: -30px;
margin-right: 5px;
}

@media screen and (max-width: 1119px) {
.citizen-sections-enabled .citizen-section-indicator {
margin-left: 0px;
}
.citizen-sections-enabled .citizen-section-indicator {
width: 21px;
height: 21px;
}
.citizen-sections-enabled .citizen-section-heading .mw-headline {
padding-left: 25px;
}
}

.citizen-sections-enabled .citizen-section-heading--collapsed .citizen-section-indicator {
background: #000000;
opacity: 50%;
box-shadow: unset;
transition: 0.3s;
}

.citizen-section-collapsible p {
margin-bottom: 1.5em;
margin-top: 0px;
}

/* Begin Заголовки стиль
Shegare */

/* Begin Подзаголовки стиль
Shegare */

/*.citizen-section-collapsible > h2, h3, h4, h5, h6 {
border-bottom: 2px dashed #5d5d5d;
width: fit-content;
}*/

/* Begin Подзаголовки стиль
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin элементы таблицы "|" не подсвечиваются при наведении
Shegare */

:root.skin-citizen-dark {
--background-color-quiet--hover: unset
}

/* End элементы таблицы "|" не подсвечиваются при наведении
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin header не скрывается
Shegare */

@media screen and (max-width: 1119px) {
.citizen-scroll--down .citizen-header {
transform: unset;
}
}

/* End header не скрывается
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin TooltipTable
Shegare */

.citizen-overflow--right {
-webkit-mask-image: unset;
}

@media screen and (min-width: 1421px) {
.citizen-table-wrapper {
overflow: unset;
}
}

@media screen and (max-width:1421px) {
.citizen-table-wrapper,
.citizen-overflow--left.citizen-overflow--right,
.citizen-overflow--left,
.citizen-overflow--right {
-webkit-mask-image: unset;
overflow: auto;
}
}

/* End TooltipTable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Отмена пикселизации
Shegare */

.citizen-header__logo img, .logo img {
image-rendering: unset;
}
.nopixelated img {
image-rendering: unset;
}

/* End оформление заголовков
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin mobile_bigtable
Shegare */

@media screen and (max-width: 1025px) {
mobile_bigtable {
font-size: 16px;
}
}
@media screen and (max-width: 1024px) {
mobile_bigtable {
font-size: 10px;
}
}

/* Begin mobile_bigtable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin главное меню
Данте ( и немного Shegare >w< )
*/

/* Общее форматирование ячеек таблицы */
.standard-link th,
.standard-link td {
vertical-align: middle;
border: 2px solid black;
background-color: #212126;
}

/* Скругление углов только у первой и последней ячеек в строке заголовка */
.standard-link th {
border-radius: 15px 0 0 15px;
}

/* Форматирование ссылок в заголовках таблицы */
.standard-link th a {
margin: 7px;
}

/* Форматирование ссылок в ячейках таблицы */
.standard-link td a {
margin: 5px 10px;
padding: 17px;
}

/* Общие стили для всех ссылок */
.standard-link a {
text-decoration: none;
font: small-caps bold 25px sans-serif;
color: #ffffff;
border: 2px solid black;
display: flex;
align-items: center;
background-color: #141417;
transition: background-color 1.0s ease, border-color 1.0s ease, color 1.0s ease;
}

/* Стили для мобильных устройств */
@media screen and (max-width:850px) {
.standard-link a {
transition: none;
}
.standard-link td {
border-radius: 0px 15px 15px 0px;
}
}

/* Стили при наведении курсора на строку таблицы */
.standard-link tr:hover a {
background-color: black;
color: #fff;
border-color: #e23229;
}

/* End главное меню
Данте ( и немного Shegare >w< )
*/
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Данте Морпехи */
/* Основные стили для контейнера меню */
.main-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

/* Общие стили для секций меню */
.menu-section {
flex-basis: 23%;
margin-bottom: 15px;
padding: 10px;
border-radius: 8px;
background-color: #14171f; /* Фон не покрашенных блоков */
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.1); /* Уменьшенная белая обводка для блоков */
}

/* Индивидуальные цвета для секций */
.marines-section {
background-color: #222424;
}

.xenos-section {
background-color: #2b2e44;
}

.other-section {
background-color: #341d1d; /* Цвет для блока "Другие фракции" */
}

/* Стили для заголовков секций */
.menu-section h3 {
padding: 5px;
margin: 0;
font-size: 18px;
text-align: center;
color: #fff;
}

/* Стили для списка */
.menu-section ul {
list-style-type: none;
padding: 0;
margin: 10px 0 0 0;
}

/* Стили для элементов списка */
.menu-section ul li {
margin: 10px 0;
text-align: center;
}

/* Стили для кнопок (ссылок) */
.menu-section ul li a {
display: block;
width: 100%;
padding: 10px;
border-radius: 8px;
text-align: center;
background-color: #1a1e29; /* Цвет фона кнопок */
color: white;
font-weight: bold;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.menu-section ul li a:hover {
background-color: #666;
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Стили для секции с картами */
.maps-section {
color: white; /* Устанавливаем белый цвет текста для всей секции */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для секции с картами */
.maps-section {
color: white !important; /* Добавление !important */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для элементов списка в секции карт */
.maps-section ul li {
flex-basis: 48%; /* Уменьшаем до 48%, чтобы уместить 2 карты в ряд с отступами */
list-style: none; /* Убираем маркеры списка */
}

/* Стили для ссылок в секции карт */
.maps-section ul li a {
display: block;
padding: 10px;
background-color: #1a1e29; /* Цвет фона кнопок в секции карт */
color: white !important; /* Устанавливаем белый цвет текста */
border-radius: 8px;
text-align: center;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.maps-section ul li a:hover {
background-color: #666; /* Цвет фона при наведении на ссылку в секции карт */
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Убираем иконку внешней ссылки в блоке карт */
.maps-section ul li a::after {
content: none !important; /* Убираем псевдоэлемент */
}

/* Стили для контейнера заголовка */
.header-container {
display: flex;
align-items: center;
background-color: #1b1e26;
padding: 20px 30px;
border-radius: 8px;
}

/* Стили для логотипа */
.logo img {
border-radius: 50%;
width: 100px;
height: auto;
}

/* Стили для текста заголовка */
.title-text {
margin-left: 30px;
color: #ffffff;
}

.title-text h1 {
margin: 0;
font-size: 32px;
font-weight: bold;
}

.title-text p {
margin: 5px 0 0;
font-size: 18px;
}

/* Стили для разделителя */
.separator {
border-bottom: 2px solid #A9A9A9;
margin: 10px 0 20px;
}

/* Адаптивные стили для мобильных устройств */
@media (max-width: 599px) {
.main-container {
flex-direction: column;
align-items: stretch;
}

.menu-section {
flex-basis: 100%;
margin-bottom: 15px;
display: flex;
flex-direction: column;
align-items: stretch;
}

.menu-section ul {
flex-grow: 1;
justify-content: space-between;
padding: 0;
}

.menu-section ul li {
flex-grow: 1;
width: 100%;
text-align: center;
margin-bottom: 10px; /* Отступы между элементами */
}

.menu-section ul li a {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
padding: 10px 0;
}

.maps-section ul {
flex-wrap: wrap;
gap: 10px;
}

.maps-section ul li {
flex-basis: 48%; /* Карты будут располагаться по 2 на ряд */
margin-bottom: 10px; /* Отступы между картами */
}

.header-container {
flex-direction: column;
text-align: center;
padding: 10px;
}

.logo img {
width: 80px;
}

.title-text {
margin-left: 0;
margin-top: 10px;
}

.title-text h1 {
font-size: 24px;
}

.title-text p {
font-size: 16px;
}
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* код оформление для Командование и тд Данте! */
/* Контейнер для карточек */
.command-wrapper {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
padding: 20px;
}

/* Основные стили карточек */
.card {
background-color: #2b2b2b; /* Темный фон карточки */
border-radius: 10px;
width: 220px;
height: auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
display: flex;
flex-direction: column;
justify-content: flex-start; /* Элементы начинают сверху */
align-items: center;
padding: 8px; /* Уменьшаем padding */
text-align: center;
position: relative;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 4px solid transparent;
color: #ffffff; /* Белый текст */
overflow: hidden; /* Скрываем все, что выходит за пределы карточки */
}

/* Цветные обводки для разных ролей */
.card.Captain {
border-color: #B0B7C3; /* Серебристый для Капитана */
}
.card.HeadOfSecurity {
border-color: #FF0000; /* Красный для Главы Безопасности */
}
.card.HeadOfPersonnel {
border-color: #00FF00; /* Зеленый для Главы Персонала */
}
.card.Engineer {
border-color: #FFA500; /* Оранжевый для Старшего Инженера */
}
.card.Scientist {
border-color: #800080; /* Фиолетовый для Научного Руководителя */
}
.card.Doctor {
border-color: #127BB7; /* Синий для Главного Врача */
}
.card.Quartermaster {
border-color: #FFD700; /* Золотой для Квартирмейстера */
}

/* Стили для текста и заголовков */
.card .role-name {
font-weight: bold;
font-size: 1.4em;
color: #ffffff; /* Белый текст */
margin-bottom: 3px;
white-space: normal; /* Разрешить перенос слов */
overflow: hidden;
text-overflow: ellipsis;
text-align: center; /* Центрирование текста */
word-wrap: break-word; /* Перенос слов при необходимости */
display: grid;
grid-template-columns: 212px;
grid-template-rows: 75px;
}
.role-name a {
color: #ccc;
}

/* Стили для изображения */
.card img {
max-width: 160px;
max-height: 160px;
margin-bottom: 3px; /* Уменьшаем отступ снизу */
}

/* Стили для описания роли */
.card .role-description {
font-size: 0.9em;
flex-grow: 1;
margin: 3px 0; /* Минимальные отступы сверху и снизу */
color: #dcdcdc; /* Более светлый текст */
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal; /* Текст переносится */
}

/* Ссылка на СРП */
.card .role-guide {
font-size: 0.85em;
margin-top: 3px; /* Минимальный отступ сверху */
text-align: center; /* Центрируем текст */
}

.card .role-guide a {
color: #00bfff; /* Цвет ссылки */
text-decoration: none;
}

.card .role-guide a:hover {
text-decoration: underline;
}

/* Hover эффект для карточек */
.card:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

* { font-family: Arial }

body {
color: #FAFAFA;
}

img {
image-rendering: pixelated;
}

.flex-container {
display: flex;
align-items: flex-start;
}

.flex-image {
flex-shrink: 0;
margin-right: 20px;
}

.flex-image-description {
flex-grow: 1;
}

.uplinkbuybutton {
background: #464966;
width: 62px;
height: 27px;
color: white;
text-align: center;
font-weight: bolder;
float: right;
padding-top: 4px;
clip-path: polygon(0px 0px, 0px 18px, 9px 27px, 62px 27px, 62px 10px, 53px 0px);
}

.tooltip {
position: relative;
display: inline;
}

.tooltiptext {
position: absolute;
display: initial;
z-index: 99999;
width: 295px;
left: -120px;
top: 42px;
padding: 5px;
pointer-events: none;
visibility: hidden;
opacity: 0;
white-space: normal;
text-align: left;
transition: transform 0.2s, background-color 0.2s;
border: 1px solid #b80000;
border-radius: 10px;
background-color: #24242a;
box-shadow: 0 0 5px #b80000;
}

.tooltip:hover > .tooltiptext {
visibility: visible;
opacity: 0.98;
}

.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
text-align: left;
}

.wikitable > tr > th,
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
border: 1px solid black;
}

.wikitable > * > tr > th {
background: #27272e;
color: white;
}

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

.job_header {
float: right;
width: 25%;
}
}

@media screen and (max-width: 1420px) {
.tooltiptext {
box-shadow: 0px 0px 100vw 100vh rgb(0 0 0 / 60%);
position: fixed;
width: 80vw;
top: 40vh;
left: 0;
margin: 0 auto;
right: 0;
}
}

@media screen and (max-width: 850px) {
.nomobile {
display: none;
}
.mobilefont {
font-size: 80%;
}
.mobile_sprite,
.mobile_text {
transform: scale(0.75);
}
}

.hover_img_special {
top: 0;
left: 0;
display: none;
}

.img_special:hover .hover_img_special {
display: inline;
}

.img_special:hover .img_spec {
display: none;
}

.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt {
border-color: #fc3;
background-color: #fef6e7;
}

html body.mediawiki .mbox-small {
clear: right;
float: right;
margin: 4px 0 4px 1em;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}

.messagebox.small {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
}

.messagebox.small-talk {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
background-color: #f8eaba;
}

.infobox {
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
color: black;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
float: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
.infobox th,
.infobox td {
vertical-align: top;
}

.infobox-label,
.infobox-data,
.infobox th,
.infobox td {
text-align: left;
}

.infobox .infobox-above,
.infobox .infobox-title,
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}

.infobox-title,
.infobox caption {
padding: 0.2em;
}

.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}

.infobox .infobox-navbar {
text-align: right;
}

.mw-default-size {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-default-size img {
border-color: black !important;
}

.mw-default-size figcaption {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-halign-right {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-right img {
border-color: black !important;
}

.mw-halign-right figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left img {
border-color: black !important;
}

.mw-halign-left figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center img {
border-color: black !important;
}

.mw-halign-center figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

th.navbox-group {
white-space: nowrap;
text-align: right;
}

.mw-parser-output .mw-collapsible-toggle {
font-weight: normal;
text-align: right;
}

td.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}

td.mbox-imageright {
border: none;
padding: 2px 0.9em 2px 0;
text-align: center;
}

#p-namespaces {
float: left;
width: 100%;
}

p {
margin-bottom: 1.5em;
}

.infobox-table {
z-index: 3 !important;
width: 400px;
max-width: 100%;
margin-bottom: 1rem;
padding-bottom: 20px !important;
background: hsl(205, 25%, 15%);
border-radius: 8px;
border-spacing: 0;
font-size: 0.875rem;
text-align: left;
}

.infobox-table tr:not(#infobox-table-img-bg) {
display: flex;
margin-top: 10px;
}

.infobox-table th,
.infobox-table td {
padding: 0 15px !important;
}

.infobox-table th,
th.infobox-table-name {
color: hsl(205, 80%, 95%);
}

.infobox-table th {
padding-top: 15px !important;
border-top: 1px solid rgba(255, 255, 255, 0.05);
font-size: 1rem;
text-align: left !important;
}

th.infobox-table-name {
padding-top: 0 !important;
border: 0 !important;
margin-top: 10px;
margin-bottom: 5px;
font-size: 1.4rem !important;
line-height: 1.4;
}

.infobox-table-img img {
max-width: 100%;
height: auto !important;
}

.infobox-table-img img[src$='.svg'] {
background: #eaecf0;
}

.infobox-table .image:hover img {
transform: scale(1.1);
}

.infobox-button {
display: block;
width: 100%;
}

.infobox-button > div {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

@media only screen and (max-width: 720px) {
.infobox-table {
margin-right: auto;
margin-left: auto;
}
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Данте страница*/
body.page-Участник_Дantes {
font-family: 'Consolas', 'Courier New', monospace;
background-color: #0f0f0f;
color: #e0e0e0;
overflow-x: hidden;
}

.glitch-text {
position: relative;
color: #ffcc00;
text-align: center;
animation: glitch 1.5s infinite;
font-size: 1.8em;
letter-spacing: 1px;
margin-bottom: 12px;
}

@keyframes glitch {
0% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
25% { text-shadow: -2px 2px #00ff00, 2px -2px #ff00ff; }
50% { text-shadow: 2px -2px #ff0000, -2px 2px #00ffff; }
75% { text-shadow: -2px -2px #ff00ff, 2px 2px #00ff00; }
100% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
}

.nt-dossier {
margin: 20px auto;
max-width: 600px;
background: linear-gradient(145deg, #1a1a1a, #111111);
border: 1px solid #ffcc00;
border-radius: 12px;
box-shadow: 0 0 20px rgba(255,204,0,0.4);
position: relative;
padding-bottom: 20px;
animation: fadeIn 1s ease-out forwards;
opacity: 0;
}

.nt-dossier-table {
width: 100%;
border-collapse: collapse;
}

.nt-dossier-table th, .nt-dossier-table td {
padding: 12px;
border-bottom: 1px solid #444;
}

.nt-dossier-table th {
background: #2c2c2c;
color: #ffcc00;
width: 40%;
text-align: left;
transition: background 0.3s;
}

.nt-dossier-table th:hover {
background: #333;
}

.scan-row {
opacity: 0;
transform: translateX(-20px);
transition: transform 0.6s ease-out, background-color 0.6s ease-out;
}

.scan-row.visible {
opacity: 1;
transform: translateX(0);
}

.threat {
color: #ff4444;
font-weight: bold;
animation: blink 1s infinite alternate;
text-transform: uppercase;
}

@keyframes blink {
0% { opacity: 1; }
50% { opacity: 0.3; }
100% { opacity: 1; }
}

.status-indicator {
width: 16px;
height: 16px;
background: #ff4444;
border-radius: 50%;
position: absolute;
bottom: 12px;
right: 12px;
animation: pulse 1.5s infinite;
}

@keyframes pulse {
0% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
50% { box-shadow: 0 0 15px #ff0000; transform: scale(1.3); }
100% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
}

.nt-tabs {
margin: 20px auto;
max-width: 600px;
text-align: center;
animation: fadeIn 1.2s forwards;
opacity: 0;
}

.nt-tab {
display: inline-block;
background: #2c2c2c;
border: 1px solid #444;
color: #ffcc00;
padding: 10px 16px;
cursor: pointer;
margin: 0 6px;
border-radius: 6px;
user-select: none;
transition: transform 0.3s ease, background-color 0.3s ease;
}

.nt-tab.active {
background: #444;
border-color: #ffcc00;
box-shadow: 0 0 10px #ffcc00 inset;
}

.nt-tab:hover {
background: #555;
transform: scale(1.05);
}

.nt-tab-content {
display: none;
max-width: 600px;
margin: 15px auto;
padding: 15px;
background: #1a1a1a;
border: 1px solid #444;
border-radius: 10px;
animation: fadeIn 0.5s forwards;
opacity: 0;
}

.nt-tab-content.active {
display: block;
opacity: 1;
}

@keyframes fadeIn {
to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
* { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.job_header .header-title,
.job_header .sprite-container {
animation: none !important;
}
}

/*МИНИ часть блока лора что бы не ломать вики государств*/
:root{
--cf-federation-color:#6e0e0e;
--cf-confederation-color:#0c0361;
--cf-sssp-color:#801828;
--cf-minor-color:#07520b;
--cf-corp-color:#0e2847;
--cf-bg-card:#1e1e1e;
--cf-text-light:#f0f0f0;
--cf-text-muted:#a0a0a0;
}

/* Структура карточек фракций (префикс cf- чтобы не ломать сайт) */
.cf-page-header{ text-align:center; margin-bottom:20px; padding:6px 10px; }
.cf-factions-wrapper{ display:flex; flex-direction:column; gap:18px; max-width:1400px; margin:0 auto; padding:6px; box-sizing:border-box; }

.cf-faction-category{ width:100%; }
.cf-category-title{ font-size:1.6rem; margin:6px 0 12px; padding-bottom:6px; border-bottom:2px solid; text-align:center; }

.cf-cards-row{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

.cf-faction-card{ background-color:var(--cf-bg-card); border-radius:10px; overflow:hidden; width:100%; max-width:520px; box-shadow:0 6px 14px rgba(0,0,0,0.45); transition:transform .22s ease, box-shadow .22s ease; }
.cf-faction-card:hover{ transform:translateY(-6px); box-shadow:0 14px 26px rgba(0,0,0,0.6); }

.cf-card-header{ padding:14px 16px; text-align:center; position:relative; }
.cf-card-header::after{ content:''; position:absolute; bottom:6px; left:8%; width:84%; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent); }

.cf-card-logo{ display:block; margin:0 auto 10px; max-width:240px; max-height:120px; }
.cf-card-title{ font-size:1.25rem; margin:0; font-weight:700; color:var(--cf-text-light); }

.cf-card-content{ padding:14px 16px; color:var(--cf-text-light); }
.cf-faction-desc{ font-size:0.95rem; color:var(--cf-text-muted); line-height:1.45; }

/* Цвета для типов */
.cf-federation{ border-top:5px solid var(--cf-federation-color); }
.cf-federation .cf-card-header{ background:linear-gradient(90deg,#6e0e0e 0%, #470303 100%); }

.cf-confederation{ border-top:5px solid var(--cf-confederation-color); }
.cf-confederation .cf-card-header{ background:linear-gradient(90deg,#0c0361 0%, #0a034a 100%); }

.cf-sssp{ border-top:5px solid var(--cf-sssp-color); }
.cf-sssp .cf-card-header{ background:linear-gradient(90deg,#801828 0%, #4f121b 100%); }

.cf-minor-states{ border-top:5px solid var(--cf-minor-color); }
.cf-minor-states .cf-card-header{ background:linear-gradient(90deg,#07520b 0%, #032b05 100%); }

.cf-corporations{ border-top:5px solid var(--cf-corp-color); }
.cf-corporations .cf-card-header{ background:linear-gradient(90deg,#0e2847 0%, #081524 100%); }

/* Адаптивность */
@media (max-width:900px){
.cf-card-logo{ max-width:180px; max-height:100px; }
.cf-faction-card{ max-width:100%; }
.cf-cards-row{ gap:10px; }
}

MediaWiki:Common.css

2026-04-06T20:01:56Z

MetalSage:

/*Химия*/
@media (max-width: 1280px) {
.chem-heading {
display: none;
}
}
@media screen and (min-width: 1120px) {
body.page-Тест .citizen-body-container {
grid-template-areas: 'void header header' 'sidebar content toc' 'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
max-width: none;
}
}
.chem-cards-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin: 20px 0;
width: 100%;
box-sizing: border-box;
}
.chem-card {
background-color: #121212;
border: 3px solid var(--card-border, #444);
border-radius: 12px;
padding: 0;
color: #e0e0e0;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
overflow: hidden;
}
.chem-name-header {
background-color: var(--card-accent);
color: #ffffff;
font-size: 22px;
font-weight: 700;
padding: 14px 20px;
text-align: center;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
margin: 0;
}
.chem-heading {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 16px;
background: rgba(255,255,255,0.06);
border-top: 1px solid rgba(255,255,255,0.1);
cursor: pointer;
}
.chem-heading-content {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}
.heading-text {
font-size: 15px;
font-weight: 600;
color: var(--card-accent, #8cf);
}
.collapse-btn {
border: 2px dotted #ffd700;
padding: 2px 12px;
border-radius: 9999px;
font-size: 13px;
color: #ffd700;
background: rgba(0,0,0,0.3);
}
.collapsible {
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
max-height: 0;
}
.collapsible.expanded {
max-height: 3000px;
}
.chem-recipe-block,
.chem-effects-block {
text-align: center;
}
.chem-recipe-steps,
.chem-effects {
padding: 12px 16px 24px;
}
.recipe-variant-header {
font-size: 15px;
font-weight: 700;
color: #ffd700;
text-align: center;
padding: 8px 0;
border-bottom: 1px dashed rgba(255,215,0,0.3);
margin-bottom: 12px;
}
.chem-recipe {
width: 100%;
max-width: 780px;
margin: 20px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 24px;
box-sizing: border-box;
}
.recipe-inputs,
.recipe-outputs {
flex: 1 1 280px;
min-width: 240px;
display: flex;
flex-direction: column;
gap: 10px;
}
.recipe-action {
flex: 0 0 160px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 0;
}
.recipe-action-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
}
.recipe-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255,255,255,0.08);
border-radius: 6px;
padding: 8px 12px;
border-left: 4px solid var(--card-accent, #8cf);
white-space: normal;
word-break: break-word;
}
.chem-reagent-icon,
.chem-beaker {
width: 36px;
height: 36px;
flex-shrink: 0;
object-fit: contain;
}
.action-sprite .chem-reagent-icon,
.action-sprite .chem-beaker {
width: 46px;
height: 46px;
}
.action-text {
font-weight: 700;
color: #ffd700;
font-style: italic;
font-size: 15px;
line-height: 1.3;
}
.chem-effects .chem-effect-line {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.45;
padding-left: 4px;
}
.chem-desc {
margin: 12px 16px;
padding: 12px;
background: rgba(255,255,255,0.03);
border-radius: 6px;
border-left: 4px solid var(--card-accent, #8cf);
font-size: 14px;
color: #aaa;
}
@media (max-width: 1024px) {
.chem-cards-container {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.chem-cards-container {
grid-template-columns: 1fr;
}
.chem-recipe {
flex-direction: column;
align-items: center;
gap: 16px;
max-width: 100%;
padding: 0 12px;
}
.recipe-action {
flex: 0 0 auto;
min-width: auto;
}
}
/*Химия*/

/*=Блок лора=*/
/*Хронолония */
.timeline {
width: 100%;
margin: 20px 0;
background-color: transparent;
}

.timeline-entry {
padding: 10px;
border-bottom: 1px solid #555;
background-color: var(--timeline-entry-bg, #333);
}

.timeline-header {
font-size: 18px;
font-weight: bold;
color: var(--timeline-header-color, #fff);
cursor: pointer;
}

.timeline-content {
padding: 10px;
font-size: 16px;
color: var(--timeline-content-color, #ddd);
background-color: var(--timeline-content-bg, #444);
display: none;
}

.timeline-entry:nth-child(even) {
background-color: var(--timeline-entry-bg-even, #222);
}

.timeline-entry:hover {
background-color: var(--timeline-entry-bg-hover, #555);
}

.timeline-entry a {
color: var(--timeline-link-color, #ff9800);
text-decoration: none;
}

.timeline-entry a:hover {
text-decoration: underline;
}

/*=Таблица планет=*/
.planets-table-wrapper {
width: 100%;
overflow-x: auto;
margin: 0 auto;
}

.planets-table {
width: 100%;
max-width: 150%;
border-collapse: separate;
border-spacing: 0;
font-family: "Segoe UI", Arial, sans-serif;
background: linear-gradient(to bottom, #0d1117, #161b22);
border: 1px solid #5a5a5a;
border-radius: 12px;
color: #b0b0b0;
overflow: hidden;
}

.planets-table th {
background-color: #3a3a3a;
color: #dcdcdc;
text-align: center;
padding: 12px;
font-size: 18px;
font-weight: bold;
border-bottom: 1px solid #5a5a5a;
}

.planets-table td {
text-align: center;
padding: 12px;
font-size: 16px;
border-top: 1px solid #5a5a5a;
}

.planets-table td img {
border-radius: 50%;
margin: 10px 0;
width: 80px;
height: 80px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6);
}

.planets-table tr:first-child th:first-child {
border-top-left-radius: 12px;
}

.planets-table tr:first-child th:last-child {
border-top-right-radius: 12px;
}

.planets-table tr:last-child td:first-child {
border-bottom-left-radius: 12px;
}

.planets-table tr:last-child td:last-child {
border-bottom-right-radius: 12px;
}

.planets-table tr:nth-child(even) {
background-color: rgba(255, 255, 255, 0.03);
}

.planets-table tr:nth-child(odd) {
background-color: rgba(255, 255, 255, 0.06);
}

.planets-table th:nth-child(2),
.planets-table td:nth-child(2) {
text-align: center;
}

.planets-table caption {
margin: 10px 0;
font-size: 20px;
font-weight: bold;
color: #a0a0a0;
text-align: left;
}

/*=Карточки планет=*/

.planets-row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
margin: 20px 0;
}

.planet-card {
width: 220px;
border: 2px solid #555;
border-radius: 15px;
overflow: hidden;
background-color: #333;
color: #fff;
text-align: center;
padding: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.7);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.planet-card img {
width: 100%;
height: 180px;
object-fit: cover;
border-bottom: 2px solid #555;
border-radius: 8px;
}

.planet-card h3 {
font-size: 1.3em;
margin: 15px 0 10px;
color: #ffcc00;
text-transform: uppercase;
letter-spacing: 1px;
}

.planet-card p {
font-size: 1em;
color: #ddd;
margin: 0;
line-height: 1.5;
max-height: 100px;
overflow: hidden;
text-overflow: ellipsis;
}

.planet-card:hover {
transform: scale(1.05);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.8);
}

.planet-card .more-info {
margin-top: 10px;
padding: 5px;
background-color: #ffcc00;
color: #222;
border-radius: 5px;
font-weight: bold;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.3s ease;
}

.planet-card .more-info:hover {
background-color: #ffaa00;
}

@media (max-width: 768px) {
.planets-row {
justify-content: center;
}

.planet-card {
width: 90%;
max-width: 280px;
}
}

@media (max-width: 480px) {
.planet-card {
width: 100%;
}
}

/*=Меню лора=*/
:root { --transition-duration: 0.4s; --primary-bg-color: #1c1c1c; --secondary-bg-color: #2c2c2c; --item-bg-color: #2e2e2e; --item-hover-bg-color: #444444; --border-color: #666; --text-color: #dcdcdc; --hover-text-color: #ffffff; --font-family: 'Arial', sans-serif; --menu-border-radius: 25px; --header-padding: 30px; --item-height: 180px; --icon-size: 72px; --text-font-size: 18px; } .custom-lore-menu { max-width: 1200px; margin: 30px auto; padding: 40px; border-radius: var(--menu-border-radius); background: linear-gradient(145deg, #1b1b1b, #252525); display: grid; grid-template-columns: 1fr; gap: 30px; font-family: var(--font-family); box-shadow: 0 10px 30px rgba(0,0,0,0.6); } .custom-header { text-align: center; background-color: var(--secondary-bg-color); padding: var(--header-padding); border-bottom: 2px solid var(--border-color); color: var(--text-color); font-size: 26px; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); } .custom-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 25px; padding: 25px; justify-items: center; align-items: stretch; } .custom-item { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: var(--item-height); text-align: center; border: 1px solid var(--border-color); border-radius: 20px; background: linear-gradient(145deg, #2a2a2a, #333333); transition: transform var(--transition-duration), background var(--transition-duration), box-shadow var(--transition-duration); cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); } .custom-item:hover { background: linear-gradient(145deg, #3a3a3a, #555555); transform: scale(1.08); box-shadow: 0 10px 20px rgba(0,0,0,0.5); } .custom-item a { text-decoration: none; color: var(--text-color); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; transition: color var(--transition-duration), text-shadow var(--transition-duration); font-size: var(--text-font-size); font-weight: bold; } .custom-item a:hover { color: var(--hover-text-color); text-shadow: 0 0 8px #fff; } .custom-icon { width: var(--icon-size); height: var(--icon-size); margin-bottom: 12px; flex-shrink: 0; filter: drop-shadow(1px 1px 3px rgba(0,0,0,0.7)); } @media (max-width: 768px) { .custom-lore-menu { padding: 20px; } .custom-links { grid-template-columns: 1fr; } .custom-item { height: auto; padding: 20px 10px; } .custom-item a { font-size: 16px; } }

/*=Блок лора=*/

/*=Блок лор Colonial marines=*/

body.page-Лор_СМ #siteSub,
body.page-Лор_СМ #contentSub,
body.page-Лор_СМ h1.firstHeading
{display:none !important}

.CMMainFigure {
height: 130px;
width: 575px;
background: #292f2d;
border-radius: 6px;
}

.CMMainText {
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: #a1a2a5;
padding-top: 6px;
padding-left: 9px;
}

.CMMainButton {
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton2 {
transform: translate(190px,-94px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButton3 {
transform: translate(380px,-188px);
height: 40px;
width: 180px;
background: #151a22;
border-radius: 6px;
margin-top: 7px;
margin-left: 7px;
}

.CMMainButtonText {
display: inline-block;
width: 100%;
height: 100%;
text-align: center;
padding-top: 7px;
font-family: "Trebuchet MS", Tahoma, sans-serif;
color: white;
text-decoration: none;
}

/*=Блок лора Маршалов CM=*/

body.page-Провост_Маршал .mw-page-title-main,
body.page-Провост_Маршал #siteSub,
body.page-Провост_Маршал .mw-body-header,
body.page-Провост_Маршал .citizen-header
{display:none !important}

body.page-Провост_Маршал .citizen-page-container
{background: rgb(20,24,31);
background: linear-gradient(90deg, rgba(20,24,31,1) 0%, rgba(40,11,15,1) 75%, rgba(82,0,0,1) 100%);}

.rectangleCM {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 20px);
}

.rectangleCM2 {
width: 250px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(835px, 30px);
}

.rectangleCM3 {
width: 800px;
height: 130px;
background: #590000;
position: relative;
transform: translate(0px, -100px);
}

.rectangleCM4 {
width: 1085px;
height: 60px;
background: linear-gradient(to right, #05141d 85%, #14181f);
position: relative;
transform: translate(0px, -90px);
}

.rectangleCMTwo {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.rectangleCMTwo2 {
width: 10px;
height: 60px;
background: #0087bd;
position: relative;
transform: translate(0px, -52px);
}

.classifieldCM {
color: #bebebe;
position: relative;
transform: translate(15px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.75em;
font-weight: 500;
}

.classifieldCMRisk {
color: #bebebe;
position: relative;
transform: translate(17.5px, 6px);
font-family: "Gill Sans", sans-serif;
font-size: calc(11px +(12 - 8)*((100vw - 400px) /(800 - 400)));
font-weight: bold;
}

.rectangleCMTwo3 {
width: 10px;
height: 130px;
background: #ce0000;
position: relative;
transform: translate(0px, -79px);
}

.classifieldCM3 {
color: #bebebe;
position: relative;
transform: translate(17.5px, 5px);
font-family: Inter, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-size: 0.9em;
font-weight: 500;
}

.classifieldCMRisk3 {
color: #bebebe;
position: relative;
transform: translate(20px, 21px);
font-family: "Gill Sans", sans-serif;
font-size: 35px;
font-weight: bold;
}

.triangle-bottomrightCM {
width: 450px;
height: 0;
border-bottom: 130px solid #700;
border-left: 100px solid transparent;
position: relative;
transform: translate(350px,-210px);
}

.MarshalsLogoCM {
right: 0;
bottom: 0;
position: absolute;
}

/*=Не лор маршалов=*/
.hrCMLore {
border: none;
border-top: 1.5px solid #C6C3B5; /* Линия теперь будет красного цвета */
}

.second_block {
display: none;
}

.imggg {
float: right ;
}

.home-card:hover .second_block {
display: block;
font-family: "Gill Sans", sans-serif;
}

.divisionis {
color: #C6C3B5;
opacity: 1;
text-align: center;
font-family: system-ui;
font-size: 30px;
}

.loreCMwelcom {
color: #C6C3B5;
opacity: 0.5;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMwelcomWork {
color: #C6C3B5;
opacity: 0.75;
text-align: left;
font-family: "Gill Sans", sans-serif;
font-size: 15px;
font-weight: lighter;
}

.loreCMtext {
color: white;
text-align: left;
font-family: system-ui;
font-size: 30px;
font-weight: bold;
}

.home-grid {
display: grid;
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
grid-auto-rows: minmax( 3rem, auto );
grid-gap: calc(0.5 * 1rem);
font-family: "Gill Sans", sans-serif;
}

.home-grid--col2 {
grid-template-columns: 1fr 1fr;
}

.home-grid a.external {
background-image: none;
}

.home-card {
position: relative;
padding: 1rem;
background: hsl(220,25%,12%);
border: 1px solid rgba(255,255,255,0.05);
border-radius: 8px;
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
font-size: 0.875rem;
}

.home-card table.timeline {
margin-top: 0.2rem;
}

.home-card--col2 {
grid-column: span 2;
}

.home-card--row3 {
grid-row: span 3;
}

.home-card--row4 {
grid-row: span 4;
}

.home-card--row8 {
grid-row: span 8 / auto;
}

.home-card__label {
color: #72777d;
font-size: 0.8125rem;
letter-spacing: 0.75px;
}

.home-card__header {
color: #202122;
font-size: 1rem;
font-weight: 600;
line-height: 1.25;
}

.home-card__header a {
display: flex;
align-items: center;
justify-content: space-between;
}

.home-card__header a:after {
content: '▶';
font-size: 0.8125rem;
}

.home-card__background {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #242a31;
border-radius: 8px;
}

.home-card__background:after {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: block;
background: linear-gradient(to right,#000,transparent);
content: "";
}

.home-card__background picture,
.home-card__background img {
width: 100%;
height: 100%;
}

.home-card__background img {
object-fit: cover;
object-position: center;
}

.home-card__foreground {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: calc(0.25 * 1rem);
color: #fff;
line-height: 1.25;
}

.home-card__foreground .home-card__header {
color: #fff;
}

.home-card__foreground .home-card__label {
color: #bababa;
}

.home-card p {
/* margin-top: calc(0.5 * 1rem); */
margin-top: calc(0 * 1rem);
font-size: 0.875rem;
}

.home-card.home-card--button {
overflow: hidden;
padding: 0;
background: #242a31;
border: 0;
}

.home-card--button a {
display: flex;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button--navigation a {
/* display: flex; */
display: contents;
height: 100%;
justify-content: center;
align-items: center;
padding: 0 1rem;
background: transparent;
color: #fff;
font-weight: 500;
}

.home-card--button .home-card__background a {
padding: 0;
}

.home-card--button img {
transition: transform 0.2s ease;
}

.home-card--button:hover img {
transform: scale(1.1);
}

.home-link {
display: grid;
margin-top: calc(0.5 * 1rem);
font-size: 0.875rem;
font-weight: 500;
grid-gap: calc(0.5 * 1rem);
text-align: center;
}

.home-link__button {
display: flex;
}

.home-link__button a {
flex-grow: 1;
padding: calc(0.5 * 1rem);
border: 1px solid rgba(255,255,255,0.05);
background: hsl(220,25%,15%);
border-radius: 8px;
color: #fff !important;
line-height: 1.25;
text-decoration: none !important;
}

.home-link__button a:hover {
background: hsl(220,30%,19%);
}

.home-link__button a:active {
background: hsl(220,30%,11%);
}

#home-content {
margin-top: calc(1.25 * 1rem);
}

.home-card .template-statsbar {
margin: 0;
}

.home-footer {
font-size: 0.8125rem;
font-family: monospace;
text-align: center;
}

#home-nav {
margin-top: 1rem;
}

#home-nav .home-card__foreground {
font-weight: 500;
}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
#ss-art-gallery.ss-wrap{ --ss-bg:#0e0f14; --ss-fg:#e9e9e9; --ss-muted:#a9b0bd; --ss-accent:#dca01b; --ss-card:#171a21; --ss-ring:#2b3241; --ss-chip:#1e2330; --ss-shadow:0 10px 28px rgba(0,0,0,.4); background:var(--ss-bg); color:var(--ss-fg); padding:20px; border-radius:18px; font-family:"Segoe UI",sans-serif }
#ss-art-gallery .ss-header{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; text-align:center }
#ss-art-gallery .ss-title{ font-size:30px; line-height:1.2; font-weight:700; color:var(--ss-accent) }
#ss-art-gallery .ss-sub{ font-size:15px; color:var(--ss-muted) }
#ss-art-gallery .ss-filters{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:10px }
#ss-art-gallery .ss-chip{ user-select:none; cursor:pointer; background:var(--ss-chip); padding:8px 14px; border-radius:999px; border:1px solid var(--ss-ring); box-shadow:var(--ss-shadow); font-size:13px; transition: transform .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-chip:hover{ background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-chip-active{ border-color:var(--ss-accent); background:var(--ss-accent); color:#000 }
#ss-art-gallery .ss-section{ margin:28px 0 }
#ss-art-gallery .ss-section-title{ font-size:22px; font-weight:700; margin:10px 0 18px; text-align:left; color:var(--ss-accent) }
#ss-art-gallery .ss-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); gap:24px; margin-top:12px }
#ss-art-gallery .ss-card{ background:var(--ss-card); border:1px solid var(--ss-ring); border-radius:16px; box-shadow:var(--ss-shadow); padding:16px; display:flex; flex-direction:column; gap:10px; transform:translateZ(0); transition:transform .2s ease,border-color .2s ease }
#ss-art-gallery .ss-card:hover{ transform:translateY(-4px); border-color:var(--ss-accent) }
#ss-art-gallery .ss-card-title{ font-size:16px; font-weight:600; color:var(--ss-muted); text-align:center }
#ss-art-gallery .ss-card img{
width:auto!important;
height:auto!important;
max-width:100%;
border-radius:12px;
display:block;
margin:0 auto;
image-rendering: auto !important; /* убираем пикселизацию — включаем плавное масштабирование спрайтов */
}
#ss-art-gallery .ss-hidden{ display:none!important }
#ss-art-gallery .ss-modal{ position:fixed; inset:0; background:rgba(0,0,0,.88); display:none; align-items:center; justify-content:center; z-index:9999 }
#ss-art-gallery .ss-modal.open{display:flex}
#ss-art-gallery .ss-modal-inner{ max-width:92vw; max-height:92vh; animation:ss-fade .25s ease }
#ss-art-gallery .ss-modal-img{
max-width:90vw;
max-height:90vh;
border-radius:14px;
box-shadow:0 0 24px rgba(0,0,0,.7);
image-rendering: auto !important; /* убираем пикселизацию в модальном окне */
}
#ss-art-gallery .ss-modal-close{ position:fixed; top:16px; right:18px; background:var(--ss-chip); border:1px solid var(--ss-ring); padding:8px 14px; border-radius:10px; cursor:pointer; transition: transform .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent), background-color .2s ease }
#ss-art-gallery .ss-modal-close:hover{ background:var(--ss-accent); color:#000 }
@keyframes ss-fade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/*------------------------------------------------Галерея-----------------------------------------------------------------------------*/
/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/
.nt-card {
float: right;
margin: 0 0 12px 12px;
display: grid;
gap: 8px;
width: 220px;
padding: 10px;
border: 1px solid rgba(120,120,120,.35);
border-radius: 10px;
background: rgba(20,20,20,.05);
box-shadow: 0 2px 6px rgba(0,0,0,.05);
text-align: center;
}
.nt-card .nt-title {
font-weight: 700;
font-size: 1rem;
}
.nt-card .nt-sprite {
display: grid;
place-items: center;
width: 64px;
height: 64px;
margin: 0 auto;
border-radius: 6px;
background: rgba(0,0,0,.04);
}
.nt-card .nt-sprite img {
image-rendering: pixelated;
width: 56px;
height: 56px;
}
.nt-card .nt-desc {
font-size: .88rem;
line-height: 1.35;
}
.nt-card .nt-stats {
display: grid;
gap: 3px;
font-size: .85rem;
margin-top: 4px;
text-align: left;
}
.nt-card .nt-stat {
padding: 3px 5px;
border-radius: 5px;
background: rgba(0,0,0,.06);
}
.nt-card .nt-src {
margin-top: 2px;
font-size: .8rem;
opacity: .85;
text-align: left;
}

/* адаптация под телефоны */
@media (max-width: 600px) {
.nt-card {
float: none;
margin: 12px 0;
width: auto;
max-width: 100%;
display: block;
text-align: center;
}
.nt-card .nt-stats,
.nt-card .nt-src {
text-align: center;
}
}

/*------------------------------------------------Сноска для предметов-----------------------------------------------------------------------------*/

/*------------------------------------------------Блок вики-----------------------------------------------------------------------------*/

.tabber {
border: 1px solid #20242a !important;
border-radius: 10px !important; /* Закругление углов у всего таба */
overflow: hidden; /* Чтобы закругление работало для содержимого */
}

.tabber__tab {
background: #19191d !important;
padding: 8px 16px;
}

.tabber__panel {
padding: 0 12px;
border-radius: 8px !important; /* Закругление углов для панели */
}

/* Все табсы должны быть заменены на табберы! */
.tabs-tabbox {
background: rgba(255,0,0,0.07) !important;
border-radius: 8px !important; /* Закругление углов */
}

/*------------------------------------------------Tabl-Сейчас 2 версии табл новая и старая, струю не убирать иначе все ломается-----------*/

/* Анимация градиента для JobHeader */
@keyframes gradient-animation {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}

/* Стиль заголовка профессии */
.job_header {
font-family: Arial, sans-serif;
border: 3px solid var(--border-color, #465298);
border-radius: 0.5em;
background-color: #27272e;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
overflow: hidden;
margin: 0 0 10px 5px;
}

.job_header .header-title {
text-align: center;
padding: 5px 10px;
margin: 0;
background: linear-gradient(135deg, var(--header-color-start, #465298), var(--header-color-end, #27272e));
background-size: 300% 300%;
color: #fff;
font-weight: bold;
font-size: 1.1em;
letter-spacing: 0.5px;
text-transform: uppercase;
animation: gradient-animation 6s ease infinite;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Контейнер для изображения профессии */
.job_header .sprite-container {
text-align: center;
padding: 3px 0;
margin: 0;
background: linear-gradient(135deg, var(--sprite-color-start, #465298), var(--sprite-color-end, #27272e));
background-size: 300% 300%;
animation: gradient-animation 6s ease infinite;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.4);
}

.job_header .sprite-container img {
/* width: 128px; */
/* height: auto; */
border-radius: 0.2em;
}

/* Элементы внутри JobHeader */
.job_header div {
padding: 3px 10px;
margin: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
color: #ddd;
transition: background-color 0.3s ease;
}

.job_header div:last-child {
border-bottom: none;
}

.job_header .label {
font-weight: bold;
color: #ddd;
}

.job_header .value {
color: #bbb;
font-size: 0.95em;
}

/* Скрываемые элементы для JobHeader */
.job_collapsible {
cursor: pointer;
color: lightblue;
text-decoration: underline;
margin-top: 10px;
}

.job_collapsible_content {
display: none;
padding: 10px;
color: #bbb;
transition: transform 0.3s ease, background-color 0.3s ease;
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для pre (цитатки)
Shegare */

pre {
display: inline-block;
white-space: pre-wrap;
}

/* End стиль для pre (цитатки)
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin ClearUnset
Shegare */

span.ClearUnset > figure.mw-halign-right {
clear: unset;
}

/* End ClearUnset
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin стиль для collapsible button
Shegare */

.collapsible_align > tbody > tr > th > span {
padding: 7px 5px;
}
.mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #dbdbdb;
box-shadow: 0 0 5px 0px;
border: 2px solid;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible.mw-made-collapsible .mw-collapsible-text {
color: #ffffff;
border: 2px dotted;
padding: 4px;
border-radius: 10px;
transition: 0.5s;
}
.mw-collapsible-toggle-default:before {
content: unset;
}
.mw-collapsible-toggle-default:after {
content: unset;
}

/* End стиль для collapsible button
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/* ===============================
Begin стиль для Grid — Shegare
=============================== */

@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

.citizen-body {
margin-left: 10px;
}

/* ===============================
End стиль для Grid — Shegare
=============================== */

/* ==================================================
Begin стиль для JobsTable — Shegare
================================================== */
/* === Общие стили === */
.citizen-body {
margin-left: 10px;
}

#IdJobsTableContainer2 {
flex-basis: 280px;
padding: 0 15px;
position: sticky;
top: 20px;
align-self: flex-start;
max-height: calc(100vh - 40px);
overflow-y: auto;
z-index: 100;
box-sizing: border-box;
transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out; /* Плавное изменение свойств */
}

.JobsTable {
border: 2px solid black;
border-radius: 10px;
margin-bottom: 2px;
width: auto;
height: fit-content;
background: #28303e;
transition: background 0.3s ease; /* Плавная смена фона */
}

.JobsTableList li a {
color: white;
font-size: 16px;
background: #232323;
display: block;
border: 2px solid black;
margin-bottom: 5px;
padding: 3px 5px;
text-decoration: none;
transition: background 0.3s ease, transform 0.3s ease; /* Плавная смена фона и эффект нажатия */
}

.JobsTableList li a:hover {
background: #3b3b3b;
transform: scale(1.05); /* Эффект увеличения при наведении */
}

.JobsTableHeadImg {
margin: 0 5px 0 15px;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

.JobsTableHeadLink {
margin-right: auto;
transition: transform 0.3s ease; /* Плавное изменение трансформации */
}

#IdJobsTableContainer1 {
display: none;
}

.JobsTable .mw-collapsible-toggle {
margin-top: -35px;
}

.JobsTable .mw-collapsible-toggle-default:before,
.JobsTable .mw-collapsible-toggle-default:after {
content: none;
}

.JobsTable .mw-collapsible-text {
background: black;
border: 2px solid;
padding: 2px;
margin-right: 5px;
font-weight: 700;
transition: color 0.3s ease, box-shadow 0.3s ease; /* Плавное изменение цвета и тени */
}

.JobsTable .mw-collapsible.mw-made-collapsible.mw-collapsed .mw-collapsible-text {
color: #00ffff9e;
box-shadow: 0 0 10px #00b9b978;
}

.JobsTableList.closed {
max-height: 0 !important;
opacity: 0;
overflow: hidden;
transition: opacity 0.5s ease, max-height 0.5s ease; /* Плавное исчезновение */
transition-delay: 1s;
}

/* Скрытие иконок по умолчанию */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 0;
}

/* === Мобильные стили (до 1440px) === */
@media screen and (max-width: 1440px) {
#IdJobsTableContainer2 {
display: none;
}

#IdJobsTableContainer1 {
display: block;
}

.JobsTableHeadImg {
margin-left: 0;
}

.JobsTableHeadLink {
margin-right: 55px;
}

/* Отображение иконок сворачивания */
.client-js td.mw-collapsed:not(.mw-made-collapsible):before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) :first-child tr:first-child th:last-child:before,
.client-js table.mw-collapsed:not(.mw-made-collapsible) > caption:first-child:after,
.client-js div.mw-collapsed:not(.mw-made-collapsible):before,
.client-js ol.mw-collapsible:not(.mw-made-collapsible):before,
.client-js ul.mw-collapsible:not(.mw-made-collapsible):before {
opacity: 1;
}
}

@media screen and (max-width: 1439px) {
.JobsTable div:first-child {
padding-left: 15px;
}
}

/* === ПК стили (от 1120px и выше) === */
@media screen and (min-width: 1120px) {
.citizen-toc-enabled .citizen-body-container {
grid-template-areas:
'void header header'
'sidebar content toc'
'footer footer footer';
grid-template-columns: 10% 70% 20%;
margin-left: 8vw;
}

body {
overflow-x: hidden;
}

#IdJobsTableContainer2 {
grid-area: sidebar;
margin-left: -8vw;
}
}

@media screen and (min-width: 1440px) {
.JobsTable .mw-collapsible.mw-collapsed {
display: block;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* Задержка при закрытии */
}

.JobsTable div:hover ~ .mw-collapsible.mw-collapsed,
.JobsTable .mw-collapsible.mw-collapsed:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s; /* Мгновенно при открытии */
}

}

.JobsTable div:hover ~ .custom-collapsible.hidden,
.JobsTable .custom-collapsible.hidden:hover {
max-height: 1000px;
opacity: 1;
transition-delay: 0s;
}
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

#IdJobsTableContainer2 {
z-index: auto;
scrollbar-width: none; /* Для Firefox */
-ms-overflow-style: none; /* Для IE и Edge */
}

.JobsTable .mw-collapsible {
transition: max-height 2s ease, opacity 2s ease;
transition-delay: 1s; /* задержка закрытия */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

#IdJobsTableContainer2::-webkit-scrollbar {
width: 0; /* скрываем скроллбар, установив нулевую ширину */
background: transparent; /* и фон прозрачным */
}

.JobsTable:hover .mw-collapsible,
.JobsTable .mw-collapsible:hover {
transition: max-height 0s ease, opacity 0s ease;
max-height: 1000px;
opacity: 1;
}

/* ==================================================
End стиль для JobsTable — Shegare
================================================== */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Заголовки стиль
Shegare */

.citizen-sections-enabled .citizen-section-heading .mw-headline {
border-bottom: 2px solid;
border-image: linear-gradient(to right top, #5d5d5d, #272727);
border-image-slice: 1;
}

.citizen-sections-enabled .citizen-section-heading .mw-headline:empty {
border: unset;
}

.citizen-sections-enabled .citizen-section-heading--collapsed .mw-headline {
border: unset;
}

.mw-ui-icon-wikimedia-collapse:before {
opacity: unset;
}

.citizen-sections-enabled .citizen-section-indicator {
width: 25px;
height: 25px;
position: absolute;
padding: 3px;
background: rgb(162 162 162 / 60%);
box-shadow: 0 0 20px 0px rgb(162 162 162 / 20%);
border: 1px solid #000000;
border-radius: 50%;
transition: 0.3s;
margin-left: -30px;
margin-right: 5px;
}

@media screen and (max-width: 1119px) {
.citizen-sections-enabled .citizen-section-indicator {
margin-left: 0px;
}
.citizen-sections-enabled .citizen-section-indicator {
width: 21px;
height: 21px;
}
.citizen-sections-enabled .citizen-section-heading .mw-headline {
padding-left: 25px;
}
}

.citizen-sections-enabled .citizen-section-heading--collapsed .citizen-section-indicator {
background: #000000;
opacity: 50%;
box-shadow: unset;
transition: 0.3s;
}

.citizen-section-collapsible p {
margin-bottom: 1.5em;
margin-top: 0px;
}

/* Begin Заголовки стиль
Shegare */

/* Begin Подзаголовки стиль
Shegare */

/*.citizen-section-collapsible > h2, h3, h4, h5, h6 {
border-bottom: 2px dashed #5d5d5d;
width: fit-content;
}*/

/* Begin Подзаголовки стиль
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin элементы таблицы "|" не подсвечиваются при наведении
Shegare */

:root.skin-citizen-dark {
--background-color-quiet--hover: unset
}

/* End элементы таблицы "|" не подсвечиваются при наведении
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin header не скрывается
Shegare */

@media screen and (max-width: 1119px) {
.citizen-scroll--down .citizen-header {
transform: unset;
}
}

/* End header не скрывается
Shegare */
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin TooltipTable
Shegare */

.citizen-overflow--right {
-webkit-mask-image: unset;
}

@media screen and (min-width: 1421px) {
.citizen-table-wrapper {
overflow: unset;
}
}

@media screen and (max-width:1421px) {
.citizen-table-wrapper,
.citizen-overflow--left.citizen-overflow--right,
.citizen-overflow--left,
.citizen-overflow--right {
-webkit-mask-image: unset;
overflow: auto;
}
}

/* End TooltipTable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin Отмена пикселизации
Shegare */

.citizen-header__logo img, .logo img {
image-rendering: unset;
}
.nopixelated img {
image-rendering: unset;
}

/* End оформление заголовков
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin mobile_bigtable
Shegare */

@media screen and (max-width: 1025px) {
mobile_bigtable {
font-size: 16px;
}
}
@media screen and (max-width: 1024px) {
mobile_bigtable {
font-size: 10px;
}
}

/* Begin mobile_bigtable
Shegare */

/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Begin главное меню
Данте ( и немного Shegare >w< )
*/

/* Общее форматирование ячеек таблицы */
.standard-link th,
.standard-link td {
vertical-align: middle;
border: 2px solid black;
background-color: #212126;
}

/* Скругление углов только у первой и последней ячеек в строке заголовка */
.standard-link th {
border-radius: 15px 0 0 15px;
}

/* Форматирование ссылок в заголовках таблицы */
.standard-link th a {
margin: 7px;
}

/* Форматирование ссылок в ячейках таблицы */
.standard-link td a {
margin: 5px 10px;
padding: 17px;
}

/* Общие стили для всех ссылок */
.standard-link a {
text-decoration: none;
font: small-caps bold 25px sans-serif;
color: #ffffff;
border: 2px solid black;
display: flex;
align-items: center;
background-color: #141417;
transition: background-color 1.0s ease, border-color 1.0s ease, color 1.0s ease;
}

/* Стили для мобильных устройств */
@media screen and (max-width:850px) {
.standard-link a {
transition: none;
}
.standard-link td {
border-radius: 0px 15px 15px 0px;
}
}

/* Стили при наведении курсора на строку таблицы */
.standard-link tr:hover a {
background-color: black;
color: #fff;
border-color: #e23229;
}

/* End главное меню
Данте ( и немного Shegare >w< )
*/
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* Данте Морпехи */
/* Основные стили для контейнера меню */
.main-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

/* Общие стили для секций меню */
.menu-section {
flex-basis: 23%;
margin-bottom: 15px;
padding: 10px;
border-radius: 8px;
background-color: #14171f; /* Фон не покрашенных блоков */
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.1); /* Уменьшенная белая обводка для блоков */
}

/* Индивидуальные цвета для секций */
.marines-section {
background-color: #222424;
}

.xenos-section {
background-color: #2b2e44;
}

.other-section {
background-color: #341d1d; /* Цвет для блока "Другие фракции" */
}

/* Стили для заголовков секций */
.menu-section h3 {
padding: 5px;
margin: 0;
font-size: 18px;
text-align: center;
color: #fff;
}

/* Стили для списка */
.menu-section ul {
list-style-type: none;
padding: 0;
margin: 10px 0 0 0;
}

/* Стили для элементов списка */
.menu-section ul li {
margin: 10px 0;
text-align: center;
}

/* Стили для кнопок (ссылок) */
.menu-section ul li a {
display: block;
width: 100%;
padding: 10px;
border-radius: 8px;
text-align: center;
background-color: #1a1e29; /* Цвет фона кнопок */
color: white;
font-weight: bold;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.menu-section ul li a:hover {
background-color: #666;
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Стили для секции с картами */
.maps-section {
color: white; /* Устанавливаем белый цвет текста для всей секции */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для секции с картами */
.maps-section {
color: white !important; /* Добавление !important */
}

.maps-section ul {
display: flex;
flex-wrap: wrap;
gap: 10px; /* Отступы между картами */
padding: 0;
margin: 0;
}

/* Стили для элементов списка в секции карт */
.maps-section ul li {
flex-basis: 48%; /* Уменьшаем до 48%, чтобы уместить 2 карты в ряд с отступами */
list-style: none; /* Убираем маркеры списка */
}

/* Стили для ссылок в секции карт */
.maps-section ul li a {
display: block;
padding: 10px;
background-color: #1a1e29; /* Цвет фона кнопок в секции карт */
color: white !important; /* Устанавливаем белый цвет текста */
border-radius: 8px;
text-align: center;
text-decoration: none;
border: 1px solid rgba(255, 255, 255, 0.2); /* Обводка для кнопок */
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.maps-section ul li a:hover {
background-color: #666; /* Цвет фона при наведении на ссылку в секции карт */
border-color: rgba(255, 255, 255, 0.5); /* Обводка при наведении */
}

/* Убираем иконку внешней ссылки в блоке карт */
.maps-section ul li a::after {
content: none !important; /* Убираем псевдоэлемент */
}

/* Стили для контейнера заголовка */
.header-container {
display: flex;
align-items: center;
background-color: #1b1e26;
padding: 20px 30px;
border-radius: 8px;
}

/* Стили для логотипа */
.logo img {
border-radius: 50%;
width: 100px;
height: auto;
}

/* Стили для текста заголовка */
.title-text {
margin-left: 30px;
color: #ffffff;
}

.title-text h1 {
margin: 0;
font-size: 32px;
font-weight: bold;
}

.title-text p {
margin: 5px 0 0;
font-size: 18px;
}

/* Стили для разделителя */
.separator {
border-bottom: 2px solid #A9A9A9;
margin: 10px 0 20px;
}

/* Адаптивные стили для мобильных устройств */
@media (max-width: 599px) {
.main-container {
flex-direction: column;
align-items: stretch;
}

.menu-section {
flex-basis: 100%;
margin-bottom: 15px;
display: flex;
flex-direction: column;
align-items: stretch;
}

.menu-section ul {
flex-grow: 1;
justify-content: space-between;
padding: 0;
}

.menu-section ul li {
flex-grow: 1;
width: 100%;
text-align: center;
margin-bottom: 10px; /* Отступы между элементами */
}

.menu-section ul li a {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
padding: 10px 0;
}

.maps-section ul {
flex-wrap: wrap;
gap: 10px;
}

.maps-section ul li {
flex-basis: 48%; /* Карты будут располагаться по 2 на ряд */
margin-bottom: 10px; /* Отступы между картами */
}

.header-container {
flex-direction: column;
text-align: center;
padding: 10px;
}

.logo img {
width: 80px;
}

.title-text {
margin-left: 0;
margin-top: 10px;
}

.title-text h1 {
font-size: 24px;
}

.title-text p {
font-size: 16px;
}
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

/* код оформление для Командование и тд Данте! */
/* Контейнер для карточек */
.command-wrapper {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
padding: 20px;
}

/* Основные стили карточек */
.card {
background-color: #2b2b2b; /* Темный фон карточки */
border-radius: 10px;
width: 220px;
height: auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
display: flex;
flex-direction: column;
justify-content: flex-start; /* Элементы начинают сверху */
align-items: center;
padding: 8px; /* Уменьшаем padding */
text-align: center;
position: relative;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 4px solid transparent;
color: #ffffff; /* Белый текст */
overflow: hidden; /* Скрываем все, что выходит за пределы карточки */
}

/* Цветные обводки для разных ролей */
.card.Captain {
border-color: #B0B7C3; /* Серебристый для Капитана */
}
.card.HeadOfSecurity {
border-color: #FF0000; /* Красный для Главы Безопасности */
}
.card.HeadOfPersonnel {
border-color: #00FF00; /* Зеленый для Главы Персонала */
}
.card.Engineer {
border-color: #FFA500; /* Оранжевый для Старшего Инженера */
}
.card.Scientist {
border-color: #800080; /* Фиолетовый для Научного Руководителя */
}
.card.Doctor {
border-color: #127BB7; /* Синий для Главного Врача */
}
.card.Quartermaster {
border-color: #FFD700; /* Золотой для Квартирмейстера */
}

/* Стили для текста и заголовков */
.card .role-name {
font-weight: bold;
font-size: 1.4em;
color: #ffffff; /* Белый текст */
margin-bottom: 3px;
white-space: normal; /* Разрешить перенос слов */
overflow: hidden;
text-overflow: ellipsis;
text-align: center; /* Центрирование текста */
word-wrap: break-word; /* Перенос слов при необходимости */
display: grid;
grid-template-columns: 212px;
grid-template-rows: 75px;
}
.role-name a {
color: #ccc;
}

/* Стили для изображения */
.card img {
max-width: 160px;
max-height: 160px;
margin-bottom: 3px; /* Уменьшаем отступ снизу */
}

/* Стили для описания роли */
.card .role-description {
font-size: 0.9em;
flex-grow: 1;
margin: 3px 0; /* Минимальные отступы сверху и снизу */
color: #dcdcdc; /* Более светлый текст */
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal; /* Текст переносится */
}

/* Ссылка на СРП */
.card .role-guide {
font-size: 0.85em;
margin-top: 3px; /* Минимальный отступ сверху */
text-align: center; /* Центрируем текст */
}

.card .role-guide a {
color: #00bfff; /* Цвет ссылки */
text-decoration: none;
}

.card .role-guide a:hover {
text-decoration: underline;
}

/* Hover эффект для карточек */
.card:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/

* { font-family: Arial }

body {
color: #FAFAFA;
}

img {
image-rendering: pixelated;
}

.flex-container {
display: flex;
align-items: flex-start;
}

.flex-image {
flex-shrink: 0;
margin-right: 20px;
}

.flex-image-description {
flex-grow: 1;
}

.uplinkbuybutton {
background: #464966;
width: 62px;
height: 27px;
color: white;
text-align: center;
font-weight: bolder;
float: right;
padding-top: 4px;
clip-path: polygon(0px 0px, 0px 18px, 9px 27px, 62px 27px, 62px 10px, 53px 0px);
}

.tooltip {
position: relative;
display: inline;
}

.tooltiptext {
position: absolute;
display: initial;
z-index: 99999;
width: 295px;
left: -120px;
top: 42px;
padding: 5px;
pointer-events: none;
visibility: hidden;
opacity: 0;
white-space: normal;
text-align: left;
transition: transform 0.2s, background-color 0.2s;
border: 1px solid #b80000;
border-radius: 10px;
background-color: #24242a;
box-shadow: 0 0 5px #b80000;
}

.tooltip:hover > .tooltiptext {
visibility: visible;
opacity: 0.98;
}

.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
text-align: left;
}

.wikitable > tr > th,
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
border: 1px solid black;
}

.wikitable > * > tr > th {
background: #27272e;
color: white;
}

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

.job_header {
float: right;
width: 25%;
}
}

@media screen and (max-width: 1420px) {
.tooltiptext {
box-shadow: 0px 0px 100vw 100vh rgb(0 0 0 / 60%);
position: fixed;
width: 80vw;
top: 40vh;
left: 0;
margin: 0 auto;
right: 0;
}
}

@media screen and (max-width: 850px) {
.nomobile {
display: none;
}
.mobilefont {
font-size: 80%;
}
.mobile_sprite,
.mobile_text {
transform: scale(0.75);
}
}

.hover_img_special {
top: 0;
left: 0;
display: none;
}

.img_special:hover .hover_img_special {
display: inline;
}

.img_special:hover .img_spec {
display: none;
}

.mw-contributions-blocked-notice-partial .mw-warning-with-logexcerpt {
border-color: #fc3;
background-color: #fef6e7;
}

html body.mediawiki .mbox-small {
clear: right;
float: right;
margin: 4px 0 4px 1em;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}

.messagebox.small {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
}

.messagebox.small-talk {
width: 238px;
font-size: 85%;
float: right;
margin: 0 0 1em 1em;
line-height: 1.25em;
background-color: #f8eaba;
}

.infobox {
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
color: black;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
float: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
.infobox th,
.infobox td {
vertical-align: top;
}

.infobox-label,
.infobox-data,
.infobox th,
.infobox td {
text-align: left;
}

.infobox .infobox-above,
.infobox .infobox-title,
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}

.infobox-title,
.infobox caption {
padding: 0.2em;
}

.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}

.infobox .infobox-navbar {
text-align: right;
}

.mw-default-size {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-default-size img {
border-color: black !important;
}

.mw-default-size figcaption {
background-color: #21212600 !important;
border-color: black !important;
}

.mw-halign-right {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-right img {
border-color: black !important;
}

.mw-halign-right figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-left img {
border-color: black !important;
}

.mw-halign-left figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center {
background-color: #27272E00 !important;
border-color: black !important;
}

.mw-halign-center img {
border-color: black !important;
}

.mw-halign-center figcaption {
background-color: #27272E00 !important;
border-color: black !important;
}

th.navbox-group {
white-space: nowrap;
text-align: right;
}

.mw-parser-output .mw-collapsible-toggle {
font-weight: normal;
text-align: right;
}

td.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}

td.mbox-imageright {
border: none;
padding: 2px 0.9em 2px 0;
text-align: center;
}

#p-namespaces {
float: left;
width: 100%;
}

p {
margin-bottom: 1.5em;
}

.infobox-table {
z-index: 3 !important;
width: 400px;
max-width: 100%;
margin-bottom: 1rem;
padding-bottom: 20px !important;
background: hsl(205, 25%, 15%);
border-radius: 8px;
border-spacing: 0;
font-size: 0.875rem;
text-align: left;
}

.infobox-table tr:not(#infobox-table-img-bg) {
display: flex;
margin-top: 10px;
}

.infobox-table th,
.infobox-table td {
padding: 0 15px !important;
}

.infobox-table th,
th.infobox-table-name {
color: hsl(205, 80%, 95%);
}

.infobox-table th {
padding-top: 15px !important;
border-top: 1px solid rgba(255, 255, 255, 0.05);
font-size: 1rem;
text-align: left !important;
}

th.infobox-table-name {
padding-top: 0 !important;
border: 0 !important;
margin-top: 10px;
margin-bottom: 5px;
font-size: 1.4rem !important;
line-height: 1.4;
}

.infobox-table-img img {
max-width: 100%;
height: auto !important;
}

.infobox-table-img img[src$='.svg'] {
background: #eaecf0;
}

.infobox-table .image:hover img {
transform: scale(1.1);
}

.infobox-button {
display: block;
width: 100%;
}

.infobox-button > div {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

@media only screen and (max-width: 720px) {
.infobox-table {
margin-right: auto;
margin-left: auto;
}
}

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Данте страница*/
body.page-Участник_Дantes {
font-family: 'Consolas', 'Courier New', monospace;
background-color: #0f0f0f;
color: #e0e0e0;
overflow-x: hidden;
}

.glitch-text {
position: relative;
color: #ffcc00;
text-align: center;
animation: glitch 1.5s infinite;
font-size: 1.8em;
letter-spacing: 1px;
margin-bottom: 12px;
}

@keyframes glitch {
0% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
25% { text-shadow: -2px 2px #00ff00, 2px -2px #ff00ff; }
50% { text-shadow: 2px -2px #ff0000, -2px 2px #00ffff; }
75% { text-shadow: -2px -2px #ff00ff, 2px 2px #00ff00; }
100% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
}

.nt-dossier {
margin: 20px auto;
max-width: 600px;
background: linear-gradient(145deg, #1a1a1a, #111111);
border: 1px solid #ffcc00;
border-radius: 12px;
box-shadow: 0 0 20px rgba(255,204,0,0.4);
position: relative;
padding-bottom: 20px;
animation: fadeIn 1s ease-out forwards;
opacity: 0;
}

.nt-dossier-table {
width: 100%;
border-collapse: collapse;
}

.nt-dossier-table th, .nt-dossier-table td {
padding: 12px;
border-bottom: 1px solid #444;
}

.nt-dossier-table th {
background: #2c2c2c;
color: #ffcc00;
width: 40%;
text-align: left;
transition: background 0.3s;
}

.nt-dossier-table th:hover {
background: #333;
}

.scan-row {
opacity: 0;
transform: translateX(-20px);
transition: transform 0.6s ease-out, background-color 0.6s ease-out;
}

.scan-row.visible {
opacity: 1;
transform: translateX(0);
}

.threat {
color: #ff4444;
font-weight: bold;
animation: blink 1s infinite alternate;
text-transform: uppercase;
}

@keyframes blink {
0% { opacity: 1; }
50% { opacity: 0.3; }
100% { opacity: 1; }
}

.status-indicator {
width: 16px;
height: 16px;
background: #ff4444;
border-radius: 50%;
position: absolute;
bottom: 12px;
right: 12px;
animation: pulse 1.5s infinite;
}

@keyframes pulse {
0% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
50% { box-shadow: 0 0 15px #ff0000; transform: scale(1.3); }
100% { box-shadow: 0 0 5px #ff4444; transform: scale(1); }
}

.nt-tabs {
margin: 20px auto;
max-width: 600px;
text-align: center;
animation: fadeIn 1.2s forwards;
opacity: 0;
}

.nt-tab {
display: inline-block;
background: #2c2c2c;
border: 1px solid #444;
color: #ffcc00;
padding: 10px 16px;
cursor: pointer;
margin: 0 6px;
border-radius: 6px;
user-select: none;
transition: transform 0.3s ease, background-color 0.3s ease;
}

.nt-tab.active {
background: #444;
border-color: #ffcc00;
box-shadow: 0 0 10px #ffcc00 inset;
}

.nt-tab:hover {
background: #555;
transform: scale(1.05);
}

.nt-tab-content {
display: none;
max-width: 600px;
margin: 15px auto;
padding: 15px;
background: #1a1a1a;
border: 1px solid #444;
border-radius: 10px;
animation: fadeIn 0.5s forwards;
opacity: 0;
}

.nt-tab-content.active {
display: block;
opacity: 1;
}

@keyframes fadeIn {
to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
* { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.job_header .header-title,
.job_header .sprite-container {
animation: none !important;
}
}

/*МИНИ часть блока лора что бы не ломать вики государств*/
:root{
--cf-federation-color:#6e0e0e;
--cf-confederation-color:#0c0361;
--cf-sssp-color:#801828;
--cf-minor-color:#07520b;
--cf-corp-color:#0e2847;
--cf-bg-card:#1e1e1e;
--cf-text-light:#f0f0f0;
--cf-text-muted:#a0a0a0;
}

/* Структура карточек фракций (префикс cf- чтобы не ломать сайт) */
.cf-page-header{ text-align:center; margin-bottom:20px; padding:6px 10px; }
.cf-factions-wrapper{ display:flex; flex-direction:column; gap:18px; max-width:1400px; margin:0 auto; padding:6px; box-sizing:border-box; }

.cf-faction-category{ width:100%; }
.cf-category-title{ font-size:1.6rem; margin:6px 0 12px; padding-bottom:6px; border-bottom:2px solid; text-align:center; }

.cf-cards-row{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

.cf-faction-card{ background-color:var(--cf-bg-card); border-radius:10px; overflow:hidden; width:100%; max-width:520px; box-shadow:0 6px 14px rgba(0,0,0,0.45); transition:transform .22s ease, box-shadow .22s ease; }
.cf-faction-card:hover{ transform:translateY(-6px); box-shadow:0 14px 26px rgba(0,0,0,0.6); }

.cf-card-header{ padding:14px 16px; text-align:center; position:relative; }
.cf-card-header::after{ content:''; position:absolute; bottom:6px; left:8%; width:84%; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent); }

.cf-card-logo{ display:block; margin:0 auto 10px; max-width:240px; max-height:120px; }
.cf-card-title{ font-size:1.25rem; margin:0; font-weight:700; color:var(--cf-text-light); }

.cf-card-content{ padding:14px 16px; color:var(--cf-text-light); }
.cf-faction-desc{ font-size:0.95rem; color:var(--cf-text-muted); line-height:1.45; }

/* Цвета для типов */
.cf-federation{ border-top:5px solid var(--cf-federation-color); }
.cf-federation .cf-card-header{ background:linear-gradient(90deg,#6e0e0e 0%, #470303 100%); }

.cf-confederation{ border-top:5px solid var(--cf-confederation-color); }
.cf-confederation .cf-card-header{ background:linear-gradient(90deg,#0c0361 0%, #0a034a 100%); }

.cf-sssp{ border-top:5px solid var(--cf-sssp-color); }
.cf-sssp .cf-card-header{ background:linear-gradient(90deg,#801828 0%, #4f121b 100%); }

.cf-minor-states{ border-top:5px solid var(--cf-minor-color); }
.cf-minor-states .cf-card-header{ background:linear-gradient(90deg,#07520b 0%, #032b05 100%); }

.cf-corporations{ border-top:5px solid var(--cf-corp-color); }
.cf-corporations .cf-card-header{ background:linear-gradient(90deg,#0e2847 0%, #081524 100%); }

/* Адаптивность */
@media (max-width:900px){
.cf-card-logo{ max-width:180px; max-height:100px; }
.cf-faction-card{ max-width:100%; }
.cf-cards-row{ gap:10px; }
}

MediaWiki:Common.js

2026-04-06T19:48:58Z

MetalSage:

/* Аудиоплееры */
(function(){
var players = document.getElementsByClassName('audio-player');
for(var i=0;i<players.length;i++){
(function(p){
var src = p.getAttribute('data-src');
if(src){
var audio = document.createElement('audio');
audio.setAttribute('controls','controls');
audio.setAttribute('preload','none');
var source = document.createElement('source');
source.setAttribute('src',src);
source.setAttribute('type','audio/mpeg');
audio.appendChild(source);
p.appendChild(audio);
}
})(players[i]);
}
})();

/* Подгрузка внешних CSS/JS */
(function(){
if(typeof mw === 'undefined') return;

function getFilesFromUrl(param){
if(!param) return [];
return param.split('|').map(function(file){ return file.trim(); });
}

function getBaseUrl(){
var server = mw.config.get('wgServer').replace(/^http:/,'https:');
var script = mw.config.get('wgScript');
return server + script + '?action=raw&ctype=text/';
}

function isValidExtension(ext){ return ext === 'js' || ext === 'css'; }

function getFileUrl(file){
var prefix = file.indexOf('MediaWiki:') === 0 ? 'MediaWiki:' : 'User:' + (mw.config.get('wgUserName') || '') + '/';
var fullName = file.indexOf(':') > -1 ? file : prefix + file;
var ext = file.split('.').pop().toLowerCase();
if(!isValidExtension(ext)){
console.error('Недопустимое расширение файла:', file);
return null;
}
var timestamp = new Date().getTime();
return getBaseUrl() + (ext==='js' ? 'javascript' : 'css') + '&title=' + encodeURIComponent(fullName) + '&_=' + timestamp;
}

function loadFiles(files){
for(var i=0;i<files.length;i++){
var url = getFileUrl(files[i]);
if(url){
var ext = files[i].split('.').pop().toLowerCase();
mw.loader.load(url,'text/' + (ext==='js' ? 'javascript' : 'css'));
}
}
}

mw.loader.using('mediawiki.util', function(){
var params = mw.util.getParamValue('use');
var files = getFilesFromUrl(params);
loadFiles(files);
});
})();

/* Перенос page-info и цвет заголовков */
(function(){
var footerPlaces = document.getElementById('footer-places');
var pageInfo = document.querySelector('.page-info');
if(footerPlaces && pageInfo){
footerPlaces.insertAdjacentElement('afterend', pageInfo.cloneNode(true));
pageInfo.parentNode.removeChild(pageInfo);
}

var headerColorElement = document.querySelector('.headerColor');
if(headerColorElement){
var content = headerColorElement.textContent.split('|');
if(content.length === 2){
var headers = document.querySelectorAll('.citizen-section-heading, .citizen-section-heading--collapsed');
for(var hi=0; hi<headers.length; hi++){
var header = headers[hi],
indicator = header.querySelector('.citizen-section-indicator'),
headline = header.querySelector('.mw-headline');
if(!indicator || !headline) continue;
if(header.classList.contains('citizen-section-heading--collapsed')){
indicator.style.cssText = 'background: black; box-shadow: unset;';
} else {
indicator.style.cssText = 'background: ' + content[1] + '; box-shadow: 0 0 20px 0px ' + content[1] + 'cc;';
headline.style.cssText = 'border-image: linear-gradient(to right top,' + content[0] + ', black); border-image-slice:1;';
}
}
}
}
})();

/* Sidebar для ролей */
(function(){
var jobsContainer = document.querySelector('.JobsTableContainer');
if(jobsContainer && jobsContainer.innerHTML.trim()){
var bodyContent = document.getElementById('bodyContent');
if(bodyContent){
bodyContent.insertAdjacentHTML('beforebegin', jobsContainer.innerHTML);
var jobTable = document.getElementById('IdJobsTableContainer1');
if(jobTable) jobTable.id = 'IdJobsTableContainer2';
}
}
})();

/* Хронология */
(function(){
if(!window.jQuery) return;
jQuery(function($){
$('.timeline-header').on('click', function(){
$(this).next('.timeline-content').slideToggle();
}).trigger('click');
});
})();

/* Галерея */
(function(){
var root = document.getElementById('ss-art-gallery');
if(!root) return;

function q(a,b){ return a.querySelector(b); }
function qa(a,b){ return Array.prototype.slice.call(a.querySelectorAll(b)); }

var chips = qa(root,'.ss-chip');

function setFilter(val){
for(var ci=0; ci<chips.length; ci++){
var c = chips[ci];
var active = (c.getAttribute('data-filter')===val || (val==='all' && c.getAttribute('data-filter')==='all'));
c.classList.toggle('ss-chip-active', active);
}

var sections = qa(root,'.ss-section');
for(var si=0; si<sections.length; si++){
var section = sections[si];
var cards = qa(section,'.ss-card');
var visibleCount = 0;
for(var cj=0; cj<cards.length; cj++){
var card = cards[cj];
var show = (val==='all' || val===card.getAttribute('data-artist'));
card.classList.toggle('ss-hidden', !show);
if(show) visibleCount++;
}
section.style.display = (val==='all' || visibleCount>0)?'block':'none';
}
}

for(var i=0;i<chips.length;i++){
(function(ch){
ch.addEventListener('click', function(){ setFilter(ch.getAttribute('data-filter')); });
})(chips[i]);
}
setFilter('all');

var modal = document.createElement('div');
modal.className = 'ss-modal';
modal.innerHTML = '<div class="ss-modal-inner"><img class="ss-modal-img" alt=""/></div><div class="ss-modal-close" role="button">✖ Закрыть</div>';
root.appendChild(modal);

var modalImg = q(modal,'.ss-modal-img');

function originalFromThumb(u){
if(!u) return u;
if(u.indexOf('/thumb/')>-1){
var s = u.replace('/thumb/','/');
s = s.replace(/\/[^\/]*$/,'');
return s;
}
return u;
}

var images = qa(root,'.ss-card img');
for(var ii=0; ii<images.length; ii++){
(function(img){
img.style.cursor='zoom-in';
img.addEventListener('click', function(e){
e.preventDefault();
var src = originalFromThumb(img.getAttribute('src')) || img.getAttribute('src');
modalImg.setAttribute('src',src);
modalImg.style.maxWidth='90vw';
modalImg.style.maxHeight='90vh';
modal.classList.add('open');
});
})(images[ii]);
}

function closeModal(){ modal.classList.remove('open'); }
modal.addEventListener('click', function(e){ if(e.target===modal||e.target.classList.contains('ss-modal-close')) closeModal(); });
document.addEventListener('keydown', function(e){ if(e.key==='Escape') closeModal(); });
})();

/* Меню лора */
(function(){
var items = document.querySelectorAll('.custom-item');
for(var mi=0; mi<items.length; mi++){
(function(item){
var icon = item.querySelector('.custom-icon');
var linkEl = item.querySelector('a');
if(!linkEl) return;

var href = linkEl.getAttribute('href');
item.style.cursor='pointer';

item.onclick = function(){ window.location.href = href; };
item.onmousemove = function(e){
var rect = item.getBoundingClientRect();
var x = e.clientX - rect.left;
var y = e.clientY - rect.top;
var moveX = (x - rect.width/2)*0.02;
var moveY = (y - rect.height/2)*0.02;
item.style.backgroundPosition = (50 + moveX) + '% ' + (50 + moveY) + '%';
if(icon) icon.style.transform = 'translateY(-8px) scale(1.08)';
var hue = Math.round((x/rect.width)*360);
item.style.boxShadow =
'0 0 15px hsla(' + hue + ',100%,60%,0.7), ' +
'0 0 30px hsla(' + ((hue+30)%360) + ',100%,50%,0.4), ' +
'0 8px 20px rgba(0,0,0,0.5)';
};
item.onmouseleave = function(){
item.style.backgroundPosition='50% 50%';
if(icon) icon.style.transform='translateY(0) scale(1)';
item.style.boxShadow='0 4px 10px rgba(0,0,0,0.3)';
};
})(items[mi]);
}
})();

/* Химия */
(function() {
if (typeof mw === 'undefined' || !window.document) return;

function initCollapse() {
var headings = document.querySelectorAll('.chem-heading');
var hi = 0;
var len = headings.length;
for (; hi < len; hi++) {
(function(node) {
if (node.getAttribute('data-chem-attached')) return;
node.setAttribute('data-chem-attached', '1');
node.style.cursor = 'pointer';
node.addEventListener('click', function() {
var kind = node.getAttribute('data-kind') || '';
var wrapper = findWrapper(node, kind);
if (!wrapper) return;
var btn = node.querySelector('.collapse-btn');

if (wrapper.classList.contains('collapsed')) {
wrapper.style.maxHeight = wrapper.scrollHeight + 'px';
wrapper.classList.remove('collapsed');
wrapper.classList.add('expanded');
if (btn) btn.textContent = 'свернуть';

var cleanup = function() {
wrapper.style.maxHeight = '';
wrapper.removeEventListener('transitionend', cleanup);
};
wrapper.addEventListener('transitionend', cleanup);
} else {
var currentHeight = wrapper.scrollHeight;
wrapper.style.maxHeight = currentHeight + 'px';
wrapper.offsetHeight;
wrapper.style.maxHeight = '0px';
wrapper.classList.remove('expanded');
wrapper.classList.add('collapsed');
if (btn) btn.textContent = 'развернуть';
}
});
})(headings[hi]);
}
}

function findWrapper(node, kind) {
var parent = node.parentNode;
if (!parent) return null;
var wrappers = parent.querySelectorAll('.collapsible');
var wi = 0;
var wlen = wrappers.length;
for (; wi < wlen; wi++) {
if (wrappers[wi].getAttribute('data-kind') === kind) {
return wrappers[wi];
}
}
return null;
}

if (document.readyState === 'complete' || document.readyState === 'interactive') {
initCollapse();
} else {
document.addEventListener('DOMContentLoaded', initCollapse);
}
})();

Лор СМ

2025-12-06T14:07:15Z

MetalSage: Ебаные карточки реально заебали не кликаться.

__NOTOC__
{{DISPLAYTITLE:}}
<div class="loreCMwelcom">Добро пожаловать на</div>
<div>[[Файл:verenvsegda.png|справа|330x72px]]</div>
<div class="loreCMtext">Лор Marine Corps</div>
<div class="loreCMwelcomWork">Лор всегда находиться в разработке</div>

'''Лор''' — это предыстория вымышленного персонажа или вселенной. Термин произошел от английского слова lore, которое значит «знания, передающиеся из поколения в поколение». На нашем сервере лор играет важную роль, ведь без его понимания легко потеряться в происходящем вокруг. Создавая проект в формате '''MRP''' ''(Medium Roleplay)'' и разрабатывая '''собственный лор''', мы надеемся, что вы будете ему следовать и не выбиваться из общей картины.

= Я новичок-морпех и не понимаю местный лор =
С пробуждением, морпех. После долгого сна в камере гибернации память может подводить — не волнуйся, это нормально. Ты — боец [[Корпус_Морской_Пехоты|Корпуса Морской Пехоты]] [[США|Соединенных Штатов Америки]]. Сейчас ты находишься на борту десантного корабля [[УДКТ «Алмайер»]].
Когда-то ты подписал контракт с [[Корпус_Морской_Пехоты|КМП США]], и теперь, вдали от Земли, выполняешь свой долг — защищаешь интересы Америки. На дворе 2182 год. Если ты пробудился - значит Алмайер прибыл на пункт назначения. Снаряжайся и следуй указаниям командиров.
<div>'''Америка''' рассчитывает на тебя.</div>
<div>'''Америка''' верит в тебя.</div>
= Фракции =

<div style="width: 100%; display: flex; flex-direction: column; gap: 15px;">

<div style="position: relative; width: 100%; height: 120px; background: #0d1117; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.6); border-left: 6px solid #3c81cc; transition: transform 0.2s;">
[[США|<span title="США" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;"></span>]]

<div style="position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 70%; height: 100%; opacity: 0.8; pointer-events: none; overflow: hidden; display: flex; justify-content: flex-end; align-items: center;">
[[Файл:Флаг_США.png|link=|600px]]
</div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #161b22 30%, rgba(22, 27, 34, 0.8) 60%, rgba(22, 27, 34, 0) 100%); z-index: 2;"></div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 30px; z-index: 3; pointer-events: none;">
<div style="font-family: 'Segoe UI', sans-serif; font-size: 24px; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,0.8); letter-spacing: 0.5px;">Соединенные Штаты Америки</div>
<div style="font-family: 'Segoe UI', sans-serif; font-size: 15px; color: #a8d1ff; font-style: italic; margin-top: 4px; text-shadow: 0 1px 2px #000;">"На Бога уповаем"</div>
</div>
</div>

<hr class="hrCMLore" style="border-color: #30363d; margin: 5px 0; opacity: 0.5;">

<div style="position: relative; width: 100%; height: 120px; background: #0d1117; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.6); border-left: 6px solid #f2c94c; transition: transform 0.2s;">
[[Вестон-Ямада|<span title="Вестон-Ямада" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;"></span>]]

<div style="position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 70%; height: 100%; opacity: 0.8; pointer-events: none; overflow: hidden; display: flex; justify-content: flex-end; align-items: center;">
[[Файл:WY_Patch.png|link=|500px]]
</div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #161b22 30%, rgba(22, 27, 34, 0.8) 60%, rgba(22, 27, 34, 0) 100%); z-index: 2;"></div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 30px; z-index: 3; pointer-events: none;">
<div style="font-family: 'Segoe UI', sans-serif; font-size: 24px; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,0.8); letter-spacing: 0.5px;">Вестон-Ямада</div>
<div style="font-family: 'Segoe UI', sans-serif; font-size: 15px; color: #fceeb5; font-style: italic; margin-top: 4px; text-shadow: 0 1px 2px #000;">"Строим лучшие миры!"</div>
</div>
</div>

<hr class="hrCMLore" style="border-color: #30363d; margin: 5px 0; opacity: 0.5;">

<div style="position: relative; width: 100%; height: 120px; background: #0d1117; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.6); border-left: 6px solid #d32f2f; transition: transform 0.2s;">
[[Союз Прогрессивных Народов|<span title="Союз Прогрессивных Народов" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;"></span>]]

<div style="position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 70%; height: 100%; opacity: 0.8; pointer-events: none; overflow: hidden; display: flex; justify-content: flex-end; align-items: center;">
[[Файл:CPN_1.png|link=|600px]]
</div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #161b22 30%, rgba(22, 27, 34, 0.8) 60%, rgba(22, 27, 34, 0) 100%); z-index: 2;"></div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 30px; z-index: 3; pointer-events: none;">
<div style="font-family: 'Segoe UI', sans-serif; font-size: 22px; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,0.8); letter-spacing: 0.5px;">Союз Прогрессивных Народов</div>
<div style="font-family: 'Segoe UI', sans-serif; font-size: 15px; color: #ffcdd2; font-style: italic; margin-top: 4px; text-shadow: 0 1px 2px #000;">"Слава Партии! Слава трудовому Народу!"</div>
</div>
</div>

<hr class="hrCMLore" style="border-color: #30363d; margin: 5px 0; opacity: 0.5;">

<div style="position: relative; width: 100%; height: 120px; background: #0d1117; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.6); border-left: 6px solid #e67e22; transition: transform 0.2s;">
[[Империя_Трех_Миров|<span title="Империя Трех Миров" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;"></span>]]

<div style="position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 70%; height: 100%; opacity: 0.8; pointer-events: none; overflow: hidden; display: flex; justify-content: flex-end; align-items: center;">
[[Файл:ИТМ.png|link=|600px]]
</div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #161b22 30%, rgba(22, 27, 34, 0.8) 60%, rgba(22, 27, 34, 0) 100%); z-index: 2;"></div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 30px; z-index: 3; pointer-events: none;">
<div style="font-family: 'Segoe UI', sans-serif; font-size: 24px; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,0.8); letter-spacing: 0.5px;">Империя Трех Миров</div>
<div style="font-family: 'Segoe UI', sans-serif; font-size: 15px; color: #ffe0b2; font-style: italic; margin-top: 4px; text-shadow: 0 1px 2px #000;">"За Императора!"</div>
</div>
</div>

<hr class="hrCMLore" style="border-color: #30363d; margin: 5px 0; opacity: 0.5;">

<div style="position: relative; width: 100%; height: 120px; background: #0d1117; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.6); border-left: 6px solid #43a047; transition: transform 0.2s;">
[[КОФ|<span title="Колониальный Освободительный Фронт" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;"></span>]]

<div style="position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 70%; height: 100%; opacity: 0.8; pointer-events: none; overflow: hidden; display: flex; justify-content: flex-end; align-items: center;">
[[Файл:CLF_Patch.png|link=|500px]]
</div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #161b22 30%, rgba(22, 27, 34, 0.8) 60%, rgba(22, 27, 34, 0) 100%); z-index: 2;"></div>

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 30px; z-index: 3; pointer-events: none;">
<div style="font-family: 'Segoe UI', sans-serif; font-size: 20px; font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,0.8); letter-spacing: 0.5px;">Колониальный Освободительный Фронт</div>
<div style="font-family: 'Segoe UI', sans-serif; font-size: 15px; color: #c8e6c9; font-style: italic; margin-top: 4px; text-shadow: 0 1px 2px #000;">"КОФ - сила!"</div>
</div>
</div>

</div>

= Концовки =
В игре представлены несколько концовок раунда. Мы решили объяснить что происходи после них:
== Победа морпехов ==
Ксеноморфы бились нещадно, терзая тела врагов.
Сёстры падали одна за другой, замирая в пучине боя.
Рой сражался отчаянно, но его силы не смогли противостоять напору бойцов КМП США.

Рой ксеноморфов полностью пал на колонии.
Колония была захвачена людьми.
Остальные ульи ощутили потерю — по всей планете начали слышаться визги и крики.
Колония была отбита.

[[Вестон-Ямада]] направила группу инженеров для восстановления инфраструктуры.
Через несколько месяцев колония вновь смогла функционировать, а её система защиты была значительно усилена.

Шаттл [[УДКТ «Алмайер»]] эвакуировал своих бойцов и покинул сектор.
==== Итог: ====
<div>'''Колония отбита.'''</div>
<div>'''Большинство ксеноморфов погибли или сбежали.'''</div>

== Победа морпехов на УДКТ «Алмайер» ==
Морпехи сражались до конца… И они справились — они отбили своё судно.

УДКТ «Алмайер» был отбит и возвращён под контроль КМП США.

Колония была временно утеряна. После гибели королевы из глубин улья начали выбираться трутни, восстанавливая колонию. Через несколько дней появилась новая лидерша — новая матка. Бой унёс множество жизней, но колония осталась под контролем улья.

Вестон-Ямада признала колонию временно нерабочей — прибытие ближайшего ремонтного шаттла оказалось слишком долгим. Колония временно признана не функционирующей.

После поражения ксеноморфов система ARES версии 3.2 зафиксировала отсутствие вражеского присутствия и активировала протокол [[Протокол_«Укротители_чумы»|"Укротители чумы"]]. Через несколько секунд по всем палубам разнёсся сигнал, и из своих камер вышли несколько десятков синтетиков, которые начали проводить ремонтные работы. Шаттл, пробивший «Алмайер», был выведен из кормы и посажен на стыковочный порт, после чего все стены были востановлены отрядом синтетиков. Шаттл приведён в горизонтальное состояние и покинул орбиту...

Итог:
Колония потеряна.
Захвачена ксеноморфами.
Морпехи отбили своё судно и покинули орбиту для восстановления УДКТ «Алмайер».

== Победа ксеноморфов ==
'''Морпехи''' сражались до конца.
Им удалось удерживать позиции достаточно долго, чтобы завершить эвакуацию экипажа.
После этого [[УДКТ «Алмайер»]] остался без управления и начал стремительно терять высоту.

Все ''ксеноморфы'' на борту, как и само судно, сгорели в плотных слоях атмосферы.

'''Колония''' была потеряна.
После гибели королевы из глубин улья начали выбираться трутни, восстанавливая колонию.
Через несколько дней появилась новая лидерша — новая матка.
Бой унес множество жизней, однако колония осталась под контролем улья.

[[Вестон-Ямада]] признала колонию утерянной — прибытие ближайшего боевого шаттла оказалось слишком поздним.

После официального подтверждения потери колонии в сектор прибыло судно [[USS_Executioner|«Палач»]], которое при поддержке малых шаттлов [[USS_Peddler_Коробейник|«Коробейник»]] собрало шлюпки и эвакуировало всех выживших из сектора.

==== Итог: ====
<div>'''Колония потеряна.'''</div>
<div>'''Захвачена ксеноморфами.'''</div>
<div>'''Большинство морпехов успели эвакуироваться.'''</div>

== Истощение==

Королевы больше нет, но рой ксеноморфов продолжает сопротивление. Остатки противника действуют хаотично, отдельные особи совершают внезапные атаки, но координации уже нет. Морпехи держат позиции, но ресурсы и боеприпасы на исходе, каждое продвижение даётся с трудом.

Бой постепенно теряет темп: атаки ксеноморфов становятся редкими, а защитные позиции морпехов укрепляются по инерции. Ни одна из сторон не может получить явное преимущество — противники просто изматывают друг друга.

Колония остаётся в неопределённом состоянии: некоторые зоны контролируются морпехами, другие — ксеноморфами. Организованного сопротивления роя больше нет, но отдельные группы продолжают атаковать и защищать остатки территории.

Морпехи выжили, но не смогли полностью зачистить ксеноморфов. Противники понесли значительные потери, но часть роя всё ещё активна, готовая к восстановлению и продолжению борьбы.

====Итог:====

'''Королевы нет, рой ксеноморфов остаётся активным.'''

'''Морпехи выжили, но не зачистили всех врагов.'''

'''Колония частично контролируется обеими сторонами.'''

'''Победителя нет.'''

== УДКТ «Алмайер» сгорел в плотных слоях атмосферы со всеми на борту==
'''Морпехи''' сражались до конца…
Но, увы, им так и не удалось отбить своё судно — даже покинуть его они не смогли.
Они ушли как герои.

[[УДКТ «Алмайер»]] начал входить в атмосферу, сгорать и разваливаться на части.
Все, кто пытался покинуть шаттл, погибали быстро и трагично: кого-то сбивало обломками, кто-то сгорал заживо.
Шлюпки, которые пытались отсоединиться от судна, взрывались прямо в стык портах — так и не успев отлететь от [[УДКТ «Алмайер»|Алмейра]].

Все ''ксеноморфы'' на борту, как и само судно, сгорели в плотных слоях атмосферы.
Шаттл просто не был рассчитан на подобные перегрузки.

Колония была потеряна.
После гибели королевы из глубин улья начали выбираться трутни, восстанавливая колонию.
Через несколько дней появилась новая лидерша — новая матка.
Бой унес множество жизней, но колония осталась под контролем улья.

[[Вестон-Ямада]] признала колонию утерянной — прибытие ближайшего боевого шаттла оказалось слишком долгим и не нужным.

После поражения и официального признания потери колонии в сектор прибыло судно [[USS_Executioner|«Палач»]], которое при поддержке малых шаттлов [[USS_Peddler_Коробейник|«Коробейник»]] собрало шлюпки и эвакуировало всех выживших из сектора.

==== Итог: ====
<div>'''Колония потеряна.'''</div>
<div>'''Захвачена ксеноморфами.'''</div>
<div>'''Морпехи, что остались на борту, погибли — но ушли с честью.'''</div>

== Ничья из-за затягивание раунда ==
После продолжительных боевых действий силы [[Корпус_Морской_Пехоты|КМП США]] и рой ксеноморфов понесли значительные потери.
Многие сестры были уничтожены, что привело к постепенному ослаблению оставшихся особей. Несмотря на это, ксеноморфы продолжали вести бой.

'''Морпехи''', в свою очередь, также оказались истощены. Боеприпасы и ресурсы были на исходе, часть подразделений получила тяжёлые повреждения. Попытки зачистки оставшихся ксеноморфов не приносили результата — контакты были редкими и быстро обрывались.

Ситуация зашла в тупик: ни одна из сторон не могла добиться решающего преимущества. Бой шел слишком долго и неведомые силы решили остановить его. Вы не помните что было дальше.

====Итог:====
<div>'''Никто не узнает что произошло дальше.'''</div>