:root{
  --ub-bg:#0b0d12;
  --ub-panel:rgba(16,20,28,.9);
  --ub-panel-2:rgba(24,30,40,.95);
  --ub-line:rgba(255,255,255,.08);
  --ub-text:#f3f6fb;
  --ub-muted:#9ba6b7;
  --ub-accent:#f7b34b;
  --ub-green:#62db83;
  --ub-vip:#ffd36b;
  --ub-shadow:0 18px 40px rgba(0,0,0,.35);
  --ub-radius:18px;
}
body{
  font-size:14px!important;
  font-family:'Roboto Reqular',sans-serif!important;
  color:var(--ub-text);
}
.background{opacity:1;background:url(/public/default2/img/fon1.jpg) no-repeat center center fixed;background-size:cover;filter:saturate(1.05);}
.overlay{background:linear-gradient(180deg,rgba(7,10,14,.82),rgba(11,13,18,.93));}
.main{position:relative;z-index:1;min-height:100vh;}
header{background:rgba(11,13,18,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--ub-line);margin-bottom:24px;}
.main-content{padding-bottom:20px;}
.top-welcome-text,.top-servers,.servers-list,.page,.promo-section .promo-card{background:var(--ub-panel);border:1px solid var(--ub-line);border-radius:22px;box-shadow:var(--ub-shadow);}
.top-welcome-text,.top-servers,.servers-list,.page{padding:16px;}
/* header widget */
.ub-topbar-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;}
.ub-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;}
.ub-logo-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--ub-accent),#ffe29a);color:#111;font-size:18px;font-weight:800;box-shadow:0 10px 24px rgba(247,179,75,.25);}
.ub-brand-title{font-size:20px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;line-height:1;}
.ub-brand-sub{font-size:12px;color:var(--ub-muted);margin-top:4px;text-transform:none;letter-spacing:0;}
.ub-auth{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.ub-auth .btn{border-radius:12px!important;padding:9px 14px!important;font-size:14px!important;}
.ub-topbar-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid var(--ub-line);}
.ub-nav{display:flex;gap:10px;flex-wrap:wrap;}
.ub-nav a,.ub-nav .ub-nav-cta{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;padding:11px 14px;border-radius:12px;border:1px solid var(--ub-line);background:rgba(255,255,255,.03);transition:.18s ease;font-size:14px;}
.ub-nav a:hover,.ub-nav .ub-nav-cta:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff;transform:translateY(-1px);}
.ub-nav .ub-nav-cta{background:linear-gradient(135deg,var(--ub-accent),#ffd98f);color:#111;border-color:transparent;font-weight:700;box-shadow:0 6px 16px rgba(247,179,75,.25);}
.ub-search{display:flex;gap:8px;align-items:center;min-width:280px;max-width:360px;flex:1;justify-content:flex-end;}
.ub-search .form-control{background:var(--ub-panel-2);border:1px solid var(--ub-line);color:#fff;border-radius:12px;height:42px;}
.ub-search .form-control::placeholder{color:#7f8a9b;}
.ub-search .btn{height:42px;border-radius:12px;padding:0 16px;}
/* hero */
.top-welcome-text h1{font-size:42px;margin:0 0 12px;line-height:.98;letter-spacing:-.03em;color:#fff;}
.top-welcome-text .ub-hero-sub{color:var(--ub-muted);font-size:16px;line-height:1.7;max-width:840px;margin-bottom:18px;}
.top-welcome-text .ub-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;}
.top-welcome-text .btn{border-radius:14px;padding:12px 18px;font-weight:700;}
.top-welcome-text .btn.add-server{background:linear-gradient(135deg,var(--ub-accent),#ffd98f);color:#111;border:none;box-shadow:0 8px 20px rgba(247,179,75,.26);}
.top-welcome-text .btn-outline-light{border-color:var(--ub-line);background:rgba(255,255,255,.04);color:#fff;}
.top-welcome-text .ub-hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:stretch;}
.top-welcome-text .ub-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.top-welcome-text .ub-stat{background:var(--ub-panel-2);border:1px solid var(--ub-line);border-radius:16px;padding:16px;}
.top-welcome-text .ub-stat strong{display:block;font-size:28px;line-height:1.1;color:#fff;}
.top-welcome-text .ub-stat span{display:block;margin-top:4px;color:var(--ub-muted);font-size:13px;}
/* section titles */
.top-servers .title h3,.servers-list .title h3{font-size:1.7em;padding:0;margin:0;color:#fff;display:flex;align-items:center;gap:10px;}
.top-servers .title,.servers-list .title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.top-servers .title .muted,.servers-list .title .muted{color:var(--ub-muted);font-size:13px;}
/* top row */
.top-servers-wrapper .row{--bs-gutter-x:12px;--bs-gutter-y:12px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;}
.top-servers-wrapper .row::-webkit-scrollbar{height:8px;}
.top-servers-wrapper .row::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:999px;}
.top-servers-wrapper .block{flex:0 0 220px;max-width:220px;}
.top-servers .top-servers-wrapper .top-servers-info{background:linear-gradient(180deg,#1a202b,#151a23);border:1px solid var(--ub-line);border-radius:16px;overflow:hidden;box-shadow:var(--ub-shadow);transition:.2s ease;height:100%;}
.top-servers .top-servers-wrapper .top-servers-info:hover{transform:translateY(-3px);border-color:rgba(247,179,75,.26);}
.top-servers .top-servers-wrapper .top-servers-info .hostname{padding:10px 12px 0;min-height:54px;}
.top-servers .top-servers-wrapper .top-servers-info .hostname a{padding:0;color:#fff;font-size:14px;font-weight:700;line-height:1.25;width:100%;}
.top-servers .top-servers-wrapper .top-servers-info .image-map{position:relative;}
.top-servers .top-servers-wrapper .top-servers-info .image-map img{width:100%;height:100px;object-fit:cover;display:block;}
.top-servers .top-servers-wrapper .top-servers-info .image-map:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(11,13,18,.88));pointer-events:none;}
.top-place-badge,.top-servers .top-servers-wrapper .top-servers-info .image-map .name-map{position:absolute;z-index:1;font-size:11px;font-weight:800;border-radius:999px;}
.top-place-badge{top:8px;left:8px;padding:5px 8px;background:rgba(247,179,75,.16);color:var(--ub-accent);border:1px solid rgba(247,179,75,.24);}
.top-servers .top-servers-wrapper .top-servers-info .image-map .name-map{left:8px;bottom:8px;padding:0;background:none;color:#ffd98f;font-size:11px;}
.top-servers .top-servers-wrapper .top-servers-info .info{padding:10px 12px 12px;display:grid;gap:8px;}
.top-servers .top-servers-wrapper .top-servers-info .info .players{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:60px;padding:7px 9px;border-radius:10px;background:rgba(98,219,131,.1);border:1px solid rgba(98,219,131,.22);color:var(--ub-green);font-size:12px;font-weight:800;}
.top-servers .top-servers-wrapper .top-servers-info .info .players::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--ub-green);animation:ubPulse 1.8s infinite;box-shadow:0 0 0 0 rgba(98,219,131,.4);}
.top-servers .top-servers-wrapper .top-servers-info .info .address{color:#fff;padding:0;border-top:none;display:block;font-size:15px;font-weight:800;cursor:pointer;word-break:break-all;}
.top-servers .top-servers-wrapper .top-servers-info .info .address:hover{color:var(--ub-accent);}
.top-server-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.top-server-play{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:8px 10px;border-radius:10px;background:linear-gradient(135deg,var(--ub-accent),#ffd98f);color:#111;font-size:12px;font-weight:800;}
/* servers list */
.servers-list table{margin-bottom:0;border-collapse:separate;border-spacing:0 10px;background:transparent!important;}
.table-dark{background:transparent!important;color:#fff;}
.table-dark thead{background:transparent;}
.table-dark thead tr th{background:rgba(255,255,255,.06);color:#fff;border:none;padding:14px 12px;vertical-align:middle;}
.table-dark tbody tr{background:var(--ub-panel-2);border:1px solid var(--ub-line);}
.table-dark tbody td{padding:14px 12px;border-top:none;vertical-align:middle;}
.table-dark tbody tr td:first-child{border-top-left-radius:14px;border-bottom-left-radius:14px;}
.table-dark tbody tr td:last-child{border-top-right-radius:14px;border-bottom-right-radius:14px;}
.table-dark .address,.players,.table-dark .vote{background:rgba(255,255,255,.06);padding:.34em .6em;border-radius:10px;color:#fff;}
.copy-btn{margin-left:8px;background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--ub-line);border-radius:10px;padding:6px 10px;transition:.18s ease;}
.copy-btn:hover{background:rgba(247,179,75,.14);color:var(--ub-accent);}
.hostname{color:#ffd36b;font-weight:700;text-decoration:none;}
/* promo/footer */
.promo-section{margin-top:18px;}
.promo-section .promo-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.promo-section .promo-card{padding:22px;}
.promo-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(247,179,75,.12);color:var(--ub-accent);border:1px solid rgba(247,179,75,.2);font-size:13px;margin-bottom:14px;}
.promo-title{font-size:28px;line-height:1.15;color:#fff;margin:0 0 10px;}
.promo-list{display:grid;gap:10px;margin-top:16px;}
.promo-item{padding:13px 14px;border-radius:14px;background:var(--ub-panel-2);border:1px solid var(--ub-line);color:#fff;}
.footer{border-top:none;background:transparent;}
.footer .container{background:var(--ub-panel);border:1px solid var(--ub-line);border-radius:20px;box-shadow:var(--ub-shadow);}
.footer h5,.footer p,.footer a,.footer .text-center{color:#fff!important;}
.footer a{text-decoration:none;}
.footer a:hover{color:var(--ub-accent)!important;}
/* mobile */
@keyframes ubPulse{0%{box-shadow:0 0 0 0 rgba(98,219,131,.42);transform:scale(.95)}70%{box-shadow:0 0 0 8px rgba(98,219,131,0);transform:scale(1)}100%{box-shadow:0 0 0 0 rgba(98,219,131,0);transform:scale(.95)}}
@media (max-width: 992px){
  .ub-topbar-top,.ub-topbar-bottom,.top-welcome-text .ub-hero-grid,.promo-section .promo-grid{grid-template-columns:1fr;display:grid;}
  .ub-topbar-top{gap:12px;}
  .ub-topbar-bottom{gap:12px;}
  .ub-search{min-width:0;max-width:none;justify-content:stretch;}
  .ub-nav{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .ub-search .btn,.ub-search .form-control,.ub-nav a,.ub-nav .ub-nav-cta{width:100%;}
  .top-welcome-text h1{font-size:32px;}
  .top-welcome-text .ub-stat-grid{grid-template-columns:1fr 1fr;}
  .table-responsive{border-radius:16px;overflow-x:auto;}
}
@media (max-width: 768px){
  header{margin-bottom:18px;}
  .top-welcome-text,.top-servers,.servers-list,.page{padding:12px;}
  .ub-nav{grid-template-columns:1fr;}
  .top-welcome-text .ub-stat-grid{grid-template-columns:1fr;}
  .top-servers-wrapper .block{flex:0 0 180px;max-width:180px;}
  .top-servers .top-servers-wrapper .top-servers-info .image-map img{height:88px;}
  .servers-list table thead{display:none;}
  .servers-list table,.servers-list tbody,.servers-list tr,.servers-list td{display:block;width:100%;}
  .servers-list tbody tr{padding:10px;border-radius:14px;margin-bottom:10px;}
  .servers-list tbody td{border:none;padding:8px 6px!important;text-align:left!important;}
  .servers-list tbody td:before{content:attr(data-label);display:block;color:var(--ub-muted);font-size:12px;margin-bottom:4px;}
  .promo-section .promo-grid{grid-template-columns:1fr;}
  .footer .row{row-gap:16px;}
}


@media (min-width: 1400px){
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container{
    max-width:1370px;
  }
}

.ub-auth .btn-outline-light{
  background:#fff!important;
  color:#111!important;
  border-color:#fff!important;
}

.ub-auth .btn-outline-light:hover,
.ub-auth .btn-outline-light:focus{
  background:#f5f5f5!important;
  color:#111!important;
  border-color:#fff!important;
}

/* user cabinet */
.user-cabinet-page{background:transparent;border:none;box-shadow:none;padding:0;}
.ub-user-panel{background:var(--ub-panel-2);border:1px solid var(--ub-line);border-radius:18px;padding:18px;box-shadow:var(--ub-shadow);}
.ub-user-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.ub-user-section-title{margin:0 0 14px;color:#fff;}
.ub-user-muted{color:var(--ub-muted);font-size:14px;line-height:1.6;}
.ub-user-menu{display:grid;gap:14px;}
.ub-user-menu-group{background:var(--ub-panel-2);border:1px solid var(--ub-line);border-radius:18px;padding:14px;box-shadow:var(--ub-shadow);}
.ub-user-menu-title{color:#fff;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px;opacity:.9;}
.ub-user-menu-link{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;padding:12px 13px;border-radius:12px;border:1px solid transparent;transition:.18s ease;}
.ub-user-menu-link:hover{background:rgba(255,255,255,.06);border-color:var(--ub-line);color:#fff;}
.ub-user-menu-link.active{background:rgba(247,179,75,.14);border-color:rgba(247,179,75,.28);color:#ffd98f;}
.ub-user-menu-link-danger{background:rgba(220,53,69,.08);border:1px solid rgba(220,53,69,.18);}
.ub-stat-card{height:100%;background:var(--ub-panel-2);border:1px solid var(--ub-line);border-radius:18px;padding:18px;box-shadow:var(--ub-shadow);}
.ub-stat-card-label{color:var(--ub-muted);font-size:13px;margin-bottom:8px;text-transform:uppercase;letter-spacing:.05em;}
.ub-stat-card-value{font-size:28px;font-weight:800;color:#fff;line-height:1.15;}
.ub-stat-card-value-small{font-size:20px;}
.ub-stat-card-link{display:inline-block;margin-top:10px;color:#ffd98f;text-decoration:none;font-weight:700;}
.ub-stat-card-tags,.ub-service-badges{display:flex;flex-wrap:wrap;gap:8px;}
.ub-tag{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid transparent;}
.ub-tag-vip{background:rgba(255,211,107,.12);color:#ffd36b;border-color:rgba(255,211,107,.24);}
.ub-tag-boost{background:rgba(98,219,131,.12);color:#62db83;border-color:rgba(98,219,131,.24);}
.ub-tag-color{background:rgba(108,117,255,.14);color:#b7c0ff;border-color:rgba(108,117,255,.28);}
.ub-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.ub-profile-item{background:rgba(255,255,255,.04);border:1px solid var(--ub-line);border-radius:14px;padding:14px;}
.ub-profile-item span{display:block;color:var(--ub-muted);font-size:13px;margin-bottom:6px;}
.ub-profile-item strong{display:block;color:#fff;font-size:16px;word-break:break-word;}
.ub-profile-item-wide{grid-column:1/-1;}
.ub-quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.ub-quick-action{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;text-decoration:none;color:#fff;background:rgba(255,255,255,.04);border:1px solid var(--ub-line);transition:.18s ease;}
.ub-quick-action:hover{transform:translateY(-1px);background:rgba(255,255,255,.07);color:#fff;}
.ub-quick-action i{width:20px;text-align:center;color:#ffd98f;}
.ub-table-actions{display:flex;gap:8px;justify-content:flex-end;}
.ub-user-servers-table .badge{margin:2px 4px 2px 0;}
@media (max-width: 991px){
  .ub-user-panel-head{flex-direction:column;}
  .ub-profile-grid,.ub-quick-actions{grid-template-columns:1fr;}
}


/* full server address in lists */
.servers-list td[data-label="Адрес"]{min-width:220px;}
.servers-list .address{display:inline-flex;align-items:center;max-width:none;white-space:nowrap;overflow:visible;text-overflow:clip;word-break:normal;}
.servers-list .copy-btn{vertical-align:middle;}

/* mobile safety fixes */
html,body{
  overflow-x:hidden;
}
img,svg,video,iframe{
  max-width:100%;
  height:auto;
}
.page .content-title,
.servers-list .title h3,
.top-servers .title h3,
.footer h5{
  overflow-wrap:anywhere;
}
@media (max-width: 991px){
  .page .table,
  .page table.table{
    display:block;
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;
  }
  .page .float-right{
    float:none!important;
    display:block;
    margin:0 0 12px;
  }
  .page input[style*="width: 240px"],
  .page input[style*="width:240px"]{
    width:100%!important;
    float:none!important;
    margin:0 0 10px!important;
  }
  .page form .btn,
  .page form .form-control,
  .page form select{
    max-width:100%;
  }
}
@media (max-width: 768px){
  #cookieBanner .container,
  #cookieBanner .d-flex{
    width:100%;
  }
  #cookieBanner .btn{
    flex:1 1 auto;
  }
  .ub-auth,
  .ub-topbar-top,
  .ub-topbar-bottom{
    width:100%;
  }
  .ub-brand{
    align-items:flex-start;
  }
  .ub-brand-title,
  .ub-brand-sub,
  .address,
  .hostname,
  .table td,
  .table th,
  .page a,
  .page span,
  .page strong{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .page .btn,
  .page button[type="submit"],
  .page input[type="submit"]{
    width:100%;
  }
}


/* improved mobile UX */
.ub-mobile-toggle{display:none;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;border:1px solid var(--ub-line);background:rgba(255,255,255,.04);color:#fff;font-size:20px;line-height:1;cursor:pointer;flex-shrink:0;}
.ub-mobile-toggle:hover,.ub-mobile-toggle:focus{background:rgba(255,255,255,.08);color:#fff;outline:none;}

@media (max-width: 768px){
  body{font-size:15px!important;}
  header{padding:0!important;}
  header .container{padding-top:12px;padding-bottom:12px;}
  .ub-topbar-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:0;}
  .ub-brand{min-width:0;gap:10px;flex:1 1 auto;}
  .ub-logo-mark{width:38px;height:38px;border-radius:12px;font-size:16px;}
  .ub-brand-title{font-size:16px;letter-spacing:.04em;}
  .ub-brand-sub{font-size:11px;line-height:1.25;}
  .ub-mobile-toggle{display:inline-flex;}
  .ub-auth{display:none;grid-template-columns:1fr 1fr;gap:8px;width:100%;padding-top:12px;}
  .ub-auth.is-open{display:grid;}
  .ub-topbar-bottom{display:none;border-top:none;padding-top:12px;}
  .ub-topbar-bottom.is-open{display:grid;gap:12px;}
  .ub-nav{display:grid;grid-template-columns:1fr;gap:8px;}
  .ub-nav a,.ub-nav .ub-nav-cta{justify-content:flex-start;padding:12px 14px;font-size:15px;}
  .ub-search{display:grid;grid-template-columns:1fr auto;gap:8px;min-width:0;max-width:none;width:100%;}
  .ub-search .form-control{min-width:0;height:44px;}
  .ub-search .btn{height:44px;padding:0 14px;width:auto;}
  .top-welcome-text{padding:14px;}
  .top-welcome-text h1{font-size:28px;line-height:1.05;}
  .top-welcome-text .ub-hero-sub{font-size:15px;line-height:1.55;}
  .top-welcome-text .ub-hero-actions{display:grid;grid-template-columns:1fr;gap:10px;}
  .top-welcome-text .btn{width:100%;justify-content:center;}
  .top-welcome-text .ub-stat{padding:14px;}
  .top-welcome-text .ub-stat strong{font-size:24px;}
  .top-servers,.servers-list,.page,.footer .container{border-radius:18px;}
  .top-servers .title,.servers-list .title{align-items:flex-start;gap:8px;}
  .top-servers .title h3,.servers-list .title h3{font-size:1.25rem;line-height:1.2;}
  .top-servers-wrapper .row{scroll-snap-type:x proximity;padding-bottom:2px;margin:0 -2px;}
  .top-servers-wrapper .block{flex:0 0 86vw;max-width:86vw;scroll-snap-align:start;}
  .top-servers .top-servers-wrapper .top-servers-info .image-map img{height:118px;}
  .top-servers .top-servers-wrapper .top-servers-info .hostname{min-height:auto;padding:12px 12px 0;}
  .top-servers .top-servers-wrapper .top-servers-info .hostname a{font-size:15px;}
  .top-server-actions{flex-wrap:wrap;}
  .top-server-play{flex:1 1 auto;min-height:38px;}
  .servers-list table,.servers-list tbody{display:block;}
  .servers-list tbody{display:grid;gap:12px;}
  .servers-list tbody tr{display:block;padding:12px 12px 10px;margin:0;border-radius:16px;box-shadow:var(--ub-shadow);}
  .servers-list tbody td{display:flex!important;align-items:flex-start;justify-content:space-between;gap:12px;padding:7px 0!important;min-height:auto;}
  .servers-list tbody td:before{content:attr(data-label);display:block;flex:0 0 92px;max-width:92px;color:var(--ub-muted);font-size:12px;line-height:1.35;margin:0;padding-top:2px;}
  .servers-list tbody td > *{max-width:calc(100% - 104px);}
  .servers-list tbody td[data-label="Название"] .hostname,
  .servers-list tbody td[data-label="Адрес"] .address{max-width:100%;}
  .servers-list .address{display:inline-flex;flex-wrap:wrap;gap:8px;white-space:normal;align-items:center;}
  .servers-list .copy-btn{margin-left:0;}
  .servers-list td[data-label="Рейтинг"]{align-items:center;}
  .servers-list td[data-label="Рейтинг"] > *{margin-left:auto;}
  .page{padding:14px;}
  .page .btn,.page button[type="submit"],.page input[type="submit"]{width:100%;}
  .footer .container{padding:18px 16px 0!important;}
  .footer .text-center.p-3{border-bottom-left-radius:18px;border-bottom-right-radius:18px;}
  #cookieBanner{padding-left:12px!important;padding-right:12px!important;}
}

@media (max-width: 480px){
  .ub-auth{grid-template-columns:1fr;}
  .ub-search{grid-template-columns:1fr;}
  .ub-search .btn{width:100%;}
  .top-servers-wrapper .block{flex-basis:90vw;max-width:90vw;}
  .servers-list tbody td{flex-direction:column;gap:6px;align-items:flex-start;}
  .servers-list tbody td:before{flex:0 0 auto;max-width:none;padding-top:0;}
  .servers-list tbody td > *{max-width:100%;}
}


/* final mobile layout refinement: top servers in vertical list */
@media (max-width: 768px){
  .top-servers-wrapper{overflow:visible;}
  .top-servers-wrapper .row{
    display:block;
    overflow:visible;
    margin:0;
    padding-bottom:0;
    --bs-gutter-x:0;
    --bs-gutter-y:0;
  }
  .top-servers-wrapper .block{
    display:block;
    flex:none;
    max-width:none;
    width:100%;
    margin-bottom:12px;
    padding:0;
  }
  .top-servers-wrapper .block:last-child{margin-bottom:0;}
  .top-servers .top-servers-wrapper .top-servers-info{
    border-radius:16px;
  }
  .top-servers .top-servers-wrapper .top-servers-info .image-map img{
    height:140px;
  }
  .top-servers .top-servers-wrapper .top-servers-info .info{
    gap:10px;
  }
  .top-server-actions{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:10px;
  }
  .top-server-play{
    min-width:104px;
    min-height:40px;
  }
}

@media (max-width: 480px){
  .top-servers .top-servers-wrapper .top-servers-info .image-map img{
    height:124px;
  }
  .top-server-actions{
    grid-template-columns:1fr;
  }
  .top-server-play{
    width:100%;
  }
}

/* server list mobile redesign */
@media (max-width: 768px){
  .servers-list .table-responsive{
    overflow:visible;
  }
  .servers-list table{
    border-spacing:0;
  }
  .servers-list tbody{
    gap:14px;
  }
  .servers-list tbody tr{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "name game"
      "address address"
      "meta meta"
      "rating rating";
    gap:10px 12px;
    padding:14px;
    border:1px solid var(--ub-line);
    background:linear-gradient(180deg,rgba(24,30,40,.98),rgba(17,22,30,.98));
  }
  .servers-list tbody td{
    display:block!important;
    padding:0!important;
    min-width:0;
  }
  .servers-list tbody td:before{
    display:block;
    margin:0 0 6px;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.05em;
  }
  .servers-list tbody td[data-label="Название"]{
    grid-area:name;
  }
  .servers-list tbody td[data-label="Название"]:before{
    display:none;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    display:block;
    font-size:16px;
    line-height:1.3;
    color:#fff;
  }
  .servers-list tbody td[data-label="Игра"]{
    grid-area:game;
    justify-self:end;
    align-self:start;
    min-width:54px;
    text-align:right!important;
  }
  .servers-list tbody td[data-label="Игра"]:before{
    display:none;
  }
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{
    width:28px;
    height:28px;
    object-fit:contain;
  }
  .servers-list tbody td[data-label="Адрес"]{
    grid-area:address;
    background:rgba(255,255,255,.04);
    border:1px solid var(--ub-line);
    border-radius:14px;
    padding:10px!important;
  }
  .servers-list tbody td[data-label="Адрес"] .address{
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
    font-size:14px;
    font-weight:700;
    line-height:1.4;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    margin-left:auto;
    min-width:40px;
    min-height:40px;
    padding:0 12px;
  }
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    display:flex!important;
    flex-direction:column;
    gap:6px;
    min-width:0;
  }
  .servers-list tbody td[data-label="Карта"]{
    grid-area:meta;
  }
  .servers-list tbody td[data-label="Игроки"]{
    grid-area:meta;
    margin-left:calc(50% + 6px);
    margin-top:-100%;
  }
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players,
  .servers-list tbody td[data-label="Карта"] span:not(.players),
  .servers-list tbody td[data-label="Игроки"] span:not(.players),
  .servers-list tbody td[data-label="Карта"]{
    font-size:14px;
  }
  .servers-list tbody td[data-label="Карта"]::after,
  .servers-list tbody td[data-label="Игроки"]::after{
    content:'';
  }
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    background:rgba(255,255,255,.035);
    border:1px solid var(--ub-line);
    border-radius:12px;
    padding:10px!important;
  }
  .servers-list tbody td[data-label="Рейтинг"]{
    grid-area:rating;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--ub-line);
    border-radius:14px;
    padding:10px!important;
  }
  .servers-list tbody td[data-label="Рейтинг"]:before{
    margin:0;
  }
  .servers-list tbody td[data-label="Рейтинг"] a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border-radius:12px;
    text-decoration:none;
    background:rgba(255,255,255,.06);
    border:1px solid var(--ub-line);
    color:#fff;
    flex-shrink:0;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:68px;
    min-height:40px;
    font-size:15px;
    font-weight:800;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote{
    margin-left:auto;
    margin-right:auto;
    background:transparent;
    padding:0;
  }
}

@media (max-width: 640px){
  .servers-list tbody tr{
    grid-template-columns:1fr;
    grid-template-areas:
      "name"
      "game"
      "address"
      "meta1"
      "meta2"
      "rating";
  }
  .servers-list tbody td[data-label="Игра"]{
    justify-self:start;
    text-align:left!important;
    background:rgba(255,255,255,.04);
    border:1px solid var(--ub-line);
    border-radius:12px;
    padding:8px 10px!important;
    display:inline-flex!important;
    align-items:center;
    gap:8px;
  }
  .servers-list tbody td[data-label="Игра"]:after{
    content:'Игра';
    color:var(--ub-muted);
    font-size:12px;
    font-weight:500;
  }
  .servers-list tbody td[data-label="Карта"]{
    grid-area:meta1;
    margin:0;
  }
  .servers-list tbody td[data-label="Игроки"]{
    grid-area:meta2;
    margin:0;
  }
  .servers-list tbody td[data-label="Адрес"] .address{
    align-items:flex-start;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    align-self:flex-end;
  }
}

/* server list mobile redesign fix */
@media (max-width: 768px){
  .servers-list tbody tr{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "name game"
      "address address"
      "map players"
      "rating rating";
    gap:10px;
  }
  .servers-list tbody td[data-label="Игра"]{grid-area:game;}
  .servers-list tbody td[data-label="Карта"]{grid-area:map;margin:0;}
  .servers-list tbody td[data-label="Игроки"]{grid-area:players;margin:0;}
  .servers-list tbody td[data-label="Рейтинг"]{grid-area:rating;}
}

@media (max-width: 640px){
  .servers-list tbody tr{
    grid-template-columns:1fr;
    grid-template-areas:
      "name"
      "game"
      "address"
      "map"
      "players"
      "rating";
  }
}

/* compact mobile server list */
@media (max-width: 768px){
  .servers-list .title{margin-bottom:10px;}
  .servers-list .title h3{font-size:1.1rem;}
  .servers-list tbody{gap:8px;}
  .servers-list tbody tr{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "name game"
      "address address"
      "map players"
      "rating rating";
    gap:8px;
    padding:10px;
    border-radius:12px;
    box-shadow:none;
  }
  .servers-list tbody td:before{
    margin:0 0 4px;
    font-size:10px;
    letter-spacing:.04em;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    font-size:13px;
    line-height:1.25;
    font-weight:700;
  }
  .servers-list tbody td[data-label="Игра"]{
    min-width:40px;
    padding:6px 8px!important;
    border-radius:10px;
  }
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{
    width:20px;
    height:20px;
  }
  .servers-list tbody td[data-label="Игра"]:after{
    font-size:11px;
  }
  .servers-list tbody td[data-label="Адрес"],
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"],
  .servers-list tbody td[data-label="Рейтинг"]{
    border-radius:10px;
    padding:8px!important;
  }
  .servers-list tbody td[data-label="Адрес"] .address{
    font-size:12px;
    line-height:1.3;
    font-weight:600;
    gap:6px;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    min-width:32px;
    min-height:32px;
    padding:0 8px;
    border-radius:8px;
    font-size:12px;
  }
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    gap:4px;
    font-size:12px;
  }
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players,
  .servers-list tbody td[data-label="Карта"] span:not(.players),
  .servers-list tbody td[data-label="Игроки"] span:not(.players),
  .servers-list tbody td[data-label="Карта"]{
    font-size:12px;
  }
  .servers-list .players,
  .servers-list .vote,
  .servers-list .rating-bg{
    border-radius:8px;
    padding:.24em .5em;
  }
  .servers-list tbody td[data-label="Рейтинг"]{
    gap:8px;
  }
  .servers-list tbody td[data-label="Рейтинг"] a{
    width:32px;
    height:32px;
    border-radius:9px;
    font-size:12px;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    min-width:52px;
    min-height:32px;
    font-size:13px;
  }
}

@media (max-width: 640px){
  .servers-list tbody tr{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "name game"
      "address address"
      "map players"
      "rating rating";
  }
  .servers-list tbody td[data-label="Игра"]{
    justify-self:end;
    text-align:right!important;
    display:flex!important;
    align-items:center;
    justify-content:center;
  }
  .servers-list tbody td[data-label="Игра"]:after{
    display:none;
  }
}

@media (max-width: 420px){
  .servers-list tbody tr{padding:8px;gap:7px;}
  .servers-list tbody td[data-label="Название"] .hostname{font-size:12px;}
  .servers-list tbody td[data-label="Адрес"] .address,
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{font-size:11px;}
}

/* ultra-compact mobile server list */
@media (max-width: 768px){
  .servers-list{padding:10px;}
  .servers-list .table-responsive{overflow:visible;}
  .servers-list .title{margin-bottom:8px;}
  .servers-list .title h3{font-size:1rem;gap:8px;}
  .servers-list tbody{gap:6px;}
  .servers-list tbody tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px;
    grid-template-areas:
      "name game"
      "address address"
      "map players"
      "rating rating";
    gap:6px 8px;
    padding:8px 9px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.05);
    box-shadow:none;
  }
  .servers-list tbody td{
    padding:0!important;
    min-height:0;
    background:none!important;
    border:none!important;
    align-items:flex-start!important;
  }
  .servers-list tbody td:before{
    margin:0 0 2px;
    font-size:9px;
    line-height:1.1;
    letter-spacing:.03em;
    opacity:.75;
  }
  .servers-list tbody td[data-label="Название"]{grid-area:name;}
  .servers-list tbody td[data-label="Название"] .hostname{
    font-size:12px;
    line-height:1.2;
    font-weight:600;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .servers-list tbody td[data-label="Игра"]{
    grid-area:game;
    justify-self:end;
    align-self:start;
    width:34px;
    min-width:34px;
    min-height:34px;
    padding:0!important;
    border-radius:8px;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:rgba(255,255,255,.05)!important;
  }
  .servers-list tbody td[data-label="Игра"]:before,
  .servers-list tbody td[data-label="Игра"]:after{display:none!important;}
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{width:18px;height:18px;}
  .servers-list tbody td[data-label="Адрес"]{grid-area:address;}
  .servers-list tbody td[data-label="Адрес"] .address{
    display:inline-flex;
    align-items:center;
    gap:5px;
    max-width:calc(100% - 30px);
    font-size:11px;
    line-height:1.2;
    font-weight:500;
    word-break:break-all;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    min-width:26px;
    width:26px;
    height:26px;
    min-height:26px;
    padding:0;
    border-radius:7px;
    font-size:11px;
    margin-left:6px;
  }
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    font-size:11px;
    line-height:1.15;
    padding:6px 7px!important;
    border-radius:8px;
    background:rgba(255,255,255,.035)!important;
  }
  .servers-list tbody td[data-label="Карта"]{grid-area:map;}
  .servers-list tbody td[data-label="Игроки"]{grid-area:players;justify-self:stretch;}
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players,
  .servers-list tbody td[data-label="Карта"] span:not(.players),
  .servers-list tbody td[data-label="Игроки"] span:not(.players){
    font-size:11px;
    line-height:1.15;
  }
  .servers-list tbody td[data-label="Рейтинг"]{
    grid-area:rating;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px;
    padding-top:2px!important;
  }
  .servers-list tbody td[data-label="Рейтинг"]:before{display:none!important;}
  .servers-list tbody td[data-label="Рейтинг"] a{
    width:26px;
    height:26px;
    border-radius:7px;
    font-size:11px;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    min-width:44px;
    min-height:26px;
    padding:.15em .45em;
    border-radius:7px;
    font-size:11px;
    line-height:1.1;
  }
  .servers-list .pagination{margin-top:10px;}
  .servers-list .pagination .page-link{padding:.35rem .55rem;font-size:.8rem;}
}

@media (max-width: 420px){
  .servers-list{padding:8px;}
  .servers-list .title h3{font-size:.95rem;}
  .servers-list tbody tr{
    grid-template-columns:minmax(0,1fr) 30px;
    gap:5px 6px;
    padding:7px;
    border-radius:9px;
  }
  .servers-list tbody td:before{font-size:8px;margin-bottom:1px;}
  .servers-list tbody td[data-label="Название"] .hostname{font-size:11px;}
  .servers-list tbody td[data-label="Игра"]{width:30px;min-width:30px;min-height:30px;border-radius:7px;}
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{width:16px;height:16px;}
  .servers-list tbody td[data-label="Адрес"] .address{font-size:10px;max-width:calc(100% - 28px);}
  .servers-list tbody td[data-label="Адрес"] .copy-btn{width:24px;height:24px;min-width:24px;min-height:24px;font-size:10px;}
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{font-size:10px;padding:5px 6px!important;}
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players,
  .servers-list tbody td[data-label="Карта"] span:not(.players),
  .servers-list tbody td[data-label="Игроки"] span:not(.players){font-size:10px;}
  .servers-list tbody td[data-label="Рейтинг"]{gap:5px;}
  .servers-list tbody td[data-label="Рейтинг"] a{width:24px;height:24px;font-size:10px;}
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{min-width:40px;min-height:24px;font-size:10px;}
}


/* FINAL MOBILE FIX: readable compact server list without broken grid */
@media (max-width: 768px){
  .servers-list{
    padding:10px !important;
  }
  .servers-list .table-responsive{
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch;
  }
  .servers-list table,
  .servers-list tbody,
  .servers-list tr,
  .servers-list td{
    display:block !important;
    width:100% !important;
  }
  .servers-list table{
    border-spacing:0 !important;
    margin:0 !important;
  }
  .servers-list thead{
    display:none !important;
  }
  .servers-list tbody{
    display:grid !important;
    gap:8px !important;
  }
  .servers-list tbody tr{
    margin:0 !important;
    padding:8px 9px !important;
    border-radius:10px !important;
    border:1px solid rgba(255,255,255,.08) !important;
    background:rgba(20,26,34,.96) !important;
    box-shadow:none !important;
  }
  .servers-list tbody td{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:8px !important;
    min-height:0 !important;
    padding:3px 0 !important;
    margin:0 !important;
    background:none !important;
    border:none !important;
    text-align:left !important;
  }
  .servers-list tbody td:before{
    content:attr(data-label) !important;
    display:block !important;
    flex:0 0 58px !important;
    width:58px !important;
    max-width:58px !important;
    margin:0 !important;
    padding-top:1px !important;
    color:rgba(255,255,255,.58) !important;
    font-size:9px !important;
    line-height:1.2 !important;
    text-transform:uppercase !important;
    letter-spacing:.05em !important;
  }
  .servers-list tbody td > *{
    max-width:calc(100% - 66px) !important;
  }
  .servers-list tbody td[data-label="Игра"]{
    align-items:center !important;
  }
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{
    width:16px !important;
    height:16px !important;
    flex:0 0 16px !important;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    display:block !important;
    font-size:12px !important;
    line-height:1.25 !important;
    font-weight:600 !important;
    word-break:break-word !important;
  }
  .servers-list tbody td[data-label="Адрес"] .address{
    display:inline-flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    gap:6px !important;
    max-width:calc(100% - 34px) !important;
    font-size:11px !important;
    line-height:1.25 !important;
    white-space:normal !important;
    word-break:break-all !important;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    min-height:24px !important;
    padding:0 !important;
    margin-left:6px !important;
    border-radius:6px !important;
    font-size:10px !important;
    line-height:24px !important;
    flex:0 0 24px !important;
  }
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    font-size:11px !important;
    line-height:1.25 !important;
    word-break:break-word !important;
  }
  .servers-list tbody td[data-label="Рейтинг"]{
    align-items:center !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    border-radius:6px !important;
    font-size:10px !important;
    margin:0 !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:38px !important;
    min-height:24px !important;
    padding:0 6px !important;
    border-radius:6px !important;
    font-size:11px !important;
    line-height:1 !important;
  }
  .servers-list .pagination{
    margin-top:10px !important;
  }
  .servers-list .pagination .page-link{
    padding:.3rem .5rem !important;
    font-size:.78rem !important;
  }
}

@media (max-width: 420px){
  .servers-list{
    padding:8px !important;
  }
  .servers-list .title h3{
    font-size:.98rem !important;
  }
  .servers-list tbody tr{
    padding:7px 8px !important;
  }
  .servers-list tbody td{
    gap:6px !important;
    padding:2px 0 !important;
  }
  .servers-list tbody td:before{
    flex-basis:52px !important;
    width:52px !important;
    max-width:52px !important;
    font-size:8px !important;
  }
  .servers-list tbody td > *{
    max-width:calc(100% - 58px) !important;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    font-size:11px !important;
  }
  .servers-list tbody td[data-label="Адрес"] .address,
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Игроки"]{
    font-size:10px !important;
  }
}

/* MOBILE HOTFIX: compact readable server list on homepage */
@media (max-width: 768px){
  .servers-list .table-responsive{
    overflow:visible !important;
  }
  .servers-list table,
  .servers-list tbody{
    display:block !important;
    width:100% !important;
  }
  .servers-list thead{
    display:none !important;
  }
  .servers-list tbody{
    gap:8px !important;
  }
  .servers-list tbody tr{
    display:grid !important;
    grid-template-columns:26px minmax(0,1fr) 64px !important;
    grid-template-areas:
      "game name rating"
      "game address rating"
      "game meta rating" !important;
    gap:6px 10px !important;
    align-items:start !important;
    padding:10px !important;
    margin:0 0 8px !important;
    border-radius:14px !important;
    background:rgba(7,12,22,.96) !important;
    border:1px solid rgba(255,255,255,.06) !important;
    box-shadow:none !important;
  }
  .servers-list tbody td{
    display:block !important;
    width:auto !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:none !important;
    background:none !important;
    text-align:left !important;
  }
  .servers-list tbody td:before,
  .servers-list tbody td[data-label="Игра"] a{
    display:none !important;
    content:none !important;
  }

  .servers-list tbody td[data-label="Игра"]{
    grid-area:game !important;
    width:26px !important;
    min-width:26px !important;
    height:26px !important;
    min-height:26px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin-top:2px !important;
    border-radius:7px !important;
    overflow:hidden !important;
    background:rgba(255,255,255,.04) !important;
  }
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{
    width:16px !important;
    height:16px !important;
    display:block !important;
  }

  .servers-list tbody td[data-label="Название"]{
    grid-area:name !important;
    min-width:0 !important;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    display:block !important;
    margin:0 !important;
    font-size:12px !important;
    line-height:1.22 !important;
    font-weight:700 !important;
    color:#fff !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;
  }

  .servers-list tbody td[data-label="Адрес"]{
    grid-area:address !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
  }
  .servers-list tbody td[data-label="Адрес"] .address{
    display:block !important;
    min-width:0 !important;
    max-width:none !important;
    font-size:11px !important;
    line-height:1.2 !important;
    color:rgba(255,255,255,.82) !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    word-break:normal !important;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    flex:0 0 24px !important;
    width:24px !important;
    min-width:24px !important;
    height:24px !important;
    min-height:24px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:7px !important;
    font-size:11px !important;
  }

  .servers-list tbody td[data-label="Карта"]{
    grid-area:meta !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    font-size:11px !important;
    line-height:1.2 !important;
    color:rgba(255,255,255,.86) !important;
  }
  .servers-list tbody td[data-label="Карта"]:after{
    content:"" !important;
    display:block !important;
    flex:1 1 auto !important;
  }
  .servers-list tbody td[data-label="Карта"]::before{
    display:inline !important;
    content:"Карта" !important;
    width:auto !important;
    max-width:none !important;
    flex:none !important;
    margin:0 4px 0 0 !important;
    color:rgba(255,255,255,.46) !important;
    font-size:10px !important;
    line-height:1 !important;
    text-transform:uppercase !important;
    letter-spacing:.04em !important;
  }
  .servers-list tbody td[data-label="Карта"]{
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .servers-list tbody td[data-label="Игроки"]{
    grid-area:players !important;
    display:none !important;
  }
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players{
    font-size:11px !important;
    line-height:1.2 !important;
  }
  .servers-list tbody td[data-label="Карта"] .players::before,
  .servers-list tbody td[data-label="Игроки"] .players::before{
    content:"Игроки" !important;
    color:rgba(255,255,255,.46) !important;
    font-size:10px !important;
    text-transform:uppercase !important;
    letter-spacing:.04em !important;
    margin-right:6px !important;
  }

  .servers-list tbody td[data-label="Рейтинг"]{
    grid-area:rating !important;
    width:64px !important;
    min-width:64px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-end !important;
    justify-content:center !important;
    gap:6px !important;
    text-align:center !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] a,
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    margin:0 !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] a{
    width:40px !important;
    height:40px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:12px !important;
    font-size:15px !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    min-width:40px !important;
    min-height:26px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:11px !important;
    line-height:1 !important;
    border-radius:9px !important;
    padding:0 8px !important;
  }
}

@media (max-width: 420px){
  .servers-list tbody tr{
    grid-template-columns:22px minmax(0,1fr) 56px !important;
    gap:5px 8px !important;
    padding:8px !important;
  }
  .servers-list tbody td[data-label="Игра"]{
    width:22px !important;
    min-width:22px !important;
    height:22px !important;
    min-height:22px !important;
  }
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{
    width:14px !important;
    height:14px !important;
  }
  .servers-list tbody td[data-label="Название"] .hostname{
    font-size:11px !important;
  }
  .servers-list tbody td[data-label="Адрес"] .address,
  .servers-list tbody td[data-label="Карта"],
  .servers-list tbody td[data-label="Карта"] .players,
  .servers-list tbody td[data-label="Игроки"] .players{
    font-size:10px !important;
  }
  .servers-list tbody td[data-label="Рейтинг"]{
    width:56px !important;
    min-width:56px !important;
    gap:5px !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] a{
    width:34px !important;
    height:34px !important;
    border-radius:10px !important;
    font-size:13px !important;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    min-width:34px !important;
    min-height:22px !important;
    font-size:10px !important;
    border-radius:8px !important;
  }
}


/* FINAL PHONE LAYOUT FOR servers-list */
.servers-list .mobile-inline-meta{display:none;}
@media (max-width: 768px){
  .servers-list .table-responsive{overflow:visible!important;}
  .servers-list tbody{display:grid!important;gap:8px!important;}
  .servers-list tbody tr{
    display:grid!important;
    grid-template-columns:20px minmax(0,1fr) 42px!important;
    grid-template-areas:
      "game name rating"
      "game address rating"
      "game meta rating"!important;
    gap:5px 8px!important;
    align-items:start!important;
    padding:8px!important;
    margin:0!important;
    border-radius:12px!important;
    background:rgba(7,12,22,.96)!important;
    border:1px solid rgba(255,255,255,.05)!important;
  }
  .servers-list tbody td{padding:0!important;margin:0!important;border:none!important;background:none!important;min-height:0!important;}
  .servers-list tbody td:before{display:none!important;}

  .servers-list tbody td[data-label="Игра"]{
    grid-area:game!important;
    width:20px!important;min-width:20px!important;height:20px!important;min-height:20px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    border-radius:6px!important;background:rgba(255,255,255,.04)!important;overflow:hidden!important;
    margin-top:2px!important;
  }
  .servers-list tbody td[data-label="Игра"] a{display:none!important;}
  .servers-list tbody td[data-label="Игра"] img,
  .servers-list tbody td[data-label="Игра"] svg{width:12px!important;height:12px!important;display:block!important;}

  .servers-list tbody td[data-label="Название"]{grid-area:name!important;min-width:0!important;}
  .servers-list tbody td[data-label="Название"] .hostname{
    display:block!important;
    font-size:11px!important;line-height:1.18!important;font-weight:700!important;
    margin:0!important;color:#fff!important;
    white-space:normal!important;word-break:break-word!important;overflow-wrap:anywhere!important;
  }

  .servers-list tbody td[data-label="Адрес"]{grid-area:address!important;display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important;}
  .servers-list tbody td[data-label="Адрес"] .address{
    display:block!important;flex:1 1 auto!important;min-width:0!important;max-width:none!important;
    font-size:10px!important;line-height:1.15!important;color:rgba(255,255,255,.78)!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;word-break:normal!important;
    background:rgba(255,255,255,.04)!important;border-radius:999px!important;padding:6px 10px!important;
  }
  .servers-list tbody td[data-label="Адрес"] .copy-btn{
    flex:0 0 22px!important;width:22px!important;min-width:22px!important;height:22px!important;min-height:22px!important;
    border-radius:7px!important;padding:0!important;margin:0!important;font-size:10px!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
  }

  .servers-list tbody td[data-label="Карта"]{grid-area:meta!important;display:block!important;min-width:0!important;}
  .servers-list tbody td[data-label="Карта"] .map-name{display:none!important;}
  .servers-list .mobile-inline-meta{
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;
    min-width:0!important;padding:5px 8px!important;border-radius:8px!important;background:rgba(255,255,255,.04)!important;
    font-size:10px!important;line-height:1.15!important;color:rgba(255,255,255,.88)!important;
  }
  .servers-list .mobile-inline-meta .mobile-map,
  .servers-list .mobile-inline-meta .mobile-players{min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .servers-list .mobile-inline-meta .mobile-map{flex:1 1 auto!important;}
  .servers-list .mobile-inline-meta .mobile-players{flex:0 0 auto!important;color:#fff!important;font-weight:700!important;}
  .servers-list .mobile-inline-meta .mobile-map:before{content:"Карта: ";color:rgba(255,255,255,.45)!important;}
  .servers-list .mobile-inline-meta .mobile-players:before{content:"Онлайн ";color:rgba(255,255,255,.45)!important;font-weight:400!important;}

  .servers-list tbody td[data-label="Игроки"]{display:none!important;}

  .servers-list tbody td[data-label="Рейтинг"]{
    grid-area:rating!important;
    width:42px!important;min-width:42px!important;
    display:flex!important;flex-direction:column!important;align-items:flex-end!important;justify-content:flex-start!important;gap:5px!important;
  }
  .servers-list tbody td[data-label="Рейтинг"]:before{display:none!important;}
  .servers-list tbody td[data-label="Рейтинг"] a{
    width:32px!important;height:32px!important;min-width:32px!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    border-radius:10px!important;font-size:12px!important;margin:0!important;
  }
  .servers-list tbody td[data-label="Рейтинг"] .vote,
  .servers-list tbody td[data-label="Рейтинг"] .rating-bg,
  .servers-list tbody td[data-label="Рейтинг"] b{
    min-width:32px!important;min-height:20px!important;padding:0 5px!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    border-radius:7px!important;font-size:10px!important;line-height:1!important;margin:0!important;
  }
}

@media (max-width: 390px){
  .servers-list tbody tr{grid-template-columns:18px minmax(0,1fr) 38px!important;gap:4px 7px!important;padding:7px!important;}
  .servers-list tbody td[data-label="Игра"]{width:18px!important;min-width:18px!important;height:18px!important;min-height:18px!important;}
  .servers-list tbody td[data-label="Игра"] img,.servers-list tbody td[data-label="Игра"] svg{width:11px!important;height:11px!important;}
  .servers-list tbody td[data-label="Название"] .hostname{font-size:10.5px!important;}
  .servers-list tbody td[data-label="Адрес"] .address{font-size:9.5px!important;padding:5px 9px!important;}
  .servers-list .mobile-inline-meta{font-size:9.5px!important;padding:5px 7px!important;}
  .servers-list tbody td[data-label="Рейтинг"]{width:38px!important;min-width:38px!important;}
  .servers-list tbody td[data-label="Рейтинг"] a{width:28px!important;height:28px!important;border-radius:9px!important;font-size:11px!important;}
  .servers-list tbody td[data-label="Рейтинг"] .vote,.servers-list tbody td[data-label="Рейтинг"] .rating-bg,.servers-list tbody td[data-label="Рейтинг"] b{min-width:28px!important;min-height:18px!important;font-size:9px!important;}
}