/* mystyle.css — стили, вынесенные из .tpl; общие правки и мобильная адаптация */

/* ===== footer.tpl ===== */
/* Минимальный стиль неоновой полукруглой рамки */
	.neon-label{
    position:absolute;left:50%;top:62%;transform:translate(-50%,-50%);
    padding:8px 16px;border-radius:999px;color:#eaffff;
    background:rgba(0,0,0,0.18);font-weight:600;
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    text-shadow:0 0 6px rgba(255,255,255,0.7),0 0 14px rgba(124,243,255,0.12);
	margin-top: 5px;
  }
  
  /* Локальная палитра для футера */
:root{
  --tmf-bg: #070912;         /* основной темный фон */
  --tmf-panel: #0c1016;      /* фон панели */
  --tmf-text: #dbefff;       /* основной текст */
  --tmf-muted: #8e9da6;      /* приглушённый текст */
  --tmf-neon-cyan: #00e6ff;  /* дополнительный неон */
  --tmf-love: #ff3fbf;       /* неоновая "любовь" (акцент) */
  --tmf-border: rgba(138,43,226,0.06);
}

/* ===== Footer ===== */
.tm-footer{
  position: relative;
  z-index: 1;
  padding: 25px 25px;
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.08)), var(--tmf-bg);
  color: var(--tmf-text);
  border-top: 1px solid rgba(255,255,255,0.02);
  box-shadow: 0 -6px 30px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.02);
  overflow: hidden;
  margin-bottom: 20px;
}

/* тонкая неоновая полоса сверху футера */
.tm-footer::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, transparent 5%, var(--tmf-neon-cyan) 25%, var(--tmf-love) 50%, var(--tmf-neon-cyan) 75%, transparent 95%);
  filter: blur(8px);
  opacity: 0.95;
  transform: translateY(-2px);
  pointer-events: none;
  mix-blend-mode: screen;
}

/* декоративное сердечко справа снизу (плавающий неоновый элемент любви) */
.tm-footer::after{
  content: "♥";
  position: absolute;
  right: 22px;
  bottom: 18px;
  font-size: 28px;
  line-height: 1;
  color: var(--tmf-love);
  text-shadow:
    0 0 8px rgba(255,63,191,0.20),
    0 0 22px rgba(255,63,191,0.10),
    0 6px 18px rgba(0,0,0,0.6);
  transform-origin: center;
  animation: tmf-heartbeat 1.8s ease-in-out infinite;
  pointer-events: none;
  opacity: 0.98;
}

/* Ссылки и текст внутри футера */
.tm-footer,
.tm-footer a,
.tm-footer p,
.tm-footer li,
.tm-footer .tm-social-icons {
  color: var(--tmf-text);
}
.tm-footer a {
  color: var(--tmf-neon-cyan);
  text-decoration: none;
  transition: color .12s ease, text-shadow .12s ease, transform .12s ease;
}
.tm-footer a:hover {
  color: var(--tmf-love);
  text-shadow: 0 0 12px rgba(255,63,191,0.14);
  transform: translateY(-1px);
}

/* Социальные иконки — неоновая подсветка на hover */
.tm-footer .tm-social-icons,
.tm-footer .tm-socialbuttons {
  z-index: 2;
}
.tm-footer .tm-social-icons > li > a,
.tm-footer .tm-socialbuttons > div > a{
  display:inline-block;
  color: var(--tmf-muted);
  background: transparent;
  border-radius: 4px;
  padding: 6px;
  transition: color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.tm-footer .tm-social-icons > li > a:hover,
.tm-footer .tm-socialbuttons > div > a:hover {
  color: #fff;
  box-shadow:
    0 6px 24px rgba(0,230,255,0.06),
    0 0 28px rgba(255,63,191,0.06);
  transform: translateY(-3px);
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.06));
}

/* Back-to-top scroller — подстраиваем под темный стиль */
.tm-totop-scroller{
  color: var(--tmf-text);
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.03);
  box-shadow: 0 6px 18px rgba(0,0,0,0.6);
  border-radius: 4px;
}
.tm-totop-scroller:hover,
.tm-totop-scroller:focus{
  color: #fff;
  box-shadow:
    0 8px 28px rgba(0,230,255,0.08),
    0 0 22px rgba(255,63,191,0.06);
  transform: translateY(-2px);
}

/* Панели внутри футера (если используются columns) */
.tm-footer .uk-panel-box,
.tm-footer .uk-panel{
  background: transparent;
  border: none;
  box-shadow: none;
}

/* Лёгкий неоновый акцент для разделительных линий внутри футера */
.tm-footer hr,
.tm-footer .divider, .tm-footer .tm-footer-divider{
  border: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.04), rgba(255,255,255,0.02));
  margin: 12px 0;
}

/* Мобильная подгонка */
@media (max-width: 767px){
  .tm-footer{
    padding: 28px 18px;
  }
  .tm-footer::after{
    right: 12px;
    bottom: 12px;
    font-size: 22px;
  }
}

.rul_down
{


	margin-top: 17px;
	}
/* ===== main.tpl ===== */
/* Простой эффект лёгкого увеличения при наведении и при фокусе */
.zoom-on-hover {
  display: inline-block; /* чтобы трансформация не ломала поток */
  transform-origin: center center;
  transition: transform 220ms cubic-bezier(.2,.9,.2,1), filter 220ms;
  will-change: transform;
}

/* Если класс применяется к контейнеру (рекомендуется) — картинка внутри масштабируется */
.zoom-on-hover img {
  display: block;
  width: 100%;
  height: auto;
}

/* Эффект при наведении / фокусе (клавиатурная доступность) */
.zoom-on-hover:hover,
.zoom-on-hover:focus,
.zoom-on-hover:focus-within {
  transform: scale(1.06);
  filter: saturate(1.04);
}

/* Если класс применяете прямо к <img>, сделайте её фокусируемой через tabindex="0" */
.zoom-on-hover.img-focusable:focus {
  outline: none; /* по желанию: можно оставить outline для видимости фокуса */
}

/* Уважение настроек пользователя по уменьшению анимации */
@media (prefers-reduced-motion: reduce) {
  .zoom-on-hover,
  .zoom-on-hover img {
    transition: none;
    transform: none !important;
  }
}

.zoom-on-hover img {
  user-drag: none;
  -webkit-user-drag: none;
  user-select: none;
}

/* Контейнер для анимированного текста */
.boost-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

/* Рамка с анимацией */
.boost-box {
    padding: 12px 20px;  /* Уменьшили отступы */
    background-color: #121212;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 179, 179, 0.3); /* Меньшее неоновое свечение */
    border: 2px solid #00b3b3; /* Бирюзовая рамка */
    position: relative;
    animation: borderAnimation 2s infinite alternate;
}

/* Текст внутри рамки */
.boost-text {
    font-size: 14px; /* Меньший размер текста */
    color: #fff;  /* Белый цвет текста */
    font-weight: 500;
    text-align: center;
    line-height: 1.4;
    margin: 0;
}

/* Выделение текста "free boost!" */
.free-boost {
    color: #00b3b3; /* Цвет для выделения free boost в неоново-бирюзовом оттенке */
    font-weight: bold;
    font-size: 16px; /* Уменьшили размер шрифта для free boost */
}

.main-navbar {
border: 1px solid rgba(0, 230, 255, 0.06);
}

/* Анимация для рамки */
@keyframes borderAnimation {
    0% {
        border-color: #00b3b3;
        transform: scale(1);
    }
    50% {
        border-color: #00b3b3;
        transform: scale(1.03); /* Меньше увеличение */
    }
    100% {
        border-color: #00b3b3;
        transform: scale(1);
    }
	.manual-text {
    font-size: 12px;
    font-weight: normal;
    opacity: 0.7;
	text-align: right;
}
}

.header-inner {
    padding-top: 19px; /* здесь регулируешь отступ сверху */
}
/* ===== menu.tpl ===== */
.tm-corr {
border: 1px solid rgba(0, 230, 255, 0.06);
border-radius: 0 0 5px 5px;
}
/* ===== menu_down.tpl ===== */
.lb-submenu {
background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
    font-size: 13px;
}

.lb-submenu-list {
    display: flex;
    gap: 15px;
    margin: 0;
    padding: 6px 20px;
    list-style: none;
}

.lb-submenu-list li a {
    color: #8f96a3;
    text-decoration: none;
    transition: color 0.2s ease;
}

.lb-submenu-list li a:hover {
    color: #ff3fbf; /* фирменный розово-красный акцент */
}

.lb-submenu-list li:not(:last-child)::after {
    content: "|";
    margin-left: 10px;
    color: #2a2f3a; /* очень приглушённый, почти незаметный */
    font-weight: 300;
}
/* ===== speedbar.tpl ===== */
:root {
    --bg: #0b0d10;
    --panel: #0e1214;
    --muted: #8aa9ae;
    --accent: #09c7d7;
    --accent-ink: rgba(9,199,215,0.14);
    --glass: rgba(255,255,255,0.02);
}

.tm-toolbar--neon { padding: 8px 0; font-family: "Helvetica Neue", Arial, sans-serif; color: var(--muted); }
.toolbar-buttons { display:flex; gap:10px; margin-right:13px; }

.user-toggle{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(180deg, rgba(12,14,16,0.56), rgba(6,8,10,0.55));
    border: 1px solid rgba(255,255,255,0.03);
    padding: 6px 10px;
    border-radius: 4px;
    color: var(--muted);
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.6), inset 0 -1px 0 rgba(255,255,255,0.02);
    transition: transform .12s ease, box-shadow .12s ease, color .12s ease;
    text-decoration:none;
}
.user-toggle:hover { transform:translateY(-1px); }
.user-toggle:focus-visible { box-shadow:0 0 0 3px var(--accent-ink); }

.icon-heart { color:#ff3fa5; filter: drop-shadow(0 1px 6px rgba(255,63,165,0.06)); }

@media (max-width:640px){
    .toolbar-buttons { gap:6px; }
    .user-toggle { padding:6px 8px; }
}

.toolbar-buttons {
    display: flex;
    gap: 14px;
    margin-right: 13px;
    align-items: center;   /* вертикальное центрирование */
    /* margin-top: 4px;       /* лёгкий сдвиг вниз */ */
}

.user-toggle{
    display: inline-flex;
    align-items: center;
    gap: 8px;

    background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);

    border: 1px solid rgba(255,255,255,0.06); /* чуть заметнее */
    padding: 11px 19px;
    font-size: 17px;
    border-radius: 8px;

    color: var(--muted);
    text-decoration: none;

    box-shadow:
        0 4px 12px rgba(0,0,0,0.65),
        inset 0 1px 0 rgba(255,255,255,0.03);

    transition:
        transform .12s ease,
        box-shadow .12s ease,
        color .12s ease;
}

.user-toggle:hover {
    transform: translateY(-1px);
    box-shadow:
        0 6px 16px rgba(0,0,0,0.7),
        0 0 0 1px rgba(9,199,215,0.15);
		  background: linear-gradient(90deg, rgba(0,230,255,0.06), rgba(255,63,191,0.04));
  color: var(--text);

}

.user-toggle,
.user-toggle:hover,
.user-toggle:focus,
.user-toggle:active {
    text-decoration: none;
}
/* ===== modules/cabinet/cabinet_main.tpl ===== */
.balance-wrapper{
    display:flex;
    justify-content:center;
    margin-bottom:30px;
}

.balance-card{
    background:#12161f;
    border-radius:12px;
    padding:18px 30px;
    border:1px solid #1f2530;
    box-shadow:0 0 20px rgba(0,0,0,0.45);
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    max-width:900px;

    -webkit-mask-image: linear-gradient(
        60deg,
        black 25%,
        rgba(0,0,0,0.4) 40%,
        rgba(0,0,0,0.15) 60%,
        transparent 90%
    );
    mask-image: linear-gradient(
        60deg,
        black 25%,
        rgba(0,0,0,0.4) 40%,
        rgba(0,0,0,0.15) 60%,
        transparent 90%
    );
}

.balance-left{
    display:flex;
    flex-direction:column;
}

.balance-title{
    color:#8f9bb3;
    font-size:13px;
    margin-bottom:5px;
    text-transform:uppercase;
    letter-spacing:1px;
}

.balance-line{
    display:flex;
    align-items:center;
    gap:12px;
}

.balance-amount{
    font-size:28px;
    font-weight:700;
    color:#ffffff;
}

.balance-amount span{
    font-size:16px;
    color:#6c8cff;
    margin-left:6px;
}

/* Зеленый плюс для пополнения */
.balance-plus{
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background:#27ae60;
    color:#fff;
    font-size:18px;
    font-weight:bold;
    text-decoration:none;
    transition:0.2s;
}

.balance-plus:hover{
    background:#2ecc71;
    transform:scale(1.1);
    color:#fff;
}

.balance-buttons{
    display:flex;
    gap:12px;
}

.add-server-title{
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:1px;
    color:#8f9bb3;
    margin-bottom:15px;
    text-align:left;
}
/* ===== modules/cabinet/cabinet_menu.tpl ===== */
.lb-panel{
    background: linear-gradient(180deg,#0b0f16 0%, #0e131c 100%);
    padding:14px;
    font-family:"Inter", Arial, Helvetica, sans-serif;
    box-shadow: 0 5px 15px rgba(0,0,0,.3);
}

/* Список */
ul.lb-list{ 
    list-style:none; 
    margin:0; 
    padding:6px; 
    border-radius:8px;
}

/* Пункт меню */
li.lb-item{ 
    display:block; 
    padding:11px 14px; 
    border-radius:6px; 
    color:#cfd6dd; 
    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease,
        color .2s ease; 
    margin-bottom:6px; 
    font-size:14px;
    position:relative;
    overflow:hidden;
    background: rgba(255,255,255,0.01); /* лёгкий матовый фон */
}

li.lb-item a{ 
    color:inherit; 
    text-decoration:none; 
    display:block; 
    width:100%; 
}

/* Hover */
li.lb-item:hover{ 
    background: rgba(255,255,255,0.025);
    color:#ffffff;
    transform: translateX(2px);
}

/* Active */
li.lb-item.active{ 
    background: rgba(255,255,255,0.045);
    color:#ffffff;
}

/* Линия слева для активного пункта */
li.lb-item.active::before{ 
    content:""; 
    position:absolute; 
    left:0; 
    top:6px; 
    bottom:6px; 
    width:3px; 
    background: rgba(255,255,255,0.35);
    border-radius:2px;
}

/* Мета */
.lb-meta{ 
    font-size:12px; 
    color:rgba(255,255,255,0.35); 
    margin-left:8px; 
}

/* Mobile */
@media (max-width:720px){ 
    .lb-panel{ padding:10px; } 
    li.lb-item{ font-size:13px; }
}

/* ===== Icons ===== */

li.lb-item a{
    position:relative;
    padding-left:36px;
}

/* базовая иконка */
li.lb-item a::before{
    content:"";
    position:absolute;
    left:10px;
    top:50%;
    transform:translateY(-50%);
    width:18px;
    height:18px;
    background-color:currentColor;
    opacity:.6; /* немного прозрачности для мягкости */

    -webkit-mask-size:contain;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    mask-size:contain;
    mask-repeat:no-repeat;
    mask-position:center;

    transition:
        transform .25s ease,
        filter .25s ease,
        opacity .25s ease;
}

/* hover icon */
li.lb-item:hover a::before{
    transform:translateY(-50%) translateX(2px) scale(1.05);
    filter: drop-shadow(0 0 4px rgba(150,150,150,.3));
    opacity:.7;
}

/* active icon */
li.lb-item.active a::before{
    filter: drop-shadow(0 0 6px rgba(160,160,160,.5));
}

/* keyframes (убрал пульсацию для спокойного вида) */
@keyframes lb-icon-pulse{
    0%, 50%, 100%{
        transform:translateY(-50%) scale(1);
        filter: drop-shadow(0 0 0 rgba(0,0,0,0));
    }
}

/* ===== Оригинальные маски иконок (восстановлены как были) ===== */

/* Кабинет */
li.lb-item.cabinet a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3 2 9v12h7v-6h6v6h7V9z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3 2 9v12h7v-6h6v6h7V9z'/%3E%3C/svg%3E");
}

/* Услуги */
li.lb-item.services a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm10 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2ZM7.2 14h9.9c.8 0 1.5-.5 1.8-1.2l3-6.5-1.8-.8-3 6.5H8L5.6 4H2v2h2l3.6 8z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm10 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2ZM7.2 14h9.9c.8 0 1.5-.5 1.8-1.2l3-6.5-1.8-.8-3 6.5H8L5.6 4H2v2h2l3.6 8z'/%3E%3C/svg%3E");
}

/* Счета */
li.lb-item.invoices a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 2h9l5 5v15a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm8 1.5V8h4.5'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 2h9l5 5v15a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm8 1.5V8h4.5'/%3E%3C/svg%3E");
}

/* Скидки */
li.lb-item.discounts a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 2 7v10l10 5 10-5V7z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 2 7v10l10 5 10-5V7z'/%3E%3C/svg%3E");
}

/* Логи */
li.lb-item.logs a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16v4H4zm0 6h16v4H4zm0 6h10v4H4z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16v4H4zm0 6h16v4H4zm0 6h10v4H4z'/%3E%3C/svg%3E");
}

/* Настройки */
li.lb-item.settings a::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm9.4 4a7.4 7.4 0 0 0-.1-1l2-1.6-2-3.4-2.4 1a7.8 7.8 0 0 0-1.7-1L16 2h-4l-.8 2.9a7.8 7.8 0 0 0-1.7 1l-2.4-1-2 3.4 2 1.6a7.4 7.4 0 0 0 0 2l-2 1.6 2 3.4 2.4-1a7.8 7.8 0 0 0 1.7 1L12 22h4l.8-2.9a7.8 7.8 0 0 0 1.7-1l2.4 1 2-3.4-2-1.6c.1-.3.1-.6.1-1Z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm9.4 4a7.4 7.4 0 0 0-.1-1l2-1.6-2-3.4-2.4 1a7.8 7.8 0 0 0-1.7-1L16 2h-4l-.8 2.9a7.8 7.8 0 0 0-1.7 1l-2.4-1-2 3.4 2 1.6a7.4 7.4 0 0 0 0 2l-2 1.6 2 3.4 2.4-1a7.8 7.8 0 0 0 1.7 1L12 22h4l.8-2.9a7.8 7.8 0 0 0 1.7-1l2.4 1 2-3.4-2-1.6c.1-.3.1-.6.1-1Z'/%3E%3C/svg%3E");
}

/* ===== Цвета для иконок меню (как были) ===== */

/* Кабинет */
li.lb-item.cabinet a::before{
    background-color: #4CAF50; /* зелёный */
}

/* Услуги */
li.lb-item.services a::before{
    background-color: #2196F3; /* синий */
}

/* Счета */
li.lb-item.invoices a::before{
    background-color: #FF9800; /* оранжевый */
}

/* Скидки */
li.lb-item.discounts a::before{
    background-color: #E91E63; /* розовый */
}

/* Логи */
li.lb-item.logs a::before{
    background-color: #9C27B0; /* фиолетовый */
}

/* Настройки */
li.lb-item.settings a::before{
    background-color: #607D8B; /* серо-синий */
}

/* hover icon */
li.lb-item:hover a::before{
    transform:translateY(-50%) translateX(3px) scale(1.08);
    filter:drop-shadow(0 0 8px rgba(139,92,246,.55));
    opacity:1;
}

/* active icon */
li.lb-item.active a::before{
    animation:lb-icon-pulse 2.6s ease-in-out infinite;
    filter:drop-shadow(0 0 12px rgba(139,92,246,.85));
}

/* keyframes */
@keyframes lb-icon-pulse{
    0%{
        filter:drop-shadow(0 0 6px rgba(139,92,246,.55));
        transform:translateY(-50%) scale(1);
    }
    50%{
        filter:drop-shadow(0 0 14px rgba(139,92,246,1));
        transform:translateY(-50%) scale(1.12);
    }
    100%{
        filter:drop-shadow(0 0 6px rgba(139,92,246,.55));
        transform:translateY(-50%) scale(1);
    }
}

/* ===== New: action buttons (Добавить сервер / Пополнить баланс) ===== */

/* Container for the two action links */
.actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

/* Shared button style - subtle, non-intrusive */
.action-btn{
  display: block;
  position: relative;
  padding: 8px 12px 8px 40px;
  border-radius: 8px;
  color: #d6dde4;
  background: rgba(255,255,255,0.02);
  text-decoration: none;
  font-size: 14px;
  line-height: 1;
  transition: background .18s ease, transform .18s ease, color .18s ease;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.02);
}

/* subtle icon via mask - placed to the left */
.action-btn::before{
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  opacity: .65;
  background-color: currentColor; /* color will be overridden per class */
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  transition: transform .18s ease, opacity .18s ease, filter .18s ease;
  filter: none;
}

/* Hover: gentle lift and slightly brighter */
.action-btn:hover{
  background: rgba(255,255,255,0.035);
  transform: translateX(2px);
  color: #ffffff;
}
.action-btn:hover::before{
  transform: translateY(-50%) translateX(2px) scale(1.06);
  opacity: .85;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.45));
}

/* Add-server: simple plus */
.action-btn.add-server{
  color: #BFE7C7;
  border-color: rgba(191,231,199,0.06);
}

.action-btn.add-server::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 5h2v14h-2V5zm-6 6h14v2H5v-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 5h2v14h-2V5zm-6 6h14v2H5v-2z'/%3E%3C/svg%3E");
  background-color: rgba(75, 182, 110, 0.95);
  opacity: 1;
}


/* Top-up: clearer ruble symbol */
.action-btn.topup{
  color: #BEEAF0;
  border-color: rgba(190,234,240,0.06);
}

.action-btn.topup::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4h7a4 4 0 1 1 0 8H9v2h6v2H9v4H7V4zm2 2v4h5a2 2 0 1 0 0-4H9z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 4h7a4 4 0 1 1 0 8H9v2h6v2H9v4H7V4zm2 2v4h5a2 2 0 1 0 0-4H9z'/%3E%3C/svg%3E");
  background-color: rgba(45, 160, 190, 1);
  opacity: 1;
}

/* Make sure icons stay subtle on small screens */
@media (max-width:720px){
  .action-btn{ padding-left:44px; font-size:13px; }
  .action-btn::before{ width:16px; height:16px; left:10px; }
}
/* ===== modules/cabinet_balance/balance_main.tpl ===== */
.balance-wrapper{
display:flex;
justify-content:center;
margin-bottom:30px;
}/* duplicate removed: .balance-card *//* duplicate removed: .balance-left *//* duplicate removed: .balance-title *//* duplicate removed: .balance-line *//* duplicate removed: .balance-amount *//* duplicate removed: .balance-amount span */
/* ===== modules/cabinet_invoices/cabinet_invoices.tpl ===== */
.balance-wrapper{
display:flex;
justify-content:center;
margin-bottom:30px;
}/* duplicate removed: .balance-card *//* duplicate removed: .balance-left *//* duplicate removed: .balance-title *//* duplicate removed: .balance-line *//* duplicate removed: .balance-amount *//* duplicate removed: .balance-amount span */


/* КНОПКА ПОПОЛНЕНИЯ */

.balance-plus{
display:flex;
align-items:center;
justify-content:center;
width:28px;
height:28px;
border-radius:50%;
background:#27ae60;
color:#fff;
font-size:18px;
font-weight:bold;
text-decoration:none;
transition:0.2s;
}/* duplicate removed: .balance-plus:hover */
/* ===== modules/cabinet_services/payment_systems.tpl ===== */
/* КОНТЕЙНЕР */
.pay-container {
    display: flex;
    align-items: stretch; /* одинаковая высота */
    gap: 10px;
}

/* ЛИЧНЫЙ БАЛАНС */
.pay-balance {
    display: flex;
    align-items: center;
    border: 1px solid #444;
    border-radius: 10px;
    padding: 12px 16px;
    cursor: pointer;
    transition: 0.2s;
		background: linear-gradient(90deg, rgba(0,230,255,0.06), rgba(255,63,191,0.04));
}

.pay-balance:hover {
    filter: brightness(1.1);
	transform: scale(1.03);
}

.pay-balance img {
    width: 60px;
    height: 60px;
    margin-right: 12px;
    opacity: 0.8;
}

.pay-text {
    margin: 0;
    text-align: left;
    color: #eee;
}

/* СТИЛЬ КНОПКИ ПОПОЛНЕНИЯ */
/* КНОПКА ПОПОЛНЕНИЯ (МЯГКАЯ И ТЁМНАЯ) */
.pay-deposit {
    display: flex;
}

.pay-deposit a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;              /* было 14px → компактнее */
    border-radius: 8px;           /* было 10px → чуть меньше */
    text-decoration: none;
    font-size: 12px;              /* текст чуть меньше */
    font-weight: 500;
    color: #ddd;
    border: 1px solid #333;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
    transition: all 0.2s ease;
    height: 100%;
    min-width: 105px;             /* немного уже */
    line-height: 1.2;
}

.pay-deposit a:hover {
    background: linear-gradient(135deg, #333, #262626);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.5);
	transform: scale(1.03);
}

.pay-deposit img {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    opacity: 0.9;
}

.pay-deposit small {
    font-size: 10px;
    opacity: 0.7;
    display: block;
}

.pay-balance,
.pay-deposit a {
    box-sizing: border-box;
}

.pay-deposit a {
    padding: 0 11px;
    height: calc(100% - 2px);
}

.pay-container {
    align-items: stretch;
}

.pay-deposit {
    display: flex;
}

.pay-deposit a {
    height: 100%;
    max-height: 84px; /* ← подгони один раз */
}
/* ===== modules/cabinet_services/server_services.tpl ===== */
/* Общий стиль для всех лейблов услуг */
label.service-item {
    display: block;
    padding: 6px;
    padding-bottom: 1px;
    border-radius: 10px;
    color: var(--text);
    cursor: pointer;
    transition: all 0.3s ease; /* плавный переход для ховера */
}

/* Эффект при наведении */
label.service-item:hover {
    background: linear-gradient(90deg, rgba(0,230,255,0.15), rgba(255,63,191,0.10));
    transform: scale(1.03);
}

/* Убираем стандартное отображение радиокнопок */
label.service-item input[type="radio"] {
    display: none;
}

/* Desktop service cards: keep descriptions inside their grid cells. */
@media (min-width: 768px){
  #service .tpl-style-074b78c3 > tbody > tr{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    align-items:stretch;
    gap:8px;
  }

  #service .tpl-style-074b78c3 > tbody > tr > .tpl-style-e7739a6d{
    float:none;
    box-sizing:border-box;
    width:auto;
    min-width:0;
    padding:4px;
  }

  #service label.service-item{
    display:flex;
    align-items:flex-start;
    box-sizing:border-box;
    width:100%;
    height:100%;
    min-width:0;
  }

  #service label.service-item .tpl-style-b89f6a89{
    flex:0 0 60px;
  }

  #service label.service-item .tpl-style-102b7f89{
    flex:1 1 auto;
    min-width:0;
    margin:0;
    white-space:normal;
    overflow-wrap:anywhere;
  }
}
/* ===== modules/cabinet_services/services_main.tpl ===== */
.lds-dual-ring {
  color: #40e0d0;
  display: inline-flex;
  width: 30px;
  height: 30px;
  vertical-align: middle;
}
.lds-dual-ring,
.lds-dual-ring:after {
  box-sizing: border-box;
}
.lds-dual-ring:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-color: currentColor transparent currentColor transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
  to { transform: rotate(360deg); }
}
/* ===== modules/cabinet_services/service_periods.tpl ===== */
#service_period p {
        border: 1px dotted rgba(138,43,226,0.08);
        padding: 6px;
        border-radius: 10px;
        background: linear-gradient(180deg, #0b0f17, #0e141b);
        color: #fff; /* чтобы текст был виден на темном фоне */
        transition: all 0.3s ease;
        cursor: pointer;
    }

    #service_period p:hover {
        transform: scale(1.05);
  background: linear-gradient(90deg, rgba(0,230,255,0.06), rgba(255,63,191,0.04));
  color: var(--text);
    }

#service_period input[type="radio"]:checked + p {
    background: linear-gradient(90deg, rgba(0,230,255,0.06), rgba(255,63,191,0.04));
    color: var(--text);
    border: 1px solid #444;
}
/* ===== modules/cabinet_services/user_servers.tpl ===== */
label {
  margin-bottom: 0;
  padding-bottom: 0;
}

.server-list {
    max-width: 760px;
    margin: 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 6px;
    overflow: hidden;
	color: var(--text);
	padding: 0;
    margin: 0 auto;
    border-radius: 6px;
    overflow: hidden;
}

.server-row {
    display: block;
    cursor: pointer;
}

.server-row input {
    display: none;
}

.server-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 16px;
    border-bottom: 1px solid #1c1c1c;
    color: #d0d0d0;
    transition: background 0.15s ease;
}

/* Hover */
.server-row:hover .server-content {
    background: linear-gradient(90deg, rgba(0, 230, 255, 0.06), rgba(255, 63, 191, 0.04));
}

/* /* Выбранный сервер */ */
/* .server-row input:checked + .server-content { */
    /* background: #1e232b; */
    /* color: #ffffff; */
/* } */

/* Левая часть */
.server-name {
    font-size: 14px;
    font-weight: 500;
}

/* Правая часть */
.server-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #9aa0a6;
}

.server-row input:checked + .server-content .server-meta {
    color: #cfd8dc;
}

.empty {
    padding: 16px;
    text-align: center;
    color: #777;
}

.server-row:last-child .server-content {
    border-bottom: none;
}
/* ===== modules/home/home_all_servers.tpl ===== */
/* Шапка таблицы */
table thead{
	background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
}

/* Ячейки заголовков */
table thead th{
  padding: 12px 14px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #cfd8dd;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.6);
  white-space: nowrap !important;
}

/* Нумерация */
table thead th:first-child{
  width: 36px;
}

/* Hover по шапке */
table thead th:hover{
  color: #ffffff;
  text-shadow: 0 0 10px rgba(35,210,255,0.25);
  background: rgba(255,255,255,0.02);
  transition: all 160ms ease;
}

/* Разделители между колонками */
table thead th + th{
  border-left: 1px solid rgba(255,255,255,0.03);
}

/* Скругление углов */
table thead th:first-child{
  border-top-left-radius: 3px;
}
table thead th:last-child{
  border-top-right-radius: 3px;
}

table td,
table th{
  white-space: nowrap !important;
}

th.hide {
    visibility: hidden;
}
/* ===== modules/home/home_befirst_servers.tpl ===== */
/* ====== Стили для трёх блоков (lb3 = loveboost 3-blocks) ====== */
  .lb3-section {
    width: 100%;
    padding: 7px 0; /* отступ сверху/снизу, боковые паддинги делайте в контейнере страницы */
	padding-top: 24px;
    box-sizing: border-box;
    background: transparent; /* можно изменить под фон сайта */
  }

  /* Убираем фиксированную ширину: занимаем всю доступную ширину родителя */
  .lb3-wrap {
    width: 100%;
    max-width: none;
    margin: 0 auto;
    /* padding: 0 20px; /* паддинги по бокам, при необходимости подкорректируй */ */
    box-sizing: border-box;
  }

  .lb3-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    align-items: stretch;
    width: 100%;
  }

  /* Карточка-квадрат */
.lb3-card {
  background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
  border: 1px solid rgba(255,255,255,0.03);
  border-radius: 8px;
  color: #cfeff6;
  box-shadow: 0 10px 30px rgba(0,0,0,0.7),
              0 1px 0 rgba(255,255,255,0.02) inset;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
  aspect-ratio: 1 / 1;
  min-height: 220px;
}

@media (max-width: 768px) {
  .lb3-card {
    aspect-ratio: auto;
    min-height: 0;
    height: auto;
  }
}

.lb3-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 32px rgba(0, 214, 255, 0.15);
  border: 1px solid rgba(0, 214, 255, 0.45);
  backdrop-filter: blur(5px);
}

  .lb3-inner {
    padding: 18px;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
  }

  .lb3-title {
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
    font-size: 23px;
    color: #e6fbff;
    margin: 2px 0 8px 0;
    letter-spacing: 0.2px;
	text-align: center;
	padding-bottom: 15px;
  }
  
    .lb4-title {
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: #e6fbff;
    margin: 2px 0 8px 0;
    letter-spacing: 0.2px;
	text-align: center;
	opacity: 0.3;
  }

  /* Нижняя панель кнопки — по центру */
  .lb3-footer {
    margin-top: auto;
    display: flex;
    justify-content: center; /* центрируем кнопку */
  }

  /* Увеличенные кнопки */
  .lb3-btn {
    display: inline-block;
    background: linear-gradient(90deg,#00d6ff 0%, #00b9ff 60%);
    color: #061216;
    font-weight: 800;
    font-size: 15px;
    padding: 12px 22px; /* увеличенные размеры */
    border-radius: 8px; /* чуть более закруглённые */
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(0,214,255,0.10), 0 1px 0 rgba(255,255,255,0.03) inset;
    transition: transform .14s ease, box-shadow .14s ease, opacity .14s;
    min-width: 140px; /* гарантия минимальной ширины */
    text-align: center;
  }

  .lb3-btn:hover {
    transform: translateY(-4px);
    opacity: 0.99;
    box-shadow: 0 14px 40px rgba(0,214,255,0.14);
  }

  .lb3-accent {
    height: 4px;
    background: linear-gradient(90deg,#ff2fa6 0%, #00d6ff 100%);
    margin: -18px -18px 10px -18px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
  }

  /* Адаптив */
@media (max-width: 767px) {
  .lb3-grid {
    grid-template-columns: 1fr;
  }

  .lb3-card {
    aspect-ratio: auto;
    min-height: 0;
    height: auto;
  }
}

@media (max-width: 480px) {
  .lb3-wrap {
    padding: 0 8px;
  }
}

  /* Fallback для браузеров без aspect-ratio */
  @supports not (aspect-ratio: 1/1) {
    .lb3-card { position: relative; height: 0; padding-bottom: 100%; }
    .lb3-inner { position: absolute; top: 0; left: 0; right:0; bottom: 0; }
  }
  

.lb3-places {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid rgba(0, 214, 255, 0.35);
  border-radius: 6px;
  font-weight: 600;
  font-size: 16px;
  color: #aeeaff;
  text-align: center;
  margin: 0 auto 10px auto;
  background: rgba(0, 214, 255, 0.06);
}

.lb3-places-green {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid rgba(0, 255, 120, 0.45);
  border-radius: 6px;
  font-weight: 600;
  font-size: 15px;
  color: #b6ffd6;
  text-align: center;
  margin: 0 auto 10px auto;
  background: rgba(0, 255, 120, 0.08);
}

/* ===== Описание услуги ===== */
.lb3-desc {
  margin: 10px 0 18px;
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(207, 239, 246, 0.75);
  text-align: center;
  font-weight: 400;
  letter-spacing: 0.15px;
}

/* Важные слова */
.lb3-desc strong {
  color: #e6fbff;
  font-weight: 600;
}

/* Вторая строка — мягче */
.lb3-desc span {
  display: block;
  margin-top: 4px;
  font-size: 13.5px;
  color: rgba(207, 239, 246, 0.55);
}

/* Для минимального стиля */
.lb3-card.is-minimal .lb3-desc {
  color: rgba(255,255,255,.65);
}

/* ===== Блок "О сервисе" на главной ===== */
.home-about {
  padding: 30px 15px; /* ещё компактнее */
  text-align: center;
}

.home-about-inner {
  max-width: 800px;
  margin: 0 auto;
}

.home-about h2 {
  display: inline-block; 
  padding: 4px 12px;    
  background: rgba(0, 188, 212, 0.15); /* мягкий бирюзовый фон, прозрачность 15% */
  border-radius: 6px;    
  font-size: 22px;
  font-weight: 700;
  color: #fff;           
  margin-bottom: 16px;
  letter-spacing: .5px;
  text-transform: uppercase;
}

/* Объединяем main и sub в одну строку */
.home-about-text {
  font-size: 15px;
  line-height: 1.5;
  color: #e0f7ff;
  letter-spacing: 0.2px;
}

/* Чтобы выделить акцентные слова */
.home-about-text strong {
  color: #fff;
  font-weight: 700;
}

/* Мелкий текст (если нужен) */
.home-about-text small {
  font-size: 13px;
  color: rgba(224,247,255,0.6);
  margin-left: 6px;
}
/* ===== modules/listing/listing_main.tpl ===== */
:root{
      --bg-very-dark: #0f1315;
      --panel-dark: #1d2225;
      --muted: #9aa3a9;
      --accent-pink: #ff4db6;
      --accent-cyan: #23d2ff;
      --badge-bg: linear-gradient(135deg, rgba(35,210,255,0.06), rgba(255,77,182,0.06));
    }

.listing-header {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 20px 24px;
    background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
    border-radius: 6px;
    box-shadow: 0 12px 40px rgba(0,0,0,0.55),
                inset 0 1px 0 rgba(255,255,255,0.03);
    margin-bottom: 20px;
    color: #f5f7f8;

    /* Плавное исчезновение */
    -webkit-mask-image: radial-gradient(
        circle at top right,
        transparent 0%,
        rgba(0,0,0,0.2) 35%,
        black 60%
    );
    mask-image: radial-gradient(
        circle at top right,
        transparent 0%,
        rgba(0,0,0,0.2) 35%,
        black 60%
    );
}

/* Акцентная линия слева */
.listing-header::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(180deg, rgba(35,210,255,0.9), rgba(255,77,182,0.6));
    box-shadow: 0 0 18px rgba(35,210,255,0.35);
}






    /* Маленький "плашечный" бейдж */
    .listing-badge{
      display: inline-block;
      min-width: 86px;
      padding: 6px 10px;
      font-size: 12px;
      line-height: 1;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      color: #eaf6ff;
      background: var(--badge-bg);
      border: 1px solid rgba(255,255,255,0.04);
      border-left: 3px solid rgba(35,210,255,0.18);
      border-radius: 3px;
      box-shadow: 0 4px 18px rgba(3,12,18,0.6);
      align-self: flex-start;
      transform: translateY(-6px);
	  white-space: nowrap;
    }

    /* Обертка заголовка */
    .listing-title-wrap{
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
    }

    /* Сам заголовок в стиле сайта */
.page-title{
  margin: 0;
  font-family: "Roboto Condensed", "Open Sans", Arial, sans-serif;
  font-size: 36px;
  font-weight: 300;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #f8fbff;
  display: flex;
  align-items: center;
  gap: 12px;

  /* читаемость + glow */
  text-shadow:
    0 2px 0 rgba(0,0,0,0.8),
    0 0 18px rgba(35,210,255,0.15);
}

    /* маленькое сердечко */
.title-heart{
  color: #ff4db6;
  font-size: 18px;
  transform: translateY(-2px);
  text-shadow:
    0 0 6px rgba(255,77,182,0.6),
    0 0 14px rgba(255,77,182,0.35);
}
    /* Подзаголовок / доп. информация */
.page-meta{
  font-size: 12px;
  color: rgba(200,210,220,0.75);
  letter-spacing: 0.04em;
}

    /* Hover — лёгкое свечение бейджа */
    .listing-badge:hover{
      box-shadow: 0 6px 28px rgba(35,210,255,0.08), 0 2px 6px rgba(0,0,0,0.6);
      transform: translateY(-8px);
      transition: all 180ms ease;
    }

    /* Адаптив */
    @media (max-width: 720px){
      .listing-header{
        flex-direction: column;
        gap: 12px;
      }
      .listing-badge{
        transform: translateY(0);
        align-self: flex-start;
      }
      .page-title{
        font-size: 26px;
      }
    }

/* Шапка таблицы */
table thead{
  background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
}/* duplicate removed: /* Ячейки заголовков */ table thead th *//* duplicate removed: /* Нумерация */ table thead th:first-child *//* duplicate removed: /* Hover по шапке */ table thead th:hover *//* duplicate removed: /* Разделители между колонками */ table thead th + th *//* duplicate removed: /* Скругление углов */ table thead th:first-child *//* duplicate removed: table thead th:last-child *//* duplicate removed: table td, table th *//* duplicate removed: th.hide */
/* ===== modules/listing/listing_main.tpl ===== */
.listing-titlebar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}

.listing-titlebar .uk-article-title{
  min-width:0;
}

.current-time {
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:8px;
  float:right;
  padding: 8px 10px;
  border-radius: 6px;

  background: #0b0f14;
  border: 1px solid #1e2730;

  font-family: 'Inter', 'Segoe UI', sans-serif;
  text-align: right;
}

.current-time .label {
  display: inline-block;
  padding: 3px 6px;
  margin-bottom: 0;

  background: #1e2730;        /* отдельный фон */
  color: #ffffff;             /* ЧИСТО БЕЛЫЙ */
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;

  border-radius: 3px;
}

.current-time .time {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  color: #e6f1ff;
  white-space: nowrap;
}

.effect-stars {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
    padding: 3px 6px;
    border-radius: 8px;
    background: rgba(255,255,255,0.02);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
}

.star {
    font-size: 14px;
    color: rgba(255,255,255,0.15);
    text-shadow: none;
    transition: all 0.15s ease;
}

.star.active {
    color: #ffd166;
    text-shadow:
        0 0 6px rgba(255,209,102,0.35),
        0 0 12px rgba(255,209,102,0.18);
}

.listing-note {
    margin: 8px 0 14px;
    padding: 8px 12px;
    font-size: 12.5px;
    line-height: 1.45;
    color: rgba(200,210,220,0.75);

    background: rgba(255,255,255,0.02);
    border-left: 2px solid rgba(35,210,255,0.25);
    border-radius: 4px;

    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
}
/* ===== modules/listing/listing_main.tpl ===== */
.checkmark {
    color: #7ED59F;      /* светло-зелёный */
    font-size: 16px;     /* размер можно менять */
    font-weight: bold;   /* чуть жирнее для лучшей видимости */
    line-height: 1;
    vertical-align: middle; /* чтобы ровно с текстом стояло */
}

.slots {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 13.5px;
    letter-spacing: 0.2px;
    line-height: 1.3;
    background: rgba(255, 255, 255, 0.04);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.slots small {
    font-size: 13px;
    opacity: 0.55;
}

/* ===== Градации ===== */

/* Много мест */
.slots.good {
    color: #9fcfca;
    background: linear-gradient(
        180deg,
        rgba(60, 110, 110, 0.25),
        rgba(60, 110, 110, 0.15)
    );
}

/* Мало */
.slots.low {
    color: #b5b5b5;
	background: linear-gradient(180deg, #0b0f16 0%, #0e131c 100%);
	}

/* ===== Ближайшее место ===== */

.next-slot {
    display: inline-block;
    padding: 3px 8px;
    margin: 1px 0;
    border-radius: 8px;
    font-size: 13.5px;
    line-height: 1.3;
    color: #a6cbc7;
    background: rgba(60, 110, 110, 0.18);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

/* ===== Вытеснение ===== */

.next-slot.danger {
    color: #9fcfca;
    background: linear-gradient(
        180deg,
        rgba(60, 110, 110, 0.25),
        rgba(60, 110, 110, 0.15)
    );
}

/* ===== Пусто ===== */

.next-slot.muted {
    color: #7f8f8f;
    background: transparent;
    box-shadow: none;
}

.ip-address {
    color: #cfeaf6;                     /* лёгкий голубоватый тон */
    background: rgba(255,255,255,0.02); /* аккуратный полупрозрачный фон */
    padding: 3px 8px;
    border-radius: 6px;
    letter-spacing: 0.02em;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
    display: inline-block;
}

/* чуть выделять при наведении, но очень сдержанно */
.ip-address:hover {
    background: rgba(35,210,255,0.03);
    color: #e6f9ff;
    transition: all 140ms ease;
}

.rounds {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 13.5px;
    letter-spacing: 0.2px;
    line-height: 1.3;
    background: rgba(255, 255, 255, 0.02); /* чуть светлее, менее заметно */
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03); /* меньше контраста */
}

/* 1 круг — мягкий красный, менее навязчивый */
.rounds.low {
    color: #d8a1a1;
    background: linear-gradient(
        180deg,
        rgba(120, 50, 50, 0.15),
        rgba(120, 50, 50, 0.08)
    );
}

/* 2–4 круга — мягкий жёлтый, менее навязчивый */
.rounds.medium {
    color: #e3d39a;
    background: linear-gradient(
        180deg,
        rgba(120, 110, 60, 0.15),
        rgba(120, 110, 60, 0.08)
    );
}

/* 5+ — мягкий зелёный, менее навязчивый */
.rounds.good {
    color: #8fc6c3;
    background: linear-gradient(
        180deg,
        rgba(60, 110, 110, 0.15),
        rgba(60, 110, 110, 0.08)
    );
}

.paid-until {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 13.5px;
    letter-spacing: 0.2px;
    line-height: 1.3;
    background: rgba(255, 255, 255, 0.02); /* чуть светлее */
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

/* скоро закончится — мягкий красный */
.paid-until.low {
    color: #d8a1a1;
    background: linear-gradient(
        180deg,
        rgba(120, 50, 50, 0.15),
        rgba(120, 50, 50, 0.08)
    );
}

/* средний запас — мягкий жёлтый */
.paid-until.medium {
    color: #e3d39a;
    background: linear-gradient(
        180deg,
        rgba(120, 110, 60, 0.15),
        rgba(120, 110, 60, 0.08)
    );
}

/* всё хорошо — зелёный */
.paid-until.good {
    color: #8fc6c3;
    background: linear-gradient(
        180deg,
        rgba(60, 110, 110, 0.15),
        rgba(60, 110, 110, 0.08)
    );
}

.boost-duration {
    margin-top: 6px;
    font-size: 13px;
    color: #23d2ff; /* акцентный голубой */
    background: rgba(35, 210, 255, 0.02); /* полупрозрачный фон */
    padding: 4px 8px;
    border-radius: 6px;
    letter-spacing: 0.05em;
    text-shadow: 0 0 6px rgba(35, 210, 255, 0.25);
}

/* Тонкая бирюзовая линия под названием карты */
.map-name-down {
    position: relative;
    display: inline-block;
    padding-bottom: 4px;
}

.map-name-down::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(35, 210, 255, 0.12);
    box-shadow: 0 0 8px rgba(35, 210, 255, 0.09);
}
/* ===== Inline styles extracted from tpl ===== */
.tpl-style-cdd8ca06{text-align: center;}
.tpl-style-af18eac8{font-size: 20px;}
.tpl-style-9ae58d96{cursor: default;}
.tpl-style-38d7ac6f{font-size: 12px; font-family: Arial, sans-serif;}
.tpl-style-d2940a86{margin: 0 4px;}
.tpl-style-7ee5132b{display:flex; justify-content:center; margin-top:10px;}
.tpl-style-60b1831d{max-width:140px; border-radius:10px;}
.tpl-style-aa836714{margin-top:12px; font-weight:700; color:#e2e8f0;}
.tpl-style-53afbd48{margin-top:6px; font-size:13px; color:#cbd5e1; line-height:1.35;}
.tpl-style-92d17336{margin-top:10px;}
.tpl-style-749d3fad{margin-top:10px; color:#cbd5e1;}
.tpl-style-c6d1439a{position:absolute; left:-9999px;}
.tpl-style-651ca08e{display: flex; align-items: center; justify-content: space-between;}
.tpl-style-fa6c8d0b{display: flex; align-items: center;}
.tpl-style-bb31b17e{width: 210px; height: auto;}
.tpl-style-9bca98f0{float: right; padding: 17px;}
.tpl-style-c591d526{background-color: #E9EBED; border-radius: 1px; padding-left: 4px; padding-right: 4px;}
.tpl-style-24b531c6{cursor: pointer;}
.tpl-style-bd530fce{width: 200px; height: 200px;}
.tpl-style-ad186065{width: 150px; height: 55px;}
.tpl-style-abd0e16e{padding-left: 30px;}
.tpl-style-db3b3887{float: right;}
.tpl-style-224b51a7{display: none;}
.tpl-style-6e5632d6{margin: auto; width: 100%;}
.tpl-style-a07faa5b{width: 32%; float: left;}
.tpl-style-a733a4d0{float: left;}
.tpl-style-93b8ea5b{display:none;}
.tpl-style-79da8ce0{width: 70px; height: 70px; float:left; margin-right: 5px;}
.tpl-style-3e6ccc92{float: right; text-align: left;}
.tpl-style-20c93bca{margin-top: 10px; font-size: 13px; color: #777;}
.tpl-style-b53b2345{width: 20px; height: 20px;}
.tpl-style-9a6a534a{width: 40px; height: 40px;}
.tpl-style-539b047e{text-align:center;}
.tpl-style-b379b901{display: table; margin: 0 auto;}
.tpl-style-aafd12cf{padding-right: 10px; cursor: pointer;}
.tpl-style-85a6323d{height: 32px; margin-top: 10px; width: 150px;}
.tpl-style-a2d48c76{margin-bottom:0;}
.tpl-style-8651f2ae{cursor: pointer; font-size: 13px;}
.tpl-style-074b78c3{margin: auto; width: 100%; text-align: center;}
.tpl-style-e7739a6d{width: 48.5%; padding: 4px; float: left;}
.tpl-style-a4c71a8b{padding: 6px; padding-bottom: 1px; border-radius: 10px;}
.tpl-style-b89f6a89{width: 60px; height: 50px; float:left; margin-right: 5px; border-radius: 10px;}
.tpl-style-102b7f89{text-align: left;}
.tpl-style-8ade942a{padding: 2px; float: left;}
.tpl-style-5c2dc9e8{width: 200px;}
.tpl-style-58aba575{cursor:pointer;}
.tpl-style-8e39bd94{overflow:hidden;}
.tpl-style-3f02ae81{text-align:center; cursor: pointer;}
.tpl-style-1c8ab246{text-decoration: none; color: black;}
.tpl-style-199b6f0e{width: 100%;}
.tpl-style-51567c7a{padding-top: 25px;}
.tpl-style-eb9eb8ea{height: 400px;}
.tpl-style-a43744a7{height: 25em; line-height: 25em; text-align: center;}
.tpl-style-3d1f6b96{vertical-align: middle;}
.tpl-style-59e39c64{width: 20px; height: 15px;}
.tpl-style-cfbe03e8{width:170px;}
.tpl-style-7744a555{width:85px;}
.tpl-style-2d024f3f{padding-right: 5px;}

/* Keep the search controls inside their three-column container. */
.search-form .uk-width-1-3{
  min-width:0;
}
.search-form .uk-width-1-3 table{
  width:100%;
  table-layout:fixed;
}
.search-form .uk-width-1-3 td:first-child{
  width:34%;
  width: auto !important;
}
.search-form .uk-width-1-3 input,
.search-form .uk-width-1-3 select{
  box-sizing:border-box;
  max-width:100%;
}
.search-form__players{
  display:flex;
  gap:6px;
}
.search-form__players .tpl-style-7744a555{
  flex:1 1 0;
  width:0;
  min-width:0;
}
.tpl-style-f406b01d{height: 140px; width: 180px;}
.tpl-style-409f14bc{overflow: hidden; width: 180px;}
.tpl-style-ca1de63f{font-size: 14pt;}
.tpl-style-69c49de7{text-align: center; display: none; padding-top: 15px;}
.tpl-style-e7170ba3{width: 100%; display: none;}
.tpl-style-5835bfb9{padding-top: 10px;}
.tpl-style-3432a83b{padding-top: 3px;}
.tpl-style-e3d221c5{width: 100px;}
.tpl-style-f3aeeeeb{width: 58%;}
.tpl-style-5172a7c4{width: 40%;}
.tpl-style-0a1a884d{width: 100%; padding-top: 3px;}
.tpl-style-9ef5794a{width: 43%;}
.tpl-style-244c7511{width: 55%;}
.tpl-style-ce6dd0d3{cursor: pointer; font-size: 20px;}
.tpl-style-6d722ccf{padding: 2px; float: left; width: 19%;}
.tpl-style-9a26b4ce{height: 23px;}


/* ===== Общая мобильная версия в стиле neon/loveboost ===== */
@media (max-width: 960px) {
  .tm-headerbar,
  .header-inner,
  .tm-toolbar--neon,
  .toolbar-buttons,
  .balance-card,
  .listing-header,
  .pay-container,
  .server-content {
    flex-wrap: wrap;
  }

  .header-inner {
    gap: 12px;
  }

  .tm-logo,
  .tm-logo img,
  .zoom-on-hover img {
    max-width: 100%;
    height: auto;
  }

  .uk-table,
  table {
    width: 100%;
  }

  .tm-article-content,
  .uk-panel,
  .lb-panel,
  .listing-header,
  .balance-card {
    box-sizing: border-box;
  }
}

@media (max-width: 767px) {
  body {
    overflow-x: hidden;
  }

  .listing-titlebar{
    display:block;
  }

  .tm-footer {
    padding: 22px 14px;
    text-align: center;
  }

  .neon-label {
    position: static;
    transform: none;
    display: inline-flex;
    margin: 10px auto 0;
    max-width: calc(100vw - 32px);
    white-space: normal;
    justify-content: center;
  }

  .lb-submenu-list,
  .toolbar-buttons,
  .pay-container,
  .balance-card,
  .listing-header,
  .server-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .lb-submenu-list {
    padding: 8px 12px;
  }

  .lb-submenu-list li:not(:last-child)::after {
    display: none;
  }

  .balance-card,
  .listing-header {
    padding: 16px;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .balance-line {
    flex-wrap: wrap;
  }

  .balance-amount {
    font-size: 24px;
  }

  .lb3-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .current-time {
    float: none;
    width: 100%;
    text-align: left;
    box-sizing: border-box;
    margin-bottom: 10px;
  }

  .uk-table,
  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

table td,table th{
    white-space: nowrap !important;
}

  .pay-balance,
  .pay-deposit a,
  .user-toggle,
  .uk-button,
  button {
    min-height: 42px;
  }

  input[type="text"],
  input[type="password"],
  input[type="email"],
  select,
  textarea {
    max-width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .tm-footer-links,
  .footer-links,
  .policy-links {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .separator {
    display: none;
  }

  .balance-amount {
    font-size: 21px;
  }

  .listing-header {
    gap: 12px;
  }
}


/* ===== Dynamic-template helpers without inline style attributes ===== */
.tpl-service-grid-cell { padding: 2px; float: left; box-sizing: border-box; width: auto; min-width: 86px; }
.tpl-position-card { border: 1px dotted #CDC9C9; padding-bottom: 6px; border-radius: 10px; }
.tpl-position-card.is-disabled { opacity: .6; }
.tpl-color-card { border: 1px dotted #CDC9C9; padding: 6px; padding-bottom: 6px; border-radius: 10px; opacity: .6; color: #000; text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff; }
.tpl-color-swatch { display: inline-block; border: 1px dotted #CDC9C9; border-radius: 15px; width: 14px; min-height: 14px; }
.has-service-color { transition: background-color .2s ease; }
.tpl-hidden-row { display: none; }
@media (max-width: 767px) { .tpl-service-grid-cell { float: none; width: 100%; min-width: 0; } }
.tpl-progress-width-0{width:0%;}
.tpl-progress-width-1{width:1%;}
.tpl-progress-width-2{width:2%;}
.tpl-progress-width-3{width:3%;}
.tpl-progress-width-4{width:4%;}
.tpl-progress-width-5{width:5%;}
.tpl-progress-width-6{width:6%;}
.tpl-progress-width-7{width:7%;}
.tpl-progress-width-8{width:8%;}
.tpl-progress-width-9{width:9%;}
.tpl-progress-width-10{width:10%;}
.tpl-progress-width-11{width:11%;}
.tpl-progress-width-12{width:12%;}
.tpl-progress-width-13{width:13%;}
.tpl-progress-width-14{width:14%;}
.tpl-progress-width-15{width:15%;}
.tpl-progress-width-16{width:16%;}
.tpl-progress-width-17{width:17%;}
.tpl-progress-width-18{width:18%;}
.tpl-progress-width-19{width:19%;}
.tpl-progress-width-20{width:20%;}
.tpl-progress-width-21{width:21%;}
.tpl-progress-width-22{width:22%;}
.tpl-progress-width-23{width:23%;}
.tpl-progress-width-24{width:24%;}
.tpl-progress-width-25{width:25%;}
.tpl-progress-width-26{width:26%;}
.tpl-progress-width-27{width:27%;}
.tpl-progress-width-28{width:28%;}
.tpl-progress-width-29{width:29%;}
.tpl-progress-width-30{width:30%;}
.tpl-progress-width-31{width:31%;}
.tpl-progress-width-32{width:32%;}
.tpl-progress-width-33{width:33%;}
.tpl-progress-width-34{width:34%;}
.tpl-progress-width-35{width:35%;}
.tpl-progress-width-36{width:36%;}
.tpl-progress-width-37{width:37%;}
.tpl-progress-width-38{width:38%;}
.tpl-progress-width-39{width:39%;}
.tpl-progress-width-40{width:40%;}
.tpl-progress-width-41{width:41%;}
.tpl-progress-width-42{width:42%;}
.tpl-progress-width-43{width:43%;}
.tpl-progress-width-44{width:44%;}
.tpl-progress-width-45{width:45%;}
.tpl-progress-width-46{width:46%;}
.tpl-progress-width-47{width:47%;}
.tpl-progress-width-48{width:48%;}
.tpl-progress-width-49{width:49%;}
.tpl-progress-width-50{width:50%;}
.tpl-progress-width-51{width:51%;}
.tpl-progress-width-52{width:52%;}
.tpl-progress-width-53{width:53%;}
.tpl-progress-width-54{width:54%;}
.tpl-progress-width-55{width:55%;}
.tpl-progress-width-56{width:56%;}
.tpl-progress-width-57{width:57%;}
.tpl-progress-width-58{width:58%;}
.tpl-progress-width-59{width:59%;}
.tpl-progress-width-60{width:60%;}
.tpl-progress-width-61{width:61%;}
.tpl-progress-width-62{width:62%;}
.tpl-progress-width-63{width:63%;}
.tpl-progress-width-64{width:64%;}
.tpl-progress-width-65{width:65%;}
.tpl-progress-width-66{width:66%;}
.tpl-progress-width-67{width:67%;}
.tpl-progress-width-68{width:68%;}
.tpl-progress-width-69{width:69%;}
.tpl-progress-width-70{width:70%;}
.tpl-progress-width-71{width:71%;}
.tpl-progress-width-72{width:72%;}
.tpl-progress-width-73{width:73%;}
.tpl-progress-width-74{width:74%;}
.tpl-progress-width-75{width:75%;}
.tpl-progress-width-76{width:76%;}
.tpl-progress-width-77{width:77%;}
.tpl-progress-width-78{width:78%;}
.tpl-progress-width-79{width:79%;}
.tpl-progress-width-80{width:80%;}
.tpl-progress-width-81{width:81%;}
.tpl-progress-width-82{width:82%;}
.tpl-progress-width-83{width:83%;}
.tpl-progress-width-84{width:84%;}
.tpl-progress-width-85{width:85%;}
.tpl-progress-width-86{width:86%;}
.tpl-progress-width-87{width:87%;}
.tpl-progress-width-88{width:88%;}
.tpl-progress-width-89{width:89%;}
.tpl-progress-width-90{width:90%;}
.tpl-progress-width-91{width:91%;}
.tpl-progress-width-92{width:92%;}
.tpl-progress-width-93{width:93%;}
.tpl-progress-width-94{width:94%;}
.tpl-progress-width-95{width:95%;}
.tpl-progress-width-96{width:96%;}
.tpl-progress-width-97{width:97%;}
.tpl-progress-width-98{width:98%;}
.tpl-progress-width-99{width:99%;}
.tpl-progress-width-100{width:100%;}
/* ===== Финальная мобильная доработка: viewport-friendly layout ===== */
:root{
  --lb-bg:#070912;
  --lb-panel:#0c1016;
  --lb-panel-2:#101722;
  --lb-border:rgba(0,230,255,.12);
  --lb-border-pink:rgba(255,63,191,.18);
  --lb-text:#eaf7ff;
  --lb-muted:#96a9b9;
  --lb-cyan:#00e6ff;
  --lb-pink:#ff3fbf;
}

html{box-sizing:border-box;max-width:100%;overflow-x:hidden;}
*,*::before,*::after{box-sizing:inherit;}
body{max-width:100%;overflow-x:hidden;}

/* Стили SEO/instruction widget вынесены из JS в CSS */
.instruction-widget{
  position:fixed;
  left:16px;
  top:16px;
  z-index:2147483647;
  width:360px;
  max-width:calc(100vw - 32px);
  min-height:90px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding:18px;
  font-family:Inter,Roboto,Arial,sans-serif;
  text-align:center;
  color:#e6eef8;
  background:linear-gradient(180deg,#0b1220,#07101a);
  border:1px solid rgba(255,255,255,.04);
  border-radius:10px;
  box-shadow:0 10px 30px rgba(2,6,23,.7);
}
.iw-title{font-size:16px;font-weight:700;color:#f8fafc;}
.iw-message{font-size:14px;line-height:1.4;min-height:40px;color:#dbeafe;}
.iw-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
@keyframes iw-pulse{0%{transform:translateY(0);opacity:.9}50%{transform:translateY(-6px);opacity:1}100%{transform:translateY(0);opacity:.9}}
.iw-animated{display:inline-block;padding:8px 12px;border-radius:8px;background:linear-gradient(90deg,#1f2937,#111827);color:#fff;font-weight:700;animation:iw-pulse 1.6s ease-in-out infinite;box-shadow:0 6px 18px rgba(16,24,40,.6);}
.iw-error{display:inline-block;padding:8px 12px;border-radius:8px;color:#fff;background:#b00020;font-weight:700;}
.iw-code{padding:8px 14px;border:1px solid rgba(165,243,252,.08);border-radius:10px;background:#0b1220;color:#a5f3fc;font-size:22px;font-weight:900;letter-spacing:2px;}
.iw-primary,.iw-neutral{min-width:130px;border-radius:8px;cursor:pointer;}
.iw-primary{padding:10px 16px;border:0;background:linear-gradient(180deg,#2563eb,#1e40af);color:#fff;font-weight:700;box-shadow:0 8px 20px rgba(37,99,235,.18);}
.iw-neutral{padding:8px 12px;border:1px solid rgba(255,255,255,.06);background:transparent;color:#cbd5e1;}
.iw-small-note{margin-top:6px;font-size:12px;color:#9fb7d9;}
button.iw-primary:active,button.iw-neutral:active{transform:translateY(1px);}

/* Mobile menu */
.mobile-nav,
.mobile-nav-list{display:none;}
.tm-corr.tm-navbar{border-radius:0 0 16px 16px;}
.mobile-nav{align-items:center;justify-content:space-between;width:100%;padding:10px 12px;}
.mobile-brand{display:flex;align-items:center;min-width:0;}
.mobile-brand img{display:block;width:148px;max-width:58vw;height:auto;}
.mobile-menu-toggle{
  width:44px;
  height:42px;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0;
  border:1px solid var(--lb-border);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(0,230,255,.08),rgba(255,63,191,.06));
  color:#fff;
  box-shadow:0 8px 22px rgba(0,0,0,.35),0 0 18px rgba(0,230,255,.05);
}
.mobile-menu-toggle span{display:block;width:20px;height:2px;border-radius:999px;background:#eaf7ff;transition:transform .2s ease,opacity .2s ease;}
.mobile-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mobile-menu-toggle.is-open span:nth-child(2){opacity:0;}
.mobile-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-nav-list{list-style:none;margin:0;padding:8px 12px 14px;}
.mobile-nav-list a{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:12px;
  background:rgba(255,255,255,.025);
  color:var(--lb-text);
  text-decoration:none;
}
.mobile-nav-list li+li{margin-top:7px;}
.mobile-nav-list li.uk-active>a,
.mobile-nav-list a:hover{
  color:#fff;
  border-color:rgba(0,230,255,.22);
  background:linear-gradient(90deg,rgba(0,230,255,.10),rgba(255,63,191,.08));
  box-shadow:0 0 18px rgba(0,230,255,.06);
}
.mobile-account-link>a{border-color:rgba(255,63,191,.18);}

@media (max-width: 767px){
  body{padding-left:0!important;padding-right:0!important;background:var(--lb-bg);}

  .uk-container{
    width:100%!important;
    max-width:none!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .tm-page-bg,.tm-container,.tm-top-block,.tm-middle,.tm-block-bottom{width:100%;max-width:100%;}
  .tm-container{padding-bottom:12px;}
  .tm-top-block,.tm-grid-block,.tm-block-bottom,.tm-top-block+.tm-middle{margin-top:12px!important;}

  .tm-corr.tm-navbar{
    position:sticky;
    top:0;
    z-index:1000;
    margin-left:-10px;
    margin-right:-10px;
    border:1px solid rgba(0,230,255,.10);
    border-top:0;
    background:rgba(7,9,18,.96)!important;
    backdrop-filter:blur(14px);
    box-shadow:0 10px 28px rgba(0,0,0,.45),0 0 24px rgba(255,63,191,.07);
  }
  .mobile-nav{display:flex!important;}
  .mobile-nav-list.is-open{display:grid!important;grid-template-columns:1fr;}

  .lb-submenu{margin-left:-2px;margin-right:-2px;}
  .lb-submenu-list{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    gap:8px!important;
    overflow-x:auto;
    padding:10px 2px 4px!important;
    scrollbar-width:none;
  }
  .lb-submenu-list::-webkit-scrollbar{display:none;}
  .lb-submenu-list li{flex:0 0 auto;}
  .lb-submenu-list a{
    display:flex;
    align-items:center;
    min-height:38px;
    padding:8px 12px;
    border:1px solid rgba(0,230,255,.12);
    border-radius:999px;
    background:rgba(255,255,255,.025);
    color:var(--lb-text);
    white-space:nowrap;
  }

  .tm-middle.uk-grid,
  .uk-grid.tm-grid-block{
    display:block!important;
    margin-left:0!important;
  }
  .tm-middle.uk-grid>[class*='uk-width-'],
  .uk-grid.tm-grid-block>[class*='uk-width-'],
  .tm-main,
  .tm-sidebar-a,
  .tm-sidebar-b,
  [class*='uk-width-medium-']{
    float:none!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
  }

  .tm-content,
  .uk-article,
  .uk-panel,
  .uk-panel-box,
  .tm-block-bottom{
    border-radius:18px;
  }
  .tm-content .uk-article,
  .uk-article{
    padding:14px!important;
    color:var(--lb-text);
    background:linear-gradient(180deg,rgba(16,23,34,.96),rgba(8,12,20,.96))!important;
    border:1px solid rgba(0,230,255,.10);
    box-shadow:0 14px 34px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
  }
  .uk-article-title,
  .page-header h1,
  .page-title{
    font-size:24px!important;
    line-height:1.15!important;
    margin-bottom:12px!important;
    color:#fff;
    text-shadow:0 0 12px rgba(255,63,191,.13);
  }
  h1,h2,h3,h4{word-break:normal;overflow-wrap:anywhere;}
  p,.listing-note,.page-meta,td,th{overflow-wrap:anywhere;}

  .tm-toolbar--neon,
  .toolbar-buttons{
    display:flex!important;
    flex-direction:column!important;
    float:none!important;
    gap:8px!important;
    width:100%;
  }
  .tm-toolbar--neon .uk-float-left,
  .tm-toolbar--neon .uk-float-right{float:none!important;width:100%;}
  .user-toggle,.uk-button,button,input,select,textarea{min-height:0px;}
  input[type="text"],input[type="password"],input[type="email"],input[type="number"],select,textarea,
  .tpl-style-cfbe03e8,.tpl-style-7744a555,.tpl-style-5c2dc9e8,.tpl-style-e3d221c5{
    width:100%!important;
    max-width:100%!important;
  }
  .uk-form .uk-grid{display:block;margin-left:0!important;}
  .uk-form .uk-grid>[class*='uk-width-'],
  .uk-form [class*='uk-width-1-']{float:none!important;width:100%!important;padding-left:0!important;margin-top:10px;}
  .uk-form table,.uk-form tbody,.uk-form tr,.uk-form td{display:block!important;width:100%!important;}
  .uk-form td{padding:4px 0!important;}

  /* Красивые карточки вместо десктопных таблиц серверов */
  #all_servers,
  #all_servers thead,
  #all_servers tbody,
  #all_servers tr,
  #all_servers td{
    display:block!important;
    width:100%!important;
  }
  #all_servers{overflow:visible!important;border-collapse:separate!important;border-spacing:0!important;background:transparent!important;}
  #all_servers thead{display:none!important;}
  #all_servers tr{
    position:relative;
    margin:0 0 12px!important;
    padding:12px!important;
    border:1px solid rgba(0,230,255,.13)!important;
    border-radius:16px;
    background:linear-gradient(180deg,rgba(13,20,31,.98),rgba(8,12,20,.98));
    box-shadow:0 12px 28px rgba(0,0,0,.30),0 0 22px rgba(255,63,191,.045);
  }
  #all_servers tr.has-service-color{box-shadow:0 12px 28px rgba(0,0,0,.32),0 0 24px rgba(0,230,255,.09);}
  #all_servers td{
    display:flex!important;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    min-height:36px;
    padding:8px 0!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    color:var(--lb-text)!important;
    white-space:normal!important;
    text-align:right!important;
  }
  #all_servers td:last-child{border-bottom:0!important;}
  #all_servers td::before{
    content:"";
    flex:0 0 42%;
    color:var(--lb-muted);
    font-size:12px;
    text-align:left;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  #all_servers td:nth-child(1)::before{content:"Игра";}
  #all_servers td:nth-child(2)::before{content:"Сервер";}
  #all_servers td:nth-child(3)::before{content:"Адрес";}
  #all_servers td:nth-child(4)::before{content:"Коннект";}
  #all_servers td:nth-child(5)::before{content:"Игроки";}
  #all_servers td:nth-child(6)::before{content:"Карта";}
  #all_servers td:nth-child(7)::before{content:"Голоса";}
  #all_servers td[colspan]::before{display:none;}
  #all_servers td[colspan]{display:block!important;text-align:center!important;}
  #all_servers a{color:#8eeeff;}
  #all_servers .uk-icon-gamepad{font-size:22px;}

  /* Listing: таблицы превращаются в неоновые карточки */
  .listing-summary-table,
  .listing-service-table,
  .listing-summary-table thead,
  .listing-service-table thead,
  .listing-summary-table tbody,
  .listing-service-table tbody,
  .listing-summary-table tr,
  .listing-service-table tr,
  .listing-summary-table td,
  .listing-service-table td{
    display:block!important;
    width:100%!important;
  }
  .listing-summary-table,
  .listing-service-table{overflow:visible!important;background:transparent!important;}
  .listing-summary-table thead,
  .listing-service-table thead{display:none!important;}
  .listing-summary-table tr,
  .listing-service-table tr{
    margin:0 0 12px!important;
    padding:12px!important;
    border:1px solid rgba(255,63,191,.15)!important;
    border-radius:16px;
    background:linear-gradient(180deg,rgba(16,23,34,.98),rgba(9,13,22,.98));
    box-shadow:0 12px 28px rgba(0,0,0,.30),0 0 22px rgba(255,63,191,.05);
  }
  .listing-summary-table td,
  .listing-service-table td{
    display:flex!important;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:8px 0!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    color:var(--lb-text)!important;
    white-space:normal!important;
    text-align:right!important;
  }
  .listing-summary-table td:last-child,
  .listing-service-table td:last-child{border-bottom:0!important;}
  .listing-summary-table td::before,
  .listing-service-table td::before{
    flex:0 0 42%;
    color:var(--lb-muted);
    font-size:12px;
    text-align:left;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  .listing-summary-table td:nth-child(1)::before{content:"Услуга";}
  .listing-summary-table td:nth-child(2)::before{content:"Описание";}
  .listing-summary-table td:nth-child(3)::before{content:"Эффект";}
  .listing-summary-table td:nth-child(4)::before{content:"Места";}
  .listing-summary-table td:nth-child(5)::before{content:"Ближайшее";}
  .listing-service-table td:nth-child(1)::before{content:"Страна";}
  .listing-service-table td:nth-child(2)::before{content:"Сервер";}
  .listing-service-table td:nth-child(3)::before{content:"Адрес";}
  .listing-service-table td:nth-child(4)::before{content:"Игроки";}
  .listing-service-table td:nth-child(5)::before{content:"Карта";}
  .listing-service-table td:nth-child(6)::before{content:"До/К-во кругов";}
  .listing-service-table td[colspan]::before{display:none;}
  .listing-service-table td[colspan]{display:block!important;text-align:center!important;}
  .listing-service-table .uk-progress{min-width:135px;width:52%;margin:0;}
  .listing-badge,.slots,.next-slot,.rounds,.paid-until{max-width:58%;white-space:normal;}
  .current-time{display:flex;float:none!important;width:100%;justify-content:space-between;align-items:center;margin:0 0 12px!important;}
  .listing-note{padding:12px!important;border-radius:14px;}
  .listing-header-wrap{padding-top:12px!important;}
  .listing-header{padding:14px!important;border-radius:16px;}

  /* Остальные таблицы не ломают ширину экрана: аккуратный скролл в стиле сайта */
  .tm-article-content>.uk-table:not(#all_servers):not(.listing-summary-table):not(.listing-service-table),
  .tm-article-content>table:not(#all_servers):not(.listing-summary-table):not(.listing-service-table){
    display:block;
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    border-radius:14px;
    background:rgba(255,255,255,.02);
  }
  
  table td,table th{
    white-space: nowrap !important;
}

  .uk-modal-dialog{width:auto!important;margin:18px 10px!important;border-radius:18px;}
  .uk-pagination{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;}
  .uk-pagination>li{margin:0!important;}
  .tm-footer{margin-left:0;margin-right:0;border-radius:18px;padding:20px 12px!important;}
  .rul_down{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:12px!important;}
}

@media (max-width: 380px){
  .mobile-brand img{width:128px;}
  .uk-container{padding-left:8px!important;padding-right:8px!important;}
  .tm-corr.tm-navbar{margin-left:-8px;margin-right:-8px;}
  #all_servers td,.listing-summary-table td,.listing-service-table td{display:block!important;text-align:left!important;}
  #all_servers td::before,.listing-summary-table td::before,.listing-service-table td::before{display:block;margin-bottom:4px;}
  .listing-badge,.slots,.next-slot,.rounds,.paid-until{max-width:100%;}
  .listing-service-table .uk-progress{width:100%;}
}

/* Listing table widths moved from tpl attributes */
@media (min-width:768px){
  .listing-country-cell{width:5.3%;}
  .listing-name-cell{width:32%;}
  .listing-address-cell{width:25%;}
  .listing-players-cell{width:24%;}
  .listing-map-cell{width:18%;}
  .listing-expire-cell{width:15%;}
}

/* ===== Mobile UX v2: современное меню, drawer и аккуратные мобильные секции ===== */
.mobile-account-button,
.mobile-menu-backdrop,
.mobile-menu-drawer,
.mobile-section-toggle{
  display:none;
}

@media (max-width: 767px){
  :root{
    --lb-header-height:64px;
    --lb-radius-xl:22px;
  }

  body.mobile-menu-open{
    overflow:hidden!important;
    touch-action:none;
  }

  .tm-corr.tm-navbar{
    min-height:var(--lb-header-height);
    border-radius:0 0 22px 22px!important;
    overflow:visible!important;
  }

  .mobile-nav{
    min-height:var(--lb-header-height);
    padding:10px 12px!important;
    gap:10px;
    background:
      radial-gradient(circle at 20% 0%, rgba(255,63,191,.15), transparent 32%),
      radial-gradient(circle at 82% 8%, rgba(0,230,255,.14), transparent 34%),
      rgba(7,9,18,.86);
  }

  .mobile-brand{
    flex:1 1 auto;
    justify-content:center;
  }

  .mobile-brand img{
    width:158px!important;
    max-width:48vw!important;
    filter:drop-shadow(0 0 14px rgba(255,63,191,.22));
  }

  .mobile-menu-toggle,
  .mobile-account-button,
  .mobile-menu-close{
    position:relative;
    flex:0 0 46px;
    width:46px;
    height:46px;
    border-radius:16px;
    border:1px solid rgba(0,230,255,.22);
    background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
    box-shadow:0 10px 24px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08), 0 0 18px rgba(0,230,255,.07);
  }

  .mobile-menu-toggle{
    display:inline-flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
  }

  .mobile-menu-toggle::after,
  .mobile-account-button::after{
    content:"";
    position:absolute;
    inset:-1px;
    border-radius:inherit;
    background:linear-gradient(135deg,rgba(0,230,255,.28),rgba(255,63,191,.18));
    opacity:.34;
    pointer-events:none;
    mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    mask-composite:exclude;
    -webkit-mask-composite:xor;
    padding:1px;
  }

  .mobile-menu-toggle span{
    width:21px!important;
    height:2px!important;
    background:#fff!important;
    box-shadow:0 0 10px rgba(0,230,255,.35);
  }

  .mobile-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)!important;}
  .mobile-menu-toggle.is-open span:nth-child(2){opacity:0!important;}
  .mobile-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)!important;}

  .mobile-account-button{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:22px;
    line-height:1;
    text-decoration:none!important;
    border-color:rgba(255,63,191,.28);
    text-shadow:0 0 12px rgba(255,63,191,.55);
  }

  .mobile-menu-backdrop{
    display:block!important;
    position:fixed;
    inset:0;
    z-index:1990;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    background:rgba(1,3,10,.72);
    backdrop-filter:blur(5px);
    transition:opacity .22s ease, visibility .22s ease;
  }

  body.mobile-menu-open .mobile-menu-backdrop,
  .mobile-menu-backdrop.is-visible{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  .mobile-menu-drawer{
    display:flex!important;
    flex-direction:column;
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    z-index:2000;
    width:min(88vw,370px);
    max-width:370px;
    padding:calc(16px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom));
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateX(-106%);
    transition:transform .28s cubic-bezier(.22,.72,.18,1);
    border-right:1px solid rgba(0,230,255,.18);
    background:
      radial-gradient(circle at 12% 0%, rgba(255,63,191,.18), transparent 33%),
      radial-gradient(circle at 95% 15%, rgba(0,230,255,.18), transparent 34%),
      linear-gradient(180deg,rgba(13,19,31,.98),rgba(6,9,17,.98));
    box-shadow:24px 0 60px rgba(0,0,0,.55), 0 0 34px rgba(255,63,191,.08);
  }

  body.mobile-menu-open .mobile-menu-drawer{
    transform:translateX(0);
  }

  .mobile-drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px;
  }

  .mobile-drawer-logo img{
    width:160px;
    max-width:58vw;
    display:block;
    filter:drop-shadow(0 0 16px rgba(255,63,191,.22));
  }

  .mobile-menu-close{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    flex:0 0 42px;
    width:42px;
    height:42px;
    padding:0;
    color:#fff;
    font-size:31px;
    line-height:1;
    cursor:pointer;
  }

  .mobile-drawer-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-bottom:14px;
  }

  .mobile-drawer-action{
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:15px;
    color:var(--lb-text)!important;
    text-decoration:none!important;
    background:rgba(255,255,255,.035);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  }

  .mobile-drawer-action-primary{
    border-color:rgba(255,63,191,.24);
    background:linear-gradient(135deg,rgba(255,63,191,.18),rgba(0,230,255,.10));
    box-shadow:0 0 24px rgba(255,63,191,.06), inset 0 1px 0 rgba(255,255,255,.08);
  }

  .mobile-menu-drawer .mobile-nav-list{
    display:block!important;
    list-style:none;
    margin:0;
    padding:0;
  }

  .mobile-menu-drawer .mobile-nav-list li+li{
    margin-top:9px;
  }

  .mobile-menu-drawer .mobile-nav-list a{
    min-height:50px;
    padding:13px 14px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.07);
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
    color:#eaf7ff!important;
    font-size:15px;
    font-weight:600;
    letter-spacing:.01em;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
  }

  .mobile-menu-drawer .mobile-nav-list li.uk-active>a,
  .mobile-menu-drawer .mobile-nav-list a:hover,
  .mobile-menu-drawer .mobile-nav-list a:focus{
    border-color:rgba(0,230,255,.27);
    background:linear-gradient(135deg,rgba(0,230,255,.14),rgba(255,63,191,.10));
    color:#fff!important;
    box-shadow:0 0 24px rgba(0,230,255,.08), inset 0 1px 0 rgba(255,255,255,.08);
  }

  .mobile-section-nav{
    margin:0 0 12px!important;
  }

  .mobile-section-toggle{
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-height:48px;
    margin:0 0 10px;
    padding:12px 14px;
    border:1px solid rgba(0,230,255,.16);
    border-radius:17px;
    color:#fff;
    background:
      linear-gradient(135deg,rgba(0,230,255,.10),rgba(255,63,191,.08)),
      rgba(255,255,255,.025);
    box-shadow:0 10px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.055);
    font-weight:700;
    letter-spacing:.01em;
    cursor:pointer;
  }

  .mobile-section-toggle i{
    width:22px;
    height:22px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.12);
    position:relative;
    flex:0 0 22px;
  }

  .mobile-section-toggle i::before,
  .mobile-section-toggle i::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:10px;
    height:2px;
    border-radius:999px;
    background:#fff;
    transform:translate(-50%,-50%);
    transition:transform .2s ease;
  }

  .mobile-section-toggle i::after{
    transform:translate(-50%,-50%) rotate(90deg);
  }

  .mobile-section-toggle.is-open i::after{
    transform:translate(-50%,-50%) rotate(0deg);
  }

  .mobile-collapsible-panel{
    display:none!important;
  }

  .mobile-collapsible-panel.is-open{
    display:block!important;
    animation:mobilePanelIn .2s ease both;
  }

  .lb-submenu-list.mobile-collapsible-panel.is-open,
  .server-tabs .mobile-collapsible-panel.is-open{
    display:grid!important;
    grid-template-columns:1fr;
    gap:8px;
  }

  .lb-submenu-list{
    overflow:visible!important;
    padding:0!important;
  }

  .lb-submenu-list li{
    width:100%;
  }

  .lb-submenu-list a,
  .server-tabs .uk-subnav>li>a{
    width:100%;
    min-height:44px;
    justify-content:flex-start;
    border-radius:15px!important;
    border-color:rgba(255,255,255,.07)!important;
    background:rgba(255,255,255,.03)!important;
  }

  .server-tabs .uk-subnav{
    margin:0!important;
    padding:0!important;
    letter-spacing:normal!important;
  }

  .server-tabs .uk-subnav>li{
    display:block!important;
    margin:0!important;
  }

  .server-tabs .uk-subnav>li.uk-active>a,
  .lb-submenu-list li.uk-active>a,
  .lb-submenu-list a:hover{
    border-color:rgba(0,230,255,.24)!important;
    background:linear-gradient(135deg,rgba(0,230,255,.12),rgba(255,63,191,.09))!important;
    color:#fff!important;
  }

  .tm-middle.uk-grid{
    display:flex!important;
    flex-direction:column;
  }

  .tm-main{
    order:2;
  }

  .cabinet-sidebar{
    order:1;
    margin-bottom:12px!important;
  }

  .cabinet-sidebar .lb-panel{
    border:1px solid rgba(0,230,255,.12);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(16,23,34,.96),rgba(8,12,20,.96));
    box-shadow:0 14px 34px rgba(0,0,0,.32),0 0 24px rgba(255,63,191,.045);
  }

  .cabinet-sidebar .actions{
    display:grid;
    grid-template-columns:1fr;
    gap:9px;
  }

  .cabinet-sidebar .action-btn,
  .cabinet-sidebar li.lb-item{
    border-radius:14px;
  }

  .cabinet-sidebar li.lb-item{
    min-height:44px;
    display:flex;
    align-items:center;
    margin-bottom:8px;
    border:1px solid rgba(255,255,255,.055);
    background:rgba(255,255,255,.025);
  }

  .cabinet-sidebar li.lb-item.active{
    border-color:rgba(255,63,191,.20);
    background:linear-gradient(135deg,rgba(255,63,191,.13),rgba(0,230,255,.08));
  }

  /* Личный кабинет и платежные блоки на телефоне — карточками */
  #my_servers,
  #my_servers thead,
  #my_servers tbody,
  #my_servers tr,
  #my_servers td{
    display:block!important;
    width:100%!important;
  }

  #my_servers{
    border-collapse:separate!important;
    border-spacing:0!important;
    background:transparent!important;
  }

  #my_servers thead{
    display:none!important;
  }

  #my_servers tr{
    margin:0 0 12px!important;
    padding:12px!important;
    border:1px solid rgba(0,230,255,.13)!important;
    border-radius:16px;
    background:linear-gradient(180deg,rgba(13,20,31,.98),rgba(8,12,20,.98));
    box-shadow:0 12px 28px rgba(0,0,0,.30),0 0 22px rgba(255,63,191,.045);
  }

  #my_servers td{
    display:flex!important;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    min-height:36px;
    padding:8px 0!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    color:var(--lb-text)!important;
    text-align:right!important;
  }

  #my_servers td:last-child{
    border-bottom:0!important;
  }

  #my_servers td::before{
    flex:0 0 42%;
    color:var(--lb-muted);
    font-size:12px;
    text-align:left;
    text-transform:uppercase;
    letter-spacing:.04em;
  }

  #my_servers td:nth-child(1)::before{content:"Игра";}
  #my_servers td:nth-child(2)::before{content:"Сервер";}
  #my_servers td:nth-child(3)::before{content:"Адрес";}
  #my_servers td:nth-child(4)::before{content:"Игроки";}
  #my_servers td:nth-child(5)::before{content:"Карта";}
  #my_servers td:nth-child(6)::before{content:"Действия";}
  #my_servers td[colspan]::before{display:none;}
  #my_servers td[colspan]{display:block!important;text-align:center!important;}

  #pay_system table,
  #pay_system tbody,
  #pay_system tr,
  #pay_system td{
    display:block!important;
    width:100%!important;
  }

  #pay_system td{
    margin-bottom:10px;
    padding:0!important;
  }

  #pay_system label{
    min-height:86px;
    display:flex!important;
    align-items:center;
    gap:12px;
    padding:12px!important;
    border:1px solid rgba(0,230,255,.12);
    border-radius:16px;
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  }

  #pay_system img{
    max-width:74px!important;
    height:auto!important;
    flex:0 0 auto;
  }

  #pay_system p{
    margin:0!important;
    text-align:left!important;
  }

  .balance-card{
    width:100%!important;
    border-radius:20px!important;
    padding:16px!important;
    align-items:flex-start!important;
    background:linear-gradient(135deg,rgba(255,63,191,.12),rgba(0,230,255,.08)),rgba(255,255,255,.025)!important;
    border:1px solid rgba(255,255,255,.07)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.32),0 0 24px rgba(255,63,191,.05)!important;
  }

  .balance-wrapper{
    margin-bottom:16px!important;
  }

  .balance-amount{
    font-size:28px!important;
  }

  .balance-plus{
    width:44px!important;
    height:44px!important;
    min-width:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:15px!important;
  }

  .uk-panel-box#add,
  #add.uk-panel-box{
    border-radius:18px!important;
    padding:14px!important;
  }

  @keyframes mobilePanelIn{
    from{opacity:0;transform:translateY(-6px)}
    to{opacity:1;transform:translateY(0)}
  }
}

@media (max-width: 380px){
  .mobile-brand img{width:138px!important;max-width:44vw!important;}
  .mobile-menu-toggle,
  .mobile-account-button{flex-basis:43px;width:43px;height:43px;border-radius:15px;}
  .mobile-drawer-actions{grid-template-columns:1fr;}
}

/* ===== Mobile UX v3 — жесткая доводка под современные телефоны ===== */
@media (max-width: 767px){
  html,
  body{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow-x:hidden!important;
    background:#070912!important;
    -webkit-text-size-adjust:100%;
  }

  *,
  *::before,
  *::after{
    box-sizing:border-box!important;
  }

  img,
  svg,
  video,
  canvas,
  iframe{
    max-width:100%!important;
  }

  table{
    max-width:100%!important;
  }

  a,
  button,
  input,
  select,
  textarea{
    -webkit-tap-highlight-color:rgba(0,230,255,.18);
  }

  body.mobile-menu-open,
  html.mobile-menu-open{
    overflow:hidden!important;
  }

  .uk-container,
  .uk-container-center,
  .tm-page-bg,
  .tm-container,
  .tm-middle,
  .tm-top-block,
  .tm-grid-block,
  .tm-main,
  .tm-content,
  .tm-article,
  .tm-article-content,
  .uk-article,
  .uk-panel,
  .uk-panel-box{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .uk-container,
  .uk-container-center{
    padding-left:10px!important;
    padding-right:10px!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .uk-grid,
  .tm-middle.uk-grid,
  .uk-grid.tm-grid-block{
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .uk-grid > *,
  [class*='uk-width-'],
  [class*='uk-width-medium-'],
  [class*='uk-width-large-']{
    float:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  #site-navigation.tm-corr.tm-navbar,
  .tm-corr.tm-navbar{
    position:sticky!important;
    top:0!important;
    z-index:3000!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    border-radius:0 0 20px 20px!important;
    border:1px solid rgba(0,230,255,.12)!important;
    border-top:0!important;
    background:rgba(7,9,18,.97)!important;
    overflow:visible!important;
    isolation:isolate;
  }

  .mobile-nav{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr) 52px;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    min-height:64px!important;
    padding:8px 10px!important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255,63,191,.16), transparent 35%),
      radial-gradient(circle at 82% 4%, rgba(0,230,255,.14), transparent 36%),
      linear-gradient(180deg,rgba(13,18,29,.98),rgba(7,9,18,.98))!important;
  }

  .desktop-nav-list{
    display:none!important;
  }

  .mobile-brand{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    min-width:0!important;
    height:48px!important;
    overflow:hidden!important;
  }

  .mobile-brand img{
    width:auto!important;
    max-width:170px!important;
    max-height:46px!important;
    object-fit:contain!important;
    filter:drop-shadow(0 0 15px rgba(255,63,191,.22));
  }

  .mobile-menu-toggle,
  .mobile-account-button,
  .mobile-menu-close,
  .mobile-section-toggle,
  .uk-button,
  .btn,
  button.btn,
  input[type='button'],
  input[type='submit']{
    /* appearance:none!important; */
    /* -webkit-appearance:none!important; */
    color:#f3fbff!important;
    /* text-shadow:none!important; */
    /* border-color:rgba(0,230,255,.22)!important; */
    /* background-color:rgba(12,19,30,.96)!important; */
    background-image:linear-gradient(135deg,rgba(0,230,255,.13),rgba(255,63,191,.10))!important;
    box-shadow:0 10px 24px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08)!important;
  }

  .mobile-menu-toggle,
  .mobile-account-button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:46px!important;
    min-height:46px!important;
    padding:0!important;
    margin:0!important;
    border-radius:16px!important;
    cursor:pointer!important;
    position:relative!important;
    z-index:3010!important;
    pointer-events:auto!important;
  }

  .mobile-menu-toggle{
    flex-direction:column!important;
    gap:5px!important;
  }

  .mobile-menu-toggle span{
    display:block!important;
    width:22px!important;
    height:2px!important;
    min-height:2px!important;
    padding:0!important;
    margin:0!important;
    border-radius:999px!important;
    background:#fff!important;
    box-shadow:0 0 10px rgba(0,230,255,.38)!important;
    transition:transform .22s ease, opacity .18s ease!important;
  }

  .mobile-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)!important;}
  .mobile-menu-toggle.is-open span:nth-child(2){opacity:0!important;}
  .mobile-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)!important;}

  .mobile-account-button{
    font-size:22px!important;
    text-decoration:none!important;
    border-color:rgba(255,63,191,.27)!important;
  }

  .mobile-menu-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:3990!important;
    display:block!important;
    width:100vw!important;
    height:100vh!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    background:rgba(1,3,10,.76)!important;
    backdrop-filter:blur(6px);
    transition:opacity .22s ease, visibility .22s ease!important;
  }

  body.mobile-menu-open .mobile-menu-backdrop,
  .mobile-menu-backdrop.is-visible{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  .mobile-menu-drawer{
    position:fixed!important;
    top:0!important;
    left:0!important;
    bottom:0!important;
    z-index:4000!important;
    display:flex!important;
    flex-direction:column!important;
    width:min(88vw,360px)!important;
    max-width:360px!important;
    min-width:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    padding:calc(16px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    transform:translate3d(-105%,0,0)!important;
    transition:transform .28s cubic-bezier(.22,.72,.18,1)!important;
    border-right:1px solid rgba(0,230,255,.18)!important;
    background:
      radial-gradient(circle at 10% 0%, rgba(255,63,191,.20), transparent 34%),
      radial-gradient(circle at 96% 15%, rgba(0,230,255,.18), transparent 34%),
      linear-gradient(180deg,rgba(13,19,31,.99),rgba(5,8,15,.99))!important;
    box-shadow:24px 0 60px rgba(0,0,0,.58),0 0 34px rgba(255,63,191,.08)!important;
    will-change:transform;
  }

  body.mobile-menu-open .mobile-menu-drawer{
    transform:translate3d(0,0,0)!important;
  }

  .mobile-drawer-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    margin:0 0 16px!important;
  }

  .mobile-drawer-logo{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
  }

  .mobile-drawer-logo img{
    width:auto!important;
    max-width:170px!important;
    max-height:48px!important;
    object-fit:contain!important;
  }

  .mobile-menu-close{
    display:flex!important;
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    margin:0!important;
    border-radius:15px!important;
    font-size:32px!important;
    line-height:1!important;
    cursor:pointer!important;
  }

  .mobile-drawer-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    width:100%!important;
    margin:0 0 14px!important;
  }

  .mobile-drawer-action,
  .mobile-menu-drawer .mobile-nav-list a,
  .lb-submenu-list a,
  .server-tabs .uk-subnav > li > a,
  .cabinet-sidebar .lb-list a,
  .cabinet-sidebar .action-btn{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:46px!important;
    padding:12px 14px!important;
    border:1px solid rgba(255,255,255,.075)!important;
    border-radius:15px!important;
    color:#eaf7ff!important;
    text-decoration:none!important;
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    line-height:1.25!important;
  }

  .mobile-drawer-action{
    justify-content:center!important;
    text-align:center!important;
    font-weight:700!important;
  }

  .mobile-drawer-action-primary,
  .mobile-menu-drawer .mobile-nav-list li.uk-active > a,
  .lb-submenu-list li.uk-active > a,
  .server-tabs .uk-subnav > li.uk-active > a,
  .cabinet-sidebar .lb-item.active > a,
  .cabinet-sidebar .action-btn.add-server,
  .cabinet-sidebar .action-btn.topup{
    border-color:rgba(0,230,255,.25)!important;
    background:linear-gradient(135deg,rgba(0,230,255,.15),rgba(255,63,191,.12))!important;
    color:#fff!important;
    box-shadow:0 0 24px rgba(0,230,255,.07), inset 0 1px 0 rgba(255,255,255,.08)!important;
  }

  .mobile-menu-drawer .mobile-nav-list,
  .lb-submenu-list,
  .server-tabs .uk-subnav,
  .cabinet-sidebar .lb-list{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
    overflow:visible!important;
  }

  .mobile-menu-drawer .mobile-nav-list li,
  .lb-submenu-list li,
  .server-tabs .uk-subnav > li,
  .cabinet-sidebar .lb-list > li{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  .mobile-section-nav,
  .cabinet-sidebar{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0 0 12px!important;
    padding:0!important;
    overflow:hidden!important;
  }

  .mobile-section-toggle{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:50px!important;
    padding:12px 14px!important;
    margin:0 0 10px!important;
    border-radius:17px!important;
    font-weight:800!important;
    letter-spacing:.01em!important;
    text-align:left!important;
    line-height:1.25!important;
    cursor:pointer!important;
    pointer-events:auto!important;
  }

  .mobile-section-toggle i{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    flex:0 0 24px!important;
    border-radius:50%!important;
    border:1px solid rgba(255,255,255,.14)!important;
    position:relative!important;
    margin-left:10px!important;
  }

  .mobile-section-toggle i::before,
  .mobile-section-toggle i::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:10px!important;
    height:2px!important;
    border-radius:999px!important;
    background:#fff!important;
    transform:translate(-50%,-50%)!important;
    transition:transform .2s ease!important;
  }

  .mobile-section-toggle i::after{
    transform:translate(-50%,-50%) rotate(90deg)!important;
  }

  .mobile-section-toggle.is-open i::after{
    transform:translate(-50%,-50%) rotate(0deg)!important;
  }

  .mobile-collapsible-panel{
    display:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  .mobile-collapsible-panel.is-open{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  .cabinet-sidebar .lb-panel.mobile-collapsible-panel.is-open{
    display:block!important;
  }

  .cabinet-sidebar .lb-panel{
    padding:12px!important;
    border-radius:18px!important;
  }

  .cabinet-sidebar .actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    margin:0 0 10px!important;
  }

  .tm-content .uk-article,
  .uk-article.tm-article,
  .uk-article{
    padding:12px!important;
    border-radius:18px!important;
    overflow:hidden!important;
  }

  .page-header,
  .listing-header,
  .balance-wrapper,
  .boost-container,
  .pay-container,
  .server-content,
  .uk-form,
  .uk-form-row,
  .uk-form-controls{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .uk-article-title,
  .page-header h1,
  h1{
    font-size:22px!important;
    line-height:1.2!important;
    overflow-wrap:anywhere!important;
  }

  p,
  li,
  td,
  th,
  a,
  span,
  div{
    overflow-wrap:anywhere;
  }

  input[type='text'],
  input[type='password'],
  input[type='email'],
  input[type='number'],
  input[type='search'],
  input[type='url'],
  select,
  textarea{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:44px!important;
    margin:0 0 9px!important;
    padding:10px 12px!important;
    border-radius:13px!important;
    color:#eaf7ff!important;
    background:rgba(255,255,255,.045)!important;
    border:1px solid rgba(0,230,255,.14)!important;
  }

  /* .uk-button, */
  /* .btn, */
  /* button.btn, */
  /* input[type='button'], */
  /* input[type='submit']{ */
    /* display:inline-flex!important; */
    /* align-items:center!important; */
    /* justify-content:center!important; */
    /* max-width:100%!important; */
    /* min-height:44px!important; */
    /* padding:10px 14px!important; */
    /* border-radius:14px!important; */
    /* line-height:1.2!important; */
    /* text-decoration:none!important; */
    /* white-space:normal!important; */
    /* cursor:pointer!important; */
  /* } */

  .tm-article-content .uk-button,
  .tm-article-content .btn,
  .tm-article-content button.btn,
  .tm-article-content input[type='button'],
  .tm-article-content input[type='submit']{
    width:100%!important;
    margin:5px 0!important;
  }

  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table){
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    border-collapse:separate!important;
    border-spacing:0!important;
  }

  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tbody,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tr{
    max-width:100%!important;
  }

  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) td,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) th{
    max-width:100%!important;
    white-space:normal!important;
    word-break:break-word!important;
  }

  #all_servers,
  #my_servers,
  .listing-summary-table,
  .listing-service-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  #all_servers tbody,
  #my_servers tbody,
  .listing-summary-table tbody,
  .listing-service-table tbody{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
  }

  #all_servers tr,
  #my_servers tr,
  .listing-summary-table tr,
  .listing-service-table tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:12px!important;
    overflow:hidden!important;
  }

  #all_servers td,
  #my_servers td,
  .listing-summary-table td,
  .listing-service-table td{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  #all_servers td > *,
  #my_servers td > *,
  .listing-summary-table td > *,
  .listing-service-table td > *{
    min-width:0!important;
    max-width:100%!important;
  }

  .ip-address,
  .listing-badge,
  .slots,
  .next-slot,
  .rounds,
  .paid-until,
  .boost-duration{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .uk-progress,
  .progress,
  .progress-bar{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .tpl-style-a07faa5b,
  .tpl-style-a733a4d0,
  .tpl-style-3e6ccc92,
  .tpl-style-db3b3887,
  .tpl-style-e7739a6d,
  .tpl-style-8ade942a,
  .tpl-style-6d722ccf,
  .tpl-style-9bca98f0{
    float:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .tpl-style-f3aeeeeb,
  .tpl-style-5172a7c4,
  .tpl-style-9ef5794a,
  .tpl-style-244c7511,
  .tpl-style-cfbe03e8,
  .tpl-style-7744a555,
  .tpl-style-5c2dc9e8,
  .tpl-style-e3d221c5,
  .tpl-style-f406b01d,
  .tpl-style-409f14bc,
  .tpl-style-bd530fce,
  .tpl-style-ad186065,
  .tpl-style-bb31b17e{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
  }

  .tpl-style-79da8ce0,
  .tpl-style-b89f6a89{
    float:none!important;
    width:64px!important;
    height:auto!important;
    margin:0!important;
    flex:0 0 auto!important;
  }

  #pay_system label,
  label.tpl-style-a733a4d0{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:82px!important;
    margin:0 0 10px!important;
    padding:12px!important;
    border-radius:16px!important;
    border:1px solid rgba(0,230,255,.14)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
  }

  label.tpl-style-a733a4d0 p,
  #pay_system label p{
    margin:0!important;
    text-align:left!important;
  }

  .uk-modal,
  .uk-modal-dialog{
    max-width:100vw!important;
    overflow-x:hidden!important;
  }

  .uk-modal-dialog{
    width:calc(100vw - 20px)!important;
    margin:16px 10px!important;
    border-radius:18px!important;
  }

  .instruction-widget{
    left:10px!important;
    right:10px!important;
    top:10px!important;
    width:auto!important;
    max-width:none!important;
  }
}

@media (max-width: 380px){
  .mobile-nav{
    grid-template-columns:48px minmax(0,1fr) 48px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .mobile-menu-toggle,
  .mobile-account-button{
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
  }
  .mobile-brand img{
    max-width:145px!important;
  }
  .mobile-drawer-actions{
    grid-template-columns:1fr!important;
  }
}

@media (max-width: 767px){
  html, body{
    margin:0!important;
    padding:0!important;
  }
  .mobile-menu-backdrop{
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    transform:none!important;
  }
  .mobile-section-toggle{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .mobile-collapsible-panel.is-open,
  .cabinet-sidebar .lb-panel.mobile-collapsible-panel.is-open{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media (max-width: 767px){
  button,
  input,
  textarea,
  select,
  .mobile-menu-toggle,
  .mobile-account-button,
  .mobile-menu-close,
  .mobile-section-toggle,
  .uk-button,
  .btn{
    -moz-box-sizing:border-box!important;
    -webkit-box-sizing:border-box!important;
    box-sizing:border-box!important;
  }
}

/* ===== Modal add server in cabinet ===== */
.add-server-modal .add-server-dialog{
  width:620px;
  max-width:calc(100vw - 32px);
  padding:0;
  overflow:hidden;
  border-radius:22px;
  color:var(--lb-text, #eaf7ff);
  border:1px solid rgba(0,230,255,.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(255,63,191,.16), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(0,230,255,.14), transparent 36%),
    linear-gradient(180deg, rgba(16,23,34,.98), rgba(7,9,18,.98));
  box-shadow:0 28px 80px rgba(0,0,0,.62), 0 0 34px rgba(255,63,191,.08), inset 0 1px 0 rgba(255,255,255,.06);
}

.add-server-modal .add-server-dialog::before{
  content:"";
  display:block;
  height:3px;
  background:linear-gradient(90deg, transparent, rgba(0,230,255,.85), rgba(255,63,191,.75), transparent);
  box-shadow:0 0 18px rgba(0,230,255,.32);
}

.add-server-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:2;
  color:#fff;
  opacity:.78;
}

.add-server-close:hover{
  opacity:1;
}

.add-server-modal-header{
  padding:24px 28px 18px;
  border-bottom:1px solid rgba(255,255,255,.065);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
}

.add-server-eyebrow{
  margin-bottom:7px;
  color:var(--lb-muted, #96a9b9);
  font-size:12px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.add-server-modal .add-server-title{
  margin:0;
  color:#ffffff;
  font-size:22px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:.01em;
  text-transform:none;
}

.add-server-form{
  padding:24px 28px 28px;
}

.add-server-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

.add-server-field label{
  display:block;
  margin:0 0 8px;
  color:var(--lb-muted, #96a9b9);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.add-server-field input,
.add-server-field select{
  width:100%;
  min-height:44px;
  margin:0;
  padding:11px 13px;
  border:1px solid rgba(0,230,255,.14);
  border-radius:14px;
  color:#eaf7ff;
  background:rgba(255,255,255,.045);
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.add-server-field input:focus,
.add-server-field select:focus{
  border-color:rgba(0,230,255,.36);
  background:rgba(255,255,255,.065);
  box-shadow:0 0 0 3px rgba(0,230,255,.08), 0 0 24px rgba(255,63,191,.05);
}

.add-server-field input::placeholder{
  color:rgba(234,247,255,.48);
}

.add-server-captcha{
  grid-column:1 / -1;
}

.add-server-captcha-image{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  margin:0 0 10px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  background:rgba(0,0,0,.18);
  cursor:pointer;
}

.add-server-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:22px;
}

.add-server-actions .uk-button{
  min-height:44px;
  padding:0 18px;
  border-radius:14px;
  font-weight:700;
  line-height:44px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.add-server-actions .uk-button:hover{
  transform:translateY(-1px);
}

.add-server-submit{
  color:#fff!important;
  border:1px solid rgba(0,230,255,.24)!important;
  background:linear-gradient(135deg, rgba(0,230,255,.20), rgba(255,63,191,.14))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10)!important;
}

.add-server-cancel{
  color:#cfd8e3!important;
  border:1px solid rgba(255,255,255,.075)!important;
  background:rgba(255,255,255,.035)!important;
}

@media (max-width:720px){
  .add-server-modal .add-server-dialog{
    width:calc(100vw - 20px);
    margin:16px 10px!important;
    border-radius:18px;
  }

  .add-server-modal-header,
  .add-server-form{
    padding-left:18px;
    padding-right:18px;
  }

  .add-server-grid{
    grid-template-columns:1fr;
    gap:13px;
  }

  .add-server-actions{
    flex-direction:column;
  }

  .add-server-actions .uk-button{
    width:100%;
  }
}

/* ===== Styled "Разделы сайта" mobile button ===== */
@media (max-width: 767px){
  .mobile-section-toggle.site-sections-toggle{
    position:relative!important;
    overflow:hidden!important;
    min-height:48px!important;
    padding:11px 14px 11px 45px!important;
    border:0!important;
    border-radius:16px!important;
    color:#f6fbff!important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255,63,191,.28), transparent 34%),
      radial-gradient(circle at 88% 8%, rgba(0,230,255,.24), transparent 38%),
      linear-gradient(135deg, rgba(14,22,35,.98), rgba(7,10,20,.98))!important;
    box-shadow:
      inset 0 0 0 1px rgba(0,230,255,.28),
      inset 0 1px 0 rgba(255,255,255,.10),
      0 12px 28px rgba(0,0,0,.38),
      0 0 20px rgba(0,230,255,.10)!important;
    text-transform:uppercase!important;
    letter-spacing:.055em!important;
  }

  .mobile-section-toggle.site-sections-toggle::before{
    content:"☰";
    position:absolute;
    left:14px;
    top:50%;
    transform:translateY(-50%);
    width:22px;
    height:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:7px;
    color:#ff6bd3;
    background:rgba(255,255,255,.045);
    box-shadow:0 0 16px rgba(255,63,191,.12);
    font-size:13px;
    line-height:1;
  }

  .mobile-section-toggle.site-sections-toggle::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);
    transform:translateX(-120%);
    transition:transform .45s ease;
  }

  .mobile-section-toggle.site-sections-toggle:hover,
  .mobile-section-toggle.site-sections-toggle:focus,
  .mobile-section-toggle.site-sections-toggle.is-open{
    color:#fff!important;
    transform:translateY(-1px);
    box-shadow:
      inset 0 0 0 1px rgba(255,63,191,.40),
      inset 0 1px 0 rgba(255,255,255,.12),
      0 14px 32px rgba(0,0,0,.42),
      0 0 24px rgba(255,63,191,.12),
      0 0 22px rgba(0,230,255,.10)!important;
  }

  .mobile-section-toggle.site-sections-toggle:hover::after,
  .mobile-section-toggle.site-sections-toggle:focus::after,
  .mobile-section-toggle.site-sections-toggle.is-open::after{
    transform:translateX(120%);
  }

  .site-sections-toggle__label{
    position:relative;
    z-index:1;
    display:inline-flex;
    align-items:center;
    min-width:0;
  }

  .mobile-section-toggle.site-sections-toggle i{
    position:relative!important;
    z-index:1;
    background:rgba(0,230,255,.08)!important;
    box-shadow:0 0 16px rgba(0,230,255,.12)!important;
  }
}

/* ===== Container-only fix for mobile "Разделы сайта" button ===== */
@media (max-width: 767px){
  .mobile-section-nav.lb-submenu{
    background:transparent!important;
    background-color:transparent!important;
    margin:0 0 12px!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    overflow:visible!important;
  }

  .mobile-section-nav.lb-submenu::before,
  .mobile-section-nav.lb-submenu::after{
    display:none!important;
  }

  .mobile-section-toggle.site-sections-toggle{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 10px!important;
    padding:11px 14px 11px 45px!important;
    border:0!important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255,63,191,.28), transparent 34%),
      radial-gradient(circle at 88% 8%, rgba(0,230,255,.24), transparent 38%),
      linear-gradient(135deg, rgba(14,22,35,.98), rgba(7,10,20,.98))!important;
    box-shadow:
      inset 0 0 0 1px rgba(0,230,255,.28),
      inset 0 1px 0 rgba(255,255,255,.10),
      0 12px 28px rgba(0,0,0,.38),
      0 0 20px rgba(0,230,255,.10)!important;
  }

  .mobile-section-toggle.site-sections-toggle i{
    flex:0 0 22px!important;
    min-width:22px!important;
    margin-left:10px!important;
  }
}


/* ===== Разделы сайта внутри основного меню только на мобильных ===== */
@media (max-width: 767px){
  .mobile-nav-sections{
    width:100%!important;
    margin:16px 0 0!important;
    padding:14px 0 0!important;
    border-top:1px solid rgba(255,255,255,.075)!important;
  }

  .mobile-nav-sections-title{
    margin:0 0 9px!important;
    padding:0 4px!important;
    color:#718091!important;
    font-size:11px!important;
    font-weight:700!important;
    line-height:1.2!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
  }

  .mobile-nav-sections-list{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
  }

  .mobile-nav-sections-list li{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  
.mobile-nav-sections-list,
.mobile-nav-sections-list > li,
.mobile-nav-sections-list > li > a {
    text-align: left !important;
    justify-content: flex-start !important;
    justify-items: start !important;
    align-items: flex-start !important;
}

@media (max-width: 600px) {
    .mobile-nav-sections-list,
    .mobile-nav-sections-list > li,
    .mobile-nav-sections-list > li > a {
        text-align: left !important;
        justify-content: flex-start !important;
        justify-items: start !important;
        align-items: flex-start !important;
    }
}

  .mobile-nav-sections-list a{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:40px!important;
    padding:9px 12px!important;
    border-radius:13px!important;
    border:1px solid rgba(255,255,255,.045)!important;
    color:#aebdcc!important;
    background:rgba(255,255,255,.018)!important;
    box-shadow:none!important;
    text-decoration:none!important;
    font-size:14px!important;
    font-weight:500!important;
    line-height:1.25!important;
    letter-spacing:.01em!important;
  }

  .mobile-nav-sections-list li.uk-active > a,
  .mobile-nav-sections-list a:hover,
  .mobile-nav-sections-list a:focus{
    color:#edfaff!important;
    border-color:rgba(0,230,255,.14)!important;
    background:linear-gradient(90deg, rgba(0,230,255,.055), rgba(255,63,191,.04))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
    outline:none!important;
  }
}

/* ===== Stable mobile layout for listing server cards ===== */
@media (max-width: 767px){
  .listing-service-table tbody{
    display:block!important;
  }

  .listing-service-table tbody > tr{
    display:block!important;
    box-sizing:border-box!important;
    margin:0 0 12px!important;
  }

  .listing-service-table tbody > tr > td{
    display:grid!important;
    grid-template-columns:minmax(92px, 38%) minmax(0, 1fr)!important;
    align-items:center!important;
    gap:12px!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-height:42px!important;
    text-align:right!important;
  }

  .listing-service-table tbody > tr > td::before{
    display:block!important;
    min-width:0!important;
    margin:0!important;
    text-align:left!important;
  }

  .listing-service-table tbody > tr > td > *{
    justify-self:end;
    min-width:0!important;
    max-width:100%!important;
  }

  .listing-service-table .listing-name-cell a,
  .listing-service-table .ip-address,
  .listing-service-table .map-name-down,
  .listing-service-table .paid-until{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .listing-service-table .uk-progress{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }

  .listing-service-table .rounds{
    width:auto!important;
    min-width:52px!important;
    margin:0!important;
    text-align:center!important;
  }
}

/* ===== Cabinet menu: reserve space for icons on mobile ===== */
@media (max-width: 767px){
  .cabinet-sidebar .action-btn,
  .cabinet-sidebar .lb-list > li > a{
    box-sizing:border-box!important;
    padding:12px 14px 12px 46px!important;
  }

  .cabinet-sidebar .action-btn::before,
  .cabinet-sidebar .lb-list > li > a::before{
    left:15px!important;
    width:18px!important;
    height:18px!important;
  }

  .cabinet-sidebar .lb-list > li{
    display:block!important;
    min-height:0!important;
  }
}

/* ===== Safe mobile overflow fixes: tables, forms and long text ===== */
@media (max-width: 767px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
    word-break:normal!important;
    overflow-wrap:normal!important;
    -webkit-hyphens:manual!important;
    -ms-hyphens:manual!important;
    hyphens:manual!important;
  }

  .tm-content,
  .uk-article,
  #text,
  .tm-article-content,
  .uk-panel,
  .uk-form,
  .uk-form-row,
  .uk-form-controls{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* Не ломаем слова по одной букве: длинные строки переносятся только когда это нужно. */
  p,
  li,
  a,
  span,
  div,
  td,
  th{
    word-break:normal!important;
    overflow-wrap:break-word!important;
    -webkit-hyphens:manual!important;
    -ms-hyphens:manual!important;
    hyphens:manual!important;
  }

  /* Обычные текстовые таблицы из страниц (например, партнёры) не сжимаем до вертикальных колонок — даём аккуратный горизонтальный скролл. */
  #text table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table),
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table),
  .uk-article > table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table){
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    table-layout:auto!important;
    border-collapse:collapse!important;
  }

  #text table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tbody,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tbody,
  .uk-article > table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tbody{
    display:table-row-group!important;
  }

  #text table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tr,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tr,
  .uk-article > table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) tr{
    display:table-row!important;
  }

  #text table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) th,
  #text table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) td,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) th,
  .tm-article-content table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) td,
  .uk-article > table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) th,
  .uk-article > table:not(#all_servers):not(#my_servers):not(.listing-summary-table):not(.listing-service-table) td{
    display:table-cell!important;
    /* width:auto!important; */
    min-width:96px!important;
    max-width:none!important;
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    vertical-align:middle!important;
  }

  /* Поля ввода не выходят за пределы карточек даже при width:100% и внутренних padding. */
  input,
  textarea,
  select,
  button,
  .btn,
  .uk-button,
  .uneditable-input{
    box-sizing:border-box!important;
    max-width:100%!important;
  }

  input:not([type='checkbox']):not([type='radio']):not([type='file']):not([type='image']),
  textarea,
  select{
    min-width:0!important;
  }

  .uk-form input:not([type='checkbox']):not([type='radio']):not([type='file']):not([type='image']),
  .uk-form textarea,
  .uk-form select,
  .uk-form-controls input:not([type='checkbox']):not([type='radio']):not([type='file']):not([type='image']),
  .uk-form-controls textarea,
  .uk-form-controls select{
    width:100%!important;
  }

  .input-append,
  .input-prepend,
  .controls,
  .control-group,
  .uk-form-controls{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden;
  }

  /* Периоды покупки услуги на мобильных: вместо узких вертикальных колонок — сетка нормальных карточек. */
  #service_period,
  #service_period table,
  #service_period tbody{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  #service_period tr{
    display:grid!important;
    grid-template-columns:repeat(auto-fit, minmax(135px, 1fr))!important;
    gap:8px!important;
    width:100%!important;
  }

  #service_period td,
  #service_period .tpl-style-8ade942a{
    display:block!important;
    float:none!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding:0!important;
  }

  #service_period label{
    display:block!important;
    width:100%!important;
    margin:0!important;
  }

  #service_period p{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:48px!important;
    margin:0!important;
    padding:8px 10px!important;
    text-align:center!important;
    line-height:1.25!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    box-sizing:border-box!important;
  }

  /* Платёжный блок держится внутри карточки. */
  .pay-container,
  #service_pay_system{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .pay-container > label,
  .pay-balance,
  .pay-deposit,
  .pay-deposit a,
  .pay-text{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .pay-balance{
    padding:12px!important;
  }

  .pay-text{
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
  }
}






/* =========================================================
   LISTING SERVICE — compact horizontal mobile layout
   ========================================================= */

@media (max-width: 767px){

  .listing-service-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    background:transparent!important;
    border:0!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .listing-service-table thead{
    display:none!important;
  }

  .listing-service-table tbody{
    display:flex!important;
    flex-direction:column!important;
    width:max-content!important;
    min-width:100%!important;
    max-width:none!important;
    overflow:visible!important;
  }

  /* Одна строка сервера */
  .listing-service-table tbody > tr{
    display:flex!important;
    align-items:center!important;

    width:max-content!important;
    min-width:100%!important;
    max-width:none!important;

    margin:0 0 6px!important;
    padding:7px 8px!important;

    box-sizing:border-box!important;

    border:1px solid rgba(0,230,255,.10)!important;
    border-radius:9px!important;

    background:
      linear-gradient(
        90deg,
        rgba(11,15,22,.98),
        rgba(14,19,28,.96)
      )!important;

    box-shadow:
      0 4px 12px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.025)!important;

    overflow:visible!important;
  }

  /* Все ячейки — горизонтально */
  .listing-service-table tbody > tr > td{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;

    flex:0 0 auto!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;

    min-height:28px!important;

    margin:0!important;
    padding:0 8px!important;

    box-sizing:border-box!important;

    border:0!important;
    border-right:1px solid rgba(255,255,255,.055)!important;

    text-align:left!important;
    white-space:nowrap!important;

    /* overflow:visible!important; */
  }

  .listing-service-table tbody > tr > td:last-child{
    border-right:0!important;
    padding-right:4px!important;
  }

  /* Убираем подписи */
  .listing-service-table td::before{
    display:none!important;
    content:none!important;
  }

  /* ---------------------------------------------------------
     1. Страна
     --------------------------------------------------------- */

  .listing-service-table td:nth-child(1){
    width:34px!important;
    min-width:34px!important;
    padding:0 5px!important;
    justify-content:center!important;
  }

  /* ---------------------------------------------------------
     2. Сервер + IP
     Название сверху, IP снизу, но всё в одной строке таблицы
     --------------------------------------------------------- */

.listing-service-table td:nth-child(2){
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;

    min-width:200px!important;
    max-width:200px!important;

    padding:0 9px!important;

    box-sizing:border-box!important;

    line-height:normal!important;

    overflow:hidden!important;
}


/* Название сервера */
.listing-service-table td:nth-child(2) .listing-name-cell,
.listing-service-table td:nth-child(2) .listing-name-cell a{
    display:block!important;

    width:100%!important;
    max-width:100%!important;

    box-sizing:border-box!important;

    font-size:12px!important;
    line-height:15px!important;

    white-space:nowrap!important;

    overflow:hidden!important;
    text-overflow:ellipsis!important;
}


/* IP адрес */
.listing-service-table td:nth-child(2) .ip-address{
    display:block!important;

    width:100%!important;
    max-width:100%!important;

    box-sizing:border-box!important;

    margin-top:2px!important;

    font-size:10px!important;
    line-height:12px!important;

    white-space:nowrap!important;

    overflow:hidden!important;
    text-overflow:ellipsis!important;

    overflow-wrap:normal!important;
}

  /* ---------------------------------------------------------
     3. Игроки / прогресс
     --------------------------------------------------------- */

  .listing-service-table td:nth-child(3){
    min-width:170px!important;
    justify-content:center!important;
    padding:0 8px!important;
  }

  .listing-service-table .uk-progress{
    width:75px!important;
    min-width:75px!important;
    max-width:75px!important;

    margin:0!important;
  }

  /* ---------------------------------------------------------
     4. Карта
     --------------------------------------------------------- */

  .listing-service-table td:nth-child(4){
    min-width:105px!important;
    padding:0 8px!important;
  }

  .listing-service-table .map-name-down{
    display:block!important;

    max-width:none!important;

    /* font-size:11px!important; */
    line-height:14px!important;

    white-space:nowrap!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
  }

  /* ---------------------------------------------------------
     5. Коннект / дата / последний блок
     --------------------------------------------------------- */

  .listing-service-table td:nth-child(5),
  .listing-service-table td:nth-child(6){
    /* min-width:100px!important; */

    padding:0 8px!important;

    /* overflow:visible!important; */
  }

  .listing-service-table .paid-until,
  .listing-service-table .rounds,
  .listing-service-table .slots,
  .listing-service-table .next-slot{
    display:inline-flex!important;
    align-items:center!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;

    white-space:nowrap!important;
    /* overflow:visible!important; */
    overflow-wrap:normal!important;

    /* font-size:10px!important; */
    /* line-height:13px!important; */
  }

  /* Полностью запрещаем старым правилам обрезать содержимое */
  .listing-service-table td > *,
  .listing-service-table td span,
  .listing-service-table td a{
    max-width:none!important;
    /* overflow:visible!important; */
  }
}


/* Очень узкие телефоны */
@media (max-width:380px){

  .listing-service-table tbody > tr{
    padding:6px 7px!important;
    margin-bottom:5px!important;
  }

  .listing-service-table tbody > tr > td{
    padding-left:6px!important;
    padding-right:6px!important;
  }

  .listing-service-table td:nth-child(1){
    min-width:30px!important;
    width:30px!important;
  }

  .listing-service-table td:nth-child(2){
    min-width:140px!important;
  }

  .listing-service-table td:nth-child(3){
    min-width:115px!important;
  }

  .listing-service-table td:nth-child(4){
    min-width:95px!important;
  }

  .listing-service-table td:nth-child(5),
  .listing-service-table td:nth-child(6){
    min-width:95px!important;
  }
}

/* Мобильная версия списка серверов */
@media (max-width: 767px) {

    table {
        width: 100%;
        max-width: 100%;
        table-layout: fixed;
    }

    table th,
    table td {
        padding: 8px 6px;
        font-size: 12px;
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
		white-space: nowrap !important;
    }

    table thead th {
        padding: 9px 6px;
        font-size: 10px;
		white-space: nowrap !important;
    }

    table thead th:first-child {
        width: 100%;
		white-space: nowrap !important;
    }
}

/* =========================================================
   Заголовок списка серверов
   ========================================================= */

.servers-page-title {
    position: relative;

    width: 100%;
    box-sizing: border-box;

    margin: 0 0 14px !important;
    padding: 14px 18px !important;

    background:
        linear-gradient(
            180deg,
            rgba(14, 20, 30, 0.98),
            rgba(9, 14, 22, 0.98)
        ) !important;

    /* border: 1px solid rgba(0, 210, 255, 0.10) !important; */
    border-radius: 6px !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.025);

    overflow: hidden;
}


/* Голубая линия сверху */
.servers-page-title::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            rgba(0, 210, 255, 0.00),
            rgba(0, 210, 255, 0.85),
            rgba(0, 210, 255, 0.20),
            rgba(0, 210, 255, 0.00)
        );

    box-shadow:
        0 0 10px rgba(0, 210, 255, 0.25);
}


/* Заголовок */
.servers-page-title h2 {
    position: relative;

    margin: 0 !important;
    padding: 0 !important;

    font-family:
        "Segoe UI",
        Roboto,
        "Helvetica Neue",
        Arial,
        sans-serif !important;

    font-size: 24px !important;
    font-weight: 600 !important;

    line-height: 1.25 !important;

    letter-spacing: 0.02em !important;

    color: #e8f9ff !important;

    text-align: left !important;

    text-shadow:
        0 0 10px rgba(0, 210, 255, 0.10);
}


/* Маленький голубой акцент перед текстом */
.servers-page-title h2::before {
    content: "";

    display: inline-block;

    width: 4px;
    height: 22px;

    margin-right: 11px;

    vertical-align: -3px;

    border-radius: 3px;

    background:
        linear-gradient(
            180deg,
            #00d6ff,
            #00a9d0
        );

    box-shadow:
        0 0 10px rgba(0, 214, 255, 0.35);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .servers-page-title {
        margin: 0 0 10px !important;
        padding: 11px 12px !important;

        border-radius: 6px !important;
    }

    .servers-page-title h2 {
        font-size: 18px !important;
        line-height: 1.3 !important;

        letter-spacing: 0.01em !important;
    }

    .servers-page-title h2::before {
        width: 3px;
        height: 18px;

        margin-right: 8px;

        vertical-align: -3px;
    }
}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 380px) {

    .servers-page-title {
        padding: 10px !important;
    }

    .servers-page-title h2 {
        font-size: 16px !important;
    }

    .servers-page-title h2::before {
        height: 16px;
        margin-right: 7px;
    }
}

/* =========================================================
   ALL SERVERS — MOBILE FIX
   ========================================================= */

@media (max-width: 767px) {

    /* ГОЛОСА: + VIP - справа */
    #all_servers td:nth-child(7) {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 0 !important;
        min-height: 34px !important;
        padding: 7px 0 !important;
        box-sizing: border-box !important;
    }

    #all_servers td:nth-child(7)::before {
        position: absolute !important;
        left: 0 !important;
        top: 50% !important;
        width: 42% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        text-align: left !important;
    }

    #all_servers td:nth-child(7) .uk-icon-plus {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 18px !important;
        height: 20px !important;
        margin: 0 5px !important;
    }

    #all_servers td:nth-child(7) .uk-badge,
    #all_servers td:nth-child(7) .uk-badge-success {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 20px !important;
        line-height: 20px !important;
        padding: 0 7px !important;
        margin: 0 4px !important;
        box-sizing: border-box !important;
    }

    #all_servers td:nth-child(7) .uk-icon-minus {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 18px !important;
        height: 20px !important;
        margin: 0 0 0 5px !important;
    }


    /* АДРЕС: IP → флаг */
    #all_servers td:nth-child(3) {
        display: grid !important;
        grid-template-columns: 42% minmax(0, 1fr) auto !important;
        align-items: center !important;
        column-gap: 6px !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        text-align: right !important;
    }

    #all_servers td:nth-child(3)::before {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: auto !important;
        margin: 0 !important;
        text-align: left !important;
    }

    #all_servers td:nth-child(3) img {
        grid-column: 3 !important;
        grid-row: 1 !important;
        display: block !important;
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        justify-self: end !important;
        align-self: center !important;
    }
}


/* Узкие телефоны */
@media (max-width: 380px) {

    #all_servers td:nth-child(7) .uk-icon-plus,
    #all_servers td:nth-child(7) .uk-icon-minus {
        width: 17px !important;
        margin-left: 3px !important;
        margin-right: 3px !important;
    }

    #all_servers td:nth-child(7) .uk-badge,
    #all_servers td:nth-child(7) .uk-badge-success {
        padding: 0 6px !important;
        margin-left: 3px !important;
        margin-right: 3px !important;
    }

    #all_servers td:nth-child(3) {
        grid-template-columns: 42% minmax(0, 1fr) auto !important;
        column-gap: 5px !important;
    }

    #all_servers td:nth-child(3) img {
        width: 17px !important;
        min-width: 17px !important;
        max-width: 17px !important;
    }
}

/* =========================================================
   ALL SERVERS — FINAL MOBILE TWEAKS
   ========================================================= */

@media (max-width: 767px) {

    /* -----------------------------------------------------
       Название сервера
       Немного увеличиваем шрифт
       ----------------------------------------------------- */

    #all_servers td:nth-child(2) {
        font-size: 14px !important;
    }

    #all_servers td:nth-child(2) a {
        font-size: 15px !important;
        line-height: 18px !important;

        display: inline-block !important;

        max-width: 100% !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }


    /* -----------------------------------------------------
       Увеличиваем допустимую длину названия
       ----------------------------------------------------- */

    #all_servers td:nth-child(2) > *,
	
#all_servers td:nth-child(2) a {
    font-size: 15px !important;
    line-height: 18px !important;
    display: inline-block !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}


    /* -----------------------------------------------------
       Полностью убираем строку "Коннект"
       ----------------------------------------------------- */

    #all_servers td:nth-child(4) {
        display: none !important;
    }
}


/* =========================================================
   Очень узкие телефоны
   ========================================================= */

@media (max-width: 380px) {

    #all_servers td:nth-child(2) {
        font-size: 13px !important;
    }

#all_servers td:nth-child(2) a {
        font-size: 13px !important;
        line-height: 17px !important;
        max-width: 78% !important;
    }
}

/* =========================================================
   SERVICE PERIODS — MOBILE FINAL
   Горизонтальные карточки с нормальным расстоянием
   ========================================================= */

@media (max-width: 767px) {

    /* =====================================================
       ВНЕШНИЙ КОНТЕЙНЕР — СКРОЛЛ
       ===================================================== */

    #service_period {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        box-sizing: border-box !important;

        -webkit-overflow-scrolling: touch !important;
    }


    /* =====================================================
       ТАБЛИЦА
       ===================================================== */

    #service_period > table,
    #service_period table.tpl-style-074b78c3 {

        display: block !important;

        width: max-content !important;
        min-width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;

        border-collapse: separate !important;
        border-spacing: 0 !important;

        table-layout: auto !important;

        overflow: visible !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       TBODY
       ===================================================== */

    #service_period > table > tbody,
    #service_period table.tpl-style-074b78c3 > tbody {

        display: block !important;

        width: max-content !important;
        min-width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 4px 8px 10px !important;

        overflow: visible !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       СТРОКА
       ===================================================== */

    #service_period > table > tbody > tr,
    #service_period table.tpl-style-074b78c3 > tbody > tr {

        display: flex !important;

        flex-direction: row !important;
        flex-wrap: nowrap !important;

        align-items: stretch !important;

        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;

        gap: 14px !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       КАРТОЧКИ ПЕРИОДОВ
       ===================================================== */

    #service_period > table > tbody > tr > td,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td,
    #service_period .tpl-style-8ade942a {

        display: block !important;

        flex: 0 0 145px !important;

        width: 175px !important;
        min-width: 175px !important;
        max-width: 175px !important;

        height: auto !important;

        float: none !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        vertical-align: top !important;

        overflow: visible !important;
    }


    /* =====================================================
       LABEL
       ===================================================== */

    #service_period > table > tbody > tr > td > label,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td > label {

        display: block !important;

        width: 175px !important;
        max-width: 175px !important;
        min-width: 175px !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        overflow: visible !important;
    }


    /* =====================================================
       КАРТОЧКА
       ===================================================== */

    #service_period > table > tbody > tr > td > label > p,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td > label > p {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 175px !important;
        max-width: 175px !important;
        min-width: 175px !important;

        min-height: 43x !important;

        margin: 0 !important;
        padding: 9px 10px !important;

        box-sizing: border-box !important;

        border-radius: 12px !important;

        text-align: center !important;

        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;

        overflow: hidden !important;

        /* Полностью убираем старый scale */
        transform: none !important;

        transition:
            background .2s ease,
            border-color .2s ease,
            box-shadow .2s ease !important;
    }


    /* =====================================================
       HOVER
       ===================================================== */

    #service_period > table > tbody > tr > td > label > p:hover,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td > label > p:hover {

        transform: none !important;

        background:
            linear-gradient(
                135deg,
                rgba(0,230,255,.10),
                rgba(255,63,191,.07)
            ) !important;

        box-shadow:
            0 4px 14px rgba(0,0,0,.25),
            0 0 12px rgba(0,230,255,.08) !important;
    }


    /* =====================================================
       ВЫБРАННЫЙ ПЕРИОД
       ===================================================== */

    #service_period input[type="radio"]:checked + p {

        transform: none !important;

        box-shadow:
            0 0 0 1px rgba(0,230,255,.22),
            0 5px 16px rgba(0,0,0,.25) !important;
    }


    /* Радио скрываем */
    #service_period input[type="radio"] {
        display: none !important;
    }


    /* =====================================================
       СКРОЛЛБАР
       ===================================================== */

    #service_period::-webkit-scrollbar {
        height: 4px !important;
    }

    #service_period::-webkit-scrollbar-track {
        background: rgba(255,255,255,.04) !important;
        border-radius: 10px !important;
    }

    #service_period::-webkit-scrollbar-thumb {
        background: rgba(0,230,255,.25) !important;
        border-radius: 10px !important;
    }
}


/* =========================================================
   УЗКИЕ ТЕЛЕФОНЫ
   ========================================================= */

@media (max-width: 380px) {

    #service_period > table > tbody > tr,
    #service_period table.tpl-style-074b78c3 > tbody > tr {

        gap: 11px !important;
    }


    #service_period > table > tbody > tr > td,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td,
    #service_period .tpl-style-8ade942a {

        flex-basis: 135px !important;

        width: 135px !important;
        min-width: 135px !important;
        max-width: 135px !important;
    }


    #service_period > table > tbody > tr > td > label,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td > label {

        width: 135px !important;
        min-width: 135px !important;
        max-width: 135px !important;
    }


    #service_period > table > tbody > tr > td > label > p,
    #service_period table.tpl-style-074b78c3 > tbody > tr > td > label > p {

        width: 135px !important;
        min-width: 135px !important;
        max-width: 135px !important;

        min-height: 60px !important;

        padding: 8px !important;
    }
}

/* =========================================================
   DESKTOP — ТОЛЬКО ПЕРИОД И НАЗВАНИЕ СЕРВЕРА
   ========================================================= */

@media (min-width: 768px) {

    /* Название сервера */
    .listing-service-table .listing-name-cell,
    .listing-service-table .listing-name-cell a {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

    /* Период */
    .listing-service-table .service-period,
    .listing-service-table .period,
    .listing-service-table td.period {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

}

/* =========================================================
   ПК — НЕ ПЕРЕНОСИТЬ НАЗВАНИЕ СЕРВЕРА И ПЕРИОД
   Мобильную версию НЕ ТРОГАЕМ
   ========================================================= */

@media (min-width: 768px) {

    /* Название сервера */
    .listing-service-table .listing-name-cell,
    .listing-service-table .listing-name-cell a {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }


    /* Оплачено до */
    .listing-service-table .paid-until {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }

}

@media (max-width: 767px) {

    /* =========================================
       СТРАНИЦА СЕРВЕРА — МОБИЛЬНАЯ ВЕРСИЯ
       ========================================= */

    .tm-main,
    .tm-content,
    .tm-article-content,
    .uk-article {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }


    /* =========================================
       ЗАГОЛОВОК СЕРВЕРА
       ========================================= */

    .listing-header-wrap {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 0 12px !important;
        box-sizing: border-box !important;
    }

    .listing-header {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;

        gap: 10px !important;

        padding: 12px !important;
        margin: 0 !important;

        box-sizing: border-box !important;

        overflow: hidden !important;

        -webkit-mask-image: none !important;
        mask-image: none !important;
    }


    /* =========================================
       КАРТИНКА
       ========================================= */

    .listing-header img {
        display: block !important;

        width: auto !important;
        max-width: 100% !important;
        height: auto !important;

        margin: 0 !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       КОЛИЧЕСТВО ИГРОКОВ
       ========================================= */

    .listing-header + p,
    .listing-header ~ p {
        max-width: 100% !important;

        box-sizing: border-box !important;

        margin: 8px 0 !important;
        padding: 0 !important;

        line-height: 1.4 !important;
    }


    /* =========================================
       ОСНОВНОЙ БЛОК ИНФОРМАЦИИ
       ========================================= */

    .uk-article .listing-info,
    .uk-article .listing-details,
    .uk-article .server-info {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 10px 0 !important;
        padding: 12px !important;

        box-sizing: border-box !important;

        overflow: hidden !important;
    }


    /* =========================================
       СПИСОК ИНФОРМАЦИИ О СЕРВЕРЕ
       ========================================= */

    .uk-article .uk-list {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        list-style: none !important;
    }

    .uk-article .uk-list > li {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        display: flex !important;
        align-items: center !important;
        flex-wrap: wrap !important;

        gap: 6px !important;

        margin: 0 !important;
        padding: 7px 0 !important;

        box-sizing: border-box !important;

        line-height: 1.4 !important;
    }


    /* =========================================
       УБИРАЕМ ПЕРЕНОСЫ
       ========================================= */

    .uk-article .uk-list > li br {
        display: none !important;
    }

    .uk-article .uk-list > li > strong,
    .uk-article .uk-list > li > b,
    .uk-article .uk-list > li > span,
    .uk-article .uk-list > li > a {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }


    /* =========================================
       АДРЕС
       ========================================= */

    .uk-article .ip-address {
        display: inline !important;

        max-width: 100% !important;

        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }


    /* =========================================
       БЕЙДЖИ
       ========================================= */

    .uk-article .listing-badge {
        display: inline-flex !important;

        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;

        align-items: center !important;

        white-space: nowrap !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       КОННЕКТЫ
       ========================================= */

    .uk-article .uk-list > li:last-child {
        display: flex !important;

        align-items: center !important;

        flex-wrap: wrap !important;

        gap: 6px !important;
    }

    .uk-article .uk-list > li:last-child .uk-button,
    .uk-article .uk-list > li:last-child button {
        display: inline-flex !important;

        width: auto !important;

        min-width: 42px !important;
        max-width: 70px !important;

        height: 34px !important;
        min-height: 34px !important;

        margin: 0 !important;

        padding: 5px 12px !important;

        align-items: center !important;
        justify-content: center !important;

        flex: 0 0 auto !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       ЗАГОЛОВКИ
       ========================================= */

    .uk-article h2,
    .uk-article h3 {
        width: 100% !important;
        max-width: 100% !important;

        margin: 20px 0 8px !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        line-height: 1.2 !important;
    }


    /* =========================================
       ТАБЛИЦА УСЛУГ
       ========================================= */

    .uk-article .listing-service-table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        /*
         * ВАЖНО:
         * здесь НЕ ставим overflow:hidden
         */
        overflow-x: auto !important;
        overflow-y: hidden !important;

        -webkit-overflow-scrolling: touch !important;
    }


    .uk-article .listing-service-table tr {
        width: 100% !important;
        max-width: none !important;

        box-sizing: border-box !important;
    }


    .uk-article .listing-service-table td {
        max-width: none !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       ЕСЛИ ВНУТРИ ЕСТЬ ОБЁРТКА
       ========================================= */

    .uk-article .listing-service-table-wrapper,
    .uk-article .table-scroll,
    .uk-article .table-responsive {
        width: 100% !important;
        max-width: 100% !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        -webkit-overflow-scrolling: touch !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       ТАБЛИЦА МОЖЕТ БЫТЬ ШИРЕ ЭКРАНА
       ========================================= */

    .uk-article .listing-service-table table {
        max-width: none !important;
    }


    /* =========================================
       ПАРАГРАФЫ
       ========================================= */

    .uk-article p {
        max-width: 100% !important;

        box-sizing: border-box !important;
    }

}

@media (max-width: 767px){

    .server-tabs,
    .mobile-section-nav{
        display:block!important;

        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        margin-left:0!important;
        margin-right:0!important;

        padding-left:0!important;
        padding-right:0!important;

        box-sizing:border-box!important;

        overflow-x:hidden!important;
        overflow-y:visible!important;
    }


    .server-tabs *,
    .mobile-section-nav *{
        max-width:100%!important;
        min-width:0!important;
        box-sizing:border-box!important;
    }


    .server-tabs .uk-subnav{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        margin-left:0!important;
        margin-right:0!important;

        padding-left:0!important;
        padding-right:0!important;

        box-sizing:border-box!important;
    }


    .server-tabs .uk-subnav > li{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        margin-left:0!important;
        margin-right:0!important;

        padding-left:0!important;
        padding-right:0!important;

        box-sizing:border-box!important;
    }


    .server-tabs .uk-subnav > li > a,
    .mobile-section-nav a,
    .mobile-section-nav button{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        margin-left:0!important;
        margin-right:0!important;

        box-sizing:border-box!important;

        overflow:hidden!important;

        white-space:normal!important;
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
    }
}

@media (max-width: 767px){

    /* =========================================
       СКРЫВАЕМ КНОПКУ «МЕНЮ СЕРВЕРА»
       ========================================= */

    .server-tabs .mobile-section-toggle,
    .mobile-section-nav .mobile-section-toggle{
        display:none!important;
    }


    /* =========================================
       ПУНКТЫ МЕНЮ ВСЕГДА ВИДИМЫ
       ========================================= */

    .server-tabs .mobile-collapsible-panel,
    .mobile-section-nav .mobile-collapsible-panel{

        display:block!important;

        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        height:auto!important;

        max-height:none!important;

        margin:0!important;

        padding:0!important;

        opacity:1!important;

        visibility:visible!important;

        transform:none!important;

        animation:none!important;

        transition:none!important;

        overflow:visible!important;

        box-sizing:border-box!important;
    }


    /* =========================================
       УБИРАЕМ АНИМАЦИЮ У ПУНКТОВ
       ========================================= */

    .server-tabs *,
    .mobile-section-nav *{

        animation:none!important;

        transition:none!important;

        transform:none!important;
    }


    /* =========================================
       СПИСОК ПУНКТОВ
       ========================================= */

    .server-tabs .uk-subnav,
    .server-tabs .lb-submenu-list,
    .mobile-section-nav .uk-subnav,
    .mobile-section-nav .lb-submenu-list{

        display:grid!important;

        grid-template-columns:minmax(0,1fr)!important;

        gap:8px!important;

        width:100%!important;

        max-width:100%!important;

        min-width:0!important;

        margin:0!important;

        padding:0!important;

        box-sizing:border-box!important;

        overflow:visible!important;
    }


    /* =========================================
       ПУНКТЫ
       ========================================= */

    .server-tabs .uk-subnav > li,
    .server-tabs .lb-submenu-list > li,
    .mobile-section-nav .uk-subnav > li,
    .mobile-section-nav .lb-submenu-list > li{

        display:block!important;

        width:100%!important;

        max-width:100%!important;

        min-width:0!important;

        margin:0!important;

        padding:0!important;

        box-sizing:border-box!important;
    }


    /* =========================================
       ССЫЛКИ
       ========================================= */

    .server-tabs .uk-subnav > li > a,
    .server-tabs .lb-submenu-list > li > a,
    .mobile-section-nav .uk-subnav > li > a,
    .mobile-section-nav .lb-submenu-list > li > a{

        display:flex!important;

        align-items:center!important;

        width:100%!important;

        max-width:100%!important;

        min-width:0!important;

        margin:0!important;

        box-sizing:border-box!important;

        white-space:normal!important;

        overflow-wrap:anywhere!important;

        word-break:break-word!important;

        overflow:hidden!important;
    }
}

/* =========================================================
   ALL SERVERS — FIX SERVER NAME VERTICAL ALIGN
   ========================================================= */
@media (max-width: 767px) {

    /* Все строки одинаковой высоты */
    #all_servers td {
        box-sizing: border-box !important;
        min-height: 36px !important;
        height: 36px !important;
        padding: 8px 0 !important;
        line-height: 20px !important;
    }

    /* Строка "Сервер" */
    #all_servers td:nth-child(2) {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        height: 36px !important;
        min-height: 36px !important;
        box-sizing: border-box !important;
        padding: 8px 0 !important;
    }

    /* Само название */
    #all_servers td:nth-child(2) a {
        display: block !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;

        line-height: 20px !important;

        align-self: center !important;
        vertical-align: middle !important;

        overflow: hidden !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;

        transform: none !important;
    }
}

/* На очень узких экранах */
@media (max-width: 380px) {
    #all_servers td:nth-child(2) a {
        line-height: 18px !important;
        max-height: none !important;
        height: auto !important;
    }
}

/* =========================================================
   MOBILE — место для крестика в модальном окне
   ========================================================= */

@media (max-width: 767px) {

    .connects-modal .uk-modal-header {
        padding-top: 45px !important;
        position: relative !important;
    }

    .connects-modal .connects-modal-close {
        top: 4px !important;
        right: 4px !important;
    }

}

/* =========================================================
   pagination в invoices — место для крестика в модальном окне
   ========================================================= */

.pagination {
    padding: 0;
    list-style: none;
    text-align: center;
    letter-spacing: -0.31em;
}

.pagination:before,
.pagination:after {
    content: " ";
    display: table;
}
.pagination:after { clear: both; }

.pagination > li {
    display: inline-block;
    letter-spacing: normal;
}
.pagination > li:nth-child(n+2) {
    margin-left: 6px;
}

.pagination > li > a,
.pagination > li > span {
    display: inline-block;
    min-width: 34px;
    padding: 6px 10px;
    line-height: 20px;
    text-decoration: none;
    box-sizing: border-box;
    text-align: center;
    border-radius: 6px;
    font-weight: 500;
    border: 1px solid #2a2d36;
}

/* обычная кнопка */
.pagination > li > a {
    background-color: #1c1f26;
    color: #4fd1c5;
    transition: all 0.2s ease;
}

/* hover */
.pagination > li > a:hover,
.pagination > li > a:focus {
    background-color: #18282a;
    color: #6ff3e8;
    border-color: #4fd1c5;
    outline: none;
    box-shadow: 0 0 0 1px rgba(79, 209, 197, 0.45);
}

/* active click */
.pagination > li > a:active {
    background-color: #123436;
    color: #5eead4;
}

/* текущая страница */
.pagination > .uk-active > span {
    background: linear-gradient(135deg, #4fd1c5, #2bb0e6);
    color: #0b1f22;
    border-color: transparent;
    box-shadow: 0 6px 14px rgba(79, 209, 197, 0.45);
}

/* disabled */
.pagination > .uk-disabled > span {
    background-color: #16181d;
    color: #6b6f7a;
    border-color: #23252c;
}

/* prev / next */
.pagination-previous { float: left; }
.pagination-next { float: right; }

.pagination-left { text-align: left; }
.pagination-right { text-align: right; }

/* =========================================================
   MOBILE PAGINATION — SQUARE BUTTONS
   ========================================================= */

@media (max-width: 767px) {

    .pagination {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: wrap !important;

        width: 100% !important;
        height: auto !important;

        margin: 15px auto !important;
        padding: 0 !important;

        gap: 4px !important;

        float: none !important;
        box-sizing: border-box !important;
    }

    .pagination::before,
    .pagination::after {
        display: none !important;
    }


    /* Скрываем Previous / Next */
    .pagination > li:first-child,
    .pagination > li:last-child {
        display: none !important;
    }


    /* Каждый номер */
    .pagination > li {
        display: block !important;

        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;

        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;

        margin: 0 !important;
        padding: 0 !important;

        float: none !important;

        flex: 0 0 30px !important;

        box-sizing: border-box !important;
    }

    .pagination > li:nth-child(n+2) {
        margin-left: 0 !important;
    }


    /* Сама кнопка */
    .pagination > li > a,
    .pagination > li > span {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;

        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        line-height: 30px !important;
        font-size: 12px !important;

        text-align: center !important;
        vertical-align: middle !important;

        overflow: hidden !important;
    }


    /* Активная страница */
    .pagination > .uk-active > span {
        width: 30px !important;
        height: 30px !important;

        min-width: 30px !important;
        min-height: 30px !important;

        max-width: 30px !important;
        max-height: 30px !important;

        padding: 0 !important;
        margin: 0 !important;

        line-height: 30px !important;
    }

}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 380px) {

    .pagination {
        gap: 3px !important;
    }

    .pagination > li {
        width: 27px !important;
        min-width: 27px !important;
        max-width: 27px !important;

        height: 27px !important;
        min-height: 27px !important;
        max-height: 27px !important;

        flex-basis: 27px !important;
    }

    .pagination > li > a,
    .pagination > li > span,
    .pagination > .uk-active > span {

        width: 27px !important;
        min-width: 27px !important;
        max-width: 27px !important;

        height: 27px !important;
        min-height: 27px !important;
        max-height: 27px !important;

        padding: 0 !important;
        margin: 0 !important;

        line-height: 27px !important;
        font-size: 11px !important;
    }

}