@font-face {
    font-family: 'Bender';
    src: url('/templates/Default/fonts/bender/main.woff2') format('woff2'),
         url('/templates/Default/fonts/bender/main.otf') format('opentype');
}

@font-face {
    font-family: 'Advent Pro';
    src: url('/templates/Default/fonts/adventpro/main.woff2') format('woff2'),
         url('/templates/Default/fonts/adventpro/main.otf') format('opentype');
    font-weight: 400;  /* normal */
    font-style: normal;
}

@font-face {
    font-family: 'Advent Pro';
    src: url('/templates/Default/fonts/adventpro/bold.woff2') format('woff2'),
         url('/templates/Default/fonts/adventpro/bold.otf') format('opentype');
    font-weight: 700;  /* bold */
    font-style: normal;
}

html, body {
    background: #0d1b20;
    color: #d4d4b4;
    margin: 0;
    font-family: "Advent Pro", san;s-serif;
    overflow-x: hidden;
	cursor: 
		url('/templates/Default/images/cursor.png') 4 1, 
		url('/templates/Default/images/cursor.cur') 4 1, 
        auto;
}

html, body, 
a, button, input, textarea, select,
[role="button"], [onclick], 
* {
    cursor: url('/templates/Default/images/cursor.png') 4 1,
            url('/templates/Default/images/cursor.cur') 4 1,
            auto !important;
}

html.no-scroll,
body.no-scroll {
    overflow: hidden !important;
}

.error {color: #F08080;}
.underline {height: 100px;}

#loadingOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0d1b20;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

#loader {
    margin-bottom: 10px;
}

#progress-container {
    position: relative;
    width: 150px;
    border-radius: 5px;
    padding: 5px;
    margin: 0 auto;
    background-color: rgba(255,255,255,.1);
    overflow: hidden;
}

#progress {
    height: 15px;
    background-color: #ffffff;
    border-radius: 2px;
    width: 0%;
}

#progressText {
    text-align: center;
    margin-top: 5px;
}

/*------scroll bar---------------------*/

::-webkit-scrollbar {
  width: 5px;
  height: 7px;
}
::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}
::-webkit-scrollbar-thumb {
  background: #d4d4b4;
  border: 0px none #ffffff;
  border-radius: 0px;
}
::-webkit-scrollbar-thumb:hover {
  background: #d4d4b4;
}
::-webkit-scrollbar-thumb:active {
  background: #d4d4b4;
}
::-webkit-scrollbar-track {
  background: transparent;
  border: 0px none #ffffff;
  border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
  background: transparent;
}
::-webkit-scrollbar-track:active {
  background: transparent;
}
::-webkit-scrollbar-corner {
  background: transparent;
}


@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}

.banned {background: #DC143C; color: #fff; padding: 5px; font-size: 10pt; position: relative; top: -5px; border-radius: 5px;}

.pwalogo {
    display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.pwalogo img {
    width: 100px;
    min-width: 20%;
}

.pwaversion {
    position: absolute;
    width: 100%;
    bottom: 10%;
    font-size: 30px;
    left: 0;
    text-align: center;
}

.preloaderBg {
	position: fixed;
    z-index: 999999; 
    top: 0;
	  background: #0d1b20;
    width: 100%;
    height: 100vh;
    text-align: center;
}

.preloader {
    margin-top: calc(50vh - 75px);
    margin-left: auto;
    margin-right: auto;
  	background: url(/templates/Default/images/logo_1x1.svg) no-repeat center;
    background-size: 75px;
    width: 150px;
    height: 150px;
}


.preloader2 {
  border: 5px solid rgba(255,255,255,.1);
  border-top: 5px solid #d4d4b4;
  border-radius: 50%;
  width: 150px;
  height: 150px;
  animation: spin 1s ease-in-out infinite ;
  position: relative;
  margin: auto;
  top: -150px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

h1, h2, h3, h4:not(.base-item h4), h5 {
    font-family: "Advent Pro", sans-serif;
}

h1 {font-size: 26pt; margin-bottom: 40px; font-family: 'Bender', sans-serif;  color: #fff;}
h4 {font-size: 18pt; margin-bottom: 20px;}
h5 {font-size: 16pt; margin-bottom: 10px; margin-top: 0;}

p {
    margin: 0;
    padding: 0;
}

.full-text p {margin: 10px 0;}
.full-text h4 {margin-top: 50px;}

a {z-index: 5; text-decoration: none;}
.com_user a {color: #ffffff;}

.tcenter {
    text-align: center;
}

.tright {
    text-align: right;
}

.questshop {margin-bottom: 10px;}

.bg-reset-row {z-index: 999999; position: fixed; right: 30px; bottom: 75px; font-size: 12pt;}
.bg-sound-row {z-index: 999999; position: fixed; right: 30px; bottom: 30px; font-size: 12pt;}
.bg-sound {position: relative; width: 100%; height: 100%;}
.bg-sound-btn {border: 0; background: rgba(255,255,255,.1); color: rgba(255,255,255,.5); border: 1px solid rgba(255,255,255,.2); border-radius: 5px; position: relative; aspect-ratio: 1/1; width: 40px; height: 40px; transition: 0.3s all;}
.bg-sound-btn i {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.bg-sound-btn:hover {background: rgba(255,255,255,.4);  border: 1px solid rgba(255,255,255,.5); color: rgba(255,255,255,1); transform: scale(1.2); transition: 0.3s all;}
.bottom-row {display: none;}

.dark-carousel {position: relative;}
.dark-carousel:before {content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 50px; background: linear-gradient(90deg, rgba(13,27,32,1) 0%, rgba(13,27,32,0) 100%); z-index: 10;}
.dark-carousel:after {content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 50px; background: linear-gradient(90deg, rgba(13,27,32,0) 0%, rgba(13,27,32,1) 100%); z-index: 10;}

.navigation {margin-top: -120px; text-align: center;}
.pages span {font-family: 'Bender', sans-serif;  font-size: 18pt; color: #fff; padding: 0 3px;}
.pages a {font-family: 'Bender', sans-serif;  font-size: 18pt; color: rgba(255,255,255,.7); padding: 0 3px; transition: 0.3s all;}
.pages a:hover {color: rgba(255,255,255,.9); transition: 0.3s all;}

/*------ СМАРТФОН МЕНЮ ---------------------*/
.bottommenu-fixed-info {display: none; position: fixed; z-index: 9999; top: calc(100% - 120px); left: 10px; right: 10px; background: #d4d4b4; color: #0d1b20; padding: 15px; border-radius: 10px 10px 0 0; border: 1px solid #0d1b20; transition: top 0.3s ease-in-out;}
.bottommenu-fixed-info.active {top: auto; bottom: 80px; transition: bottom 0.3s ease-in-out, top 0.3s ease-in-out;}
.topmenu-fixed-info {position: relative; grid-column: span 13; background: #d4d4b4; color: #0d1b20; padding: 15px;}
.bottom-snow-line {pointer-events: none; z-index: 99; position: fixed; bottom: 0; left: -20px; width: calc(100% + 40px);}
.close-button {position: absolute; top: 50%; right: 10px; transform: translate(0, -50%); background: transparent; border: 0; font-size: 18pt;}
.menu-hidden {display: none; pointer-events: none;}
.topmenu-fixed-info a, .bottommenu-fixed-info a {color: #0d1b20; text-decoration: underline;}
.topmenu-row {position: fixed; box-shadow: 0 0 10px black; width: 100%; background: #0d1b20; z-index: 999; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 0; grid-auto-flow: row dense; font-family: 'Bender', sans-serif;  letter-spacing: 2px; font-size: 8pt; text-transform: uppercase;}
.topmenu-item {font-size: 10pt; text-align: center; padding: 10px; color: #fff; transition: 0.3s all;}
.topmenu-item a {color: #fff;}
.topmenu-item-lock {text-align: center; padding: 10px; color: rgba(255,255,255,.5); background: rgba(0,0,0,.2); transition: 0.3s all; border-radius: 3px; border: 1px solid rgba(0,0,0,.2);}
.topmenu-logo {text-align: center; transition: 0.3s all;}
.topmenu-logo img {height: 20px; padding-top: 8px; padding-bottom: 6px;}
.topmenu-item:hover, .topmenu-logo:hover {background: rgba(255,255,255,.1); transition: 0.3s all;}
.topmenu-item-season {font-size: 10pt; position: relative; text-align: center; padding: 10px; color: #0d1b20; background: rgba(212,212,180,1); transition: 0.3s all;}
.topmenu-item-season:hover {background: rgba(255,255,255,1);}
.topmenu-item-season:a {color: #0d1b20;}
.topmenu-item-season-timer {font-size: 8pt; z-index: -1; color: #fff; text-transform: lowercase; width: 80%; position: absolute; bottom: -22px; padding: 5px 5px; left: 50%; transform: translate(-50%, 0); background: rgba(0,0,0,.5); bordet-top: 1px solid #0d1b20; border-radius: 0 0 5px 5px; transition: 0.3s all;}
.topmenu-item-season:hover .topmenu-item-season-timer {opacity: 0; bottom: 20px; transition: 0.3s all;}

    @keyframes phone-show {
      0% {opacity: 0; margin-top: 30px;}
      100% {opacity: 1;  margin-top: 0;}
    }
    
    @keyframes phone-hide {
      0% {opacity: 1; margin-top: 0;}
      100% {opacity: 0;  margin-top: 30px;}
    }
    
    @keyframes back-show {
      0% {opacity: 0;}
      100% {opacity: 1;}
    }
    
    @keyframes back-hide {
      0% {opacity: 1; margin-top: 0;}
      100% {opacity: 0;}
    }


@keyframes glitch-animation {
    0% {
        clip-path: inset(0);
        transform: translate(0);
        filter: none;
    }
    10% {
        clip-path: inset(0 0 30% 0);
        transform: translate(-5px, 2px);
        filter: brightness(1.2) contrast(1.2);
    }
    20% {
        clip-path: inset(0 5% 15% 0);
        transform: translate(5px, -2px);
        filter: brightness(1.1) contrast(1.1);
    }
    30% {
        clip-path: inset(0 0 30% 0);
        transform: translate(-2px, 4px);
        filter: brightness(1.2) contrast(1.2);
    }
    40% {
        clip-path: inset(0 0 30% 0);
        transform: translate(2px, -1px);
        filter: brightness(1.1) contrast(1.1);
    }
    50% {
        clip-path: inset(0);
        transform: translate(0);
        filter: none;
    }
    100% {
        clip-path: inset(0);
        transform: translate(0);
        filter: none;
    }
}

.bg-main {
    position: relative;
    background: url(/templates/Default/images/headers/bg-main.jpg);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-main-newyear {
    position: relative;
    background: url(/templates/Default/images/headers/bg-main-newyear.jpg?v=2);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-camp {
    position: relative;
    background: url(/templates/Default/images/headers/bg-camp.jpg);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-store {
    position: relative;
    background: url(/templates/Default/images/headers/bg-store.jpg);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-battlepass-season1 {
    position: relative;
    background: url(/templates/Default/images/headers/bg-battlepass-season1.jpg?v=1);
    background-position: top center;
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-battlepass-level {z-index: -1; text-align: center; background-image: var(--background); background-size: 500%; background-position: center center;}
.bg-battlepass-blur {position: relative; -webkit-backdrop-filter: blur(1000px); backdrop-filter: blur(1000px); padding: 75px 0 150px 0; background: rgba(13,27,32,.5);}
.bg-battlepass-image {width: 175px; margin-bottom: 30px;}

.bg-premium {
    position: relative;
    background: url(/templates/Default/images/headers/bg-header-premium.png);
    background-position: top center;
    padding-top: 200px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-treasurehunters {
    position: relative;
    background: url(/templates/Default/images/headers/bg-event-treasurehunters.jpg);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-invite {
    position: relative;
    background: url(/templates/Default/images/headers/bg-invite.jpg);
    padding-top: 400px;
    padding-bottom: 100px;
    background-size: cover;
    background-position: center center;
    text-align: center;
}

.bg-lootbox {
    position: relative;
    background-image: var(--background);
    aspect-ratio: 21/9;
    background-size: cover;
    background-position: center center;
    text-align: center;
    margin-bottom: 50px;
}

.bg-main-blur {
    position: relative;
    background: url(/templates/Default/images/headers/bg-op.jpg);
    background-size: cover;
    background-position: center center;
    text-align: center;
    backdrop-filter: blur(55px);
}

.bg-user, .bg-user-ultimate, .bg-user-ultimate_ghotic {
    position: relative;
    overflow: hidden;
    background: url(/templates/Default/images/headers/bg-user.png);
    background-size: cover;
    background-position: center center;
    text-align: center;
    backdrop-filter: blur(55px);
}

.bg-user video {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -25%);
    z-index: 1;
}

.bg-user-ultimate video, .bg-user-ultimate_ghotic video {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    transform: translate(-50%, 0);
    z-index: 1;
}

.bg-blur {
    height: 550px;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.bg-video {
    position: relative;
    height: 550px;
    background: rgba(13,27,32,.4);
    z-index: 2;
}

.bg-gradient:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 40%;
    width: 100%;
    background: linear-gradient(180deg, rgba(13,27,32,0) 0%, rgba(13,27,32,.2) 30%, rgba(13,27,32,1) 100%);
    z-index: 20;
}

.event-card-treasurehunters {background: linear-gradient(45deg, rgba(13,27,32,1) 0%, rgba(138,89,30,1) 100%);}
.event-card-mysteriousexchange {background: linear-gradient(45deg, rgba(99,70,130,1) 0%, rgba(26,24,37,1) 100%);}
.event-card-halloween {background: linear-gradient(45deg, rgba(150,50,25,1) 0%, rgba(113,41,26,1) 100%);}
.event-card-snowforest {background: url('/templates/Default/images/raids/snowforest.jpg'); background-size: cover; background-position: center center;}
.event-card-mainpage {background: linear-gradient(45deg, rgba(36,43,49,1) 0%, rgba(50,66,69,1) 100%);}

.event-card-fractions {position: relative; padding: 20px 0 0 0; border-left: 1px solid #30393b; border-right: 1px solid #30393b; border-top: 1px solid #30393b; border-radius: 10px 10px 0 0; padding-top: 200px;}
.event-card-fractions-image {position: absolute; left: 0; top: -50px; width: 100%; transition: 0.3s all;}
.event-card-fractions-text {background: #0d1b20; border-left: 1px solid #30393b; border-right: 1px solid #30393b;  border-bottom: 1px solid #30393b; border-radius: 0 0 10px 10px; padding: 10px 20px 20px 20px;}
.event-block:hover .event-card-fractions-image {top: -75px; transition: 0.3s all;}

.fraction-this .event-card-fractions {border-left: 1px solid #fff; border-right: 1px solid #fff; border-top: 1px solid #fff;}
.fraction-this .event-card-fractions-text {border-left: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff;}

.event-fraction-1 {background: linear-gradient(45deg, rgba(2,79,14,1) 0%, rgba(7,28,18,1) 100%);}
.event-fraction-2 {background: linear-gradient(45deg, rgba(79,2,2,1) 0%, rgba(28,7,7,1) 100%);}
.event-fraction-3 {background: linear-gradient(45deg, rgba(79,46,2,1) 0%, rgba(28,15,7,1) 100%);}
.event-fraction-4 {background: linear-gradient(11deg, rgba(66,66,66,1) 0%, rgba(27,27,27,1) 100%);}
.event-fraction-5 {background: linear-gradient(11deg, rgba(66,61,33,1) 0%, rgba(45,38,9,1) 100%);}
.event-fraction {border: 1px solid rgba(255,255,255,.2);}
.owl-fractions {padding-top: 100px;}

.warzone-logs {position: relative; margin-bottom: 10px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 50px; overflow: hidden; text-align: center;}
.warzone-logs b {color: #fff;}
.warzone-logs-new {width: 300px; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); opacity: .5;}
.warzone-logs-old {width: 300px; position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); opacity: .5;}

.warzone-rank {position: relative; display: flex; justify-content: center; margin: 0 auto 30px auto; z-index: 99;}
.warzone-rank img {width: 65px; transition: 0.3s all;}
.warzone-rank img:hover {transform: scale(1.1); transition: 0.3s all;}
.warzone-rank-text {padding-top: 13px; padding-right: 5px;}
.warzone-rank-text-title {font-family: 'Bender', sans-serif;  font-size: 12pt; text-transform: uppercase; color: #fff;}
.warzone-rank-text-subtitle {font-weight: bold;}
.warzone-score-text {position: absolute; bottom: 50px; left: 0; right: 0; text-align: center; font-family: 'Bender', sans-serif; color: #fff; font-size: 24pt;}

.warzone-black {position: absolute; background: rgba(0,0,0,.7); left: 0; top: 0; bottom: 0; right: 0;}
.warzone-base-item {position: absolute; left: var(--left); top: var(--top); width: var(--width); height: var(--height); background: url(https://www.escapefromtarkov.com/themes/eft/images/news_li_bg.png) rgba(255,255,255,.2); text-align: center; transition: 0.3s all;}
.warzone-base-item:hover {background: rgba(255,255,255,.1); transition: 0.3s all;}
.warzone-base-item-info {position: absolute; left: 50%; top: calc(50% - 5px); transform: translate(-50%, -50%); width: 100%;}
.warzone-base-item-logo {width: 25%;}
.warzone-base-item-title {font-weight: bold; font-size: 10pt; text-transform: uppercase; color: #fff;}

.warzone-getop-row {background: rgba(255,255,255,.1); padding: 20px; border: 1px solid rgba(255,255,255,.2);}
.warzone-getop-row h4 {color: #fff; font-family: 'Bender', sans-serif;}
.warzone-getop-item {position: relative; Box-sizing: border-box; aspect-ratio: 16/9; overflow: hidden; background: rgba(0,0,0,.1);}
.warzone-getop-btn {text-align: center; margin-top: 24%;}
.warzone-getop-link {font-family: 'Bender', sans-serif; font-size: 32pt; color: #fff;}
    
.warzone-next-row {display: grid; gap: 5px; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; width: 500px; max-width: 100%;}
.warzone-next-text {margin-top: 10px; font-weight: bold; margin-bottom: 5px;}
.warzone-header {background: var(--background); background-size: cover; background-position: center center;}
.warzone-header-row {-webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); background: rgba(13,27,32,.5); padding-top: 50px; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 20px; grid-auto-flow: row dense;}
.warzone-header-logo {width: 100%;}
.warzone-header-info {position: relative; grid-column: span 3;}
.warzone-header-main {position: absolute; top: 50%; transform: translate(0, -50%);}
.warzone-header-title {font-family: 'Bender', sans-serif;  font-size: 32pt; text-transform: uppercase; color: #fff; text-shadow: 0 0 5px black;}
.warzone-header-leader {color: #fff; text-shadow: 0 0 5px black;}
.warzone-header-score {position: absolute; top: 50%; right: 0; text-align: right; transform: translate(0, -50%); text-align: right;}
.warzone-header-place {position: relative; top: -7px; font-family: 'Bender', sans-serif;  font-size: 12pt; text-transform: uppercase; color: #fff; text-shadow: 0 0 5px black;}
.warzone-header-points {font-family: 'Bender', sans-serif;  font-size: 50pt; text-transform: uppercase; color: #fff; text-shadow: 0 0 5px black;}
.warzone-header-subpoints {position: relative; top: -7px; font-family: 'Bender', sans-serif;  font-size: 12pt; text-transform: uppercase; color: #fff; text-shadow: 0 0 5px black;}

.warzone-top-row {position: relative;}
.warzone-top-me {background: rgba(255,255,255,.2);}
.warzone-top-notme {border-bottom: 1px solid rgba(255,255,255,.1);}
.warzone-top-logo {width: 60px;}
.warzone-top-name {position: absolute; left: 75px; top: 50%; transform: translate(0, -50%); font-size: 14pt; font-weight: bold; color: rgba(255,255,255,.75);}
.warzone-top-score {position: absolute; text-align: right; right: 15px; top: 50%; transform: translate(0, -50%); font-family: 'Bender', sans-serif;  font-size: 16pt; text-transform: uppercase; color: #fff;}

.loot-name-coupon {
    color: #fff;
    font-family: "Advent Pro", sans-serif;
  	font-weight: bold;
    font-size: 16pt;
    margin-top: 40px;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
}

.couponbtn {
    background: linear-gradient(90deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
    width: 200px;
    padding: 10px 10px 10px 15px;
    color: rgba(255,255,255,.7);
    border-radius: 5px 0 0 5px;
    transition: 0.3s all;
}

.couponbtn:hover {
    background: linear-gradient(90deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
    width: 200px;
    padding: 10px 10px 10px 20px;
    color: rgba(255,255,255,1);
    transition: 0.3s all;
}

.loot-info-coupon {
    width: 100%;
    padding-bottom: 50px;
    text-align: center;
}

#coupon input {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    font-family: 'Bender', sans-serif; 
    color: rgba(255,255,255,1);
    font-size: 30pt;
    width: 100%;
    max-width: 400px;
    text-align: center;
    letter-spacing: 3px;
}

#coupon .popup_contain {
    background: url(https://theclosedsector.com/templates/Default/images/raids/university.jpg);
    background-size: cover;
    background-position: center center;
}

.warzone-round .popup_contain {
    background: #121212;
    color: #fff;
	background: radial-gradient(circle, rgba(52,52,52,1) 0%, rgba(18,18,18,1) 100%);
    background-position: center bottom; /* Центр градиента внизу */
    background-size: cover; /* Или другое значение, в зависимости от ваших нужд */
}

.warzone-round .loot-name {text-align: center; width: 100%;}

.collector-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    grid-auto-flow: row dense;
}

.collector-item {
    position: relative;
    background: rgba(255,255,255,.1);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 0;
    grid-auto-flow: row dense;
}

.collector-item div img {
    height: 100px;
}

.collector-item-text {
    padding: 15px;
    grid-column: span 4;
}

.collector-item-title {
    color: #fff;
    font-weight: bold;
}

.collector-item-date {
    margin-top: 5px;
    font-size: 10pt;
}

.collector-item-date b {
    color: #fff;
}

.collector-item-reward {
    margin-top: 10px;
    font-size: 8pt;
    font-weight: bold;
}

.collector-item-reward span {
    padding: 3px;
    color: rgba(255,255,255,.7);
}

.collector-item-my {
    background: #d4d4b4;
    color: #000;
}

.collector-item-my .collector-item-reward span, .collector-item-my .collector-item-title {color: #000;}

.collector-btn {
    position: absolute;
    right: 15px;
    top: 15px;
}

.base-row {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 20px; grid-auto-flow: row dense;}
.base-nav-title {font-size: 12pt; color: #fff;}
.base-content {grid-column: span 4; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); padding: 20px;}
.base-content h1 {margin-top: 0; margin-bottom: 0; color: #ffffff; font-size: 20pt;}
.base-content h2 {margin-top: 0; margin-bottom: 30px; color: rgba(255,255,255,.5); font-size: 12pt;}
.base-content h4 {font-size: 14pt; margin-bottom: 10px;}
.base-content p {margin-bottom: 10px;}
.base-content a {color: #fff;}

.base-short {background: rgba(255,255,255,.05); padding: 10px; margin-bottom: 5px; color: #fff;}
.base-short:hover {background: rgba(255,255,255,.1);}

.profile-subtitle img {position: relative; top: -2px; width: 1.2em; opacity: .7;}
.profile-subtitle {font-size: 14pt; margin-bottom: -5px; z-index: 250;}
.profile-title {z-index: -1; position: absolute; top: 65px; left: 0; width: 100%; font-size: 35pt; font-family: 'Bender', sans-serif; text-transform: uppercase; font-style: normal; color: rgba(255,255,255,.7);}
.profile-title-top {z-index: -1; position: absolute; top: 45px; left: 0; width: 100%; font-size: 35pt; font-family: 'Bender', sans-serif;  text-transform: uppercase; font-style: normal; color: rgba(255,255,255,.7);}
.profile-op1 {pointer-events: none; width: 450px; position: absolute; left: calc(50% - 225px); bottom: 0;}
.profile-op2 {pointer-events: none; width: 350px; position: absolute; left: calc(50% - 375px); bottom: 0; z-index: -1;}
.profile-op3 {pointer-events: none; width: 350px; position: absolute; left: calc(50% + 25px); bottom: 0; z-index: -1;}
.profile-op-glith1 {position: relative; width: 450px; height: 450px;}
.profile-op-glith2 {position: relative; width: 350px; height: 350px;}
.profile-op-glith3 {position: relative; width: 350px; height: 350px;}
.profile-op-left {margin-left: 75px;}
.profile-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.profile-row-op {width: 800px; max-width: 100%; margin: 0 auto; position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.profile-row div:not(#invlimit):not(.inv-limit-red):not(.inv-limit-yellow) {position: relative; background: rgba(255,255,255,.1); padding: 0; border: 1px solid rgba(255,255,255,.2);}
.profile-row-title {background: rgba(255,255,255,.1); padding: 10px; font-size: 10pt; color: #d4d4b4;}
.profile-row-count {padding: 10px; color: #d4d4b4;}
.profile-row-bitton {position: absolute; bottom: 25px; right: 20px; text-align: right;}
.inv-limit-red {position: relative; background: rgba(212,62,62,.5); padding: 0; border: 1px solid rgba(212,62,62,.5);}
.inv-limit-yellow {position: relative; background: rgba(177,177,57,.5); padding: 0; border: 1px solid rgba(255,255,110,.5);}
.profile-theme {text-align: center; margin-bottom: 20px;}

.seasontop {color: #d4d4b4; transition: 0.3s all; border: 1px solid #3d494d;}
.seasontop-blur {height: 325px; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);}
.seasontop-op1 {width: 60%; position: absolute; left: 50%; transform: translate(-50%, 0); bottom: 0;}
.seasontop-op2 {width: 40%; position: absolute; left: 25%; transform: translate(-50%, 0); bottom: 0; z-index: -1;}
.seasontop-op3 {width: 40%; position: absolute; left: 75%; transform: translate(-50%, 0); bottom: 0; z-index: -1;}
.seasontop-op-left {margin-left: 12.5%;}
.seasontop-more {transition: 0.3s all; color: #d4d4b4; grid-column: span 3; position: relative; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px;}
.seasontop-more-me {transition: 0.3s all; grid-column: span 3; position: relative; background: #d4d4b4; color: #0d1b20; border: 1px solid rgba(255,255,255,.2); padding: 20px;}
.seasontop:hover, .seasontop-more:hover, .seasontop-more-me:hover {transition: 0.3s all; opacity: .7;}
.seasontop-rank {text-align: left; position: absolute; bottom: -20px; left: 0; right: 0; transform: scale(.75); z-index: 99;}
.seasontop-position {font-family: 'Bender', sans-serif;  text-transform: uppercase; color: #fff; padding-right: 10px;}
.seasontop-rankimg {position: absolute; right: 5px; top: 9px; width: 50px;}
.seasontop-score {position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-family: 'Bender', sans-serif; color: #fff;}
.seasontop-more-me .seasontop-position {color: rgba(0,0,0,.7);}

.profile-level {text-align: center; margin-top: 10px;}
.profile-level-count {font-size: 35pt; font-family: 'Bender', sans-serif;  text-transform: uppercase; font-style: normal; color: rgba(255,255,255,.7); margin-bottom: 5px; transition: 0.3s all;}
.profile-level-xp {font-size: 8pt; color: rgba(0,0,0,.7); font-weight: bold; transition: 0.3s all;}
.profile-level-bar {position: relative; width: 100px; background: rgba(255,255,255,.7); padding: 4px 7px; margin: 0 auto;}
.profile-level-bar-in {position: absolute; left: 0; top: 0; width: var(--width); background: rgba(0,0,0,.2); height: calc(100% - 6px); margin: 3px;}

.profile-level:hover .profile-level-count {cursor: pointer; color: rgba(255,255,255,.9); transition: 0.3s all;}
.profile-level:hover .profile-level-bar {cursor: pointer; background: rgba(255,255,255,.9); transition: 0.3s all;}

@keyframes scale1 {
    0% {transform: scale(1);
  box-shadow:0 25px 25px rgba(0, 0, 0, 0.4);
  }
    50% {transform: scale(0.9);
   box-shadow:0 25px 25px rgba(0, 0, 0, 0.6)
  }
   100% {transform: scale(1);
   box-shadow:0 25px 25px rgba(0, 0, 0, 0.4)
 }
}

.profile-op-item {background: rgba(255,255,255,.1); padding: 0; border: 1px solid rgba(255,255,255,.2);}

.ui-form {
    list-style-type:  none;
    padding-left: 0;
}

.form-group {
    margin: 20px 0;
}

.global-line {
    margin-bottom: 10px;
}

.global-line-in {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
}

.global-line-in p {
    padding: 20px;
    text-align: center;
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255,255,255,.1);
}

.global-line-in p b {
	font-family: 'Bender', sans-serif;
    
    font-size: 26pt;
    color: #fff;
    line-height: 155%;
}

.global-line-in p span {
    color: #fff;
    font-weight: bold;
}

@keyframes text {
  0%{
    transform: translate(0, 0);
  }
  
  100%{
    transform: translate(-120%, 0);
  }
}

.activeuser-sticky {position: sticky; left: 0; transition: background 0.3s; z-index: 10;}
.activeuser-name {background: linear-gradient(to right, transparent, black, transparent); padding-top: 6px;}
.activeuser-header {font-weight: bold; color: #fff;}
.activeuser-row {position: relative; min-width: 1200px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px; margin-bottom: 10px; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.activeuser-row a {color: #fff;}
.activeuser-row div:not(.activeuser-name) {text-align: center; padding-top: 5px;}
.activeuser-green {color: #50C878;}
.activeuser-red {color: #FF5733;}
.activeuser-white {color: #FFFFFF;}
.activeuser-rank {position: absolute; width: 40px; top: -5px; left: 0;}
.activeuser-level {padding-left: 45px; font-family: 'Bender', sans-serif;  text-transform: uppercase; font-style: normal; color: rgba(255,255,255,.7); padding-right: 10px;}
.activeuser-level-premium {padding-left: 45px;
  font-family: 'Bender', sans-serif;  text-transform: uppercase; font-style: normal; color: rgba(255,255,255,.7); padding-right: 10px;
  background: linear-gradient(90deg, #e933ff, #ffb400, #ff3333, #334dff, #e933ff);
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textflow 5s linear infinite;
}
@keyframes textflow {
  from {background-position: 0% center}         
  to {background-position: 200% center}
}

.activeuser-lastskin h1 {padding: 0; margin: 0 0 10px 0; font-family: 'Bender', sans-serif;  text-transform: uppercase; color: #fff;}
.activeuser-lastitem h1 {padding: 0; margin: 30px 0 10px 0; font-family: 'Bender', sans-serif;  text-transform: uppercase; color: #fff;}
.activeuser-lastskin b, .activeuser-lastitem b {color: #fff;}
.activeuser-lastitem {margin-bottom: 50px;}

.activeuser-camp {grid-column: span 2;}
.activeuser-camp span {position: relative; margin: 0 3px; width: 25px; padding: 3px 0;}
.activeuser-camp span img {width: 25px; height: 25px;}

.animate {
  background: linear-gradient(90deg, #e933ff, #ffb400, #ff3333, #334dff, #e933ff);
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textflow 5s linear infinite;
}
@keyframes textflow {
  from {background-position: 0% center}         
  to {background-position: 200% center}
}

.fraction-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.fraction-item {background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px; text-align: center;}
.fraction-cover {width: 100%;}
.fraction-name {margin: 10px 0; font-size: 14pt;}
.fraction-score {font-size: 10pt; margin-top: 10px; font-weight: bold;}
.fraction-leader {background: #d4d4b4; color: #000; padding: 10px;}
.fraction-leader-title {font-weight: bold; font-size: 10pt;}
.fraction-leader-name {margin-top: 5px;}
.fraction-documents {position: relative; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px; margin-bottom: 10px;}
.fraction-documents h4 {margin: 0 0 20px 0; padding: 0;}
.fraction-top {position: relative; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px; margin-bottom: 10px;}
.fraction-top-name {font-size: 16pt;}
.fraction-top-score {position: absolute; right: 20px; top: 25px;}
.fraction-in-cover {height: 100px; position: absolute; top: 20px; right: 20px; background: #0d1b20; border: 1px solid rgba(0,0,0,.1);}

.reward-timeout {margin-top: -10px; margin-bottom: 10px;}

#pm-menu {
    margin-bottom: 30px;
}

#pm-menu a {
    background: #d4d4b4;
    color: #000;
    text-decoration: none;
    padding: 5px 10px;
}

.pmlist a {
    color: #d4d4b4;
    text-decoration: none;
}

.pmlist tr:nth-child(odd) { background: rgba(255,255,255,.1); }
.pmlist tr:nth-child(even) { background: rgba(255,255,255,.2); }

.left {
    list-style-type:  none;
    padding-left: 0;
}

.left li {
    display: inline-block;
}

.left li a {
    color: #fff;
    text-decoration: none;
}

.com_content {
    background: #d4d4b4;
    color: #000000;
    padding: 1px 20px 20px 20px;
    margin-top: 30px;
}

.activefilter {background: #d4d4b4; color: rgba(0,0,0,.7); transition: 0.3s all;}
.activefilter:hover {background: #ffffff; color: rgba(0,0,0,.7); transition: 0.3s all;}

.market-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 1.2%;
    grid-auto-flow: row dense;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    margin-bottom: 10px;
}

.market-img img:not(.loot-cover) {
    width: 100%;
    display: block;
}

.market-name {
    align-content: center;
    font-size: 14pt;
    grid-column: span 6;
}

.market-seller {
    align-content: center;
    font-size: 14pt;
    grid-column: span 3;
}

.market-seller a {
    color: #fff;
}

.market-state {
    font-size: 10pt;
    font-weight: bold;
}

.market-price {
    text-align: center;
    align-content: center;
    grid-column: span 2;
}

.market-buy {
    text-align: center;
    align-content: center;
    grid-column: span 2;
}

.market-limit {
    margin-top: -20px;
    margin-bottom: 20px;
}

.allitems-nav {
    padding-top: 50px;
}

.allitems-nav a {
    margin-bottom: 20px;
}

.allitems-row {
    padding: 20px;
    position: relative;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
    margin-bottom: 10px;
    min-height: 95px;
}

.allitems-image {
    position: absolute;
    width: 95px;
    height: 95px;
    top: 20px;
    left: 20px;
}

.allitems-info {
    padding-left: 115px;
}

.allitems-name {
    margin-top: 5px;
    font-size: 14pt;
}

.allitems-detail {
    margin-top: 10px;
}

.allitems-detail input {
    width: 200px;
    padding: 8.5px 15px;
    border-radius: 5px;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.1);
    color: #fff;
    font-family: 'Bender', sans-serif;
    letter-spacing: 1px;
}

.allitems-detail-error {
    margin-top: 10px;
    font-weight: bold;
}

.allitems-type {
    position: absolute;
    right: 20px;
    top: 20px;
    text-align: right;
}

.allitems-market {
    margin-top: 30px;
}

.allitems-minprice {
    margin-bottom: 10px;
}

.commission {
    margin-bottom: 10px;
    font-weight: bold;
}

.commission:before {
    content: "Стоимость выставления: ";
    font-weight: normal;
}

.commission:after {
    content: " кредитов";
    font-weight: normal;
}

.quester-area {
    position: relative;
    background-image: var(--background);
    aspect-ratio: 24/9;
    background-size: cover;
    background-position: top 25% center;
}

.quester-area:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 65%;
    width: 100%;
    background: linear-gradient(180deg, rgba(13,27,32,0) 0%, rgba(13,27,32,.2) 30%, rgba(13,27,32,1) 100%);
    z-index: 0;
}

.quester-info {
    margin-top: 20px;
    width: 300px;
    max-width: 100%;
}

.quester-info-row {position: absolute; bottom: 0; left: 0; right: 0;}
.quester-info-row p {margin: 0;}
.quester-info-row h1 {margin: 0; font-family: 'Bender', sans-serif;  font-size: 28pt; color: #fff; z-index: 2;}
.quester-region {font-size: 12pt; font-family: 'Bender', sans-serif;  color: #fff;}

.img1em {
    width: 1em;
    height: 1em;
}

.mainwidth {
    position: relative;
    max-width: 1300px;
    margin: 0 auto;
}

.chatarea {
    background: rgba(255,255,255,.1);
    min-height: 100vh;
    padding: 20px;
}

.chatwidth {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}

.lootboxwidth {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}

.lootbox-logs-row {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; width: 70%; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); padding: 5px; height: 62px; white-space: nowrap; overflow: hidden;}
.lootbox-logs-items {position: relative; width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 5px;}
.lootbox-logs-item {position: relative; height: 60px; background-color: transparent; margin-bottom: 20px;}
.lootbox-logs-new {position: relative; border: 1px solid rgba(0,0,0,.2);}
.lootbox-logs-hide {display: none;}
.lootbox-logs-item img {position: absolute; top: 10px; left: 10px; height: 40px;}
.lootbox-logs-item-text {font-size: 10pt; position: absolute; left: 60px; top: 50%; width: calc(100% - 80px); transform: translateY(-50%); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.lootbox-logs-item-title {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-weight: bold; color: #fff;}

.top10 {margin-top: 10px;}
.top30p {padding-top: 30px;}
.top50p {padding-top: 50px;}
.top100p {padding-top: 50px;}
.top100pp {padding-top: 100px;}
.top20p {padding-top: 20px;}
.top10p {padding-top: 10px;}
.top15p {padding-top: 15px;}
.bottom50p {padding-bottom: 50px;}
.bottom20 {margin-bottom: 20px;}

.top20 {margin-top: 20px;}
.notop {margin-top: 0;}

.freeops {overflow: hidden; position: relative; border: 1px solid #525B5F; background: rgba(255,255,255,.1); aspect-ratio: 16/9;}
.freeops-content {position: absolute; top: 50%; left: 50%; width: 75%; transform: translate(-50%, -50%); text-align: center;}
.freeops-item {width: 50%;}
.freeops-title {font-family: 'Bender', sans-serif;  text-transform: uppercase; font-size: 14pt; margin-bottom: 10px; color: #fff;}
.freeops-btn {margin-top: 10px;}

.op-short {overflow: hidden; position: relative; border: 1px solid #525B5F; aspect-ratio: 16/9; background-image: var(--background); background-size: 600%; background-position: center center;}
.op-blur {backdrop-filter: blur(55px); -webkit-backdrop-filter: blur(55px); width: 100%; height: 100%; z-index: 2; overflow: hidden;}
.op-blur:after {content: ""; z-index: 5; position: absolute; bottom: 0; left: 0; right: 0; height: 50%; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);}
.op-short-status {position: absolute; font-family: 'Bender', sans-serif; text-transform: uppercase; letter-spacing: 5px; left: 10px; right: 10px; text-align: center; top: 10px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 7px 5px 7px 10px; color: #fff;}
.op-short-autor {font-size: 10pt; color: rgba(255,255,255,.7);}
.op-short-text {z-index: 10; position: absolute; left: 20px; right: 20px; bottom: 20px; text-align: left; text-transform: uppercase; text-shadow: 1px 1px black; font-family: 'Bender', sans-serif; color: #fff;}
.op-short-age {margin-bottom: 20px; color: #fff; font-weight: bold; font-size: 10pt;}
.op-short-image {position: absolute; aspect-ratio: 1/1; left: 0; bottom: 0; top: 0; transition: 0.3s all; z-index: 5;}
.op-short-image img {width: 100%;}
.op-blur:hover .op-short-image {transform: scale(1.2); transition: 0.3s all;}
.op-short-squad {text-align: center; position: relative; top: 10px; color: #fff; text-shadow: 0 0 2px black; font-weight: bold; text-transform: none; opacity: 0; transition: 0.3s all;}
.op-short-squad a {color: #fff;}
.op-short-squad span {background: rgba(255,255,255,.2); padding: 5px; border-radius: 5px;}
.op-short-cover {position: absolute; aspect-ratio: 1/1; left: 0; right: 0; bottom: 0; transition: 0.3s all;}
.op-blur:hover .op-short-squad {cursor: pointer; opacity: 1; top: -10px; transition: 0.3s all;}

.op-blur:hover .op-short-new-image {transform: scale(1.2); transition: 0.3s all;}
.op-short-footer {position: absolute; top: 55%; left: 50%; width: calc(50% - 20px); transform: translateY(-50%);padding: 5px;}
.op-short-footer div {position: relative; text-align: center;}
.op-short-footer-empty img {opacity: .5;}
.op-short-footer div img:not(.op-short-footer-empty) {width: 100%; padding: 5px; box-sizing: border-box;}
.op-short-footer-equip {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 5px; grid-auto-flow: row dense; margin-bottom: 5px;}
.op-short-footer-backpack {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; gap: 5px; grid-auto-flow: row dense;}
.op-short-footer-hp {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 9pt; font-family: 'Bender', sans-serif;}
.op-short-footer-go {position: absolute; top: 55%; left: 50%; width: calc(50% - 20px); transform: translateY(-50%);padding: 5px; text-align: center; font-family: 'Bender', sans-serif; font-size: 20pt; color: #fff;}
.op-short-footer-go img {width: 40%;}

.op-short-stat {position: absolute; top: 0; left: 0; z-index: 15; width: calc(100% - 30px); padding: 60px 15px 0 15px; font-size: 12pt; color: #fff; font-family: 'Bender', sans-serif; }
.op-short-stat i {opacity: .6;}
.op-short-stat-hp {position: relative; top: -2px; font-size: 10pt;}
.op-short-stat-right {position: absolute; top: 0; right: 0; z-index: 15; text-align: right; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; grid-auto-flow: row dense; width: calc(2em + 10px); margin: 60px 15px 0 15px; font-size: 12pt; color: #fff; font-family: 'Bender', sans-serif; }
.op-short-stat-right img {height: 0.85em; opacity: .6;}

.op-full {position: relative; text-align: center; width: 100%; background-image: var(--background); background-size: 600%; background-position: center center;}
.op-full-blur {position: relative; height: 500px; -webkit-backdrop-filter: blur(55px); backdrop-filter: blur(55px);}
.op-full-cover {height: 100%; z-index: -1; max-width: 100%;}
.op-full-glitch {height: 100%; aspect-ratio: 1/1; position: relative; margin: 0 auto;}

.op-item {
    position: relative;
    background: #d4d4b4;
    color: #000000;
    padding: 20px;
}

.op-stat-title {
}

.op-stat-value {
    font-weight: bold;
    font-size: 16pt;
}

.op-stat-value a {
    color: #0d1b20;
}

.popup_med {
    position: absolute;
    right: 20px;
  	top: 20px;
}

.op-hp span {
    font-size: 12pt;
}

.item {
    margin-top: 50px;
    position: relative;
    background: #d4d4b4;
    color: #000000;
    padding: 20px;
}

.question {
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    color: #000000;
    padding: 20px;
}

.chat-row {
    position: relative;
    height: 400px;
    overflow-y: auto;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    padding: 20px;
    margin-bottom: 10px;
}

.chat-image {
    width: 100%;
    margin-bottom: 20px;
    border-radius: 10px;
}

.chat-op {
    width: 50%;
    background: #d4d4b4;
}

.chat-player {
    width: 50%;
    margin-left: calc(50% - 40px);
    background: #fff;
}

.chat-system {
    padding: 20px;
}

.answer {
    position: relative;
    background: #d4d4b4;
    color: #000000;
    padding: 20px;
    opacity: .7;
    transition: 0.3s all;
}

.answer:hover {
    position: relative;
    background: #d4d4b4;
    color: #000000;
    padding: 20px;
    opacity: 1;
    transition: 0.3s all;
}

.item-red {
    margin-top: 50px;
    position: relative;
    background: rgba(212,62,62,.5);
    border: 1px solid rgba(212,62,62,.5);
    color: #fff;
    padding: 20px;
}

.inraidmap-area {position: relative; width: 100%; aspect-ratio: 30/10; overflow: hidden; border-radius: 10px;}
.inraidmap {position: relative; background: var(--background); top: var(--top); background-size: 100%; aspect-ratio: 1/1; width: 100%;}
.inraidmap-location {position: absolute; width: 50px; height: 50px; left: var(--left); top: var(--top); transition: 0.3s all; opacity: .5;}
.inraidmap-location:before {content: attr(title); position: absolute; left: 45px; top: 20px; width: 200px; color: #fff; text-shadow: 1px 1px black;}
.inraidmap-op {position: absolute; width: 50px; height: 50px; left: var(--left); top: var(--top); transition: 0.3s all; z-index: 10;}
.inraidmap-op img {width: 50px; filter: drop-shadow(5px 5px 5px #000000);}
.inraidmap-op:after {content: attr(subtitle); position: absolute; left: 60px; top: 6px; font-size: 9pt; font-weight: bold; width: 200px; color: #fff; text-shadow: 1px 1px black;}
.inraidmap-op:before {content: attr(title); position: absolute; left: 60px; top: 17px; font-family: 'Bender', sans-serif;  font-size: 17pt; width: 200px; color: #fff; text-shadow: 1px 1px black;}
.line-svg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; /* Чтобы линия не мешала взаимодействию с другими элементами */}
.line-svg line {z-index: 0; stroke: rgb(141,150,146); /* Цвет линии */ stroke-dasharray: 5, 5; /* Пунктирный эффект */ stroke-width: 2; /* Толщина линии */}
.inraidmap-end-black {z-index: 100; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5);}
.inraidmap-end {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
.inraidmap-end-btn {background: linear-gradient(45deg, #999 5%, #fff 10%, #ccc 30%, #ddd 50%, #ccc 70%, #fff 80%, #999 95%); border: 1px solid rgba(255,255,255,.2); padding: 20px 20px 20px 30px; letter-spacing: 10px; border-radius: 10px; transition: 0.3s all;}
.inraidmap-end-btn:hover {transform: scale(1.1); transition: 0.3s all;}
.inraidmap-end-btn-text-sub {font-family: 'Bender', sans-serif;  font-size: 8pt;color: #0d1b20; text-transform: uppercase;}
.inraidmap-end-btn-text {font-family: 'Bender', sans-serif;  font-size: 18pt;color: #0d1b20; text-transform: uppercase;}

.globalmap-area {position: fixed; background: #0d1b20; width: 100%; height: 100vh; overflow: auto; z-index: 100;}
.globalmap {position: relative; background: var(--background); background-size: 100%; aspect-ratio: 1/1; width: 100%; min-width: 1000px; overflow: hidden;}
.globalmap-war {position: relative; background: url(https://theclosedsector.com/templates/Default/images/map/warmap.jpg); background-size: 100%; aspect-ratio: 1/1; width: 100%; min-width: 1000px;}
.globalmap-item {position: absolute; width: 50px; height: 50px; left: var(--left); top: var(--top); transition: 0.3s all;}
.globalmap-item:before {content: attr(title); position: absolute; left: 45px; top: 17px; width: 200px; color: #fff; text-shadow: 1px 1px black;}
.globalmap-img {transition: 0.3s all;}
.globalmap-item:hover .globalmap-img {padding: 5px; transition: 0.3s all;}
.globalmap-item:hover:before {transition: 0.3s all; left: 55px; opacity: 0.7; pointer-events: none; transition: 0.3s all;}
.globalmap {width: 100%;}
.globalmap-raid {margin-bottom: 10px; font-weight: bold; font-size: 10pt;}
.globalmap-raid  span {padding-right: 10px;}
.globalmap-raid  i {padding-right: 5px;}
.globalmap-cover {padding: 0; width: 100%; aspect-ratio: 41/9; overflow: hidden; margin-bottom: 15px; border-radius: 10px;}
.globalmap-cover img {width: 100%; margin-top: -42%;}
.globalmap-lock {opacity: .5;}
.globalmap-btn {position: fixed; bottom: 50px; width: 100%; text-align: center; z-index: 120;}

.globalmap-fr1 {background: rgba(0,255,30,.25);}
.globalmap-fr2 {background: rgba(255,0,0,.25);}
.globalmap-fr3 {background: rgba(255,132,0,.25);}
.globalmap-fr4 {background: rgba(255,255,255,.25);}
.globalmap-fr5 {background: rgba(255,235,143,.25);}

.globalmap-red {
    width: 100%;
    height: 100%;
    text-align: center;
    position: relative;
    background: rgba(212,62,62,.5);
    border: 1px solid rgba(212,62,62,.5);
    color: #fff;
}

.globalmap-red p {
    margin-top: 25%;
}

.quest-item {
    margin-bottom: 20px;
    position: relative;
    background: #d4d4b4;
    color: #000000;
    padding: 20px;
}

.quest-autor {
    position: absolute;
    width: 75px;
    height: 75px;
    top: 20px;
    left: 20px;
    border-radius: 10px;
}

.quest-area {
    position: relative;
    top: -5px;
    padding-left: 90px;
}

.quest-title {
    font-weight: bold;
    font-size: 14pt;
}

.quest-title span {
    font-size: 10pt;
}

.quest-text {
    margin-top: 5px;
}

.quest-text p {
    margin-top: 10px;
}

.quest-zone {
    margin-top: 20px;
    background: rgba(0,0,0,.25);
    padding: 20px;
    position: relative;
    border-radius: 10px;
}

.quest-item-icon {
    width: 50px;
    height: 50px;
}

.quest-item-icon-second {
    width: 50px;
    height: 50px;
    margin-left: 15px;
}

.quest-reward {
    margin: 10px 0 0 0;
}

.services-edition-row {width: 100%; position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-edition-composition-title {font-weight: bold; font-size: 12pt; margin-top: 20px; margin-bottom: 5px;}
.services-edition-composition {font-size: 12pt; line-height: 130%; margin-bottom: 75px;}

.services-newedition-short {padding: 30px 30px 60px 30px;}
.services-newedition-short-cover img {width: 100%;}

.services-newedition-row {position: relative; width: 100%; position: relative; margin-bottom: 20px;}
.services-newedition-cover, .services-premium-cover, .services-newglobalrank-cover {text-align: center; padding: 30px 0;}
.services-newedition-cover img {width: 30%;}
.services-premium-cover img {width: 15%;}
.services-newglobalrank-cover img {width: 25%;}
.services-newglobalrank-text {font-family: 'Bender', sans-serif; font-size: 16pt; color: #fff;}
.services-premium-info {text-align: center; font-size: 14pt; color: #fff; width: 80%; max-width: 400px; margin: 30px auto;}
.services-premium-text {font-size: 14pt; color: rgba(255,255,255,.7); padding-bottom: 50px;}
.services-newedition-info {font-size: 11pt; padding: 0;}
.services-newedition-info sup {opacity: .7;}
.services-newedition-info-row {position: relative; width: 100%; position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-newedition-title {font-family: 'Bender', sans-serif;  font-size: 17pt; color: #fff; margin: 40px 0 20px 0;}
.services-newedition-money img {width: 2em; position: relative; top: -1px; padding-right: -5px; transform: scale(1.4);}
.services-newedition-item {background: rgba(255,255,255,.1); border-radius: 10px; text-align: center; padding: 20px;}
.services-newedition-item img {display: block; width: 50%; margin: 0 auto 10px auto;}
.services-newedition-items {margin: 20px 0 5px 0; color: #fff; font-weight: bold;}
.services-newedition-buy {position: relative; text-align: center;}
.services-newedition-button {background: linear-gradient(45deg, #999 5%, #fff 10%, #ccc 30%, #ddd 50%, #ccc 70%, #fff 80%, #999 95%); border: 1px solid rgba(255,255,255,.2); padding: 15px 15px 15px 20px; letter-spacing: 5px; border-radius: 10px; transition: 0.3s all;}
.services-newedition-button:hover {transform: scale(1.1); transition: 0.3s all;}
.services-newedition-text-sub {font-family: 'Bender', sans-serif;  font-size: 10pt;color: #0d1b20; text-transform: uppercase;}
.services-newedition-text {font-family: 'Bender', sans-serif;  font-size: 18pt;color: #0d1b20; text-transform: uppercase;}
.services-newedition-discount {color: #FFFF00; margin-top: 10px; font-weight: bold;}
.services-newedition-oldprice {text-decoration: line-through; font-family: 'Bender', sans-serif;  font-size: 15pt; color: rgba(255,255,255,.5);}
.services-newedition-disclaimer {font-size: 10pt; opacity: .7;}
.services-newedition-upgrade {position: relative; top: -13px;}
.services-newedition-upgrade span {background: #fff; color: #000; padding: 3px 5px; border-radius: 5px;}

.services-newedition-skins-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-newedition-themes-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-newedition-skin-item {position: relative;}
.services-newedition-skin-cover {width: 100%;}
.services-newedition-skin-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: white;
  mask: linear-gradient(
    to right,
    transparent 0%,
    white 20%,
    white 80%,
    transparent 100%
  );
}
.services-newedition-theme-item {position: relative;}
.services-newedition-theme-cover {width: 100%; border-radius: 10px;}

.services-newedition-items-loot-row {width: 100%; padding-bottom: 50px; position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}

.services-upbalance-row {width: 100%; position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-upbalance-col {position: relative; background: #d4d4b4; color: #000; border-radius; 3px; padding: 30px; transition: 0.3s all;}
.services-upbalance-col:hover {background: #f0f0cd; transition: 0.3s all;}
.services-upbalance-col img {position: absolute; right: 10px; top: 0; width: 125px; transition: 0.3s all;}
.services-upbalance-col:hover img {width: 150px; top: -13px; right: -3px; transition: 0.3s all;}
.services-upbalance-title {margin: 5px 0 10px 0;}
.services-upbalance-title span {border-radius: 3px; font-size: 8pt; font-weight: bold;}
.services-upbalance-bonus span {font-size: 14pt; font-weight: bold;}

.services-offers-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-offers-row > *:not(.loot-pack):not(.loot-cp):not(.services-big-item-cp) {aspect-ratio: 16/9; width: 100%; height: auto;}
.services-skins-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
.services-skins-badge {position: absolute; bottom: 22px; left: 25px; background: rgba(0,0,0,.7); color: rgba(255,255,255,.75); font-family: 'Bender', sans-serif;  padding: 5px 5px 7px 27px; z-index: 5;} 
.services-skins-badge span {font-size: 9pt;}
.services-skins-badge img {width: 1em;}
.services-skins-badge:before {content: ""; position: absolute; top: 6px; left: 7px; background: url(https://theclosedsector.com/templates/Default/images/store/timer.gif); background-size: cover; width: 1em; height: 1em;}
.services-big-item {position: relative; height: 100%; grid-row: span 2; grid-column: span 2; order: -1; overflow: hidden;}
.services-big-item-cp {position: relative; height: 100%; padding: 20px; Box-sizing: border-box; grid-row: span 2; grid-column: span 2; order: -1; overflow: hidden}
.services-big-item video {position: absolute; top: 0; left: 0; min-width: calc(100% + 15px);}
.services-big-item .loot-skin {position: absolute; top: 0; left: 0; width: calc(100% + 15px); z-index: 1;}
.services-big-item .loot-bg-image {position: absolute; top: 0; left: 0; width: calc(100% + 15px); z-index: 0;}

.store-timer-offer-empty {position: relative; aspect-ratio: 16/9;}
.store-timer-offer-item {position: relative; aspect-ratio: 16/9; background: var(--background); background-size: cover; background-position: center center; overflow: hidden;}
.store-timer-offer-item:after {content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid #494949; pointer-events: none;}
.store-timer-offer-blur {position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); background: linear-gradient(9deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.5) 100%);}
.store-timer-offer-cover-row {position: absolute; left: 15px; top: 15px; width: 35%;}
.store-timer-offer-cover {width: 100%;}
.store-timer-offer-info {position: absolute; left: calc(35% + 30px); top: 30px; padding-right: 15px;}
.store-timer-offer-title {font-family: 'Bender', sans-serif;  font-size: 14pt; color: #fff; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.store-timer-offer-desc {margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; color: rgba(255,255,255,.5);}
.store-timer-offer-button {position: absolute; bottom: 22px; left: 25px;}
.store-timer-offer-timer {position: relative; padding-left: 25px; font-family: 'Bender', sans-serif;  color: rgba(255,255,255,.75);}
.store-timer-offer-timer span {font-size: 9pt;}
.store-timer-offer-timer:before {content: ""; position: absolute; top: 1px; left: 5px; background: url(https://theclosedsector.com/templates/Default/images/store/timer.gif); background-size: cover; width: 1em; height: 1em;}

.vkbonusbtn {background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); padding: 20px; margin-bottom: 10px; font-family: 'Bender', sans-serif; color: #fff;}

.myphone-promo .store-timer-offer-cover-row {left: 15px; top: 15px; width: 30%;}
.myphone-promo .store-timer-offer-info {left: calc(30% + 30px); top: 20px;}
.myphone-promo .store-timer-offer-title {font-size: 12pt; -webkit-line-clamp: 1;}
.myphone-promo .store-timer-offer-desc {-webkit-line-clamp: 2; font-size: 9pt; padding-right: 10px;}
.myphone-promo .store-timer-offer-button {position: absolute; bottom: 15px; left: 10px;}
.myphone-promo .services-skins-badge {bottom: 12px; left: 10px; padding: 3px 3px 5px 25px;}
.myphone-promo .services-skins-badge:before {top: 4px; left: 7px;}
.myphone-promo .store-timer-offer-timer {padding-left: 22px;}
.myphone-promo video {width: 100%;}

.lootbox-banner {position: relative; text-align: center;}
.lootbox-banner img {width: 50%; display: block; margin: 20px auto 50px auto; transition: 0.3s all;}
.lootbox-banner:hover img {transform: scale(1.2); transition: 0.3s all;}
.lootbox-link {color: #fff;}

.lootbox-free {
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
	font-family: 'Bender', sans-serif;
    
    font-size: 10pt;
    color: #000;
    padding: 0 15px;
    line-height: 155%;
    z-index: 5;
}
.lootbox-title {position: absolute; bottom: 20px; left: 20px; right: 20px; text-align: center; font-size: 14pt; font-weight: 300;}

.lootbox-items-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.ach-row {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-auto-flow: row dense; margin-bottom: 10px;}
.ach-logo-no {width: 100%; display: block; opacity: .1;}
.ach-logo {width: 100%; display: block; opacity: 1;}
.ach-text {grid-column: span 11; align-content: center; -webkit-align-content: center; height: 100%;}
.ach-name {font-size: 14pt; font-weight: bold;}
.ach-info {font-size: 10pt; margin: 5px 0;}
.ach-btn {grid-column: span 2; align-content: center; text-align: center;}

.transcript-errors {
    text-align: center;
    margin: 30px 0 50px 0;
    color: #fff;
}

.transcript-errors span {
    background: rgba(212,62,62,.5);
    padding: 10px;
}

.transcript-selected {
    text-align: center;
    font-size: 36pt;
    letter-spacing: 10px;
    margin-bottom: 20px;
}

.transcript-selected p {
    font-size: 10pt;
    margin-bottom: -15px;
    letter-spacing: 0;
}

.transcript-buttons {
    text-align: center;
}

.transcriptbtn {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
    aspect-ratio: 1/1;
    font-weight: bold;
    width: 24%;
    margin-bottom: 3px;
    font-size: 16pt;
    transition: 0.3s all;
}

.transcriptbtn:hover {
    transform: scale(0.95);
    background: rgba(255,255,255,.2);
    transition: 0.3s all;
}

.business-head-title {
    font-family: 'Bender', sans-serif;
    
    color: #fff;
}

.openraidmap {background: linear-gradient(45deg, #999 5%, #fff 10%, #ccc 30%, #ddd 50%, #ccc 70%, #fff 80%, #999 95%); border: 1px solid rgba(255,255,255,.2); padding: 20px 20px 20px 30px; letter-spacing: 10px; border-radius: 10px; transition: 0.3s all;}
.openraidmap:hover {transform: scale(1.1); transition: 0.3s all;}
.openraidmap-text-sub {font-family: 'Bender', sans-serif;  font-size: 14pt;color: #0d1b20; text-transform: uppercase;}
.openraidmap-text {font-family: 'Bender', sans-serif;  font-size: 26pt;color: #0d1b20; text-transform: uppercase;}

.prestige-area {background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); color: #fff; padding: 20px; margin-top: 20px;}
.prestige-title {font-family: 'Bender', sans-serif;  text-transform: uppercase; font-size: 16pt; margin-bottom: 5px;}
.prestige-subtitle {margin-top: 20px; font-size: 10pt; font-weight: bold; text-align: left;}
.prestige-row {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense; margin-top: 10px; background: rgba(255,255,255,.1); padding: 10px;}
.prestige-skin-item {grid-column: span 2; grid-row: span 2; background: #0d1b20;}
.prestige-item {position: relative; background: #0d1b20;}
.prestige-item-empty {background: #0d1b20; aspect-ratio: 1/1;}

.op-settings-area {
    z-index: 24;
    width: 1300px;
    position: absolute;
    top: 50px;
    left: calc(50% - 650px);
}

.op-settings-row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;  
    align-content: space-between;
}

.op-settings-line {
    width: 150px;
}

.op-settings-item {
    position: relative;
    width: 100%;
    height: auto;
	aspect-ratio: 1/1;
    margin-bottom: 20px;
    background: rgba(0,0,0,.2);
    border: 1px solid rgba(255,255,255,.2);
}

.op-settings-hp {
    padding-top: calc(50% - 20pt);
    font-size: 40pt;
    text-align: center;
    font-family: 'Bender', sans-serif;
}

.hp-green {color: #77dd77 ;}
.hp-red {color: #FF9A84;}
.hp-yellow {color: #FFFF00;}
.hp-white {color: #FFFFFF;}

.op-settings-image {
    box-sizing: border-box;
    width: 100%;
    padding: 15%;
}

.op-settings-rank {
    width: 150px;
    padding-top: 0;
    padding-left: 0;
    transform: scale(0.75);
}

.op-settings-rank-min {
    width: 45px;
    position: absolute;
    bottom: 0;
    right: 0;
}

.op-settings-no-image {
    width: 100px;
    padding-top: calc(50% - 50px);
    padding-left: calc(50% - 50px);
    opacity: .5;
}

.op-settings-buttons .popup_main {
    display: inline-block;
}

.inv-limit {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    margin-bottom: 20px;
}

.inv-limit-header {
    background: rgba(255,255,255,.1);
    padding: 10px;
    font-size: 10pt;
}

.inv-limit-count {
    padding: 10px;
}

.inv-filter {
    margin-bottom: 10px;
}

.inv-filter button {
    margin-bottom: 10px;
}

.disassembly-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  	gap: 5px;
    grid-auto-flow: row dense;
}

.disassembly-scrap-row {width: 300px; max-width: 80%; margin: 50px auto; text-align: center;}
.disassembly-scrap-info {font-family: 'Bender', sans-serif; color: #fff;}
.disassembly-scrap-bar {background: rgba(255,255,255,.1); width: 100%;}
.disassembly-scrap-bar-line {width: var(--width); height: 20px; background: #fff;}
.disassembly-popup {position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.disassembly-toolbar {display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
#disassembly-bulk-btn[disabled] { opacity:.5; pointer-events:none; }
#disassembly-bulk-btn.is-loading { opacity:.7; pointer-events:none; }
.disassembly-hint { opacity:.7; font-size:.9em; }
.disassembly-card { position:relative; cursor:pointer; }
.disassembly-card .select-badge{
  position:absolute; top:6px; right:6px; width:22px; height:22px; border-radius:6px;
  border:2px solid rgba(255,255,255,.6); background:rgba(0,0,0,.35); backdrop-filter: blur(2px);
}
.disassembly-card.selected { outline:2px solid #56d364; outline-offset:2px; }
.disassembly-card.selected .select-badge{ background:#56d364; border-color:#56d364; }
.disassembly-card.disassembled { opacity:.15; pointer-events:none; }

.pockets-row {
    width: 450px;
    max-width: 100%;
    margin: 0 auto;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.pockets-item {
    aspect-ratio: 1/1;
}

.specoperation-loot-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.loot-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.market-logs-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
    border-bottom: 1px solid rgba(255,255,255,.2);
    padding: 10px;
}
.market-logs-title {grid-column: span 6;}
.market-logs-date, .market-logs-state {opacity: .7; text-align: center;}
.market-logs-price {font-family: 'Bender', sans-serif;  text-align: right}

.market-logs-header-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
    color: #0d1b20;
    background: #d4d4b4;
    padding: 10px;
}
.market-logs-header-title {grid-column: span 6;}
.market-logs-header-date, .market-logs-header-state {text-align: center;}
.market-logs-header-price {text-align: right}

.bpcheck-row {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.rarity0 {
    background: rgba(255,255,255,0);
    border: 1px solid rgba(255,255,255,.1);
    opacity: .3;
}

.rarity1 {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
}

.rarity2 {
    background: rgba(75,105,255,.1);
    border: 1px solid rgba(75,105,255,.2);
}

.rarity3 {
    background: rgba(211,44,230,.1);
    border: 1px solid rgba(211,44,230,.2);
}

.rarity4 {
    background: rgba(254,243,61,.1);
    border: 1px solid rgba(254,243,61,.1);
}

.rarity4 {
    background: rgba(254,243,61,.1);
    border: 1px solid rgba(254,243,61,.1);
}

.rarity5 {
    background: rgba(255,0,0,.1);
    border: 1px solid rgba(255,0,0,.1);
}

.set-item {position: relative; overflow: hidden;}

.spark {
  position: absolute;
  width: 5px;
  height: 5px;
  background-color: yellow;
  border-radius: 50%;
  box-shadow: 0 0 10px yellow, 0 0 20px yellow;
  animation: sparkle 1.5s infinite ease-in-out;
}

@keyframes sparkle {
  0% {
    transform: translate(0, 0) scale(1);
    opacity: 1;
  }
  50% {
    transform: translate(20px, -20px) scale(0.5);
    opacity: 0.5;
  }
  100% {
    transform: translate(40px, -40px) scale(0);
    opacity: 0;
  }
}

.loot-item {
    position: relative;
    cursor: pointer;
    overflow: hidden;
}

.loot-item-empty {
    aspect-ratio: 1/1;
}

.loot-item-plus {
    font-size: 40pt;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: rgba(255,255,255,.75);
}

.loot-item.disassembled {
    opacity: 0.15;
    pointer-events: none;
    transition: opacity 0.3s ease; /* Плавное затемнение */
}

.loot-item.disassembled .popup_body {
    display: none;
}

.loot-skin {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: none 0% 0% / auto repeat scroll padding-box border-box
    rgba(0, 0, 0, 0);
  overflow: hidden;
  -webkit-filter: brightness(1.5);
  -webkit-mask-size: 300% 200%;
  -webkit-mask-image: -webkit-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 0) 60%
  );
  -webkit-transition: -webkit-mask-position;
  -webkit-animation-timing-function: linear;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-filter: brightness(1.5);
  -moz-mask-size: 300% 200%;
  -moz-mask-image: -webkit-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 0) 60%
  );
  -moz-transition: -webkit-mask-position;
  -moz-animation-timing-function: linear;
  -moz-transform: translate3d(0, 0, 0);
  -o-filter: brightness(1.5);
  -o-mask-size: 300% 200%;
  -o-mask-image: -webkit-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 0) 60%
  );
  -o-transition: -webkit-mask-position;
  -o-animation-timing-function: linear;
  -o-transform: translate3d(0, 0, 0);
  filter: brightness(1.5);
  mask-size: 300% 200%;
  mask-image: -webkit-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 0) 60%
  );
  transition: -webkit-mask-position;
  animation-timing-function: linear;
  transform: translate3d(0, 0, 0);
  transition-duration: 3s;
  animation: move 2s ease-out infinite;
}

@keyframes move {
  from {
    -webkit-mask-position: 150% 0px;
    -moz-mask-position: 150% 0px;
    -o-mask-position: 150% 0px;
    mask-position: 150% 0px;
  }
  to {
    -webkit-mask-position: 0% 0px;
    -moz-mask-position: 0% 0px;
    -o-mask-position: 0% 0px;
    mask-position: 0% 0px;
  }
}

.loot-skin-free {
    position: absolute;
    top: 65%;
    left: -150%; 
    background: rgba(255,255,153,.5);
    color: #fff;
    font-weight: bold;
    padding: 10px 15px;
    font-size: 20pt;
    width: 200%;
    transform: rotate(-30deg);
    white-space: nowrap;
    overflow: hidden;
    color: rgba(255,255,255,.7);
}

.loot-skin-free span {
    color: rgba(0,0,0,.2);
}

.loot-theme {
    Box-sizing: border-box;
    aspect-ratio: 16/9;
    overflow: hidden;
}

.loot-edition {
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    width: 55%;
    height: 70%;
}

.loot-edition-title {
    color: #fff;
    text-align: center;
}

.loot-edition-text {
    text-align: center;
    color: #fff;
    font-family: 'Bender', sans-serif;
    font-size: 14pt;
}

.loot-premium {
    overflow: hidden;
    position: relative;
    margin: 7% auto 0 auto;
    width: 35%;
    height: 55%;
}

.loot-pack {
    grid-row: span 3;
    position: relative;
    width: 100%;
    background: var(--background);
    background-size: cover;
    background-position: center center;
}
.loot-pack:after {content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid #494949; pointer-events: none;}
.loot-pack:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 60%;
    width: 100%;
    background: linear-gradient(180deg, rgba(13,27,32,0) 0%, rgba(13,27,32,.2) 30%, rgba(13,27,32,1) 100%);
    z-index: 0;
    pointer-events: none;
}

.loot-cp {grid-row: span 2; padding: 20px; box-shadow: inset 0 0 20px rgba(0,0,0,.25);}

.loot-theme video {width: 100%; display: block;}

.loot-item img {
    line-height: 0px;
    display: block;
}

.loot-state {
    font-size: 8pt;
    font-weight: bold;
    padding: 3px 5px;
    position: absolute;
    bottom: 5px;
    right: 5px;
    background: #d4d4b4;
    color: #000;
}

.loot-state img {
    height: 1.5em;
}

.loot-state-bad {
    font-size: 8pt;
    font-weight: bold;
    padding: 3px 5px;
    position: absolute;
    bottom: 5px;
    right: 5px;
    background: #A52A2A;
    color: #fff;
}

.loot-image {
    width: 100%;
}

.loot-image-buy {
    width: 100%;
    opacity: .5;
}

.loot-cover {
    width: 100px;
    position: absolute;
    top: 20px;
    right: 20px;
}

.loot-cover img {
    width: 100%;
    background: rgba(0,0,0,.05);
    border: 1px solid rgba(0,0,0,.1);
}

.loot-cover video {
    width: 100%;
}

.loot-power {
    margin-top: 10px;
    padding: 10px 0;
    width: 100%;
    text-align: center;
    font-size: 10pt;
}

.setbonus:not(.popup_contain) {width: 300px; max-width: calc(100% - 40px); margin: 0 auto 50px auto; background: rgba(255,255,255,.1); padding: 15px; border-radius: 5px; border: 1px solid rgba(255,255,255,.2); color: #fff;}
.setbonus-open {font-size: 14pt;}
.setbonus-img {width: 1em;}
.loot-set {position: relative; top: -5px; font-size: 10pt; font-weight: bold;}
.loot-set-icon {position: absolute; width: 25px; bottom: 5px; left: 5px;}

.loot-name {
    font-family: "Advent Pro", sans-serif;
  	font-weight: bold;
    font-size: 16pt;
    margin-top: 10px;
    margin-bottom: 10px;
    width: calc(100% - 120px);
}

.loot-info {
    width: calc(100% - 120px);
    padding-bottom: 50px;
}

.loot-info-full {
    width: 100%;
    padding-bottom: 50px;
}

.loot-buttons {
    position: absolute;
    left: 20px;
    bottom: 20px;
}

.loot-buttons button {
    margin-top: 5px;
    margin-right: 5px;
}

.camp-overflow {
    max-width: 1300px;
    overflow: auto;
    margin: 0 auto;
    border: 1px solid rgba(255,255,255,.2);
}

.camp-map {
    position: relative;
    margin: 0 auto;
    width: 100%;
    min-width: 600px;
    aspect-ratio: 1/1;
    background: url(https://theclosedsector.com/templates/Default/images/headers/bg-camp-plan.png);
    background-size: cover;
}

.camp-map a {
    color: #fff;
    font-weight: bold;
}

.camp-map-item {
    position: absolute;
    background: rgba(255,255,255,.25);
    border: 1px solid rgba(255,255,255,.5);
    align-content: center;
    text-align: center;
    transition: 0.3s all;
}

.camp-map-item img {
    width: 50%;
    max-width: 150px;
    opacity: .5;
    transition: 0.3s all;
}

.camp-map-item:hover {
    background: rgba(255,255,255,.4);
    transition: 0.3s all;
}

.camp-map-item:hover img {
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-1 {left: 77%; top: 46.3%; width: 11.5%; aspect-ratio: 1/2.14;}
.camp-map-2 {left: 63%; top: 46.3%; width: 13.8%; aspect-ratio: 1/1.25;}
.camp-map-3 {left: 30.5%; top: 22.7%; width: 13.3%; aspect-ratio: 1/1.8;}
.camp-map-4 {left: 67%; top: 21.5%; width: 13%; aspect-ratio: 1/0.79;}
.camp-map-5 {left: 45.7%; top: 66.3%; width: 11.6%; aspect-ratio: 1/1.25;}
.camp-map-6 {left: 15.3%; top: 11%; width: 14.8%; aspect-ratio: 1/1.3;}
.camp-map-7 {left: 66.5%; top: 32.3%; width: 13.5%; aspect-ratio: 1/0.69;}

.camp-map-1:before, .camp-map-2:before, .camp-map-3:before, .camp-map-4:before, .camp-map-5:before, .camp-map-6:before, .camp-map-7:before  {position: absolute; content: ""; left: calc(100% - 60px); padding: 5px 10px; background: #d4d4b4; color: #000; top: 10%; opacity: 0; transition: 0.3s all;}

.camp-map-1:hover:before {
    position: absolute;
    content: "Оружейный верстак";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-2:hover:before {
    position: absolute;
    content: "Верстак для брони";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-3:hover:before {
    position: absolute;
    content: "Ремонтный гараж";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-4:hover:before {
    position: absolute;
    content: "Верстак для шлемов";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-5:hover:before {
    position: absolute;
    content: "Дешифратор";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-6:hover:before {
    position: absolute;
    content: "Верстак для разборки";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-map-7:hover:before {
    position: absolute;
    content: "Мастерская";
    left: calc(100% + 10px);
    padding: 5px 10px;
    background: #d4d4b4;
    color: #000;
    top: 10%;
    opacity: 1;
    transition: 0.3s all;
}

.camp-row {
    width: 100%;
    position: relative;
    grid-auto-flow: row dense;
}

.camp-item {
    color: #d4d4b4;
    position: relative;
    border: 1px solid rgba(255,255,255,.2);
    display: grid;
	grid-template-columns: 1fr 1fr 1fr;
  	gap: 10px;
    margin-bottom: 20px;
    padding: 20px;
}

.camp-left {
    align-content: center;
}

.camp-right {
    grid-column: span 2;
    align-content: center;
}

.camp-image {
    width: 100%;
    line-height: 0px;
    display: block;
}

.camp-zone:not(.popup_camp) {
    padding: 20px;
    position: relative;
    text-align: center;
}

.popup_camp {
    margin-top: 10px;
}

.camp-name {
    text-align: center;
	font-family: "Advent Pro", sans-serif;
  	font-weight: 400;
    font-size: 20pt;
  	font-style: normal;
}

.camp-name sup {
    font-weight: bold;
    font-size: 9pt;
    padding: 3px 4px;
    border-radius: 5px;
    color: rgba(255,255,255,.75);
}

.camp-rarity {
    padding: 0 3px;
    color: rgba(0,0,0,.75);
    font-weight: bold;
}

.popup_contain {
    overflow-y: auto;
    overflow-x: hidden;
    text-align: left;
    min-height: 170px;
}

.squad-row {
    Box-sizing: border-box;
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.squad-item {
    position: relative;
    background: #d4d4b4;
    color: #000000;
}

.squad-not-item {
	background: rgba(255,255,255,.25);
    position: relative;
}

.squad-item img {
    padding-left: 5px;
    float: left;
    width: 35%;
}

.squad-not-item img {
    padding-left: 5px;
    float: left;
    width: 35%;
    opacity: .7;
}

.squad-new {
    margin-top: 15px;
    font-size: 10pt;
}

.squad-area {
    position: absolute;
    left: 0;
    top: 0;
    padding-left: calc(35% + 15px);
    padding-right: 15px;
}

.squad-rank {
    margin-top: 15px;
    font-size: 8pt;
}

.squad-name {
    margin-top: 5px;
    margin-bottom: 10px;
    font-weight: bold;
}

.raid-list {
    width: 100%;
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr;
  	gap: 1.2%;
    grid-auto-flow: row dense;
}

.raid-row {
    position: relative;
    background-image: var(--background);
    background-size: 100%;
    background-position: center center;
    margin-bottom: 20px;
}

.raid01-row-block {
    position: relative;
    background: url('/templates/Default/images/bg-raid01.jpg');
    background-size: cover;
    background-position: center center;
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

.raid-item {
    background: rgba(0,0,0,.5);
    padding: 60px;
}

.raid-name {
    font-size: 12pt;
    font-weight: bold;
    margin-bottom: 10px;
}

.raid-timer {
    margin-bottom: 10px;
    font-family: 'Bender', sans-serif;
    
    font-size: 20pt;
}

.raid-info {
    position: absolute;
    top: 20px;
    right: 40px;
    text-align: right;
}

.raid-info {
    font-size: 10pt;
}

.raid-info p {
    margin: 10px 0;
}

.raid-info span {
    font-weight: bold;
    font-size: 8pt;
}

.raidinfo-bigtext {color: #fff; font-size: 18pt;}
.raidinfo-text {color: #fff;}

.topraid-item {
   	background-image: var(--background);
    background-size: 100%;
    background-position: center center;
    margin-bottom: 10px;
}

.topraid-in {
    background: rgba(0,0,0,.5);
    display: grid;
	grid-template-columns: 1fr 1fr 1fr;
  	gap: 10px;
    padding: 20px;
    color: #d4d4b4;
    transition: 0.3s all;
}

.topraid-in:hover {
    background: rgba(0,0,0,.6);
    transition: 0.3s all;
}

.topraid-name {
    font-size: 16pt;
    font-weight: bold;
    align-content: center;
}

.topraid-location, .topraid-date {
    font-size: 10pt;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topraid-profit {
    align-content: center;
    text-align: right;
}

.open_popup{
}
.popup_body{
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
    -ms-transition: 300ms;
    transition: 300ms;
    z-index: 999999;
}
.popup_body_show{
  display:block;
  -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
    -ms-transition: 300ms;
    transition: 300ms;
    animation: ani 0.3s forwards;
}

@keyframes ani {
  0% {opacity: 0; -webkit-backdrop-filter: blur(0); backdrop-filter: blur(0);}
  100% {opacity: 1; -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);}
}

.popup_back{
  background: rgba(0,0,0,0.7);
  position: fixed;
  left:0;right:0;top:0;bottom:0;
}
.popup_contain{
  position:relative;
  background: var(--image, #d4d4b4);
  background-size: cover;
  background-position: center center;
  color: #000000;
  width: 1000px;
  max-width:80%;
  margin:100px auto 50px;
  padding: 10px 20px;
  z-index: 11;
}
.popup_close{
    display: none;
  background:red;
  padding:3px 10px 5px;
  position: absolute;
  right:10px;
  top:10px;
  color: #fff;
  border-radius: 50%;
}

.blackjack-row {position: fixed; top: 0; left: 0; bottom: 0; right: 0; text-align: center;}

.blackjack {
    position: relative;
    height: 100vh;
    min-height: 500px;
}

.blackjack-dealer {
    position: absolute;
    width: 400px;
    left: calc(50% - 200px);
    top: 50px;
    background: #d4d4b4;
    color: #000;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-flow: row dense;
    filter: drop-shadow(0 0 0.75rem black);
}

.blackjack-bottom {
    position: absolute;
    width: 400px;
    left: calc(50% - 200px);
    bottom: 50px;
}

.blackjack-player {
    background: #d4d4b4;
    color: #000;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-flow: row dense;
    z-index: 1;
    filter: drop-shadow(0 0 0.75rem black);
}

.blackjack-balance {
    margin-top: 10px;
}

.blackjack-balance img {
    position: relative;
    top: 2px;
    width: 1em;
    height: 1em;
}

.blackjack-photo {
    width: 100%;
    display: block;
}

.blackjack-info {
    grid-column: span 3;
    text-align: center;
    align-content: center;
}

.blackjack-name {
    font-size: 14pt;
    font-weight: bold;
}

.blackjack-area {
    position: absolute;
    top: 35%;
    width: 500px;
    left: calc(50% - 250px);
}

.blackjack-area button {
    margin: 5px;
}

.blackjack-area input {
    margin-bottom: 5px;
}

.blackjack-center {
    text-align: center;
    background: rgba(255,255,255,.1);
    padding: 30px 20px;
}

.blackjack-num {
    font-size: 30pt;
    font-weight: bold;
}

.blackjack-line {
    background-image: linear-gradient(to right, rgba(212,212,180,0), rgba(212,212,180,1), rgba(212,212,180,0));
    border: 0;
    height: 5px;
}

.blackjack-action {
    margin-top: 20px;
}

.blackjack-action p {
    margin-bottom: 20px;
    font-size: 14pt;
}

.blackjack-action button {
    margin: 0 5px;
}

.blackjack-cards {
    width: 100%;
    text-align: center;
    height: 50px;
    overflow: hidden;
    width: 250px;
}

.blackjack-cards img {
    width: 50px;
    margin-right: -20px;
    filter: drop-shadow(0 0 0.75rem black);
}

.blackjack-reward-row {animation: blackjack-reward 5s forwards; z-index: 99; position: fixed; top: 0; left: 0; right: 0; bottom: 0;}

@keyframes blackjack-reward {
    0% {
        opacity: 0; /* Начало: полностью прозрачный */
    }
    10% {
        opacity: 1; /* Появление: полностью видимый */
    }
    50% {
        opacity: 1; /* Полная видимость на 5 секунде */
    }
    60% {
        opacity: 1; /* Начало исчезновения */
    }
    100% {
        opacity: 0; /* Конец: полностью прозрачный */
        pointer-events: none;
    }
}

.liquidation-row {
    position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  	gap: 10px;
    grid-auto-flow: row dense;
}

.liquidation-item {
    position: relative;
    text-align: center;
}

.liquidation-rank {
    font-size: 8pt;
    padding-top: 10px;
}

.liquidation-name {
    padding-bottom: 10px;
    font-size: 10pt;
    font-weight: bold;
}

.liquidation-cover {
    width: 100%;
}

.liquidation-done {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
}

.glitch {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: var(--background);
    background-position: center;
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}

/* ADAPTIVE
----------------------------------------------- */

@media screen and (max-width: 1520px) {
    .topmenu-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
    .lootbox-logs-items {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
}

@media screen and (max-width: 1320px) {
    .lootbox-logs-items {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
    .mainwidth, .chatwidth {width: calc(100% - 20px); padding-left:10px; padding-right: 10px;}
    .op-settings-area {width: calc(100% - 20px); left: 10px;}
    .camp-overflow {width: calc(100% - 20px);}
    .services-newedition-items-loot-row {padding-bottom: 50px;}
}

@media screen and (max-width: 1100px) {
    .lootbox-logs-items {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
    .services-newedition-row {grid-template-columns: 1fr; gap: 0;}
    .services-newedition-cover {grid-column: span 1;}
    .services-newedition-cover img {width: 100%;}
    .services-newedition-info-column {grid-column: span 1;}
    .services-newedition-buy {position: relative; top: 0; right: 0; text-align: center; margin-bottom: 30px;}
    .services-newedition-more {display: block; position: relative; width: 100%; height: auto; opacity: 1; text-align: center; font-size: 50pt; color: rgba(255,255,255,.5); text-align: center;}
    .services-newedition-items-loot-row {padding-bottom: 0;}
    .services-newedition-upgrade {position: relative; top: 0; text-align: center; background: #fff; color: #000; padding: 10px 20px; border-radius: 5px; margin-bottom: 10px;}
    .services-newedition-upgrade span {background: transparent; color: #000;}
    .services-newedition-info-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
    .services-newedition-skins-row {position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
    .services-newedition-themes-row {position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
    .services-newedition-items-loot-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
    .services-premium-cover img, .services-newglobalrank-cover img {width: 60%;}
    
    .topmenu-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
    
    .squad-row {grid-template-columns: repeat(2, 1fr);}
    .op-short-stat {width: calc(100% - 24px); padding: 52px 12px 0 12px; font-size: 10pt;}
    .op-short-stat-right {margin: 52px 12px 0 12px; font-size: 10pt;}
    .op-short-stat-hp {top: -2px; font-size: 8pt;}
    .market-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 0;}
    .market-img {grid-column: span 2; background: rgba(255,255,255,.1);}
    .market-name {grid-column: span 5; padding-left: 10px;  background: rgba(255,255,255,.1); }
    .market-seller {padding: 20px; grid-column: span 5;}
    .market-price {grid-column: span 5; padding: 20px; text-align: right;}
    .market-buy {order: 4; grid-column: span 3;  background: rgba(255,255,255,.1);}
    
    .battlepass-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
    
    .quester-area {aspect-ratio: 16/9;}
    
    .liquidation-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
    .services-offers-row {grid-template-columns: 1fr 1fr;}
}

@media screen and (max-width: 959px) {  
    .lootbox-logs-items {display: block;}
    .lootbox-logs-item:not(.lootbox-logs-hide) {aspect-ratio: 1/1; display: inline-block;}
    .lootbox-logs-item img {top: 50%; left: 50%; transform: translate(-50%,-50%);}
    .lootbox-logs-item-text {display: none;}
    .lootbox-logs-item-title span {display: none;}
    
    .base-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
	.base-content {grid-column: span 3;}
    
    .loot-set-icon {width: 15px;}
    
    .inraidmap-area {aspect-ratio: 1/1;}
    .inraidmap {top: 0;}
    .inraidmap-location {transform: scale(0.5);}
    .inraidmap-op img {transform: scale(0.75);}
    .inraidmap-op:after {left: 45px; top: 8px; font-size: 8pt;}
    .inraidmap-op:before {left: 45px; top: 18px;}
    
    .warzone-rank {margin: 0 auto 20px auto;}
    .warzone-header-info {padding-bottom: 100px;}
    .warzone-header-row {grid-template-columns: 1fr; text-align: center; width: 100%; gap: 0; padding-top: 0; max-width: 100%;}
    .warzone-header-logo {display: none;}
    .warzone-header-main {position: relative; margin-top: -20px; text-align: center;}
    .warzone-header-score {position: relative; margin-top: 70px; margin-bottom: 50px; text-align: center;}
    .warzone-header-title {font-size: 18pt;}
    .warzone-next-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; width: 100%; max-width: 100%;}
    
    .market-logs-row, .market-logs-header-row {width: calc(100% - 20px); grid-template-columns: 1fr 1fr 1fr;}
    .market-logs-title, .market-logs-header-title {display: none;}
    .market-logs-date, .market-logs-header-date {text-align: left; transform: translate(0, 0)}
    
    .bg-lootbox {aspect-ratio: 3/4;}
    
    .topmenu-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
    
    .prestige-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
    .camp-left, .camp-right {grid-column: span 3; text-align: center;}
    
    .underline {height: 150px;}
    
    .lootboxwidth {width: calc(100% - 20px); padding-left:10px; padding-right: 10px;}
    .bg-main, .bg-main-newyear {padding-top: 350px; padding-bottom: 100px; z-index: 10;}
    .bg-blur, .bg-video {padding-top: 0; z-index: 10; height: 300px;}
    .bg-user video, .bg-user-ultimate video, .bg-user-ultimate_ghotic video {width: 150%; transform: translate(-50%, 0);}
    .op-full-blur {height: 300px;}
    .profile-subtitle img {top: -1px;}
    .profile-subtitle {font-size: 10pt; margin-bottom: -5px;}
    .profile-title {top: 40px; font-size: 20pt;}
    .profile-op1 {width: 250px; position: absolute; left: calc(50% - 125px); bottom: 0;}
	.profile-op2 {width: 200px; position: absolute; left: calc(50% - 225px); bottom: 0; z-index: -1;}
	.profile-op3 {width: 200px; position: absolute; left: calc(50% + 25px); bottom: 0; z-index: -1;}
    .profile-op-glith1 {position: relative; width: 250px; height: 250px;}
	.profile-op-glith2 {position: relative; width: 200px; height: 200px;}
	.profile-op-glith3 {position: relative; width: 200px; height: 200px;}
    .profile-op-left {margin-left: 50px;}
    .profile-row, .profile-row-op {grid-template-columns: 1fr 1fr;}
    #op-empty {display: none;}
    #op-morality {grid-column: span 2;}
    .squad-row {grid-template-columns: repeat(1, 1fr);}
    .loot-row, .lootbox-items-row, .bpcheck-row {	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px;}
    .services-newedition-info-row {grid-template-columns: 1fr 1fr;}
    .services-newedition-skins-row {position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; grid-auto-flow: row dense;}
    .services-newedition-themes-row {position: relative; display: grid; grid-template-columns: 1fr; gap: 10px; grid-auto-flow: row dense;}
    .services-newedition-items-loot-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
    .collector-row {grid-template-columns: 1fr; gap: 10px;}
    .specoperation-loot-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
    .disassembly-row {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
    
    .transcriptbtn {width: 19.5%;}
    
    .warzone-logs {padding: 30px;}
    .warzone-logs-new {width: 150px; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); opacity: .5;}
    .warzone-logs-old {width: 150px; position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); opacity: .5;}
    
    .liquidation-row {grid-template-columns: 1fr 1fr 1fr;}
    .event-card-item {padding-top: 200px;}
    
    .battlepass-premium-banner {width: 100%; grid-template-columns: 1fr;}
    .battlepass-premium-banner-text {text-align: center;}
    
}

@media screen and (max-width: 760px) {
    .op-short-footer-hp {font-size: 7pt;}
    .store-timer-offer-empty {display: none;}
    
    .lootbox-logs-row {width: 85%;}
    .lootbox-logs-item img {max-width: 100%;}
    .lootbox-logs-items {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
    .services-offers-row {grid-template-columns: 1fr;}
    .loot-pack { aspect-ratio: 9/14;}
    .loot-cp {grid-row: span 1;}
	.services-skins-row {grid-template-columns: 1fr;}
    .services-big-item-cp {grid-row: span 1; grid-column: span 1; aspect-ratio: auto;} 
    .services-big-item {grid-row: span 1; grid-column: span 1; aspect-ratio: 16/9;} 
    .services-big-item video {position: relative; min-width: 100%;}
    .services-big-item .loot-skin {position: relative; top: 0; left: 0; width: 100%;}
    .services-big-item .loot-bg-image {width: 100%;}
    
    .loot-edition {width: 50%; height: 60%;}
    .base-row {grid-template-columns: 1fr;}
	.base-content {grid-column: span 1;}
    
    .bg-reset-row {top: 65px; right: 20px; bottom: auto;}
    .bg-sound-row {right: 20px; top: 20px; bottom: auto;}
    
    .seasontop-blur {aspect-ratio: 16/12; height: auto; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);}
    .seasontop-rank {position: absolute; bottom: -10px; left: 0; right: 0; rtt}
    
    .globalmap-area {width: 100%; height: calc(100vh - 80px);}
    .globalmap-btn {position: fixed; bottom: 120px; width: 100%; text-align: center; z-index: 120;}
    
    .battlepass-row {grid-template-columns: 1fr 1fr 1fr;}
    
    .top100p {padding-top: 50px;}
    .topmenu-row {display: none;}
    .bottom-row {display: block; position: fixed; background: #d4d4b4; border-top: 1px solid #0d1b20; z-index: 999999; bottom: 0; left: 0; width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-auto-flow: row dense;}
    .bottom-row div {text-align: center; padding: 20px; color: #0d1b20;}
    .bottom-row .bx {font-size: 16pt;}
    .bottom-snow {pointer-events: none; position: absolute; width: calc(100% + 20px); left: -10px; top: -30px; filter: drop-shadow(15px 5px 10px rgba(0,0,0,.35));}
    .bottom-snow-line {display: none;}
    .bottommenu-fixed-info {display: block;}
    .close-button {position: relative; top: 0; right: 0; transform: translate(0, 0); font-size: 10pt; background: rgba(0,0,0,.15); padding: 5px 8px; border-radius: 5px;}
    
    .business-head-title {font-size: 20pt; text-align: center;}
    .business-balance {position: relative; top: -20px; right: auto; text-align: center; margin-bottom: 30px;}
    .business-row, .business-user-row {grid-template-columns: 1fr;}
    
    .loot-row, .lootbox-items-row, .bpcheck-row {grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; grid-auto-flow: row;}
    .specoperation-loot-row {grid-template-columns: 1fr 1fr;}
    .disassembly-row {grid-template-columns: 1fr 1fr 1fr 1fr;}
    .services-edition-row {grid-template-columns: 1fr 1fr;}
    .services-edition-row div:last-child {grid-column: span 2;}
    .services-upbalance-row {grid-template-columns: 1fr;}
    .store-timer-offer-desc {-webkit-line-clamp: 3;}
    .store-timer-offer-cover-row {width: 30%;}
    .store-timer-offer-info {left: calc(30% + 30px); top: 25px;}
    .seasontop-more, .seasontop-more-me {grid-column: span 1;}
    .fraction-row {width: 500%; padding-right: 10px;}
    .raid-info {margin-top: 40px; position: relative; top: auto; right: auto; text-align: left;}
    .camp-row {display: block;}
    .camp-item {margin-bottom: 20px;}
    .op-settings-line {width: 75px;}
    .op-settings-item {margin-bottom: 10px;}
    .op-settings-hp {padding-top: calc(50% - 6pt);font-size: 12pt;text-align: center;font-weight: bold;}
    .op-settings-rank {width: 75px; padding-top: 0;padding-left: 0;}
    .op-settings-rank-min {width: 25px;}
    .op-settings-no-image {width: 60px; padding-top: calc(50% - 30px); padding-left: calc(50% - 30px);}
    .global-line-in {grid-template-columns: 1fr;}
    
    .ach-row {grid-template-columns: 1fr 1fr 1fr 1fr;margin-bottom: 10px; padding: 10px;}
    .ach-text {align-content: center; grid-column: span 3; padding-right: 10px;}
    .ach-btn {grid-column: span 4; align-content: center; text-align: center; background: rgba(255,255,255,.1);}
    .ach-btn button {margin: 10px 0 10px 0;}
    .ach-received {padding: 10px 0 10px 0;}
    
    .loot-cover {width: 22%; height: auto;}
    .loot-buttons {width: 70%; position: relative; margin: 15px 0 20px 0; left: 0; bottom: 0;}
    .loot-name, .loot-info {width: 70%;}
    
    .blackjack-dealer, .blackjack-bottom, .blackjack-area {width: 70%; left: 15%;}
    
    .quester-area {aspect-ratio: 2/3;}
    
    .topraid-in {grid-template-columns: 1fr 1fr;}
    .topraid-name {grid-column: span 2;}
    
    .transcriptbtn {width: 32%; margin-bottom: 5px;}
    
    .event-card-fractions {padding-top: 250px;}
    
    .liquidation-row {grid-template-columns: 1fr 1fr 1fr;}
}

/* Блокировка горизонтальной ориентации для смартфонов */
@media screen and (orientation: landscape) and (max-width: 760px) {
    html, body {
        height: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden; /* убираем прокрутку */
    }

    body > * {
        display: none !important; /* скрываем всё содержимое */
    }

    body::before {
        content: "Переверните смартфон.";
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        color: #fff;
    }
}