@font-face {
    font-family: "a_FuturaRound";
    src: url("/fonts/a-futuraround.eot");
    src: url("/fonts/a-futuraround.eot?#iefix") format("embedded-opentype"),
         url("/fonts/a-futuraround.woff2") format("woff2"),
         url("/fonts/a-futuraround.woff") format("woff"),
         url("/fonts/a-futuraround.ttf") format("truetype"),
         url("/fonts/a-futuraround.otf") format("opentype"),
         url("/fonts/a-futuraround.svg#a_FuturaRound") format("svg");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: local("Roboto"), local("Roboto Regular"), local("Roboto-Regular"),
         url("/fonts/Roboto.woff2") format("woff2"),
         url("/fonts/Roboto-Regular.woff2") format("woff2"),
         url("/fonts/Roboto.woff") format("woff"),
         url("/fonts/Roboto-Regular.woff") format("woff"),
         url("/fonts/Roboto.ttf") format("truetype"),
         url("/fonts/Roboto-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: local("Roboto Medium"), local("Roboto-Medium"),
         url("/fonts/Roboto-Medium.woff2") format("woff2"),
         url("/fonts/Roboto-Medium.woff") format("woff"),
         url("/fonts/Roboto-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: local("Roboto Bold"), local("Roboto-Bold"),
         url("/fonts/Roboto-Bold.woff2") format("woff2"),
         url("/fonts/Roboto-Bold.woff") format("woff"),
         url("/fonts/Roboto-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: local("Roboto Black"), local("Roboto-Black"),
         url("/fonts/Roboto-Black.woff2") format("woff2"),
         url("/fonts/Roboto-Black.woff") format("woff"),
         url("/fonts/Roboto-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* =============================================================
   CSS Variables
   ============================================================= */
:root{
    /* Background layers */
    --bg-main:   #0b0d12;
    --bg-card:   #141824;
    --bg-card-2: #1c2233;
    --bg-dark:   #0b0d12;   /* alias */
    --bg-deep:   #070910;

    /* Text */
    --text-main:  #f4ead7;
    --text-muted: #a9a08f;
    --cream:      #f4ead7;  /* alias */
    --muted-brown:#a9a08f;  /* alias */

    /* Accent / gold */
    --accent-gold:   #f5a623;
    --accent-orange: #ff8a00;
    --accent-light:  #ffd166;
    --accent:        #ff8a00;  /* alias for controls */
    --accent-dark:   #b77817;  /* dark gold for links on light blocks */
    --gold:          #ff8a00;  /* alias */
    --gold-2:        #ffd166;  /* alias */

    /* Status */
    --success: #22c55e;
    --danger:  #dc2626;
    --bs-red:  #dc2626;  /* fallback if Bootstrap variables are absent */

    /* Semantic card aliases (used across page-specific blocks) */
    --brown:   #141824;
    --brown-2: #1c2233;
    --card:    #141824;
    --card-soft:#1c2233;

    /* Silver-theme design tokens (used in dark-theme overrides) */
    --silver-card-top:    #3a4256;
    --silver-card-mid:    #252d3f;
    --silver-card-bottom: #171d2b;
    --silver-card-soft:   #465066;
    --silver-border:      rgba(226, 232, 240, .42);
    --silver-border-soft: rgba(226, 232, 240, .24);
    --silver-glow:        rgba(203, 213, 225, .20);
    --silver-shadow:      0 24px 70px rgba(0,0,0,.50),
                          inset 0 1px 0 rgba(255,255,255,.14),
                          inset 0 -1px 0 rgba(15,23,42,.72);
    --silver-shadow-hover:0 30px 86px rgba(0,0,0,.58),
                          0 0 30px rgba(203,213,225,.18),
                          inset 0 1px 0 rgba(255,255,255,.22);
    --block-border:       rgba(255, 209, 102, .38);
    --block-border-soft:  rgba(245, 166, 35, .18);
    --block-shadow:       0 20px 48px rgba(0,0,0,.42);
    --block-shadow-hover: 0 24px 56px rgba(0,0,0,.48), 0 0 22px rgba(245,166,35,.08);
}


/* =============================================================
   Reset / Global
   ============================================================= */
*,
*::before,
*::after{
    box-sizing: border-box;
}

html{
    min-height: 100%;
    scroll-behavior: smooth;
}

body{
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at 16% 0%, rgba(245,166,35,.10), transparent 28%),
        radial-gradient(circle at 92% 12%, rgba(77,111,255,.07), transparent 30%),
        linear-gradient(180deg, var(--bg-main) 0%, var(--bg-deep) 100%);
    color: var(--text-main);
    font-family: 'Roboto', Arial, sans-serif;
}

img,
svg{
    max-width: 100%;
    vertical-align: middle;
}

button,
input,
select,
textarea{
    font: inherit;
}

a{ color: var(--accent-light); text-decoration: none; }
a:hover{ color: #ffe3a3; }


/* =============================================================
   Typography — headings carry a gold underline accent
   ============================================================= */
h1,
h2,
h3,
.section-title h1,
.section-title h2,
.page-section h1,
.auth-section h1,
.modal-title{
    color: var(--text-main) !important;
}

.section-title h1::after,
.section-title h2::after,
.page-section h1::after,
.auth-section h1::after{
    content: "";
    display: block;
    width: 72px;
    height: 3px;
    margin-top: .55rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--accent-orange), var(--accent-light));
    box-shadow: 0 0 16px rgba(255,138,0,.35);
}

.text-cream,
.section-title h1,
.section-title h2,
.page-section h1,
.auth-section h1{ color: var(--text-main) !important; }

.text-muted-brown,
.text-muted,
.small,
small{ color: var(--text-muted) !important; }


/* =============================================================
   Top bar
   ============================================================= */
.topbar{
    background: rgba(17, 21, 32, .94);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 209, 102, .16);
    box-shadow: 0 10px 30px rgba(0,0,0,.32);
}

.py-3{
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

.brand{
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    font-weight: 800;
    letter-spacing: .4px;
}
.brand-logo{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    min-width: 58px;
    text-align: center;
    transform: scale(1.18);
    -webkit-transform: scale(1.18);
    -webkit-animation: leaves 2s ease-in-out 1 alternate;
    animation: leaves 2s ease-in-out 1 alternate;
    transition: transform 1s ease-out;
    -moz-transition: transform 1s ease-out;
    -o-transition: transform 1s ease-out;
    -webkit-transition: transform 1s ease-out;
}
.brand-logo:hover{
    transform: scale(1.32);
    -webkit-transform: scale(1.32);
}
.brand-logo img{
    display: block;
    width: 58px;
    height: 58px;
    object-fit: contain;
    animation: coin 5s ease-in-out 1 alternate;
    transition: transform 1s ease-out;
    -moz-transition: transform 1s ease-out;
    -o-transition: transform 1s ease-out;
    -webkit-transition: transform 1s ease-out;
    filter: drop-shadow(0 0 18px rgba(255,138,0,.32));
}
.brand-logo img:hover{
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
}
@keyframes coin {
    0% { transform: rotateY(0deg); }
    100% { transform: rotateY(360deg); }
}

@-webkit-keyframes leaves {
    0% { -webkit-transform: scale(.3); }
    100% { -webkit-transform: scale(1.18); }
}

@keyframes leaves {
    0% { transform: scale(.3); }
    100% { transform: scale(1.18); }
}

.langs{
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .18rem;
    border-radius: 999px;
    background: rgba(28,34,51,.76);
    border: 1px solid rgba(245,166,35,.22);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.18);
}
.lang-link{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .22rem;
    min-width: 44px;
    height: 34px;
    padding: 0 .48rem;
    border-radius: 999px;
    color: var(--text-main) !important;
    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    border: 1px solid transparent;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.lang-link:hover,
.lang-link:focus-visible{
    color: #1a1000 !important;
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    border-color: rgba(255,224,138,.86);
    box-shadow: 0 0 18px rgba(255,138,0,.28);
    transform: translateY(-1px);
    outline: none;
}
.lang-link-current{
    color: #1a1000 !important;
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    border-color: rgba(255,224,138,.92);
    cursor: default;
}
.lang-flag{
    font-size: 1rem;
    line-height: 1;
}
.lang-code{
    letter-spacing: .035em;
}


.top-vote-links{
    position: relative;
    display: inline-flex;
    align-items: center;
    z-index: 1040;
}
.top-vote-links::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
}
.top-vote-toggle{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 31px;
    padding: .25rem .68rem;
    border-radius: 999px;
    border: 1px solid rgba(245,166,35,.28);
    background: rgba(28,34,51,.76);
    color: var(--cream, #f7ecd4);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: .025em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.18);
    cursor: pointer;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}
.top-vote-toggle::after{
    content: "";
    width: .42rem;
    height: .42rem;
    margin-left: .12rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-1px);
    opacity: .78;
    transition: transform .18s ease;
}
.top-vote-links:hover .top-vote-toggle,
.top-vote-links:focus-within .top-vote-toggle{
    color: #1a1000;
    background: linear-gradient(135deg, #ff8a00, #ffd166);
    border-color: rgba(255,224,138,.92);
    box-shadow: 0 0 18px rgba(255,138,0,.28);
    transform: translateY(-1px);
}
.top-vote-links:hover .top-vote-toggle::after,
.top-vote-links:focus-within .top-vote-toggle::after{
    transform: rotate(225deg) translate(-1px, -1px);
}
.top-vote-menu{
    position: absolute;
    top: calc(100% + 9px);
    z-index: 1041;
    right: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(112px, 1fr));
    gap: .38rem;
    min-width: 268px;
    padding: .62rem;
    border-radius: 18px;
    background: rgba(17,20,31,.96);
    border: 1px solid rgba(245,166,35,.28);
    box-shadow: 0 20px 46px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px) scale(.98);
    transform-origin: right top;
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}
.top-vote-menu::before{
    content: "";
    position: absolute;
    right: 24px;
    top: -6px;
    width: 12px;
    height: 12px;
    background: rgba(17,20,31,.96);
    border-left: 1px solid rgba(245,166,35,.28);
    border-top: 1px solid rgba(245,166,35,.28);
    transform: rotate(45deg);
}
.top-vote-links:hover .top-vote-menu,
.top-vote-links:focus-within .top-vote-menu{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}
.top-vote-link{
    display: inline-flex;
    align-items: center;
    gap: .48rem;
    min-width: 0;
    min-height: 44px;
    padding: .18rem .42rem .18rem .18rem;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.05);
    background: rgba(255,255,255,.035);
    color: rgba(255,246,226,.88);
    text-decoration: none;
    text-transform: uppercase;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .04em;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}
.top-vote-link:hover,
.top-vote-link:focus-visible{
    color: #fff;
    background: linear-gradient(135deg, rgba(255,138,0,.35), rgba(255,209,102,.22));
    border-color: rgba(255,224,138,.74);
    box-shadow: 0 0 18px rgba(255,138,0,.28);
    transform: translateY(-1px);
    outline: none;
}
.top-vote-icon{
    flex: 0 0 44px;
    display: block;
    width: 44px;
    height: 39px;
    background-image: url('/images/style/icons.png');
    background-repeat: no-repeat;
    filter: grayscale(.18) brightness(.95);
    transition: filter .18s ease;
}
.top-vote-name{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.top-vote-link:hover .top-vote-icon,
.top-vote-link:focus-visible .top-vote-icon{
    filter: grayscale(0) brightness(1.08);
}
.mmotop{background-position: 0 -39px;}
.topzone{background-position: -44px -39px;}
.hopzone{background-position: -88px -39px;}
.l2server{background-position: -132px -39px;}
.brazil{background-position: -176px -39px;}
.l2network{background-position: -220px -39px;}
.l2top{background-position: -308px 0;}




/* =============================================================
   Hero section
   ============================================================= */
.site-main{ min-height: 70vh; }

.hero-section{
    border-bottom: 1px solid rgba(255, 209, 102, .16);
    background:
        radial-gradient(circle at top left, rgba(245,166,35,.12), transparent 34%),
        linear-gradient(135deg, rgba(27,33,50,.78), rgba(11,13,18,.86));
}


/* Server opening countdown */
.server-open-countdown{
    position: relative;
    z-index: 2;
    padding: 1rem 1.05rem 1.05rem;
    border-radius: 22px;
    border: 1px solid rgba(255, 210, 82, .72);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 224, 122, .34), transparent 30%),
        radial-gradient(circle at 90% 12%, rgba(255, 29, 29, .32), transparent 34%),
        linear-gradient(135deg, #4d0604 0%, #94130b 38%, #2a0604 72%, #130706 100%);
    box-shadow:
        0 22px 54px rgba(0,0,0,.50),
        0 0 32px rgba(247, 0, 0, .28),
        0 0 26px rgba(255, 210, 82, .22),
        inset 0 1px 0 rgba(255,255,255,.20),
        inset 0 -1px 0 rgba(55, 0, 0, .72);
    overflow: hidden;
}
.server-open-countdown::before{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(110deg, transparent 0%, rgba(255,255,255,.28) 42%, rgba(255, 210, 82, .32) 50%, transparent 64%),
        linear-gradient(90deg, rgba(255, 210, 82, .34), transparent 18%, transparent 82%, rgba(247, 0, 0, .24));
    transform: translateX(-125%);
    animation: countdownShine 3.8s ease-in-out infinite;
    mix-blend-mode: screen;
}
.server-open-countdown::after{
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 0;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, #ffd65a, #ff2d1f, #ffd65a, transparent);
    box-shadow: 0 0 18px rgba(255, 210, 82, .70);
    pointer-events: none;
}
.server-open-countdown-title{
    position: relative;
    z-index: 1;
    margin-bottom: .7rem;
    color: #fff4c7;
    font-size: .94rem;
    font-weight: 950;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .075em;
    text-shadow:
        0 1px 0 rgba(92, 0, 0, .70),
        0 0 16px rgba(255, 210, 82, .40),
        0 0 22px rgba(247, 0, 0, .25);
}
.server-open-countdown-title a{
    color: #ffe36f !important;
}
.server-open-countdown-title span{
    color: #ff2b1d;
    text-shadow:
        0 0 10px rgba(255, 43, 29, .75),
        0 0 18px rgba(255, 210, 82, .45);
}
.server-open-countdown-timer{
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .58rem;
}
.server-open-countdown-item{
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    border: 1px solid rgba(255, 224, 122, .76);
    background:
        radial-gradient(circle at 50% 8%, rgba(255,255,255,.30), transparent 33%),
        linear-gradient(180deg, rgba(255, 210, 82, .30) 0%, rgba(247, 0, 0, .22) 52%, rgba(38, 0, 0, .58) 100%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.24),
        inset 0 -1px 0 rgba(92,0,0,.58),
        0 10px 22px rgba(0,0,0,.30),
        0 0 18px rgba(255, 210, 82, .18);
}
.server-open-countdown-item b{
    color: #fff6d1;
    font-size: clamp(1.18rem, 2.8vw, 1.72rem);
    line-height: 1;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
    text-shadow:
        0 2px 0 rgba(92, 0, 0, .70),
        0 0 14px rgba(255, 210, 82, .78),
        0 0 18px rgba(255, 43, 29, .45);
}
.server-open-countdown-item small{
    margin-top: .22rem;
    color: #ffcf4f !important;
    font-size: .62rem;
    line-height: 1;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .07em;
    text-shadow: 0 0 10px rgba(255, 210, 82, .45);
}
@keyframes countdownShine{
    0%, 45%{ transform: translateX(-125%); opacity: .55; }
    72%{ opacity: .95; }
    100%{ transform: translateX(125%); opacity: .55; }
}

@media (max-width: 575.98px){
    .server-open-countdown{
        padding: .82rem;
        border-radius: 18px;
    }
    .server-open-countdown-timer{
        gap: .38rem;
    }
    .server-open-countdown-item{
        min-height: 56px;
        border-radius: 14px;
    }
    .server-open-countdown-item b{
        font-size: 1.05rem;
    }
    .server-open-countdown-item small{
        font-size: .52rem;
        letter-spacing: .04em;
    }
}

@media (prefers-reduced-motion: reduce){
    .server-open-countdown::before{
        animation: none !important;
        transform: none;
        opacity: .18;
    }
}


/* =============================================================
   Buttons
   ============================================================= */
.form-select option{
    color: #000 !important;
}

.btn{
    border-radius: 999px;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}

.btn-main,
.btn-gold,
.btn-primary,
.support-button-toggle{
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    color: #1a1000 !important;
    font-weight: 800;
    border: 1px solid #ffcc66 !important;
    box-shadow: 0 0 18px rgba(255,138,0,.35);
}
.download-main-link{
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    color: #fff !important;
    font-weight: 800;
    border: 1px solid #ffcc66 !important;
    box-shadow: 0 0 18px rgba(255,138,0,.35);
}
.btn-main:hover,
.btn-gold:hover,
.btn-primary:hover,
.download-main-link:hover,
.support-button-toggle:hover{
    background: linear-gradient(135deg, #ff9f1a, #ffe08a) !important;
    color: #fff !important;
    border-color: #ffe08a !important;
    box-shadow: 0 0 26px rgba(255,168,40,.55);
    transform: translateY(-1px);
}

.btn-brown,
.btn-outline-light,
.lang-switch a,
.nav-pills .nav-link{
    background: rgba(28,34,51,.86);
    border: 1px solid rgba(245,166,35,.22);
    color: var(--text-main);
}
.btn-brown:hover,
.btn-outline-light:hover,
.lang-switch a:hover,
.nav-pills .nav-link.active,
.nav-pills .nav-link:hover{

    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    color: #1a1000 !important;
    border: 1px solid #ffcc66 !important;
    box-shadow: 0 0 18px rgba(255,138,0,.35);
	
}

.btn-green,
.btn-hero-donate-green {
    background: linear-gradient(135deg, #007502, #3fff00) !important;
    color: #062b15 !important;
    font-weight: 900;
    border: 1px solid #2da144 !important;
    box-shadow: 0 0 18px rgba(34,197,94,.35);
}
.btn-green:hover,
.btn-green:focus,
.btn-hero-donate-green:hover,
.btn-hero-donate-green:focus {
    background: linear-gradient(135deg, #16a34a, #74d88f) !important;
    color: #d1ffda !important;
    border-color: #044728 !important;
    box-shadow: 0 0 26px rgba(34,197,94,.55);
    transform: translateY(-1px);
}

/* =============================================================
   Universal card blocks
   ============================================================= */
.game-card,
.hero-card,
.about-hero,
.about-content-card,
.about-info-card,
.about-years-card,
.download-chronicle,
.download-file,
.files-hero,
.files-info,
.files-changelog-box,
.rules-hero,
.rules-intro,
.rules-warning-box,
.rules-toc,
.rules-nav-card,
.rule-item,
.bonus-hero,
.bonus-card,
.bonus-vote-card,
.bonus-rewards-card,
.bonus-table-wrap,
.forum-last-card,
.news-popup-card,
.auth-section .game-card,
.support-panel,
.modal-content{
	background: linear-gradient(135deg, rgb(4 11 35), #070910);
    color: var(--text-main) !important;
    border: 1px solid var(--silver-border) !important;
    box-shadow: var(--silver-shadow) !important;
	border-radius: 18px;

}

/* Card headings */
.game-card h1,
.game-card h2,
.game-card h3,
.hero-card h1,
.hero-card h2,
.hero-card h3,
.about-page h1,
.about-page h2,
.about-page h3,
.files-page h1,
.files-page h2,
.rules-page h1,
.rules-page h2,
.rules-page h3,
.bonus-page h1,
.bonus-page h2,
.bonus-page h3,
.forum-last-card h2,
.modal-content h1,
.modal-content h2,
.modal-content h3{
    color: var(--text-main) !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.32);
}

/* Muted labels inside cards */
.text-muted-brown,
.game-card .text-muted-brown,
.hero-card .text-muted-brown,
.download-chronicle .text-muted-brown,
.news-popup-card .text-muted-brown,
.about-mini-stat span,
.download-file small,
.forum-last-meta,
.bonus-item-name small{
    color: var(--text-muted) !important;
    opacity: 1;
}
.download-file small{
    color: var(--text-main) !important;
    opacity: 1;
}

/* Card hover */
.game-card:hover,
.hero-card:hover,
.download-chronicle:hover,
.download-file:hover,
.about-content-card:hover,
.about-info-card:hover,
.bonus-card:hover,
.forum-last-link:hover,
.server-tile:hover .server-id,
.rules-toc-link:hover,
.files-quick-actions a:hover,
.bonus-tabs .nav-link:hover{
    border-color: rgba(248,250,252,.58) !important;
    box-shadow: var(--silver-shadow-hover) !important;
    filter: brightness(1.05);
}

/* Links inside dark cards */
.modal-content a:not(.btn):not(.nav-link):not(.dropdown-item),
.game-card a:not(.btn),
.rules-content a:not(.btn){
    color: #fff !important;
}
.modal-content a:not(.btn):not(.nav-link):not(.dropdown-item):hover,
.game-card a:not(.btn):hover,
.rules-content a:not(.btn):hover{
    color: #fff1bd !important;
    background: rgba(245,166,35,.10) !important;
}


/* =============================================================
   Badge / pill elements
   ============================================================= */
.badge-soft,
.game-card .badge-soft,
.hero-card .badge-soft,
.files-page .badge-soft,
.news-popup-card .badge-soft,
.forum-last-badge,
.bonus-chance,
.bonus-hero-badge,
.download-badge{
    background:
        linear-gradient(135deg, rgba(255,255,255,.16), rgba(148,163,184,.16)),
        rgba(37,45,67,.92) !important;
    border: 1px solid rgba(226,232,240,.38) !important;
    color: #fff3c4 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 20px rgba(0,0,0,.22) !important;
	border-radius: 18px;
	padding: 5px 10px;
}

/* Accent for VIP / bonus labels */
.bonus-kicker,
.files-kicker,
.rules-kicker,
.about-kicker,
.bonus-card-icon,
.vip{ color: var(--accent-light) !important; }

.bonus-hero-badge,
.bonus-chance,
.server-ribbon-gold span{
    background: linear-gradient(135deg, rgba(245,166,35,.20), rgba(255,209,102,.10));
    border-color: rgba(255,209,102,.34);
}


/* =============================================================
   Status dots and status badges
   ============================================================= */
.status-dot{
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 6px;
    background: var(--danger);
    box-shadow: 0 0 0 3px rgba(220,38,38,.16);
}
.status-dot.online,
.badge.bg-success{
    background: var(--success) !important;
    color: #052e14 !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,.18), 0 0 18px rgba(34,197,94,.26);
}
.text-success{
    color: var(--success) !important;
    background: transparent !important;
    box-shadow: none !important;
}
.status-dot:not(.online),
.badge.bg-danger{
    background: var(--danger) !important;
    color: #fff !important;
    box-shadow: 0 0 0 3px rgba(220,38,38,.16);
}
.text-danger{
    color: #ffb4b4 !important;
    background: transparent !important;
    box-shadow: none !important;
}


/* =============================================================
   Section titles
   ============================================================= */
.section-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
}
.section-title h1,
.section-title h2{ margin: 0; }


/* =============================================================
   Server grid
   ============================================================= */
.home-servers-card{ overflow: hidden; }
.home-servers-card .servers{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
	margin-top:10px;
}

.server-tile{ perspective: 900px; }

.server-id{
    display: block;
    position: relative;
    min-height: 112px;
    border-radius: 18px;
    overflow: hidden;
    isolation: isolate;
    background:
        linear-gradient(135deg, rgba(255,209,102,.11), transparent 34%),
        linear-gradient(180deg, rgba(32,39,58,.94), rgba(16,20,31,.98));
    border: 1px solid rgba(238,225,196,.14) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 10px 24px rgba(0,0,0,.22) !important;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.server-id::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(circle at 88% 12%, rgba(34,197,94,.16), transparent 24%),
        radial-gradient(circle at 18% 0%, rgba(255,138,0,.14), transparent 30%),
        linear-gradient(90deg, rgba(255,209,102,.22), transparent 18%, transparent 82%, rgba(255,209,102,.08)) !important;
    opacity: .95;
    pointer-events: none;
}

.server-id::after{
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,209,102,.74), transparent);
    opacity: .72;
    pointer-events: none;
}

.server-tile:hover .server-id{
    transform: translateY(-2px) rotateX(1deg) !important;
    border-color: rgba(255,209,102,.42) !important;
    background:
        linear-gradient(135deg, rgba(255,209,102,.15), transparent 36%),
        linear-gradient(180deg, rgba(36,45,67,.96), rgba(17,21,33,.99)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 14px 30px rgba(0,0,0,.30),
        0 0 22px rgba(255,138,0,.08) !important;
}

.server-id .leftRect,
.server-id .rightRect{
    position: absolute;
    top: 12px;
    bottom: 12px;
    width: 3px;
    height: auto;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255,209,102,.78), rgba(255,138,0,.24), rgba(34,197,94,.34)) !important;
    opacity: .58;
    z-index: 1;
    pointer-events: none;
}
.server-id .leftRect{ left: 10px; }
.server-id .rightRect{ right: 10px; opacity: .22 !important; }

.server-body{
    position: relative;
    z-index: 2;
    min-height: 112px;
    padding: 1.75rem 1rem .82rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: 1fr auto;
    align-items: center;
    justify-items: center;
    gap: .35rem .45rem;
    text-align: left;
}

.server-body img{
    grid-column: 1 / 4;
    grid-row: 1 / 2;
    width: 112px;
    height: 56px;
    max-width: 78%;
    object-fit: contain;
    filter: drop-shadow(0 7px 12px rgba(0,0,0,.34)) saturate(1.03);
    opacity: .96;
    transition: transform .25s ease;
}
.server-tile:hover .server-body img{ transform: scale(1.025) !important; }

.server-name{
    position: absolute;
    top: .58rem;
    left: 1rem;
    right: 3.9rem;
    z-index: 2;
    color: #f4ead7 !important;
    font-size: .98rem;
    line-height: 1.05;
    font-weight: 900;
    letter-spacing: .055em;
    text-align: left;
    text-transform: uppercase;
    text-shadow: 0 2px 12px rgba(0,0,0,.45), 0 0 14px rgba(245,166,35,.15) !important;
}

.server-rate{
    position: static;
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 25px;
    padding: .12rem .48rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    color: #201000 !important;
    font-size: .82rem;
    font-weight: 950;
    box-shadow: 0 5px 13px rgba(255,138,0,.22) !important;
}

.server-online{
    position: absolute;
    bottom: .52rem;
    right: .82rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 23px;
    padding: .08rem .42rem;
    border-radius: 999px;
    color: #fff3f3 !important;
    font-size: .72rem;
    font-weight: 950;
}
.server-online.is-offline,
.server-online.offline{
    color: #fff3f3 !important;
}

.server-add{ display: none !important; }

/* Ribbons */
.server-ribbon{
    position: absolute;
    z-index: 4;
    width: 90px;
    height: 120px;
    overflow: hidden;
    pointer-events: none;
    opacity: .94;
}
.server-ribbon span{
    position: absolute;
    display: block;
    width: 124px;
    padding: .2rem 0;
    background: linear-gradient(135deg, #007502, #3fff00);
    color: #fff;
    font-size: 14px;
    line-height: 1;
    font-weight: 950;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .025em;
    text-shadow: 0 1px 3px rgba(0,0,0,.3);
    box-shadow: 0 5px 12px rgba(0,0,0,.18) !important;
}
.server-ribbon-br{ right: -2px; bottom: -12px; }
.server-ribbon-br span{ right: -31px; bottom: 25px; transform: rotate(-45deg); }
.server-ribbon-tr{ right: -12px; top: -12px; }
.server-ribbon-tr span{ right: -31px; top: 25px; transform: rotate(45deg); }
.server-ribbon-gold span{
    background: linear-gradient(120deg, #9f650b 0%, #d89b21 24%, #fff1a3 42%, #c88612 58%, #7a4a05 78%, #f4cf62 100%);
    background-size: 220% 220%;
    color: #2d1800;
    text-shadow: 0 1px 0 rgba(255,255,255,.55), 0 2px 8px rgba(102,59,0,.32);
    border-top: 1px solid rgba(255,255,255,.45);
    border-bottom: 1px solid rgba(92,52,0,.28);
    animation: serverGoldShimmer 3.4s ease-in-out infinite;
	font-size: 16px;
	width: 144px;
}
@keyframes serverGoldShimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}


/* =============================================================
   News scroll
   ============================================================= */
.news-scroll{
    display: flex;
    align-items: stretch;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: .25rem .25rem 1.05rem;
    scroll-snap-type: none;
    scroll-behavior: auto;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) rgba(255,255,255,.16);
}
.news-scroll::-webkit-scrollbar{ height: 10px; }
.news-scroll::-webkit-scrollbar-track{ background: rgba(255,255,255,.14); border-radius: 999px; }
.news-scroll::-webkit-scrollbar-thumb{ background: linear-gradient(135deg, var(--accent-orange), var(--accent-light)); border-radius: 999px; }

.news-scroll{
    cursor: grab;
    -webkit-overflow-scrolling: touch;
}
.news-scroll.is-drag-ready,
.news-scroll.is-dragging{
    cursor: grabbing;
    user-select: none;
}
.news-scroll.is-dragging .news-card,
.news-scroll.is-dragging .news-card *{
    user-select: none;
}
.news-scroll.is-dragging .news-card{
    transform: none !important;
    transition: none !important;
}
.news-scroll .news-card,
.news-scroll .news-card img{
    -webkit-user-drag: none;
}

.news-card{
    position: relative;
    isolation: isolate;
    flex: 0 0 min(360px, 86vw);
    min-height: 360px;
    overflow: hidden;
    scroll-snap-align: none;
    display: flex;
    align-items: flex-end;
    text-decoration: none;
    cursor: pointer;
    border-radius: 22px;
    transform: translateY(0);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.news-card:not(.has-bg){
    background:
        radial-gradient(circle at 18% 0%, rgba(255,209,102,.08), transparent 38%),
        linear-gradient(180deg, #252d43 0%, #1b2132 100%) !important;
    border: 1px solid rgba(255,209,102,.20) !important;
}
.news-card::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: var(--news-bg, none);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1);
    transition: transform .45s ease, filter .45s ease;
}
.news-card.has-bg::before{
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 25%, rgba(0,0,0,.62) 55%, rgba(0,0,0,.24) 78%, transparent 100%);
    mask-image:         linear-gradient(180deg, #000 0%, #000 25%, rgba(0,0,0,.62) 55%, rgba(0,0,0,.24) 78%, transparent 100%);
}
.news-card.has-bg::after{
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg, rgba(11,13,18,.05) 0%, rgba(11,13,18,.54) 42%, rgba(11,13,18,.90) 100%) !important;
}
.news-card.has-bg{ color: var(--cream); text-shadow: 0 2px 12px rgba(0,0,0,.45); }
.news-card:hover{ transform: translateY(-4px); box-shadow: 0 26px 55px rgba(0,0,0,.34); border-color: rgba(255,180,92,.55); }
.news-card:hover::before{ transform: scale(1.12); filter: saturate(1.08) contrast(1.05); }

.news-card-content{
    width: 100%;
    min-height: 100%;
    padding: 1.35rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: inherit;
}
.news-card-title,
.news-card-text{ color: var(--text-main) !important; }
.news-card.has-bg .news-card-title{ color: #fff7e8; }
.news-card-title{ font-weight: 800; line-height: 1.25; margin-bottom: .7rem; }
.news-card-text{ display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

.news-date{ color: var(--accent-light) !important; font-size: .9rem; margin-bottom: .5rem; font-weight: 700; }

/* News popup cover */
.news-popup-cover{
    min-height: 260px;
    background-image: var(--news-bg, none);
    background-size: cover;
    background-position: center top;
    position: relative;
    animation: newsPopupCoverPan 4.4s ease-out 1 both;
}
.news-popup-cover::after{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg,
            rgba(0,0,0,.04) 0%,
            rgba(11,13,18,.10) 42%,
            rgba(11,13,18,.72) 78%,
            #111622 100%
        );
}

@-webkit-keyframes newsPopupCoverPan {
    0% { background-position: center top; }
    68% { background-position: center bottom; }
    100% { background-position: center center; }
}

@keyframes newsPopupCoverPan {
    0% { background-position: center top; }
    68% { background-position: center bottom; }
    100% { background-position: center center; }
}

@media (prefers-reduced-motion: reduce) {
    .news-popup-cover{
        animation: none !important;
        background-position: center center;
    }
}


/* =============================================================
   Forum / BBCode content
   ============================================================= */
.forum-content{ line-height: 1.5; overflow-wrap: anywhere; }
.forum-content br + br{ display: block; content: ""; margin-top: .45rem; }
.forum-content img,
.forum-img{ max-width: 100%; height: auto; border-radius: 16px; margin: .55rem 0; }
.forum-content .text-center{ text-align: center; }
.forum-content .text-end{ text-align: right; }

.forum-quote{ border-left: 4px solid var(--gold); padding: .75rem 1rem; background: rgba(255,255,255,.22); border-radius: 12px; }

.forum-spoiler,
.pro-spoiler,
.forum-content{
position: relative;
    margin: 8px 0;
    padding: 13px 15px;
    border-radius: 14px;
    line-height: 1.55;
    transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
    background: linear-gradient(90deg, #efefef, #eee);
    color: #000 !important;

}
.forum-quote,
.files-quick-actions a,
.rules-toc-link,
.bonus-tabs .nav-link{
    background:
        linear-gradient(122deg, rgba(255,255,255,.18), rgba(255,255,255,.04) 30%, transparent 52%),
        linear-gradient(155deg, #4a5368 0%, #30384d 38%, #20283a 100%) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--silver-border-soft) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 26px rgba(0,0,0,.28) !important;
}
.forum-spoiler summary{
    cursor: pointer;
}

.pro-spoiler-title{
    padding: .65rem .85rem;
    color: var(--accent-light);
    font-weight: 800;
	min-height:40px;
	background:
		linear-gradient(155deg, #20283a 0%, #30384d 38%, #4a5368 100%),
        linear-gradient(122deg, rgba(255,255,255,.18), rgba(255,255,255,.04) 30%, transparent 52%) !important;
	border-radius: 14px;
}
.forum-spoiler-body,
.pro-spoiler-body{ padding: .85rem; overflow: auto; }

/* Dark links inside server description spoiler blocks */
.pro-spoiler a:not(.btn),
.pro-spoiler a[href]:not(.btn){
    color: #1a1000 !important;
    font-weight: 800;
}
.pro-spoiler a:not(.btn):hover,
.pro-spoiler a[href]:not(.btn):hover{
    color: #000 !important;
    text-decoration: underline;
}

.forum-list{ padding-left: 1.35rem; margin: .75rem 0; }
.forum-list li{ margin: .25rem 0; }

.bbcode-font{ display: inline; }

/* Last-topics grid */
.forum-last-card .section-title a{
	color: var(--text-main);
	font-size: var(--bs-btn-font-size);
	font-weight: 0;
	text-decoration: none;
}
.forum-last-card .section-title h2{
	text-transform: uppercase;
	letter-spacing: .055em;
}
.forum-last-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}
.forum-last-link{
    display: flex;
    min-width: 0;
    min-height: 74px;
    flex-direction: column;
    justify-content: space-between;
    gap: .55rem;
    padding: .78rem .82rem;
    border: 1px solid rgba(111,58,22,.22);
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 10px 22px rgba(36,17,6,.09);
    color: #2f1608;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.forum-last-link:hover{
    color: #1f0e04;
    border-color: rgba(255,143,43,.52);
    background: linear-gradient(145deg, rgba(255,239,207,.98), rgba(255,204,132,.78));
    box-shadow: 0 14px 28px rgba(36,17,6,.15);
    transform: translateY(-2px);
}
.forum-last-title{
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: inherit;
    font-size: .9rem;
    font-weight: 850;
    line-height: 1.22;
}
.forum-last-meta{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .45rem;
    color: #77502f;
    font-size: .74rem;
    font-weight: 700;
}
.forum-last-list a,
.forum-last-item {
    background: rgba(28,34,51,.96) !important;
    color: var(--text-main) !important;
}
.forum-last-list a:hover,
.forum-last-item:hover{
    background: rgba(28,34,51,.96);
    color: var(--accent-light) !important;
    border-color: rgba(255,209,102,.40) !important;
}
.forum-last-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 35px;
    padding: .12rem .42rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .02em;
}


/* =============================================================
   Tables
   ============================================================= */
.table,
.table-game,
.bonus-table,
.bonus-reward-table{
    --bs-table-color: var(--text-main);
    --bs-table-bg: rgba(48,56,77,.76) !important;
    --bs-table-striped-bg: rgba(70,80,102,.68) !important;
    --bs-table-hover-bg: rgba(226,232,240,.14) !important;
    --bs-table-border-color: rgba(255,209,102,.18) !important;
    color: var(--text-main) !important;
}
.table thead,
.table-game thead,
.bonus-table thead,
.bonus-reward-table thead{
    background: linear-gradient(135deg, rgba(226,232,240,.24), rgba(148,163,184,.15)) !important;
    color: #f8fafc !important;
}

.mini-tabs,
.mini-server-tabs{
    gap: .35rem;
}
.mini-tabs .nav-link,
.mini-server-tabs .nav-link{
    color: var(--accent-orange);
    border-radius: 999px;
    padding: .20rem .4rem;
}
.mini-tabs .nav-link.active,
.mini-server-tabs .nav-link.active{
    background: var(--brown);
    color: var(--cream);
}
.mini-server-tabs .nav-link{
    font-size: .84rem;
    border-color: rgba(255, 209, 102, .24);
}
.mini-rating-content{
    min-height: 180px;
}

.place{ width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--brown); color: var(--cream); font-weight: 700; }
.name{ flex: 1; padding-left: .5rem; font-weight: 700; }
.score,
.news-date,
.f_id{ color: var(--accent-light) !important; font-weight: 700; }

.server-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(43,22,11,.15);
}
.mini-rating-row{
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 4px 0;
    border-bottom: 1px solid rgba(43,22,11,.15);
}
.mini-rating-row--has-clan,
.mini-rating-row--has-leader{
    grid-template-columns: 34px minmax(0, 1fr) minmax(72px, .8fr) auto;
}
.mini-rating-row .place{ grid-column: 1; }
.mini-rating-row .name,
.mini-rating-name{ min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.mini-rating-row .score{ justify-self: end; white-space: nowrap; }
.mini-rating-clan{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-muted) !important;
    font-size: .78rem;
    font-weight: 800;
}
.mini-rating-leader{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-muted) !important;
    font-size: .78rem;
    font-weight: 800;
}
.mini-rating-leader .rating-sex{
    margin-left: .25rem;
    font-size: .9em;
}
.cabinet-account-premium{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    flex-wrap: wrap;
}
.cabinet-premium-connect{
    margin-left: auto;
    padding: .28rem .72rem;
    line-height: 1.2;
}
.server-row:last-child,
.mini-rating-row:last-child{ border-bottom: 0; }

.mini-rating-pane.mini-rating-pane-animate{
    -webkit-animation-name: tr_scale;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-duration: .7s;
    -webkit-animation-delay: 0s;
    animation-name: tr_scale;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-duration: .7s;
    animation-delay: 0s;
    transform-origin: center top;
    will-change: transform;
}

@-webkit-keyframes tr_scale{
    0%{ -webkit-transform: scale(1.08, 1.12); transform: scale(1.08, 1.12); }
    80%{ -webkit-transform: scale(.96, .92); transform: scale(.96, .92); }
    100%{ -webkit-transform: scale(1, 1); transform: scale(1, 1); }
}

@keyframes tr_scale{
    0%{ transform: scale(1.08, 1.12); }
    80%{ transform: scale(.96, .92); }
    100%{ transform: scale(1, 1); }
}

.btn-play-pulse{
    -webkit-animation: playButtonPulse 1.6s ease-in-out infinite;
    animation: playButtonPulse 1.6s ease-in-out infinite;
    transform-origin: center;
    will-change: transform;
}

.btn-play-pulse:hover,
.btn-play-pulse:focus{
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

@-webkit-keyframes playButtonPulse{
    0%, 100%{ -webkit-transform: scale(1); transform: scale(1); }
    50%{ -webkit-transform: scale(1.08); transform: scale(1.08); }
}

@keyframes playButtonPulse{
    0%, 100%{ transform: scale(1); }
    50%{ transform: scale(1.08); }
}


/* =============================================================
   Forms
   ============================================================= */
.form-control,
.form-select{
    background: linear-gradient(180deg, #40495d 0%, #273044 100%) !important;
    color: var(--text-main) !important;
    border-color: rgba(226,232,240,.36) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.form-control:focus,
.form-select:focus{
    background: linear-gradient(180deg, #4b556b 0%, #30394f 100%) !important;
    border-color: rgba(255,209,102,.66) !important;
    box-shadow: 0 0 0 .2rem rgba(255,209,102,.16), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.form-control::placeholder{ color: rgba(244,234,215,.48); }

.form-label{ color: #6a7382; font-weight: 800; }

.form-error{ display: none !important; min-height: 0 !important; margin-top: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.form-error:not(:empty){
    display: block !important;
    margin-top: .35rem !important;
    padding: .45rem .65rem !important;
    border-radius: 10px;
    font-size: .875rem;
    line-height: 1.35;
    color: #ffd4d4;
    background: rgba(220,38,38,.14) !important;
    border: 1px solid rgba(220,38,38,.32) !important;
}

.alert-danger,
.invalid-feedback,
.is-invalid ~ .form-error{
    background: rgba(220,38,38,.12) !important;
    border-color: rgba(220,38,38,.30) !important;
    color: #ffd7d7 !important;
}
.alert-warning,
.download-alert{
    background: rgba(245,166,35,.11) !important;
    border-color: rgba(245,166,35,.26) !important;
    color: var(--text-main) !important;
}

/* Password toggle */
.password-toggle-field{ position: relative; }
.password-toggle-field .form-control{ padding-right: 3.15rem; }
.password-toggle-btn{
    position: absolute;
    top: 50%;
    right: .72rem;
    width: 2.05rem;
    height: 2.05rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
    border: 0;
    border-radius: 999px;
    background: #141824;
    color: var(--gold-2);
    font-size: 1rem;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
    z-index: 3;
}
.password-toggle-btn:hover,
.password-toggle-btn:focus-visible,
.password-toggle-btn.is-visible{
    background: linear-gradient(135deg, var(--gold), var(--gold-2));
    color: #241104;
    box-shadow: 0 8px 18px rgba(255,138,0,.22);
    outline: none;
}
.password-toggle-btn:active{ transform: translateY(-50%) scale(.96); }


/* =============================================================
   Modals / Popups
   ============================================================= */
.modal-content{
    border-radius: 24px;
    overflow: hidden;
}
.modal-header,
.modal-footer{ border-color: rgba(245,166,35,.14); }

.page-popup .modal-content{
    background-color: #070910;
    background:
        radial-gradient(circle at 15% 0%, rgba(255,209,102,.12), transparent 36%),
        linear-gradient(180deg, #1b2132 0%, #111622 100%) !important;
    border-color: rgba(255,209,102,.30) !important;
    box-shadow: 0 30px 100px rgba(0,0,0,.72), 0 0 32px rgba(203,213,225,.16), inset 0 1px 0 rgba(255,255,255,.18) !important;
    color: var(--cream);
    border-radius: 24px;
    overflow: hidden;
}
.page-popup .modal-header{
    background-color: #0a1023;
    border-bottom-color: rgba(255,209,102,.24) !important;
}
.page-popup .modal-title{ color: var(--gold-2); font-weight: 800; }
.page-popup .modal-body{ padding: 0; min-height: 220px; }
.page-popup .modal-body > .container,
.page-popup .modal-body > section > .container{ max-width: 100%; }
.page-popup .modal-body .page-section,
.page-popup .modal-body .auth-section{ padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
.page-popup .modal-body .sticky-side{ position: static; }
.page-popup .popup-loader{
    position: absolute;
    inset: 58px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(11,13,18,.78) !important;
    z-index: 10;
}
.page-popup .popup-loader-image{
    width: 150px;
    height: 150px;
    object-fit: contain;
	transform: scaleX(-1);
}
.page-popup .popup-loader.d-none{ display: none !important; }
.page-popup .modal-body.is-loading{ min-height: 260px; }

/* Links inside popup — override dark-card rule to stay subtle */
.page-popup .modal-content a:not([class]),
.page-popup .modal-content .forum-content a:not(.btn),
.page-popup .modal-content .rules-content a:not(.btn){
    color: var(--accent-dark) !important;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,209,102,.28);
    padding-bottom: 1px;
    transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}
.page-popup .modal-content a:not([class]):hover,
.page-popup .modal-content .forum-content a:not(.btn):hover,
.page-popup .modal-content .rules-content a:not(.btn):hover{
    color: #fff1bd !important;
    border-bottom-color: rgba(255,209,102,.72);
    background-color: rgba(245,166,35,.08) !important;
}

.page-popup .rules-toc{ top: 16px; max-height: calc(100vh - 190px); }


/* =============================================================
   Sticky sidebar
   ============================================================= */
.sticky-side{ position: sticky; top: 100px; }

/* TOP 5 on the home page must scroll normally,
not stay pinned. */
.home-section [data-mini-ratings],
[data-mini-ratings]{
    position: static !important;
    top: auto !important;
}


/* =============================================================
   Files page
   ============================================================= */
.files-page .files-hero{ position: relative; overflow: hidden; }
.files-page .files-hero::after{
    content: "";
    position: absolute;
    inset: auto -8% -42% auto;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0,138,29,.28), transparent 70%);
    pointer-events: none;
}

.files-quick-actions{ display: grid; gap: .75rem; position: relative; z-index: 1; }

.download-chronicle{ border-radius: 24px; padding: 1.25rem; }
.download-chronicle-head{ display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.download-chronicle-img-wrap{
    width: 154px;
    min-width: 154px;
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(43,22,11,.18), rgba(255,255,255,.18));
    border: 1px solid rgba(43,22,11,.12);
    overflow: hidden;
}
.download-chronicle-img-wrap img{ max-width: 100%; height: auto; object-fit: contain; }

.download-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 28px;
    padding: .2rem .6rem;
    border-radius: 999px;
    font-weight: 900;
    letter-spacing: .04em;
}

.download-launcher{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    border-radius: 18px;
    background: radial-gradient(circle at top right, rgba(255, 180, 92, .22), transparent 42%), linear-gradient(180deg, rgba(58, 34, 20, .98), rgba(26, 15, 10, .98));
	border: 1px solid rgba(255, 180, 92, .34);
}
.download-launcher span,
.download-main-link span{
    display: block;
    color: #fff;
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.download-launcher strong{ display: block; font-size: 1.05rem; }

.download-file{
    border-radius: 20px;
    overflow: hidden;
    background: radial-gradient(circle at top right, rgba(255, 180, 92, .22), transparent 42%), linear-gradient(180deg, rgba(58, 34, 20, .98), rgba(26, 15, 10, .98));
    border: 1px solid rgba(43,22,11,.13);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.download-file:hover{
    transform: translateY(-3px);
    box-shadow: 0 18px 35px rgba(43,22,11,.2);
    border-color: rgba(255,138,29,.45);
}

.download-main-link{
    display: block;
    min-height: 148px;
    padding: 1.15rem;
    color: #b77817;
    background-color: #d9d9d9;
}
.download-main-link:hover{ color: #b77817; }
.download-main-link strong{ display: block; margin: .5rem 0 .65rem; font-size: 1.3rem; line-height: 1.18; }
.download-main-link small{ display: block; color: #000; font-weight: 700; }

.download-file-primary .download-main-link{
    background:
        linear-gradient(135deg, rgba(255,138,29,.34), rgba(255,247,232,.7)),
        radial-gradient(circle at top right, rgba(255,180,92,.45), transparent 45%);
}
.download-file-secondary .download-main-link{
    background:
        linear-gradient(135deg, rgba(59,36,22,.16), rgba(255,247,232,.76)),
        radial-gradient(circle at top right, rgba(255,180,92,.28), transparent 45%);
}

.files-info{
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.15rem;
    border-radius: 22px;
    color: #b77817;
    background: linear-gradient(135deg, rgb(40 96 252 / 96%), #021732);
    border: 1px solid rgba(255,255,255,.22);
    box-shadow: 0 18px 35px rgba(0,0,0,.2);
}
.files-info-icon{
    width: 42px; height: 42px; min-width: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: #021732;
    color: #fff;
    font-weight: 900;
    font-size: 1.3rem;
}
.files-info a{ color: #061d45; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }

.files-changelog .section-title{ color: #b77817; }
.files-changelog-box{
	background: linear-gradient(90deg, #efefef, #eee);
    max-height: 420px;
    overflow-y: auto;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(255,180,92,.18);
    font-family: Consolas, Monaco, 'Courier New', monospace;
    font-size: .92rem;
    line-height: 1.65;
    white-space: normal;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) rgba(255,255,255,.13);
	color: #000 !important;
}
.files-changelog-box::-webkit-scrollbar{ width: 10px; }
.files-changelog-box::-webkit-scrollbar-track{ background: rgba(255,255,255,.13); border-radius: 999px; }
.files-changelog-box::-webkit-scrollbar-thumb{ background: linear-gradient(180deg, var(--accent-orange), var(--accent-light)); border-radius: 999px; }

/* Anchor targets */
.files-page #files-downloads,
.files-page #files-changelog{ scroll-margin-top: 100px; }
.files-page #files-downloads.is-anchor-target,
.files-page #files-changelog.is-anchor-target{

    border-radius: 24px;
}

/* Active nav state */
.rules-toc-link.active,
.files-quick-actions a.active{
    color: #fff4dc;
    border-color: rgba(255,178,87,.45);
    background: rgba(255,143,43,.18);
}


/* =============================================================
   Rules page
   ============================================================= */
.rules-page .rules-hero{ position: relative; overflow: hidden; border: 1px solid rgba(255,178,87,.22); }
.rules-page .rules-hero::after{
    content: "";
    position: absolute;
    inset: auto -8% -42% auto;
    width: 360px; height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0,138,29,.28), transparent 70%);
    pointer-events: none;
}
.rules-page .rules-hero > *{ position: relative; z-index: 1; }

.rules-warning-box{
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255,143,43,.12);
    border: 1px solid rgba(255,178,87,.28);
    color: #ffe4b8;
}
.rules-warning-icon{
    width: 42px; height: 42px; flex: 0 0 42px;
    border-radius: 50%;
    display: grid; place-items: center;
    font-size: 26px; font-weight: 900;
    color: #2b160c;
    background: linear-gradient(135deg, #ffb257, #ff7a1a);
    box-shadow: 0 10px 26px rgba(255,122,26,.28);
}
.rules-warning-box strong,
.rules-warning-box span{ display: block; }
.rules-warning-box span{ color: #efc98f; font-size: .95rem; }

.rules-page .rules-sidebar{
    align-self: flex-start;
}
.rules-page .rules-toc{
    position: sticky !important;
    top: 90px !important;
    z-index: 3;
    max-height: calc(100vh - 115px);
    overflow: auto;
}
.rules-toc-title{ color: #fff0d0; font-weight: 800; margin-bottom: 12px; letter-spacing: .02em; }
.rules-toc-nav{ display: grid; gap: 8px; }
.rules-toc-link{
    display: block;
    color: #efc98f;
    text-decoration: none;
    padding: 9px 11px;
    border-radius: 12px;
    font-size: .92rem;
    line-height: 1.25;
    transition: .18s ease;
}
.rules-toc-link:hover{ color: #fff4dc; transform: translateX(3px); }

.rules-document{ color: #f4d5a4; }
.rules-intro{ padding: 18px; border-radius: 16px; }
.rules-intro b,
.rules-content b{ color: #920804; }
.rules-content a,
.rules-intro a{ color: #70320b; font-weight: 800; text-decoration: none; border-bottom: 1px dashed rgba(112,50,11,.45); }
.rules-content a:hover,
.rules-intro a:hover{ color: #b04d0d; }

.rules-section-title{
    scroll-margin-top: 100px;
    color: #fff0d0;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    margin: 32px 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255,178,87,.18);
}
.rules-content .rules-section-title:first-child{ margin-top: 0; }

.rule-item{
    position: relative;
    margin: 8px 0;
    padding: 13px 15px;
    border-radius: 14px;
    line-height: 1.55;
    transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
	background: linear-gradient(90deg, #efefef, #eee);
	color: #000 !important;
}
.rule-item:hover{ transform: translateY(-1px); }
.rule-item:target,
.rules-section-title.is-rules-target,
.rule-item.is-rules-target,
.rules-section-title.is-anchor-target,
.rule-item.is-anchor-target{
    border-color: rgba(255,143,43,.65);
}


/* =============================================================
   Bonus page
   ============================================================= */
.bonus-page{ color: var(--cream); }

.bonus-hero{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: clamp(1.25rem, 3vw, 2.25rem);
    position: relative;
    overflow: hidden;
    border-radius: 24px;
}
.bonus-hero p{ max-width: 720px; margin-bottom: 0; font-size: 1.04rem; }

.bonus-kicker,
.files-kicker,
.rules-kicker,
.about-kicker{
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-bottom: .35rem;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.bonus-hero-badge{
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 118px; height: 118px;
    border-radius: 999px;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.42), 0 20px 38px rgba(255,138,29,.2);
}
.bonus-hero-badge span{ display: block; font-size: 2.1rem; line-height: 1; }

.bonus-card,
.bonus-vote-card,
.bonus-rewards-card{ padding: clamp(1rem, 2vw, 1.5rem); border-radius: 24px; position: relative; overflow: hidden; }

.bonus-card-icon{
    display: inline-grid;
    place-items: center;
    width: 54px; height: 54px;
    margin-bottom: .9rem;
    border-radius: 18px;
    background: rgba(255,180,92,.16);
    color: #ffd3a0;
    font-size: 1.5rem;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.bonus-list{
    display: grid;
    gap: .65rem;
    margin: 0;
    padding-left: 1.15rem;
}
.bonus-list{ color: var(--text-main) !important; }
.bonus-list li::marker{ color: #ffb45c; }
.bonus-list code{ padding: .1rem .35rem; border-radius: .45rem; background: rgba(0,0,0,.22); color: #ffe0a8; }

.bonus-vote-actions{ display: grid; gap: .75rem; }

.bonus-tabs{ gap: .55rem; }
.bonus-tabs .nav-link{
    border-radius: 999px;
    font-weight: 900;
}
.bonus-tabs .nav-link.active{
    background: linear-gradient(135deg, var(--gold), var(--gold-2)) !important;
    border-color: transparent;
    color: #b77817;
    box-shadow: 0 10px 22px rgba(255,138,29,.18);
}

.bonus-table-wrap{
    border-radius: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid rgba(255,180,92,.18);
    -webkit-overflow-scrolling: touch;
}
.bonus-table{ color: var(--text-main); min-width: 720px; }
.bonus-table td,
.bonus-table th{ padding: .8rem .85rem; vertical-align: middle; }

.bonus-item-icon-cell{ width: 52px; }
.bonus-item-icon{
    display: inline-grid;
    place-items: center;
    width: 38px; height: 38px;
    border-radius: 999px;
    background: radial-gradient(circle at top, rgba(255,255,255,.28), rgba(0,0,0,.18));
    border: 1px solid rgba(255,255,255,.14);
}
.bonus-item-icon img{ width: 28px; height: 28px; object-fit: contain; }
.bonus-item-name strong,
.bonus-item-name small{ display: block; }
.bonus-item-name strong{ color: #fff8ea; }

.bonus-chance{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: .22rem .55rem;
    border-radius: 999px;
}


/* =============================================================
   About page
   ============================================================= */
.about-page .fw-black{ font-weight: 900; }
.about-hero{ position: relative; overflow: hidden; }
.about-hero::after{
    content: "";
    position: absolute;
    inset: auto -8% -42% auto;
    width: 360px; height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0,138,29,.28), transparent 70%);
    pointer-events: none;
}
.about-years-card{
    position: relative; z-index: 1;
    border-radius: 24px; padding: 1.5rem;
    background: linear-gradient(135deg, #007502, #3fff00);
    border: 1px solid rgba(43,22,11,.16);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.about-years-number{ font-size: clamp(3rem, 8vw, 5rem); line-height: .95; font-weight: 900; color: #fff; }
.about-years-label{ margin-top: .45rem; color: #fff; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; }
.about-content-card,
.about-info-card{ font-size: 1.02rem; line-height: 1.65; }

.about-benefits{ display: grid; gap: .72rem; padding-left: 0; list-style: none; border: 0 !important; }
.about-benefits li{
    position: relative;
    padding: .8rem 1rem .8rem 2.7rem;
    border-radius: 16px;
    background: linear-gradient(135deg, rgb(255 138 0 / 96%), #000000);
}
.about-benefits li::before{
    content: "";
    position: absolute;
    left: 1rem; top: 1.08rem;
    width: .72rem; height: .72rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold), var(--gold-2));
    box-shadow: 0 0 0 5px rgba(255,138,29,.12);
}
.about-mini-stat{
    display: flex; justify-content: space-between; gap: 1rem; align-items: center;
    padding: .9rem 0;
    border-bottom: 1px solid rgba(43,22,11,.15);
}
.about-mini-stat:last-child{ border-bottom: 0; }
.about-mini-stat span{ color: #6f3f1c; font-weight: 700; }
.about-mini-stat b{ text-align: right; color: var(--accent-light) !important; }


/* =============================================================
   Register page
   ============================================================= */
.register-page .row{ align-items: stretch; }
.register-start-card{ position: relative; overflow: hidden; }
.register-start-card::before{
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 15% 10%, rgba(255,209,102,.20), transparent 32%),
        radial-gradient(circle at 100% 0%, rgba(255,138,0,.14), transparent 36%);
    pointer-events: none;
}
.register-start-card > *{ position: relative; z-index: 1; }
.register-start-kicker{
    display: inline-flex; align-items: center; gap: .4rem;
    margin-bottom: .55rem;
    color: var(--gold-2);
    font-size: .78rem; font-weight: 900;
    letter-spacing: .08em; text-transform: uppercase;
}
.register-start-card h2{ margin-bottom: .35rem; font-weight: 900; }
.register-steps{
    display: grid; gap: .85rem;
    margin: 0; padding: 0; list-style: none;
}
.register-steps li{
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .8rem; align-items: start;
    padding: .85rem; border-radius: 18px;
    background: rgba(20,24,36,.56);
    border: 1px solid rgba(255,209,102,.18);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.register-step-num{
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 50%;
    background: linear-gradient(135deg, var(--gold), var(--gold-2));
    color: #1a1000; font-weight: 950;
    box-shadow: 0 8px 20px rgba(255,138,0,.25);
}
.register-steps strong{ display: block; margin-bottom: .18rem; color: #fff4dd; font-weight: 900; }
.register-steps p{ margin: 0; color: var(--muted-brown); font-size: .93rem; line-height: 1.45; }

/* =============================================================
   Top-5 title gradient
   ============================================================= */
.top5-title{
    display: inline-block;
    background: linear-gradient(110deg, #ffe08a 0%, #ffb12b 28%, #ff7a18 54%, #ffd36a 78%, #a95808 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #ffb12b;
    font-weight: 900;
    letter-spacing: .055em;
    text-transform: uppercase;
    text-shadow: 0 2px 14px rgba(255,122,24,.22);
}


/* =============================================================
   Support widget (fixed bottom-right)
   ============================================================= */
.support_widget{
    position: fixed !important;
    right: 22px !important;
    bottom: 22px !important;
    z-index: 1080 !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    pointer-events: none !important;
}

.support_button{
    position: relative !important;
    z-index: 2 !important;
    pointer-events: auto !important;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 10px 18px 10px 12px;
    border: 1px solid rgba(255,180,92,.55);
    border-radius: 999px;
    background: linear-gradient(135deg, #ff8a1d, #ffbd67);
    color: #241104;
    font-weight: 900;
    letter-spacing: .2px;
    box-shadow: 0 18px 36px rgba(0,0,0,.32), 0 0 0 7px rgba(255,138,29,.12);
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(0) scale(1) !important;
}
.support_widget.is-open .support_button{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(140%) scale(.85) !important;
}

.support_button:hover{
    transform: translateY(-2px);
    filter: brightness(1.03);
    box-shadow: 0 22px 44px rgba(0,0,0,.38), 0 0 0 9px rgba(255,138,29,.15);
}

.support_button_icon{
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: rgba(43,22,11,.92);
    color: #fff2da;
    font-size: 20px; line-height: 1;
}

.support_panel{
    position: fixed !important;
    right: 22px !important;
    bottom: 22px !important;
    width: min(360px, calc(100vw - 44px)) !important;
    max-height: calc(100vh - 44px) !important;
    overflow-y: auto !important;
    padding: 16px;
    border-radius: 22px;
    border: 1px solid rgba(255,180,92,.34);
    background:
        radial-gradient(circle at top right, rgba(255,180,92,.22), transparent 42%),
        linear-gradient(180deg, rgba(58,34,20,.98), rgba(26,15,10,.98));
    color: #fff2da;
    box-shadow: 0 26px 70px rgba(0,0,0,.44);
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(calc(100% + 44px)) !important;
    transition: opacity .22s ease, visibility .22s ease, transform .28s ease !important;
}
.support_widget.is-open .support_panel{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}
.support_panel a,
.support_panel button{ pointer-events: auto !important; }

.support_panel_head{
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 14px; margin-bottom: 14px;
}
.support_panel_title{ font-size: 1.05rem; font-weight: 900; color: #fff6e8; }
.support_panel_subtitle{ margin-top: 4px; color: #efc98f; font-size: .92rem; line-height: 1.35; }
.support_panel_close{
    width: 34px; height: 34px;
    border: 0; border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: #fff2da;
    font-size: 22px; line-height: 1;
}
.support_panel_close:hover{ background: rgba(255,138,29,.22); }
.support_panel_links{ display: grid; gap: 9px; }
.support_link{
    display: flex; align-items: center; gap: 10px;
    padding: 11px 12px; border-radius: 14px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.07);
    color: #fff2da; font-weight: 800; text-decoration: none;
    transition: transform .18s ease, background-color .18s ease, border-color .18s ease;
}
.support_link span{
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 28px; width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(255,138,29,.18);
    color: #ffbd67;
}
.support_link:hover{ color: #fff; transform: translateX(-2px); background: rgba(255,138,29,.14); border-color: rgba(255,180,92,.34); }


/* =============================================================
   Footer
   ============================================================= */
.site-footer{
    background-color: var(--bg-deep);
    border-top: 1px solid rgba(245,166,35,.14);
}


/* =============================================================
   Varia
   ============================================================= */
.page-section h1,
.auth-section h1{ margin-bottom: 1.5rem; font-weight: 800; }


/* =============================================================
   Responsive
   ============================================================= */
@media (max-width: 991.98px){


    .container, .container-md, .container-sm {
        max-width: 990px;
    }
    .sticky-side      { position: static; }
    .hero-section     { text-align: center; }
    .rules-page .rules-toc { position: static !important; top: auto !important; max-height: none; }
    .rules-toc-nav    { grid-template-columns: 1fr 1fr; }
    .register-start-card { margin-bottom: .5rem; }
}





@media (max-width: 870.98px) {
    /* Servers: horizontal scroll on mobile */
    .home-servers-card{ overflow: visible !important; }
    .home-servers-card .servers{
        display: flex !important;
        grid-template-columns: none !important;
        gap: .75rem !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: .15rem .2rem 1rem !important;
        margin-left: -.2rem !important;
        margin-right: -.2rem !important;
        scroll-snap-type: none;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: var(--gold) rgba(255,255,255,.14);
    }
    .home-servers-card .servers::-webkit-scrollbar{ height: 8px; }
    .home-servers-card .servers::-webkit-scrollbar-track{ background: rgba(255,255,255,.12); border-radius: 999px; }
    .home-servers-card .servers::-webkit-scrollbar-thumb{ background: linear-gradient(135deg, var(--gold), var(--gold-2)); border-radius: 999px; }
    .home-servers-card .server-tile{
        flex: 0 0 min(41vw, 146px) !important;
        width: min(41vw, 146px) !important;
        min-width: min(41vw, 146px) !important;
        scroll-snap-align: none;
    }
    .home-servers-card .server-id{ width: 100% !important; min-height: 104px !important; }
    .home-servers-card .server-body{ min-height: 104px !important; }
}

@media (max-width: 767.98px) {
    .download-chronicle{ padding: 1rem; }
    .download-chronicle-head{ align-items: flex-start; }
    .download-chronicle-img-wrap{ width: 110px; min-width: 110px; min-height: 74px; }
    .download-launcher{ align-items: stretch; flex-direction: column; }
    .download-launcher .btn{ width: 100%; }
    .files-info{ flex-direction: column; }
    .files-changelog-box{ max-height: 360px; font-size: .86rem; }
    .bonus-hero{ align-items: flex-start; flex-direction: column; }
    .bonus-hero-badge{ width: 92px; height: 92px; }
    .bonus-table{ min-width: 660px; }

    .support_widget{ right: 14px !important; bottom: 14px !important; }
    .support_button_text{ display: none; }
    .support_button{ width: 54px; height: 54px; padding: 10px; justify-content: center; }
    .support_panel{
        right: 14px !important;
        bottom: 14px !important;
        width: calc(100vw - 28px) !important;
        max-height: calc(100vh - 28px) !important;
        transform: translateX(calc(100% + 28px)) !important;
    }
    .support_widget.is-open .support_panel{ transform: translateX(0) !important; }
}

@media (max-width: 575.98px) {
    .rules-toc-nav{ grid-template-columns: 1fr; }
    .rule-item{ padding: 12px; }
    .forum-last-grid{ grid-template-columns: 1fr; }
    .home-servers-card .servers{ grid-template-columns: none !important; }
    .home-servers-card .server-tile{
        flex: 0 0 min(39vw, 130px) !important;
        width: min(39vw, 130px) !important;
        min-width: min(39vw, 130px) !important;
    }
    .server-id,
    .server-body{ min-height: 104px !important; }
    .page-popup .modal-dialog{ margin: .5rem; }
    .page-popup .modal-content{ border-radius: 18px; }
}
/* =============================================================
   Cabinet server switcher / characters
   ============================================================= */
.cabinet-page [data-cabinet-characters]{
    position: relative;
    min-height: 82px;
}
.cabinet-page [data-cabinet-characters].is-loading{
    opacity: .58;
    pointer-events: none;
}
.cabinet-page [data-cabinet-characters].is-loading::after{
    content: "Загрузка персонажей...";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--accent-light);
    font-weight: 900;
    background: rgba(7, 9, 16, .62);
    border-radius: 16px;
}
.cabinet-characters-table td,
.cabinet-characters-table th{
    white-space: nowrap;
}

/* =============================================================
   Ratings page
   ============================================================= */
.ratings-page .ratings-hero,
.ratings-page .ratings-nav,
.ratings-page .ratings-table-card{
    position: relative;
}

.ratings-kicker,
.ratings-nav-label{
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-bottom: .55rem;
    color: var(--accent-light) !important;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ratings-nav-label{
    display: block;
    margin: .15rem 0 .55rem;
    color: var(--text-muted) !important;
}

.ratings-table th,
.ratings-table td{
    white-space: nowrap;
}

.ratings-table td:nth-child(2){
    color: #fff7e8;
}

.ratings-updated{
    font-size: .88rem;
}

@media (max-width: 767.98px) {
    .ratings-page .ratings-hero,
	.ratings-page .ratings-nav{
			padding: 1rem !important;
		}

    .ratings-table th,
	.ratings-table td{
			font-size: .88rem;
		}
}

.rating-sex{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.1em;
    margin-left: .25rem;
    font-weight: 900;
    line-height: 1;
}
.rating-sex-0{ color: #18c0de; }
.rating-sex-1{ color: #cb18d6; }

.rating-clan-link{
    color: var(--accent-light) !important;
    font-weight: 900;
    border-bottom: 1px dashed rgba(255, 209, 102, .55);
}
.rating-clan-link:hover,
.rating-clan-link:focus{
    color: #fff1bd !important;
    border-bottom-color: rgba(255, 241, 189, .9);
}

.clan-summary-card span{
    display: block;
    margin-bottom: .35rem;
    color: var(--text-muted) !important;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.clan-summary-card strong{
    display: block;
    color: var(--text-main) !important;
    font-size: 1.05rem;
    line-height: 1.25;
}
.clan-summary-card small{
    display: block;
    margin-top: .35rem;
    color: var(--text-muted) !important;
}
.clan-leader-mark{
    display: inline-flex;
    margin-right: .35rem;
    color: var(--accent-light);
    text-shadow: 0 0 12px rgba(255, 209, 102, .35);
}


/* =============================================================
   Server info legacy pages
   ============================================================= */
.server-info-page .server-info-hero,
.server-info-page .server-info-content{
    overflow: hidden;
}
.server-info-tabs{
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}
.server-info-tabs a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .48rem .8rem;
    border: 1px solid rgba(255,209,102,.26);
    border-radius: 999px;
    background: rgba(28,34,51,.82);
    color: var(--accent-light);
    font-weight: 800;
    text-decoration: none;
}
.server-info-tabs a:hover{
    color: #fff;
    border-color: rgba(255,209,102,.55);
}
.server-info-content .name_p,
.server-info-content .name_cat,
.server-info-content h2.name_p,
.server-info-content h2.name_cat{
    margin: 1rem 0 .8rem;
    color: var(--gold-2);
    font-weight: 900;
    letter-spacing: .01em;
}
.server-info-content .name_p{ font-size: 1.55rem; }
.server-info-content .name_cat{ font-size: 1.28rem; }
.server-info-content ul{
    padding-left: 1.25rem;
    margin-bottom: .9rem;
}
.server-info-content li{ margin: .25rem 0; }
.server-info-content .ul_div{
    padding: 1rem 1.25rem;
    border: 1px solid rgba(255,209,102,.18);
    border-radius: 14px;
    background: rgba(30,38,55,.62);
}
.server-info-content .pro-spoiler{
    padding: 1rem;
    overflow: visible;
}
.server-info-content .pro-spoiler > div{
    margin-top: .65rem;
}
.server-info-content img{
    max-width: 100%;
    height: auto;
}
.server-info-content .circle32{
    width: 32px;
    height: 32px;
    object-fit: cover;
    border-radius: 50%;
    margin: 0 10px 0 -30px;
    vertical-align: middle;
}
.server-info-content .stabs2{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));
    gap: .65rem;
    margin: 1rem 0;
}
.server-info-content .stabs2 > input[type="radio"]{
    display: none;
}
.server-info-content .stabs2 > label{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 88px;
    padding: .55rem;
    border: 1px solid rgba(255,209,102,.20);
    border-radius: 14px;
    background: rgba(28,34,51,.78);
    cursor: pointer;
}
.server-info-content .stabs2 > label img{
    max-width: 74px;
    max-height: 74px;
}
.server-info-content .stabs2 > .stab2{
    grid-column: 1 / -1;
    display: none;
    padding: 1rem;
    border: 1px solid rgba(255,209,102,.18);
    border-radius: 14px;
    background: rgba(30,38,55,.62);
}
.server-info-content .stabs2 > input[type="radio"]:checked + label + .stab2{
    display: block;
}
.server-info-content [data-legacy-toggle] a,
.server-info-content [data-legacy-toggle]{
    color: var(--accent-light);
    font-weight: 800;
}
@media (max-width: 575.98px) {
    .server-info-content .stabs2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .server-info-content .name_p{ font-size: 1.32rem; }
    .server-info-content .name_cat{ font-size: 1.12rem; }
}




/* =============================================================
   Graphic captcha
   ============================================================= */
.captcha-field .captcha-image-row{
    display: flex;
    align-items: center;
    gap: .65rem;
}
.captcha-field .captcha-input{
    flex: 1 1 180px;
    min-width: 160px;
    height: 44px;
}
.captcha-field .captcha-image{
    flex: 0 0 auto;
    width: 132px;
    height: 44px;
    border-radius: 10px;
    border: 1px solid rgba(255, 209, 102, .34);
    background: #f8f8f8;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 18px rgba(0,0,0,.18);
    cursor: pointer;
    object-fit: cover;
}
.captcha-refresh-btn{
    flex: 0 0 auto;
    min-width: 44px;
    height: 44px;
    padding: 0 .75rem;
    font-size: 1.15rem;
    line-height: 1;
}
@media (max-width: 575.98px) {
    .captcha-field .captcha-image-row{
        flex-wrap: wrap;
    }
    .captcha-field .captcha-input{
        flex-basis: 100%;
        width: 100%;
    }
}

/* =============================================================
   Clan / alliance crest icons in ratings
   ============================================================= */
.rating-crest-icon{
    display: inline-block;
    width: auto;
    height: 12px;
    margin-right: 3px;
    vertical-align: -1px;
    image-rendering: pixelated;
}
.rating-crest-icon-clan{
    margin-right: 5px;
}
.mini-rating-clan .rating-crest-icon,
.mini-rating-name .rating-crest-icon{
    flex: 0 0 auto;
}

/* Cabinet character actions */
.cabinet-character-select-col{
    width: 22px;
    text-align: center;
}
.cabinet-character-check{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0;
    cursor: pointer;
}
.cabinet-character-check input{
    width: 18px;
    height: 18px;
    accent-color: var(--accent);
    cursor: pointer;
}
.cabinet-character-actions{
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, .08);
}
.cabinet-selected-character{
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem .8rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    background: rgba(255, 255, 255, .04);
}
.cabinet-character-action-form .form-error{
    min-height: 0;
}



/* =============================================================
   Donate page
   ============================================================= */

.donate-panel,
.donate-bonus-panel,
.donate-crypto-card { position: relative; overflow: hidden; }
.donate-panel::after,
.donate-bonus-panel::after,
.donate-crypto-card::after {
    content: "";
    position: absolute;
    inset: auto -15% -45% auto;
    width: 260px; height: 260px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,138,29,.18), transparent 66%);
    pointer-events: none;
}

.donate-input { min-height: 48px; border-radius: 14px; }


.donate-range { accent-color: var(--bs-red); }
.donate-range::-webkit-slider-runnable-track { background: linear-gradient(90deg, var(--accent-light), var(--bs-red)); }
.donate-range::-moz-range-track,
.donate-range::-moz-range-progress { background: linear-gradient(90deg, var(--accent-light), var(--bs-red)); }
.donate-range-wrap { border-radius: 18px; padding: 1rem; }

.donate-range-ruler {
	transform: scaleY(-1);
    position: relative;
    width: 100%;
    height: 10px;
    margin: .35rem 0 .55rem;
    border: 1px solid rgba(226, 232, 240, .35);
    border-bottom: 0;
    background:
        linear-gradient(180deg, rgba(255,255,255,.0), rgba(226,232,240,.0));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.55),
        0 8px 18px rgba(0,0,0,.10);
    overflow: hidden;
	margin-top:-10px;
}
.donate-range-ruler::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 10px;
    background: repeating-linear-gradient(
        to right,
        transparent 0,
        transparent 9px,
        rgba(171,41,55,.92) 9px,
        rgba(171,41,55,.92) 10px
    );
}

.donate-range-scale {
    display: flex;
    justify-content: space-between;
    gap: .35rem;
    margin-top: .45rem;
}
.donate-range-scale button {
    border-radius: 999px;
    padding: .32rem .54rem;
	background: rgba(28, 34, 51, .86);
    border: 1px solid rgba(245, 166, 35, .22);
    color: #fff2da;
    font-size: .82rem;
    font-weight: 900;
    line-height: 1;
    transition: transform .18s ease, background-color .18s ease, color .18s ease;
}
.donate-range-scale button:hover,
.donate-range-scale button.is-active {
    transform: translateY(-1px);
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
	color: #fff;
}

.donate-pay-list { display: grid; gap: .75rem; }
.donate-pay-method {
    width: 100%;
    display: flex;
    align-items: center;
    gap: .9rem;
    border-radius: 18px;
    padding: .85rem 1rem;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(42,18,5,.12);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
	background: linear-gradient(90deg, #efefef, #eee) !important;
    border: 0;
    font-family: inherit;
    color: inherit;
    appearance: none;
    -webkit-appearance: none;
}
button.donate-pay-method {
    border: 0;
}
.donate-pay-method:hover {
    transform: translateY(-2px);
	background: linear-gradient(90deg, #e59000, #ffc54c) !important;
    box-shadow: 0 16px 30px rgba(42,18,5,.18);
}
.donate-pay-method img {
    flex: 0 0 42px; width: 42px; height: 42px;
    object-fit: contain; border-radius: 50%;
    background: #fff;
    border: 3px solid rgba(255,255,255,.85);
    box-shadow: 0 8px 18px rgba(42,18,5,.2);
}
.donate-pay-method span    { display: block; min-width: 0; }
.donate-pay-method strong,
.donate-pay-method small   { display: block; }
.donate-pay-method strong  { color: rgba(0,19,67,.95); font-size: .98rem; font-weight: 900; }
.donate-pay-method strong i {
    float: right;
    margin-left: .45rem;
    color: #c04d00;
    font-style: normal;
}
.donate-pay-method small   { color: #6f3f1c; font-weight: 700; }
.donate-pay-method:hover small { color: #fff !important; }

.donate-tier,
.donate-tier-empty {
    border-radius: 18px;
    padding: 1rem;
    margin-bottom: .8rem;
    transition: opacity .18s ease, transform .18s ease, border-color .18s ease;
}
.donate-tier,
.donate-tier-empty { border: 1px solid rgba(245,166,35,.14) !important; }
.donate-tier { display: none; }
.donate-tier.is-current,
.donate-tier.is-next { display: block; }
.donate-tier.is-current { opacity: 1; background: radial-gradient(circle at 15% 0%, rgba(255, 209, 102, .12), transparent 36%), linear-gradient(180deg, #1b2132 0%, #111622 100%) !important; }
.donate-tier.is-next {
    opacity: .45;
    filter: saturate(.82);
}
.donate-tier h3,
.donate-tier-empty h3 { margin: 0 0 .8rem; font-size: 1.15rem; font-weight: 900; }
.donate-tier ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.donate-tier li {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-height: 42px;
    padding: .58rem .7rem;
    border-radius: 14px;
    background: linear-gradient(135deg, #007502, #3fff00);
    color: #fff;
    font-weight: 800;
}
.donate-tier li img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; box-shadow: 0 8px 14px rgba(42,18,5,.18); }
.donate-tier li b  { margin-left: auto; color: #1f6e09; font-weight: 900; }
.donate-crypto-card { scroll-margin-top: 95px; }

.donate-wallet-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.donate-wallet {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
    border-radius: 18px;
    padding: .85rem;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}
.donate-wallet:hover,
.donate-wallet.is-copied {
    transform: translateY(-2px);
    background: rgba(245,166,35,.13) !important;
    border-color: rgba(255,209,102,.32) !important;
}
.donate-wallet img    { width: 38px; height: 38px; object-fit: contain; border-radius: 50%; }
.donate-wallet span,
.donate-wallet strong,
.donate-wallet small  { display: block; min-width: 0; }
.donate-wallet strong { font-weight: 900; }
.donate-wallet small  { max-width: 100%; overflow: hidden; text-overflow: ellipsis; color: #6f3f1c; font-weight: 700; }

.donate-note a { font-weight: 900; }





/* =============================================================
   Donate payment selectors / pure CSS crypto block
   ============================================================= */
.donate-pay-row {
    display: flex;
    align-items: stretch;
    gap: .65rem;
}
.donate-pay-row .donate-pay-method {
    flex: 1 1 auto;
    min-width: 0;
}
.donate-pay-currency {
    flex: 0 0 25px;
    border-radius: 18px;
    padding: 0;
    background: linear-gradient(90deg, #efefef, #eee);
    color: rgba(0, 19, 67, .95);
    border: 1px solid rgba(226,232,240,.36);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
    font-weight: 800;
	width:80px;
	text-align:center;
}
.donate-pay-currency option,
.donate-pay-currency optgroup {
    color: #000;
}
.donate-pay-currency:hover {
    transform: translateY(-2px);
	background: linear-gradient(90deg, #e59000, #ffc54c) !important;
    box-shadow: 0 16px 30px rgba(42,18,5,.18);
}


.donate-crypto-toggle:not(:checked) ~ .donate-crypto-card {
    display: none;
}
.donate-crypto-toggle:checked ~ .row .donate-pay-method[for="donate-crypto-toggle"] {
    border-color: rgba(255,209,102,.55) !important;
    box-shadow: 0 0 24px rgba(255,168,40,.35) !important;
}
@media (max-width: 767.98px) {
    .donate-pay-row {
        flex-direction: column;
    }
    .cursel,
    .donate-pay-currency {
        flex-basis: auto;
        width: 100%;
        min-height: 48px;
    }
}
.donate-pay-method.is-loading {
    opacity: .58;
    pointer-events: none;
}
.cabinet-donate-page .donate-pay-method[for="donate-crypto-toggle"] {
    user-select: none;
}
.donate-bonus-line {
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    border: 1px solid rgba(226,232,240,.38) !important;
    color: #fff3c4 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 20px rgba(0,0,0,.22) !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    border-radius: 18px;
    font-size: 1.05rem;
    font-weight: 900;
}
.donate-range-wrap {
    background: linear-gradient(90deg, #efefef, #eee);
}


.donate-summary-card {
	transform: translateY(-1px);
	background: linear-gradient(135deg, #007502, #3fff00) !important;
	color: #fff;
    border: 1px solid rgba(226,232,240,.36);
    min-height: 48px;
    border-radius: 14px;
	padding: 10px;
}

.donate-summary-card span,
.donate-summary-card small { color: #fff !important; }
.donate-summary-card strong {
    display: block;
    margin: .25rem 0;
    color: #fff;
    font-size: clamp(1.15rem, 4vw, 1.15rem);
    line-height: 1;
}

/* News popup top meta and navigation buttons */
.news-popup-topline{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.news-popup-meta,
.news-popup-actions{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem .75rem;
}
.news-popup-meta{
    min-width: 0;
}
.news-popup-actions{
    justify-content: flex-end;
    margin-left: auto;
}
.news-popup-actions .btn{
    white-space: nowrap;
}
@media (max-width: 767.98px) {
    .news-popup-topline{
        align-items: stretch;
        flex-direction: column;
    }
    .news-popup-meta,
	.news-popup-actions{
        justify-content: flex-start;
    }
    .news-popup-actions{
        margin-left: 0;
    }
    .news-popup-actions .btn{
        flex: 1 1 auto;
    }
}
@media (max-width: 575.98px) {
    .news-popup-actions .btn{
        width: 100%;
    }
}

/* Cabinet characters table fixes */
.cabinet-characters-table-wrap{
    border-radius: 18px;
    overflow: auto;
    border: 1px solid rgba(226, 232, 240, .28);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 26px rgba(0,0,0,.18);
}
.cabinet-characters-table{
    border-radius: 18px;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0;
}
.cabinet-characters-table thead th:first-child{ border-top-left-radius: 18px; }
.cabinet-characters-table thead th:last-child{ border-top-right-radius: 18px; }
.cabinet-characters-table tbody tr:last-child td:first-child{ border-bottom-left-radius: 18px; }
.cabinet-characters-table tbody tr:last-child td:last-child{ border-bottom-right-radius: 18px; }
.cabinet-clan-link{
    display: inline-flex;
    align-items: center;
    gap: .12rem;
    white-space: nowrap;
}
.cabinet-clan-link .rating-crest-icon{
    flex: 0 0 auto;
}
.cabinet-character-actions-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.cabinet-character-buttons{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}
.cabinet-character-actions .cabinet-selected-character{
    margin: 0;
}
@media (max-width: 767.98px) {
    .cabinet-character-actions-row,
    .cabinet-character-buttons{
        align-items: stretch;
        justify-content: flex-start;
        width: 100%;
    }
    .cabinet-character-action-form,
    .cabinet-character-action-form .btn{
        width: 100%;
    }
}
.cursel{
    flex: 0 0 185px;
    min-height: 100%;
    border-radius: 18px;
    padding: .55rem .8rem;
    background: linear-gradient(180deg, #40495d 0%, #273044 100%);
    color: var(--text-main);
    border: 1px solid rgba(226,232,240,.36);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
    font-weight: 800;
}
.cursel option,
.cursel optgroup{
    color: #000;
}
@media (max-width: 767.98px) {
    .cursel{
        flex-basis: auto;
        width: 100%;
        min-height: 48px;
    }
}



/* =============================================================
   Accessibility
   ============================================================= */
@media (prefers-reduced-motion: reduce){
    *,
    *::before,
    *::after{
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* =============================================================
   Cabinet donate crypto overlay fixes (v1.0.75)
   ============================================================= */
.cabinet-donate-page {
    position: relative;
}
.cabinet-donate-page .donate-pay-method:hover,
.cabinet-donate-page .donate-pay-method:focus {
    background: linear-gradient(90deg, #e59000, #ffc54c) !important;
}
.cabinet-donate-page .donate-crypto-toggle:not(:checked) ~ .donate-crypto-card {
    display: none !important;
}
.cabinet-donate-page .donate-crypto-toggle:checked ~ .donate-crypto-card {
    display: block !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: min(760px, calc(100vw - 2rem)) !important;
    max-height: calc(100vh - 2rem) !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
    z-index: 1095 !important;
}
.cabinet-donate-page:has(.donate-crypto-toggle:checked)::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 1090;
    background: rgba(0, 0, 0, .58);
    backdrop-filter: blur(3px);
}
@media (max-width: 767.98px) {
    .cabinet-donate-page .donate-crypto-toggle:checked ~ .donate-crypto-card {
        width: calc(100vw - 1rem) !important;
        max-height: calc(100vh - 1rem) !important;
    }
}

/* =============================================================
   Donate tier next click helper (v1.0.79)
   ============================================================= */
.donate-tier.is-next {
    cursor: pointer;
    border-color: rgba(255, 209, 102, .38) !important;
}
.donate-tier.is-next:hover,
.donate-tier.is-next:focus-visible {
    opacity: .72;
    filter: saturate(1);
    transform: translateY(-2px);
    border-color: rgba(255, 209, 102, .72) !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.28), 0 0 22px rgba(255,168,40,.16) !important;
    outline: none;
}

/* Button icons */
.btn .btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15em;
    margin-right: .42rem;
    line-height: 1;
    font-size: 1.05em;
    transform: translateY(-.02em);
}
.btn-lg .btn-icon {
    margin-right: .52rem;
    font-size: 1.1em;
}

/* Header icons */
.topbar .nav-link,
.topbar .btn {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}
.topbar .nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15em;
    line-height: 1;
    font-size: 1.02em;
    transform: translateY(-.02em);
}
.topbar .btn .btn-icon {
    margin-right: .08rem;
}

/* =============================================================
   Cabinet account balance / ban status (v1.0.87)
   ============================================================= */
.cabinet-account-line,
.cabinet-account-balance,
.cabinet-account-status {
    margin: .55rem 0;
    padding: .65rem .8rem;
    border-radius: 14px;
    border: 1px solid rgba(226, 232, 240, .22);
    background: rgba(255, 255, 255, .05);
    color: var(--text-main);
}
.cabinet-account-line,
.cabinet-account-balance {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}
.cabinet-account-line strong,
.cabinet-account-balance strong {
    flex: 0 0 auto;
}
.cabinet-account-value {
    margin-left: auto;
    text-align: right;
    overflow-wrap: anywhere;
    position: relative;
    overflow: visible;
}
.cabinet-page .game-card,
.cabinet-account-line,
.cabinet-account-balance,
.cabinet-account-status{
    overflow: visible;
}
.cabinet-account-line,
.cabinet-account-balance{
    position: relative;
    z-index: 1;
}
.cabinet-account-line:hover,
.cabinet-account-line:focus-within,
.cabinet-account-balance:hover,
.cabinet-account-balance:focus-within{
    z-index: 3501;
}
.cabinet-account-value .has-tooltip{
    position: relative;
    z-index: 2;
}
.cabinet-account-value .has-tooltip::before,
.cabinet-account-value .has-tooltip::after{
    z-index: 5000;
}
.cabinet-account-balance b,
.cabinet-account-balance a {
    color: var(--accent-light) !important;
}
.cabinet-account-status {
    display: grid;
    gap: .35rem;
    line-height: 1.35;
}
.cabinet-account-status.is-active {
    border-color: rgba(34, 197, 94, .34);
    background: rgba(34, 197, 94, .10);
}
.cabinet-account-status.is-banned {
    border-color: rgba(220, 38, 38, .42);
    background: rgba(220, 38, 38, .13);
    color: #ffd7d7;
}
.cabinet-account-status.is-banned a {
    color: #ffd166 !important;
    font-weight: 900;
}


/* =============================================================
   Cabinet public guide pages (v1.0.90)
   ============================================================= */
.cabinet-guide-page .server-info-tabs a.active {
    background: linear-gradient(135deg, #ff8a00, #ffd166) !important;
    color: #1a1000 !important;
    border-color: #ffcc66 !important;
    box-shadow: 0 0 18px rgba(255,138,0,.28);
}
.guide-steps {
    display: grid;
    gap: 1rem;
}
.guide-step {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 1rem;
    align-items: flex-start;
}
.guide-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--accent-orange), var(--accent-light));
    color: #1a1000;
    font-weight: 950;
    box-shadow: 0 10px 24px rgba(255,138,0,.24);
}
.guide-step-body h2 {
    margin-bottom: .45rem;
}
.guide-step-image,
.guide-inline-preview {
    display: inline-flex;
    max-width: 100%;
    margin-top: .65rem;
    border-radius: 14px;
    border: 1px solid rgba(255, 209, 102, .24);
    box-shadow: 0 14px 28px rgba(0,0,0,.28);
}
.guide-step-image {
    height: auto;
    background: rgba(0,0,0,.24);
}
.guide-step-image-wide {
    width: min(100%, 519px);
}
.guide-inline-preview {
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    background: linear-gradient(180deg, #1c1710, #0f0d0a);
    color: #fff7e8;
    font-weight: 900;
}
.guide-inline-preview-wide {
    flex-wrap: wrap;
}
.guide-ui-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(255,209,102,.12);
    border: 1px solid rgba(255,209,102,.26);
    color: var(--accent-light);
}
.guide-coin {
    font-size: 1.6rem;
    line-height: 1;
}
.guide-input-box {
    width: 44px;
    height: 30px;
    border: 1px solid rgba(255,255,255,.52);
    background: rgba(255,255,255,.05);
}
.guide-button-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: .35rem .8rem;
    border-radius: 8px;
    background: linear-gradient(135deg, #3a3427, #74664b);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff0d0;
}
.guide-premium-info {
    padding: .9rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(255,209,102,.22);
    background: rgba(255,255,255,.06);
    color: var(--text-main);
    line-height: 1.55;
}
@media (max-width: 575.98px) {
    .guide-step {
        grid-template-columns: 1fr;
    }
}

/* =============================================================
   Cabinet selected-server premium status (v1.0.92)
   ============================================================= */
.cabinet-account-premium b {
    color: var(--accent-light) !important;
}
.cabinet-account-premium span {
    color: var(--text-muted) !important;
    font-weight: 800;
}


/* =============================================================
   Cabinet guide back link (v1.0.98)
   ============================================================= */
.guide-back-row{
    display: flex;
    justify-content: flex-start;
}

/* Header menu wraps into two rows on medium desktop widths (v1.0.103) */
@media (min-width: 992px) and (max-width: 1399.98px) {
    .topbar .navbar-collapse {
        align-items: center;
        gap: .75rem;
    }

    .topbar .navbar-nav {
        display: grid;
        grid-template-columns: repeat(3, max-content);
        grid-auto-rows: auto;
        align-items: center;
        row-gap: .15rem;
        column-gap: .35rem;
        margin-bottom: 0 !important;
        max-width: 560px;
    }

    .topbar .navbar-nav .nav-link {
        padding-top: .22rem;
        padding-bottom: .22rem;
        line-height: 1.2;
        white-space: nowrap;
    }
}


/* =============================================================
   Cookie notice (v1.0.128)
   ============================================================= */
.cookie-notice{
    position: fixed;
    left: clamp(12px, 2vw, 24px);
    right: clamp(12px, 2vw, 24px);
    bottom: clamp(12px, 2vw, 24px);
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .9rem;
    max-width: 560px;
    margin: 0 auto;
    padding: .9rem 1rem;
    border-radius: 18px;
    color: #fff6df;
    background:
        radial-gradient(circle at 0% 0%, rgba(255,209,102,.22), transparent 34%),
        linear-gradient(135deg, rgba(85,12,12,.96), rgba(22,8,8,.97) 54%, rgba(10,12,18,.96));
    border: 1px solid rgba(255,209,102,.48);
    box-shadow:
        0 20px 48px rgba(0,0,0,.50),
        0 0 26px rgba(245,166,35,.18),
        inset 0 1px 0 rgba(255,255,255,.14);
    animation: cookieNoticeIn .32s ease-out both;
}
.cookie-notice[hidden]{
    display: none !important;
}
.cookie-notice__text{
    min-width: 0;
    font-size: .92rem;
    line-height: 1.35;
    font-weight: 700;
}
.cookie-notice__button{
    flex: 0 0 auto;
    min-width: 64px;
    padding: .42rem .9rem;
    border: 1px solid rgba(255,224,138,.88);
    border-radius: 999px;
    background: linear-gradient(135deg, #ff8a00, #ffd166);
    color: #210b00;
    font-weight: 950;
    cursor: pointer;
    box-shadow: 0 0 18px rgba(255,138,0,.35);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.cookie-notice__button:hover,
.cookie-notice__button:focus-visible{
    transform: translateY(-1px);
    filter: brightness(1.05);
    box-shadow: 0 0 26px rgba(255,168,40,.55);
    outline: none;
}
@keyframes cookieNoticeIn{
    from{ opacity: 0; transform: translateY(18px); }
    to{ opacity: 1; transform: translateY(0); }
}
@media (max-width: 575.98px){
    .cookie-notice{
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }
    .cookie-notice__button{
        width: 100%;
    }
}

/* =============================================================
   Feature carousel before footer (v1.0.147)
   ============================================================= */
.feature-carousel-section{
    position: relative;
    margin-top: 2.4rem;
    padding: 3.2rem 0 1.35rem;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 209, 102, .13), transparent 32%),
        radial-gradient(circle at 86% 16%, rgba(255, 43, 29, .10), transparent 34%),
        linear-gradient(180deg, rgba(20, 24, 36, .68) 0%, rgba(7, 9, 16, .92) 100%);
    border-top: 1px solid rgba(255, 209, 102, .30);
    border-bottom: 0;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 22px 45px rgba(0,0,0,.22);
    overflow: hidden;
}
.feature-carousel-section::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: linear-gradient(90deg, transparent 0%, rgba(255,43,29,.72) 18%, #ffd166 50%, rgba(255,43,29,.72) 82%, transparent 100%);
    box-shadow: 0 0 22px rgba(255, 209, 102, .42), 0 0 18px rgba(255, 43, 29, .28);
    pointer-events: none;
}
.feature-carousel-section::after{
    content: "";
    position: absolute;
    left: 8%;
    right: 8%;
    top: 4px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.24), transparent);
    pointer-events: none;
}
.feature-carousel{
    position: relative;
    padding: 0 3.25rem 2.6rem;
    border-radius: 0;
    overflow: visible;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}
.feature-carousel__viewport{
    overflow: hidden;
    border-radius: 22px;
    padding-top: 42px;
}
.feature-carousel__track{
    display: flex;
    transition: transform .48s ease;
    will-change: transform;
}
.feature-slide{
    position: relative;
    flex: 0 0 100%;
    min-height: 245px;
    overflow: visible;
    border-radius: 22px;
    padding: clamp(1.2rem, 3vw, 2rem);
    color: var(--text-main);
    background:
        linear-gradient(122deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 34%, transparent 56%),
        linear-gradient(155deg, #4a0c08 0%, #222b42 42%, #070910 100%);
    border: 1px solid rgba(226,232,240,.22);
}
.feature-slide::after{
    content: "";
    position: absolute;
    inset: auto 22px 0 22px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(255,209,102,.84), rgba(255,43,29,.50), transparent);
    box-shadow: 0 0 18px rgba(255,209,102,.34);
}
.feature-slide__content{
    position: relative;
    z-index: 2;
    max-width: 620px;
}
.feature-slide:not(.feature-slide--infos) .feature-slide__content{
    padding-right: min(48vw, 430px);
}
.feature-slide__content--center{
    max-width: none;
    text-align: center;
    margin: 0 auto;
}
.feature-slide__kicker{
    color: #ffcf4f;
    font-size: 1.1rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.feature-slide__title{
    color: #fff6d1;
    font-size: clamp(1.7rem, 4vw, 3rem);
    line-height: 1.02;
    font-weight: 950;
    text-transform: uppercase;
    text-shadow: 0 2px 0 rgba(92,0,0,.52), 0 0 18px rgba(255,209,102,.30);
}
.feature-slide__subtitle{
    margin-top: .25rem;
    color: var(--accent-light);
    font-size: clamp(1rem, 2vw, 1.35rem);
    font-weight: 850;
}
.feature-slide p{
    max-width: 520px;
    margin: .85rem 0 0;
    color: #f4ead7;
    font-weight: 700;
    line-height: 1.55;
}
.feature-slide__link{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1rem;
    padding: .5rem .95rem;
    border-radius: 999px;
    color: #1a1000 !important;
    background: linear-gradient(135deg, #ff8a00, #ffd166);
    border: 1px solid rgba(255,224,138,.88);
    font-weight: 950;
    box-shadow: 0 0 18px rgba(255,138,0,.35);
}
.feature-slide__link:hover{
    color: #fff !important;
    filter: brightness(1.05);
}
.feature-slide__image{
    display: block;
    max-width: min(420px, 100%);
    height: auto;
    margin: 1rem auto 0;
    filter: drop-shadow(0 16px 26px rgba(0,0,0,.36));
}
.feature-slide--infos .feature-slide__image{
    width: 70%;
    max-width: 70%;
    margin-top: 1.15rem;
    object-fit: contain;
}
.feature-slide__figure{
    position: absolute;
    right: clamp(-10px, 3vw, 28px);
    bottom: -14px;
    z-index: 1;
    width: clamp(280px, 54vw, 550px);
    max-width: 78%;
    height: auto;
    pointer-events: none;
    user-select: none;
    filter: drop-shadow(0 18px 28px rgba(0,0,0,.46));
}
.feature-slide__figure--classic,
.feature-slide__figure--kamael,
.feature-slide__figure--aka,
.feature-slide__figure--gardon{
    top: -42px;
    bottom: auto;
}
.feature-slide__figure--classic{ width: clamp(300px, 56vw, 580px); }
.feature-slide__figure--kamael{ width: clamp(377px, 70vw, 733px); }
.feature-slide__figure--aka{ width: clamp(580px, 108vw, 1128px); max-width: none; right: clamp(-340px, -22vw, -130px); }
.feature-slide__figure--gardon{ width: clamp(390px, 73vw, 754px); }
.feature-uptime{
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .55rem;
    max-width: 680px;
    margin: 1rem auto .3rem;
}
.feature-uptime__item{
    min-height: 66px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    border: 1px solid rgba(255,209,102,.38);
    background: linear-gradient(180deg, rgba(255,209,102,.18), rgba(255,43,29,.12));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.22);
}
.feature-uptime__item span{
    color: #fff6d1;
    font-size: clamp(1.15rem, 2.4vw, 1.7rem);
    line-height: 1;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 0 14px rgba(255,209,102,.42);
}
.feature-uptime__item small{
    margin-top: .22rem;
    color: #ffcf4f !important;
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.feature-carousel__nav{
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255,224,138,.72);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(148,17,11,.96), rgba(255,138,0,.86));
    color: #fff6d1;
    font-size: 2rem;
    line-height: 1;
    font-weight: 900;
    transform: translateY(-50%);
    box-shadow: 0 12px 26px rgba(0,0,0,.34), 0 0 18px rgba(255,138,0,.28);
    cursor: pointer;
}
.feature-carousel__nav:hover,
.feature-carousel__nav:focus-visible{
    background: linear-gradient(135deg, #ff2d1f, #ffd166);
    color: #250b00;
    outline: none;
}
.feature-carousel__nav--prev{ left: 1rem; }
.feature-carousel__nav--next{ right: 1rem; }
.feature-carousel__dots{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
}
.feature-carousel__dot{
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.34);
    cursor: pointer;
    transition: width .2s ease, background .2s ease, box-shadow .2s ease;
}
.feature-carousel__dot.is-active{
    width: 28px;
    background: linear-gradient(135deg, #ff2d1f, #ffd166);
    box-shadow: 0 0 14px rgba(255,138,0,.42);
}
.feature-carousel__register{
    margin-top: 1.4rem;
    text-align: center;
}
.feature-carousel__register .btn{
    min-height: 72px;
    padding: 1.15rem 3.2rem;
    font-size: 1.35rem;
    line-height: 1.15;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-shadow: 0 0 34px rgba(255,138,0,.48), 0 14px 34px rgba(0,0,0,.32);
}
.feature-carousel__register-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    text-align: center;
}
.feature-carousel__register-icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55em;
    height: 1.55em;
    border-radius: 50%;
    background: rgba(26,16,0,.22);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 0 16px rgba(255,255,255,.18);
    font-size: .9em;
    line-height: 1;
}
.feature-carousel__register .btn:hover,
.feature-carousel__register .btn:focus-visible{
    transform: translateY(-2px) scale(1.03);
}

/* Proxy page (v1.0.143) */
.proxy-hero{ position: relative; overflow: hidden; }
.proxy-hero::after{
    content: "";
    position: absolute;
    right: -90px;
    bottom: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,209,102,.18), transparent 70%);
    pointer-events: none;
}
.proxy-help-box{
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: 1rem;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255,138,0,.18), rgba(255,43,29,.12));
    border: 1px solid rgba(255,209,102,.30);
}
.proxy-help-icon{
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #1a1000;
    background: linear-gradient(135deg, #ff8a00, #ffd166);
    font-size: 1.45rem;
    font-weight: 950;
}
.proxy-help-box strong,
.proxy-help-box span{ display: block; }
.proxy-help-box span{ color: var(--text-muted); font-size: .94rem; }
.proxy-card{ border-radius: 24px; }
.proxy-steps{
    display: grid;
    gap: .72rem;
    padding-left: 1.2rem;
}
.proxy-steps li{
    padding-left: .2rem;
    color: var(--text-main);
    line-height: 1.55;
}
.proxy-steps li::marker{ color: var(--accent-light); font-weight: 950; }
.proxy-note{
    padding: .9rem 1rem;
    border-radius: 16px;
    color: #fff4dc;
    background: rgba(255,138,0,.12);
    border: 1px solid rgba(255,209,102,.26);
    font-weight: 700;
}
.proxy-image{
    display: block;
    width: 100%;
    max-width: 310px;
    height: auto;
    margin: 0 auto;
    border-radius: 16px;
    border: 1px solid rgba(255,209,102,.28);
    box-shadow: 0 18px 36px rgba(0,0,0,.34);
}
.proxy-legend{
    display: grid;
    gap: .45rem;
    color: var(--text-main);
    font-weight: 700;
}
.proxy-legend-color{
    display: inline-block;
    width: 16px;
    height: 10px;
    margin-right: .45rem;
    border-radius: 3px;
    vertical-align: middle;
}
.proxy-legend-color--main{ background: #ff2d1f; }
.proxy-legend-color--proxy{ background: #274bff; }

@media (max-width: 767.98px){
    .feature-carousel{
        padding: 0 .8rem 2.45rem;
    }
    .feature-carousel__viewport{
        padding-top: 28px;
    }
    .feature-carousel__nav{
        top: auto;
        bottom: .78rem;
        width: 34px;
        height: 34px;
        font-size: 1.55rem;
    }
    .feature-carousel__nav--prev{ left: .8rem; }
    .feature-carousel__nav--next{ right: .8rem; }
    .feature-slide{
        min-height: 300px;
    }
    .feature-slide:not(.feature-slide--infos) .feature-slide__content{
        padding-right: 0;
    }
    .feature-slide__figure{
        right: -74px;
        top: auto;
        bottom: -58px;
        width: clamp(260px, 72vw, 420px);
        max-width: 70%;
        opacity: .36;
    }
    .feature-slide__figure--kamael{
        width: clamp(338px, 94vw, 546px);
        max-width: 91%;
    }
    .feature-slide__figure--gardon{
        width: clamp(338px, 94vw, 546px);
        max-width: 91%;
    }
    .feature-slide__figure--aka{
        right: -170px;
        width: clamp(520px, 144vw, 840px);
        max-width: none;
        opacity: .30;
    }
    .feature-slide--infos .feature-slide__image{
        width: 70%;
        max-width: 70%;
    }
    .feature-uptime{
        grid-template-columns: repeat(5, minmax(58px, 1fr));
        gap: .35rem;
        overflow-x: auto;
        padding-bottom: .2rem;
    }
    .feature-uptime__item{
        min-height: 55px;
        border-radius: 13px;
    }
    .feature-uptime__item small{
        font-size: .5rem;
        letter-spacing: .02em;
    }
    .feature-carousel__dots{ bottom: .95rem; }
}

@media (prefers-reduced-motion: reduce){
    .feature-carousel__track{ transition: none !important; }
}

/* =============================================================
   Footer menu adapted from legacy footer (v1.0.146)
   ============================================================= */
.footer{
    padding: 70px 0 20px;
}
.footer.site-footer{
    background:
        radial-gradient(circle at 50% 0%, rgba(255,209,102,.10), transparent 34%),
        linear-gradient(180deg, rgba(11,13,18,.96), var(--bg-deep));
    border-top: 1px solid rgba(255,209,102,.18);
}
.footer .f_menu{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: clamp(1rem, 2.2vw, 2rem);
    text-align: center;
    flex-wrap: wrap;
}
.footer .f_menu ul{
    display: block;
    list-style: none;
    min-width: 140px;
    margin: 0 10px;
    padding: 20px 0 0;
    border: 0;
}
.footer .f_menu li{
    text-align: center;
    padding: 0;
    margin: 0 0 .32rem;
}
.footer .f_menu li.footer-menu-gap{
    margin-top: 1.35rem;
}
.footer .f_menu li a{
    white-space: nowrap;
}
.footer .f_menu a{
    font-size: 14px;
    letter-spacing: 2px;
    color: #b9a987 !important;
    text-decoration: none;
    position: relative;
    display: inline-block;
    padding-bottom: 0;
    transition: color .35s ease-in-out, text-shadow .35s ease-in-out, transform .18s ease;
}
.footer .f_menu a::before{
    content: "";
    width: 100%;
    height: 1px;
    margin: 0 0 -7px;
    background-color: #b9a987;
    position: absolute;
    left: 0;
    bottom: 7px;
    right: 0;
    transition: transform .35s ease-in-out, opacity .35s ease-in-out, background-color .35s ease-in-out;
    transform: scaleX(1);
    opacity: .4;
    pointer-events: none;
}
.footer .f_menu a:hover,
.footer .f_menu a:focus-visible{
    color: #fff3c4 !important;
    text-shadow: 0 0 14px rgba(255,209,102,.28);
    transform: translateY(-1px);
    outline: none;
}
.footer .f_menu a:hover::before,
.footer .f_menu a:focus-visible::before{
    transform: scaleX(0);
    opacity: 0;
}
.footer .f_menu .flogo2{
    min-width: 190px;
    padding-top: 6px;
}
.footer .f_menu .flogo2 a::before{
    height: 0;
    display: none;
}
.footer .f_menu .flogo2 a{
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: filter .35s ease, transform .35s ease;
}
.footer .f_menu .flogo2 a:hover,
.footer .f_menu .flogo2 a:focus-visible{
    -webkit-animation-name: toColor;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
    animation-name: toColor;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-duration: 1s;
    transform: scale(1.04);
}
.footer .f_menu .flogo2 img{
    display: block;
    width: 180px;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
    filter: drop-shadow(0 10px 22px rgba(0,0,0,.32));
}
.footer-copy-years{
    margin-top: .6rem;
    color: var(--text-muted);
    font-weight: 800;
    letter-spacing: .08em;
}
@-webkit-keyframes toColor{
    0%{ -webkit-filter: grayscale(100%); filter: grayscale(100%); }
    100%{ -webkit-filter: grayscale(0%); filter: grayscale(0%); }
}
@keyframes toColor{
    0%{ -webkit-filter: grayscale(100%); filter: grayscale(100%); }
    100%{ -webkit-filter: grayscale(0%); filter: grayscale(0%); }
}
.copy{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    text-align: center;
    margin: 22px 0 20px;
    color: var(--text-muted);
    font-size: .84rem;
}
@media (max-width: 767.98px){
    .footer{
        padding-top: 42px;
    }
    .footer .f_menu{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .75rem 1rem;
    }
    .footer .f_menu ul{
        min-width: 0;
        margin: 0;
        padding-top: 10px;
    }
    .footer .f_menu .flogo2{
        grid-column: 1 / -1;
        order: -1;
    }
    .footer .f_menu a{
        font-size: 12px;
        letter-spacing: 1px;
    }
}

@media (max-width: 575.98px){
    .feature-carousel__register .btn{
        width: min(100%, 360px);
        min-height: 62px;
        padding: 1rem 1.4rem;
        font-size: 1.05rem;
        white-space: normal;
    }
}

/* =============================================================
   Donate event bonus blocks
   ============================================================= */
.hero-donate-bonus-ad{
    width: min(100%, 570px);
    margin-left: 0;
    margin-right: auto;
}
.donate-bonus-ad-link{
    display: block;
    color: inherit !important;
    text-decoration: none !important;
}
.donate-bonus-ad{
    position: relative;
    min-height: 122px;
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    padding: 1.05rem 1.15rem;
    border-radius: 24px;
    border: 2px dotted rgba(54, 207, 46, .95);
    background:
        radial-gradient(circle at 8% 0%, rgba(54, 207, 46, .30), transparent 34%),
        radial-gradient(circle at 96% 18%, rgba(255, 209, 102, .32), transparent 36%),
        linear-gradient(135deg, rgba(37, 64, 24, .92), rgba(18, 26, 18, .96) 52%, rgba(73, 35, 6, .92));
    box-shadow:
        0 18px 38px rgba(0,0,0,.34),
        0 0 26px rgba(54, 207, 46, .16),
        inset 0 1px 0 rgba(255,255,255,.16);
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.donate-bonus-ad::before{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.18) 42%, transparent 66%);
    transform: translateX(-120%);
    animation: donateBonusShine 4.4s ease-in-out infinite;
}
.donate-bonus-ad-link:hover .donate-bonus-ad{
    transform: translateY(-2px);
    border-color: rgba(255, 209, 102, .95);
    box-shadow:
        0 24px 50px rgba(0,0,0,.40),
        0 0 34px rgba(54, 207, 46, .24),
        0 0 26px rgba(255, 209, 102, .18);
}
.donate-bonus-ad-icon{
    position: relative;
    z-index: 1;
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    border-radius: 22px;
    background: rgba(255,255,255,.12);
    font-size: 2.35rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
.donate-bonus-ad-content{
    position: relative;
    z-index: 1;
    min-width: 0;
}
.donate-bonus-ad-title{
    color: #dbff9b;
    font-size: clamp(1.05rem, 2.4vw, 1.45rem);
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-shadow: 0 0 18px rgba(54,207,46,.35);
}
.donate-bonus-ad-text{
    margin-top: .28rem;
    color: #f8ffe8;
    font-size: .96rem;
    line-height: 1.38;
}
.donate-bonus-ad-text strong,
.donate-bonus-ad-text b{
    color: #8cff62;
}
.donate-bonus-page-notice{
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.1rem;
    border-radius: 20px;
    border: 4px dotted #36cf2e;
    color: #10230c;
    background:
        radial-gradient(circle at 100% 0%, rgba(255,255,255,.28), transparent 34%),
        linear-gradient(135deg, #aed262, #d8f17e);
    box-shadow: 0 16px 36px rgba(0,0,0,.24), 0 0 22px rgba(54,207,46,.20);
}
.donate-bonus-page-icon{
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    flex: 0 0 54px;
    border-radius: 18px;
    background: rgba(255,255,255,.34);
    font-size: 2rem;
}
.donate-bonus-page-text{
    font-size: 1rem;
    line-height: 1.45;
    font-weight: 800;
}
.donate-bonus-page-text b{
    color: #0f5f0a;
}
@keyframes donateBonusShine{
    0%, 46%{ transform: translateX(-120%); opacity: .35; }
    72%{ opacity: .92; }
    100%{ transform: translateX(120%); opacity: .35; }
}
@media (max-width: 575.98px){
    .donate-bonus-ad{
        grid-template-columns: auto minmax(0, 1fr);
        gap: .8rem;
        padding: .9rem;
    }
    .donate-bonus-ad-icon{
        width: 54px;
        height: 54px;
        font-size: 1.8rem;
    }
    .donate-bonus-page-notice{
        align-items: flex-start;
        padding: .9rem;
    }
}
@media (prefers-reduced-motion: reduce){
    .donate-bonus-ad::before{
        animation: none !important;
        transform: none;
        opacity: .12;
    }
}

/* Unsubscribe page */
.unsubscribe-card {
    position: relative;
    overflow: hidden;
}

.unsubscribe-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    pointer-events: none;
    background: radial-gradient(circle at 50% 0%, rgba(255, 206, 86, 0.18), transparent 42%);
}

.unsubscribe-card > * {
    position: relative;
    z-index: 1;
}

.unsubscribe-icon {
    width: 74px;
    height: 74px;
    margin: 0 auto 18px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 205, 92, 0.12);
    box-shadow: 0 0 28px rgba(255, 205, 92, 0.18);
    font-size: 34px;
}

.unsubscribe-email {
    display: inline-flex;
    max-width: 100%;
    padding: 10px 16px;
    border: 1px solid rgba(245, 199, 104, 0.35);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.22);
    color: var(--gold-light);
    font-weight: 700;
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px){
    .top-vote-links{
        width: 100%;
        justify-content: center;
    }
    .top-vote-toggle{
        width: 100%;
        max-width: 240px;
    }
    .top-vote-menu{
        left: 50%;
        right: auto;
        top: calc(100% + 8px);
        width: min(92vw, 320px);
        min-width: 0;
        grid-template-columns: 1fr 1fr;
        transform: translate(-50%, 8px) scale(.98);
        transform-origin: center top;
    }
    .top-vote-menu::before{
        left: 50%;
        right: auto;
        transform: translateX(-50%) rotate(45deg);
    }
    .top-vote-links:hover .top-vote-menu,
    .top-vote-links:focus-within .top-vote-menu{
        transform: translate(-50%, 0) scale(1);
    }
    .top-vote-link{
        justify-content: flex-start;
        font-size: .68rem;
    }
}

/* Красивые подсказки вместо стандартного title */
.has-tooltip{
    position: relative;
}
.has-tooltip::before,
.has-tooltip::after{
    position: absolute;
    left: 50%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px) scale(.96);
    transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
    z-index: 3000;
}
.has-tooltip::before{
    content: attr(data-tooltip);
    bottom: calc(100% + 11px);
    width: max-content;
    max-width: min(280px, calc(100vw - 28px));
    padding: .48rem .68rem;
    border-radius: 12px;
    border: 1px solid rgba(245,166,35,.46);
    background: linear-gradient(135deg, rgba(28,20,12,.98), rgba(48,29,16,.98));
    color: #ffe9b3;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .02em;
    text-align: center;
    white-space: normal;
    box-shadow: 0 14px 30px rgba(0,0,0,.42), 0 0 18px rgba(255,138,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
}
.has-tooltip::after{
    content: "";
    bottom: calc(100% + 5px);
    width: 12px;
    height: 12px;
    border-right: 1px solid rgba(245,166,35,.46);
    border-bottom: 1px solid rgba(245,166,35,.46);
    background: rgba(48,29,16,.98);
    transform: translate(-50%, 8px) rotate(45deg) scale(.96);
}
.has-tooltip:hover::before,
.has-tooltip:hover::after,
.has-tooltip:focus-visible::before,
.has-tooltip:focus-visible::after,
.has-tooltip:focus-within::before,
.has-tooltip:focus-within::after{
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0) scale(1);
}
.has-tooltip:hover::after,
.has-tooltip:focus-visible::after,
.has-tooltip:focus-within::after{
    transform: translate(-50%, 0) rotate(45deg) scale(1);
}
.has-tooltip[data-tooltip=""]::before,
.has-tooltip[data-tooltip=""]::after{
    display: none;
}

@media (max-width: 575.98px){
    .has-tooltip::before{
        max-width: min(230px, calc(100vw - 24px));
        font-size: .72rem;
        padding: .42rem .56rem;
    }
}

/* Password toggle + fancy tooltip fix */
.password-toggle-field .password-toggle-btn.has-tooltip{
    position: absolute;
    top: 50%;
    right: .72rem;
    left: auto;
    transform: translateY(-50%);
}
.password-toggle-field .password-toggle-btn.has-tooltip:active{
    transform: translateY(-50%) scale(.96);
}
.password-toggle-btn span[aria-hidden="true"]{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    line-height: 1;
}

/* =============================================================
   Server info promo tabs and image preview tooltip
   ============================================================= */
.server-info-content .server-feature-tabs{
    margin: 1.15rem 0 1.6rem;
    padding: 1rem;
    border: 1px solid rgba(255,209,102,.16);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(21,26,39,.78), rgba(44,29,22,.56));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 45px rgba(0,0,0,.22);
}
.server-info-content .server-feature-tabs > label{
    position: relative;
    min-height: 104px;
    overflow: hidden;
    border-color: rgba(255,209,102,.28);
    background: radial-gradient(circle at 50% 15%, rgba(255,209,102,.16), rgba(31,37,55,.82) 56%, rgba(15,18,27,.94));
    box-shadow: 0 10px 24px rgba(0,0,0,.22);
}
.server-info-content .server-feature-tabs > label:hover,
.server-info-content .server-feature-tabs > input[type="radio"]:checked + label{
    border-color: rgba(255,209,102,.72);
    background: radial-gradient(circle at 50% 15%, rgba(255,209,102,.28), rgba(63,39,25,.86) 58%, rgba(20,22,32,.96));
    transform: translateY(-1px);
}
.server-info-content .server-feature-tabs > label img{
    width: 86px;
    height: 86px;
    object-fit: contain;
    filter: drop-shadow(0 10px 18px rgba(0,0,0,.34));
}
.server-info-content .server-feature-tabs > .stab2{
    color: rgba(255,244,218,.92);
    border-color: rgba(255,209,102,.24);
    background: linear-gradient(180deg, rgba(37,43,62,.88), rgba(20,24,36,.88));
}
.server-info-content .server-feature-tabs > .stab2 h2{
    margin: .25rem 0 1rem;
    color: var(--gold);
    font-size: 1.35rem;
    font-weight: 900;
}
.server-info-content .server-feature-tabs > .stab2 ul{
    margin-bottom: .75rem;
}
.server-info-content .server-feature-tabs > .stab2 li{
    margin: .38rem 0;
    line-height: 1.55;
}
.server-info-content .server-feature-tabs a:not(.image-tooltip){
    color: var(--accent-light);
    font-weight: 800;
}
.image-tooltip{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    margin: 0 .18rem;
    border: 1px solid rgba(255,209,102,.45);
    border-radius: 999px;
    background: rgba(255,209,102,.12);
    color: #ffe5a6;
    text-decoration: none;
    vertical-align: middle;
    cursor: zoom-in;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.image-tooltip:hover,
.image-tooltip:focus-visible{
    z-index: 30;
    transform: translateY(-1px) scale(1.06);
    border-color: rgba(255,230,157,.92);
    background: rgba(255,209,102,.22);
    box-shadow: 0 0 18px rgba(255,198,76,.24);
    outline: none;
}
.image-tooltip > span{
    position: absolute;
    left: 50%;
    bottom: calc(100% + 12px);
    z-index: 40;
    display: block;
    width: max-content;
    max-width: min(640px, 82vw);
    padding: .45rem;
    border: 1px solid rgba(255,209,102,.48);
    border-radius: 14px;
    background: rgba(15,18,27,.96);
    box-shadow: 0 20px 48px rgba(0,0,0,.52), 0 0 28px rgba(255,198,76,.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px) scale(.98);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.image-tooltip > span::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -7px;
    width: 13px;
    height: 13px;
    border-right: 1px solid rgba(255,209,102,.48);
    border-bottom: 1px solid rgba(255,209,102,.48);
    background: rgba(15,18,27,.96);
    transform: translateX(-50%) rotate(45deg);
}
.image-tooltip:hover > span,
.image-tooltip:focus-visible > span{
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0) scale(1);
}
.image-tooltip > span img{
    display: block;
    width: auto;
    max-width: min(600px, 78vw);
    max-height: 420px;
    border-radius: 10px;
    object-fit: contain;
}
@media (max-width: 575.98px){
    .server-info-content .server-feature-tabs{
        padding: .75rem;
    }
    .server-info-content .server-feature-tabs > label{
        min-height: 86px;
    }
    .server-info-content .server-feature-tabs > label img{
        width: 68px;
        height: 68px;
    }
    .image-tooltip > span{
        left: auto;
        right: -1rem;
        transform: translate(0, 8px) scale(.98);
    }
    .image-tooltip:hover > span,
    .image-tooltip:focus-visible > span{
        transform: translate(0, 0) scale(1);
    }
    .image-tooltip > span::after{
        left: auto;
        right: 1.15rem;
        transform: rotate(45deg);
    }
}

/* =============================================================
   v1.0.174: stabs2 labels row and image tooltip without popup
   ============================================================= */
.server-info-content .server-feature-tabs.stabs2{
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
    gap: .65rem;
}
.server-info-content .server-feature-tabs > input[type="radio"]{
    display: none !important;
}
.server-info-content .server-feature-tabs > label{
    order: 1;
    flex: 0 0 112px;
    margin: 0;
}
.server-info-content .server-feature-tabs > .stab2{
    order: 2;
    flex: 0 0 100%;
    width: 100%;
    margin-top: .15rem;
}
.image-tooltip::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: calc(100% + 12px);
    z-index: 80;
    display: block;
    width: min(600px, 78vw);
    height: min(420px, 56vw);
    max-height: 420px;
    border: 1px solid rgba(255,209,102,.48);
    border-radius: 14px;
    background-color: rgba(15,18,27,.96);
    background-image: var(--image-tooltip-src);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    box-shadow: 0 20px 48px rgba(0,0,0,.52), 0 0 28px rgba(255,198,76,.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px) scale(.98);
    transform-origin: left bottom;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.image-tooltip::after{
    content: "";
    position: absolute;
    left: .45rem;
    bottom: calc(100% + 6px);
    z-index: 81;
    width: 13px;
    height: 13px;
    border-right: 1px solid rgba(255,209,102,.48);
    border-bottom: 1px solid rgba(255,209,102,.48);
    background: rgba(15,18,27,.96);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: rotate(45deg);
    transition: opacity .18s ease, visibility .18s ease;
}
.image-tooltip:hover::before,
.image-tooltip:focus-visible::before{
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}
.image-tooltip:hover::after,
.image-tooltip:focus-visible::after{
    opacity: 1;
    visibility: visible;
}
@media (max-width: 575.98px){
    .server-info-content .server-feature-tabs > label{
        flex: 1 1 calc(50% - .65rem);
    }
    .image-tooltip::before{
        left: -1rem;
        width: min(420px, 86vw);
        height: min(320px, 60vw);
    }
    .image-tooltip::after{
        left: .35rem;
    }
}

/* =============================================================
   v1.0.175: server info spoiler gaps and light stabs2 background
   ============================================================= */
@media (min-width: 768px){
    .server-info-content > .row{
        column-gap: 1rem;
        row-gap: 1rem;
    }
    .server-info-content > .row > .pro-spoiler.col-md-6{
        flex: 0 0 calc(50% - .5rem);
        max-width: calc(50% - .5rem);
        width: calc(50% - .5rem);
        margin: 0;
    }
    .server-info-content > .row > .pro-spoiler.col-md-12{
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}
.server-info-content .server-feature-tabs.stabs2{
    background: linear-gradient(90deg, #efefef, #eee);
    color: #111;
    border-color: rgba(0,0,0,.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 16px 36px rgba(0,0,0,.16);
}
.server-info-content .server-feature-tabs.stabs2 > .stab2{
    color: #111;
    background: rgba(255,255,255,.72);
    border-color: rgba(0,0,0,.08);
}
.server-info-content .server-feature-tabs.stabs2 > .stab2 h2{
    color: #2b1b12;
}
.server-info-content .server-feature-tabs.stabs2 > label{
    background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(221,221,221,.82));
    border-color: rgba(0,0,0,.12);
}
.server-info-content .server-feature-tabs.stabs2 > label:hover,
.server-info-content .server-feature-tabs.stabs2 > input[type="radio"]:checked + label{
    background: linear-gradient(180deg, #fff7db, #ead9ac);
    border-color: rgba(176,116,30,.55);
}


/* =============================================================
   v1.0.176: server info stabs2 full-row layout
   ============================================================= */
.server-info-content > .row > .server-feature-tabs.stabs2{
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}
.server-info-content > .row > br{
    display: none;
}
@media (min-width: 768px){
    .server-info-content > .row > .server-feature-tabs.stabs2{
        flex-basis: 100%;
        max-width: 100%;
    }
}

/* =============================================================
   v1.0.177: stabs2 headings and action links
   ============================================================= */
.server-info-content .server-feature-tabs.stabs2 .stab2 h2{
    color: #24160f !important;
    text-shadow: none;
}
.server-info-content .server-feature-tabs.stabs2 .stab2 a.btn-brown:not(.image-tooltip){
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: .65rem;
    color: #fff7df;
    text-decoration: none;
}
.server-info-content .server-feature-tabs.stabs2 .stab2 a.btn-brown:not(.image-tooltip):hover,
.server-info-content .server-feature-tabs.stabs2 .stab2 a.btn-brown:not(.image-tooltip):focus-visible{
    color: #fff;
}

/* Tooltip «Игра без вайпов» без перехода по ссылке */
.no-wipe-tooltip{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: help;
    white-space: nowrap;
}
.no-wipe-tooltip-box{
    position: absolute;
    left: 50%;
    bottom: calc(100% + 12px);
    width: min(520px, calc(100vw - 32px));
    padding: .85rem .95rem;
    border-radius: 16px;
    border: 1px solid rgba(245,166,35,.48);
    background: linear-gradient(135deg, rgba(28,20,12,.98), rgba(48,29,16,.98));
    color: #ffe9b3;
    font-size: .86rem;
    font-weight: 600;
    line-height: 1.38;
    letter-spacing: .01em;
    text-align: left;
    white-space: normal;
    box-shadow: 0 18px 42px rgba(0,0,0,.46), 0 0 22px rgba(255,138,0,.20), inset 0 1px 0 rgba(255,255,255,.08);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px) scale(.96);
    transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
    z-index: 3200;
}
.no-wipe-tooltip-box::after{
    content: "";
    position: absolute;
    left: 50%;
    top: calc(100% - 6px);
    width: 13px;
    height: 13px;
    border-right: 1px solid rgba(245,166,35,.48);
    border-bottom: 1px solid rgba(245,166,35,.48);
    background: rgba(48,29,16,.98);
    transform: translateX(-50%) rotate(45deg);
}
.no-wipe-tooltip-box strong{
    display: block;
    margin-bottom: .35rem;
    color: #ffd166;
    font-size: 1rem;
    font-weight: 900;
    text-align: center;
}
.no-wipe-tooltip-box b{
    color: #fff3c4;
    font-weight: 900;
}
.no-wipe-tooltip:hover .no-wipe-tooltip-box,
.no-wipe-tooltip:focus-visible .no-wipe-tooltip-box,
.no-wipe-tooltip:focus-within .no-wipe-tooltip-box{
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0) scale(1);
}
@media (max-width: 575.98px){
    .no-wipe-tooltip{
        white-space: normal;
    }
    .no-wipe-tooltip-box{
        left: 0;
        width: min(300px, calc(100vw - 28px));
        font-size: .78rem;
        transform: translate(0, 8px) scale(.96);
    }
    .no-wipe-tooltip-box::after{
        left: 28px;
    }
    .no-wipe-tooltip:hover .no-wipe-tooltip-box,
    .no-wipe-tooltip:focus-visible .no-wipe-tooltip-box,
    .no-wipe-tooltip:focus-within .no-wipe-tooltip-box{
        transform: translate(0, 0) scale(1);
    }
}

/* =============================================================
   v1.0.184: no-wipe tooltip visibility in server info
   ============================================================= */
.server-info-page .server-info-content,
.server-info-content .pro-spoiler,
.server-info-content .pro-spoiler-body{
    overflow: visible !important;
}
.server-info-content .no-wipe-tooltip{
    position: relative;
    z-index: 3400;
}
.server-info-content .no-wipe-tooltip-box{
    z-index: 9999;
}
.server-info-content .pro-spoiler:has(.no-wipe-tooltip:hover),
.server-info-content .pro-spoiler:has(.no-wipe-tooltip:focus-visible),
.server-info-content .pro-spoiler:has(.no-wipe-tooltip:focus-within){
    z-index: 3450;
}


/* v1.0.190 — parallax for /images/girl.png on all screen widths */
.hero-section .home-hero-girl{
    --home-girl-parallax-x: 0px;
    --home-girl-parallax-y: 0px;
    transform: translate3d(var(--home-girl-parallax-x), var(--home-girl-parallax-y), 0) !important;
    transform-origin: center bottom;
    will-change: transform;
    transition: transform .08s linear;
}

/* v1.0.187 — robust mobile position for home girl */
@media (max-width: 991.98px){
    .hero-section .home-hero-girl{
        position: absolute;
        left: clamp(-220px, -18vw, -70px);
        right: auto;
        bottom: auto;
        width: min(520vw, 1420px);
        height: auto;
        max-width: none;
        max-height: none;
        object-fit: contain;
        pointer-events: none;
        z-index: 0;
    }
}

@media (max-width: 700px){
    .home-hero-girl{
        width: min(520vw, 1220px) !important;
        height: auto !important;
        max-width: none !important;
        object-fit: contain !important;
        pointer-events: none;
        z-index: 0 !important;
		left:-250px !important;
    }
}

/* v1.0.192: force dark regular href links inside server description spoiler blocks */
.server-info-content .pro-spoiler a[href]:not(.btn):not(.image-tooltip) *,
.pro-spoiler a[href]:not(.btn):not(.image-tooltip) *{
    color: inherit !important;
}


/* pro-spoiler dark-blue links */
.server-info-content .pro-spoiler a[href]:not(.btn):not(.image-tooltip),
.server-info-content .pro-spoiler .pro-spoiler-body a[href]:not(.btn):not(.image-tooltip),
.pro-spoiler a[href]:not(.btn):not(.image-tooltip){
    color: #0b2a5b !important;
    text-decoration: underline;
    text-decoration-color: #0b2a5b !important;
    text-underline-offset: 3px;
    font-weight: 800;
}
.server-info-content .pro-spoiler a[href]:not(.btn):not(.image-tooltip):hover,
.server-info-content .pro-spoiler .pro-spoiler-body a[href]:not(.btn):not(.image-tooltip):hover,
.pro-spoiler a[href]:not(.btn):not(.image-tooltip):hover{
    color: #7a1111 !important;
    text-decoration-color: #7a1111 !important;
}

/* =============================================================
   v1.0.200: footer-like text links in dark content blocks
   ============================================================= */
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link){
    position: relative;
    display: inline-block;
    padding-bottom: 0;
    color: #b9a987 !important;
    text-decoration: none !important;
    border-bottom: 0 !important;
    transition: color .35s ease-in-out, text-shadow .35s ease-in-out, transform .18s ease;
}
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link)::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #b9a987;
    transform: scaleX(1);
    opacity: .4;
    pointer-events: none;
    transition: transform .35s ease-in-out, opacity .35s ease-in-out, background-color .35s ease-in-out;
}
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link):hover,
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link):focus-visible{
    color: #fff3c4 !important;
    text-decoration: none !important;
    border-bottom: 0 !important;
    text-shadow: 0 0 14px rgba(255,209,102,.28);
    transform: translateY(-1px);
    outline: none;
}
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link):hover::before,
:is(
    .game-card,
    .hero-card,
    .about-hero,
    .about-content-card,
    .about-info-card,
    .about-years-card,
    .download-chronicle,
    .download-file,
    .files-hero,
    .files-info,
    .files-changelog-box,
    .rules-hero,
    .rules-intro,
    .rules-warning-box,
    .rules-toc,
    .rules-nav-card,
    .rule-item,
    .bonus-hero,
    .bonus-card,
    .bonus-vote-card,
    .bonus-rewards-card,
    .bonus-table-wrap,
    .forum-last-card,
    .news-popup-card,
    .auth-section .game-card,
    .support-panel,
    .modal-content,
    .page-popup .modal-content,
    .forum-content,
    .rules-content
) a[href]:not(.btn):not(.nav-link):not(.dropdown-item):not(.image-tooltip):not(.support_link):not(.top-vote-link):not(.server-id):not(.server-tile):not(.download-main-link):not(.donate-bonus-ad-link):not(.feature-slide__link):focus-visible::before{
    transform: scaleX(0);
    opacity: 0;
}

/* =============================================================
   v1.0.202: download mirrors styled like support panel links
   ============================================================= */
.download-mirrors{
    display: grid;
    gap: 9px;
    padding: .85rem 1rem 1rem;
    border-top: 1px solid rgba(43,22,11,.11);
    color: #fff2da;
}
.download-mirrors a,
.download-mirrors a.btn,
.download-mirrors a.btn-brown{
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    border-radius: 14px !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    background: rgba(255,255,255,.07) !important;
    color: #fff2da !important;
    font-size: 12px;
    text-decoration: none !important;
    box-shadow: none !important;
    transform: none;
    transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
}

.download-mirrors a:hover,
.download-mirrors a:focus-visible,
.download-mirrors a.btn:hover,
.download-mirrors a.btn:focus-visible,
.download-mirrors a.btn-brown:hover,
.download-mirrors a.btn-brown:focus-visible{
    color: #fff !important;
    transform: translateX(-2px);
    background: rgba(255,138,29,.14) !important;
    border-color: rgba(255,180,92,.34) !important;
    outline: none;
}

/* =============================================================
   v1.0.203: equal-width download mirror buttons in one row
   ============================================================= */
.download-mirrors{
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 9px !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}
.download-mirrors a,
.download-mirrors a.btn,
.download-mirrors a.btn-brown{
    flex: 1 1 0 !important;
    min-width: 0;
    width: auto !important;
    min-height: 42px;
    justify-content: center !important;
    text-align: center;
    white-space: nowrap;
}
@media (max-width: 575.98px){
    .download-mirrors a,
    .download-mirrors a.btn,
    .download-mirrors a.btn-brown{
        flex: 1 0 136px !important;
    }
}


/* =============================================================
   v1.0.207: mobile news scroll and rules TOC links
   ============================================================= */
.news-scroll{
    touch-action: pan-x pan-y !important;
    -webkit-overflow-scrolling: touch;
}

.rules-toc-nav a[href],
.rules-toc-nav .rules-toc-link{
    text-decoration: none !important;
    border-bottom: 0 !important;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease !important;
}
.rules-toc-nav a[href]::before,
.rules-toc-nav .rules-toc-link::before{
    display: none !important;
    content: none !important;
}
.rules-toc-nav a[href]:hover,
.rules-toc-nav a[href]:focus-visible,
.rules-toc-nav .rules-toc-link:hover,
.rules-toc-nav .rules-toc-link:focus-visible{
    text-decoration: none !important;
    border-bottom: 0 !important;
    transform: none !important;
}

/* =============================================================
   v1.0.208: wider page popup on tablet/mobile widths
   ============================================================= */
@media (max-width: 991.98px){
    .page-popup .modal-dialog{
        width: calc(100vw - 1rem) !important;
        max-width: calc(100vw - 1rem) !important;
        margin: .5rem auto !important;
    }

    .page-popup .modal-content{
        min-height: calc(100vh - 1rem);
        max-height: calc(100vh - 1rem);
        border-radius: 18px;
    }

    .page-popup .modal-body{
        overflow-x: hidden;
        overflow-y: auto;
        max-height: calc(100vh - 4.8rem);
    }
}

/* =============================================================
   v1.0.209: icon-only vote and language menus
   ============================================================= */
.top-vote-menu{
    grid-template-columns: 48px;
    min-width: 0;
    width: max-content;
}
.top-vote-link{
    justify-content: center;
    width: 48px;
    min-width: 48px;
    min-height: 45px;
    padding: .18rem !important;
}
.top-vote-name{
    display: none !important;
}
.lang-icon-links{
    z-index: 1042;
}
.lang-icon-toggle{
    width: 44px;
    min-width: 44px;
    height: 39px;
    min-height: 39px;
    padding: 0 !important;
    overflow: hidden;
}
.lang-icon-toggle::after{
    display: none;
}
.lang-icon-menu{
    grid-template-columns: 48px;
}
.lang-icon-link.active{
    border-color: rgba(255,224,138,.92) !important;
    background: linear-gradient(135deg, rgba(255,138,0,.35), rgba(255,209,102,.22)) !important;
    box-shadow: 0 0 18px rgba(255,138,0,.28);
}
.lang-icon{
    flex: 0 0 44px;
    display: block;
    width: 44px;
    height: 39px;
    background-image: url("/images/style/icons.png");
    background-repeat: no-repeat;
    filter: grayscale(.18) brightness(.95);
    transition: filter .18s ease;
}
.lang-current{
    margin: 0;
}
.lang-icon-link:hover .lang-icon,
.lang-icon-link:focus-visible .lang-icon,
.lang-icon-toggle:hover .lang-icon,
.lang-icon-links:focus-within .lang-icon{
    filter: grayscale(0) brightness(1.08);
}
.langs .en,
.lang-icon.en{background-position: 0px 0px;}
.langs .ru,
.lang-icon.ru{background-position: -44px 0px;}
.langs .pt,
.lang-icon.pt{background-position: -88px 0px;}
.langs .uk,
.lang-icon.uk{background-position: -308px -39px;}
.langs .es,
.lang-icon.es{background-image: url("/images/style/icons.png"); background-position: -352px -39px;}

@media (max-width: 767.98px){
    .top-vote-menu{
        grid-template-columns: 48px !important;
        width: max-content !important;
        min-width: 0 !important;
    }
    .lang-icon-menu{
        grid-template-columns: 48px !important;
    }
    .top-vote-link{
        justify-content: center !important;
        width: 48px !important;
        min-width: 48px !important;
    }
}

/* =============================================================
   v1.0.210: vertical header icon dropdowns
   ============================================================= */
.top-vote-menu,
.lang-icon-menu{
    grid-template-columns: 48px !important;
}

/* =============================================================
   v1.0.211: centered local icon dropdowns in header
   ============================================================= */
.vote-icon-toggle{
    width: 44px;
    min-width: 44px;
    height: 39px;
    min-height: 39px;
    padding: 0 !important;
    overflow: hidden;
}
.vote-icon-toggle::after{
    display: none;
}
.vote-current-icon{
    margin: 0;
}
.top-vote-links > .top-vote-menu{
    left: 50% !important;
    right: auto !important;
    transform: translate(-50%, 8px) scale(.98) !important;
    transform-origin: center top !important;
}
.top-vote-links:hover > .top-vote-menu,
.top-vote-links:focus-within > .top-vote-menu{
    transform: translate(-50%, 0) scale(1) !important;
}
.top-vote-links > .top-vote-menu::before{
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) rotate(45deg) !important;
}
.lang-icon{
    background-image: url('/images/style/icons.png') !important;
}
.lang-icon.es{
    background-image: url('/images/style/icons.png') !important;
}

/* =============================================================
   v1.0.212: header icon buttons without borders
   ============================================================= */
.vote-icon-toggle,
.lang-icon-toggle,
.top-vote-link,
.lang-icon-link,
.top-vote-link.active,
.lang-icon-link.active{
    border: 0 !important;
    border-color: transparent !important;
}
.vote-icon-toggle:hover,
.vote-icon-toggle:focus-visible,
.lang-icon-toggle:hover,
.lang-icon-toggle:focus-visible,
.top-vote-link:hover,
.top-vote-link:focus-visible,
.lang-icon-link:hover,
.lang-icon-link:focus-visible{
    border: 0 !important;
    border-color: transparent !important;
}

/* =============================================================
   v1.0.213: Mozilla/Firefox animation compatibility
   ============================================================= */
.brand-logo{
    -moz-animation: leaves 2s ease-in-out 1 alternate;
}
.brand-logo img{
    -moz-animation: coin 5s ease-in-out 1 alternate;
}
.server-open-countdown::before{
    -moz-animation: countdownShine 3.8s ease-in-out infinite;
}
.server-ribbon-gold span{
    -moz-animation: serverGoldShimmer 3.4s ease-in-out infinite;
}
.news-popup-cover{
    -moz-animation: newsPopupCoverPan 4.4s ease-out 1 both;
}
.mini-rating-pane.mini-rating-pane-animate{
    -moz-animation-name: tr_scale;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: 1;
    -moz-animation-duration: .7s;
    -moz-animation-delay: 0s;
}
.btn-play-pulse{
    -moz-animation: playButtonPulse 1.6s ease-in-out infinite;
}
.btn-play-pulse:hover,
.btn-play-pulse:focus{
    -moz-animation-play-state: paused;
}
.cookie-notice{
    -moz-animation: cookieNoticeIn .32s ease-out both;
}
.footer .f_menu .flogo2 a:hover,
.footer .f_menu .flogo2 a:focus-visible{
    -moz-animation-name: toColor;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 1s;
}
.donate-bonus-ad::before{
    -moz-animation: donateBonusShine 4.4s ease-in-out infinite;
}

@-moz-keyframes coin {
    0% { -moz-transform: rotateY(0deg); transform: rotateY(0deg); }
    100% { -moz-transform: rotateY(360deg); transform: rotateY(360deg); }
}
@-moz-keyframes leaves {
    0% { -moz-transform: scale(.3); transform: scale(.3); }
    100% { -moz-transform: scale(1.18); transform: scale(1.18); }
}
@-moz-keyframes countdownShine{
    0%, 45%{ -moz-transform: translateX(-125%); transform: translateX(-125%); opacity: .55; }
    72%{ opacity: .95; }
    100%{ -moz-transform: translateX(125%); transform: translateX(125%); opacity: .55; }
}
@-moz-keyframes serverGoldShimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@-moz-keyframes newsPopupCoverPan {
    0% { background-position: center top; }
    68% { background-position: center bottom; }
    100% { background-position: center center; }
}
@-moz-keyframes tr_scale{
    0%{ -moz-transform: scale(1.08, 1.12); transform: scale(1.08, 1.12); }
    80%{ -moz-transform: scale(.96, .92); transform: scale(.96, .92); }
    100%{ -moz-transform: scale(1, 1); transform: scale(1, 1); }
}
@-moz-keyframes playButtonPulse{
    0%, 100%{ -moz-transform: scale(1); transform: scale(1); }
    50%{ -moz-transform: scale(1.08); transform: scale(1.08); }
}
@-moz-keyframes cookieNoticeIn{
    from{ opacity: 0; -moz-transform: translateY(18px); transform: translateY(18px); }
    to{ opacity: 1; -moz-transform: translateY(0); transform: translateY(0); }
}
@-moz-keyframes toColor{
    0%{ -moz-filter: grayscale(100%); filter: grayscale(100%); }
    100%{ -moz-filter: grayscale(0%); filter: grayscale(0%); }
}
@-moz-keyframes donateBonusShine{
    0%, 46%{ -moz-transform: translateX(-120%); transform: translateX(-120%); opacity: .35; }
    72%{ opacity: .92; }
    100%{ -moz-transform: translateX(120%); transform: translateX(120%); opacity: .35; }
}

@media (prefers-reduced-motion: reduce){
    *,
    *::before,
    *::after{
        -moz-animation-duration: .01ms !important;
        -moz-animation-iteration-count: 1 !important;
    }
    .server-open-countdown::before,
    .donate-bonus-ad::before{
        -moz-animation: none !important;
    }
}

/* =============================================================
   v1.0.215: hero mt-4 block above girl on hover
   ============================================================= */
.home-hero-copy{
    position: relative;
    z-index: 1;
}
.home-hero-copy:hover,
.home-hero-copy:focus-within{
    z-index: 2;
}

/* =============================================================
   v1.0.216: local 2D icons and equal rules TOC spacing
   ============================================================= */
.btn-icon,
.nav-icon,
.bonus-card-icon,
.guide-ui-icon,
.guide-coin,
.feature-carousel__register-icon,
.unsubscribe-icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.btn-icon .fa,
.nav-icon .fa,
.bonus-card-icon .fa,
.guide-ui-icon .fa,
.guide-coin .fa,
.feature-carousel__register-icon .fa,
.unsubscribe-icon .fa{
    font-size: .95em;
    filter: none !important;
    text-shadow: none !important;
}
.rules-toc-nav{
    display: grid !important;
    gap: 8px !important;
}
.rules-toc-nav .rules-toc-link,
.rules-toc-link{
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    line-height: 1.25 !important;
    box-sizing: border-box !important;
}

/* =============================================================
   Invite page
   ============================================================= */
.invite-page .game-card{
    position: relative;
    overflow: hidden;
}
.invite-start-card::before,
.invite-form-card::before{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 14% 12%, rgba(255,209,102,.18), transparent 30%),
        radial-gradient(circle at 100% 0%, rgba(59,130,246,.12), transparent 34%);
}
.invite-page .game-card > *{
    position: relative;
    z-index: 1;
}
.invite-kicker{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: .55rem;
    color: var(--gold-2);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.invite-server-note{
    display: grid;
    gap: .2rem;
    padding: 1rem;
    border-radius: 18px;
    background: rgba(20,24,36,.62);
    border: 1px solid rgba(255,209,102,.18);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.invite-server-note span,
.invite-server-note small,
.form-hint{
    color: var(--text-muted);
}
.invite-server-note b{
    color: #fff4dd;
    font-size: 1.06rem;
}
.invite-kit-list{
    display: grid;
    gap: .75rem;
}
.invite-kit-item{
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .75rem .85rem;
    border-radius: 16px;
    background: rgba(20,24,36,.56);
    border: 1px solid rgba(248,250,252,.12);
}
.invite-kit-item span{
    color: #fff4dd;
    font-weight: 800;
}
.invite-page .circle32{
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid rgba(255,209,102,.42);
    box-shadow: 0 0 12px rgba(255,209,102,.16);
}
.form-hint{
    margin-top: .35rem;
    font-size: .86rem;
    line-height: 1.35;
}
.invite-form .btn-icon{
    margin-right: .35rem;
}
.invite-form-card .alert-success div + div{
    margin-top: .35rem;
}
@media (max-width: 575.98px){
    .invite-kit-item{
        align-items: flex-start;
    }
}

/* =============================================================
   v1.0.219: responsive header and invite card background
   ============================================================= */
.header-actions{
    justify-content: flex-end;
    margin-left: auto;
}
.header-actions .lang-icon-links,
.header-actions .vote-icon-links{
    flex: 0 0 auto;
}
.invite-form-card{
    background-image: url('/images/pagebg_invite.png') !important;
    background-position: bottom center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}
@media (min-width: 800px) and (max-width: 991.98px){
    .topbar .navbar-collapse{
        padding-top: .75rem;
    }
    .topbar .navbar-nav{
        width: 100%;
    }
    .header-actions{
        width: 100%;
        justify-content: flex-end !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: .45rem !important;
        margin-top: .45rem;
        margin-left: 0 !important;
    }
    .header-actions .btn{
        white-space: nowrap;
    }
    .header-actions .btn-gold:not(:last-child){
        margin-right: auto;
    }
}

/* =============================================================
   v1.0.220: invite background image replacement
   ============================================================= */
.invite-form-card{
    background-image: none !important;
    background-position: initial !important;
    background-repeat: initial !important;
    background-size: initial !important;
}
.invite-form-card::before{
    background: url('/images/pagebg_invite.png') center center / cover no-repeat !important;
    opacity: .2 !important;
}

/* =============================================================
   v1.0.221: auth form background images
   ============================================================= */
.auth-section.register-page #register-form .game-card,
.auth-section.login-page .login-form-card{
    position: relative;
    overflow: hidden;
}
.auth-section.register-page #register-form .game-card::before,
.auth-section.login-page .login-form-card::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .2;
}
.auth-section.register-page #register-form .game-card::before{
    background: url('/images/pagebg_register.png') center center / cover no-repeat;
}
.auth-section.login-page .login-form-card::before{
    background: url('/images/pagebg_login.png') center center / cover no-repeat;
}
.auth-section.register-page #register-form .game-card > *,
.auth-section.login-page .login-form-card > *{
    position: relative;
    z-index: 1;
}

/* =============================================================
   v1.0.232: mobile popup top clipping fix
   ============================================================= */
@media (max-width: 991.98px){
    .page-popup{
        padding-top: max(.5rem, env(safe-area-inset-top)) !important;
        padding-bottom: .5rem !important;
    }
    .page-popup .modal-dialog,
    .page-popup .modal-dialog-centered{
        align-items: flex-start !important;
        min-height: 0 !important;
        height: auto !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    .page-popup .modal-dialog{
        width: calc(100vw - 1rem) !important;
        max-width: calc(100vw - 1rem) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .page-popup .modal-content{
        min-height: auto !important;
        max-height: calc(100svh - 1rem - env(safe-area-inset-top)) !important;
        max-height: calc(100dvh - 1rem - env(safe-area-inset-top)) !important;
    }
    .page-popup .modal-body{
        overflow-x: hidden !important;
        overflow-y: auto !important;
        max-height: calc(100svh - 5rem - env(safe-area-inset-top)) !important;
        max-height: calc(100dvh - 5rem - env(safe-area-inset-top)) !important;
    }
}

/* =============================================================
   v1.0.237: community icon dropdown in header
   ============================================================= */
.community-icon-links{
    z-index: 1043;
}
.community-icon-toggle{
    width: 44px;
    min-width: 44px;
    height: 39px;
    min-height: 39px;
    padding: 0 !important;
    overflow: hidden;
}
.community-icon-toggle::after{
    display: none;
}
.community-icon-menu{
    grid-template-columns: 48px !important;
}
.community-icon{
    flex: 0 0 44px;
    display: block;
    width: 44px;
    height: 39px;
    background-image: url('/images/style/icons.png') !important;
    background-repeat: no-repeat;
    filter: grayscale(.18) brightness(.95);
    transition: filter .18s ease;
}
.community-current-icon{
    margin: 0;
}
.community-icon-link:hover .community-icon,
.community-icon-link:focus-visible .community-icon,
.community-icon-toggle:hover .community-icon,
.community-icon-links:focus-within .community-icon{
    filter: grayscale(0) brightness(1.08);
}
.community-icon.tg{background-position: -264px -39px;}
.community-icon.vk{background-position: -176px 0px;}
.community-icon.discord{background-position: -264px 0px;}
.community-icon.fb{background-position: -132px 0px;}
.header-actions .community-icon-links{
    flex: 0 0 auto;
}
.vote-icon-toggle,
.lang-icon-toggle,
.community-icon-toggle,
.top-vote-link,
.lang-icon-link,
.community-icon-link,
.top-vote-link.active,
.lang-icon-link.active,
.community-icon-link.active{
    border: 0 !important;
    border-color: transparent !important;
}
.vote-icon-toggle:hover,
.vote-icon-toggle:focus-visible,
.lang-icon-toggle:hover,
.lang-icon-toggle:focus-visible,
.community-icon-toggle:hover,
.community-icon-toggle:focus-visible,
.top-vote-link:hover,
.top-vote-link:focus-visible,
.lang-icon-link:hover,
.lang-icon-link:focus-visible,
.community-icon-link:hover,
.community-icon-link:focus-visible{
    border: 0 !important;
    border-color: transparent !important;
}
@media (max-width: 767.98px){
    .community-icon-menu{
        grid-template-columns: 48px !important;
    }
}


/* =============================================================
   v1.0.239: TG link near Ratings uses Font Awesome
   ============================================================= */
.header-tg-link{
    white-space: nowrap;
}
.header-tg-icon{
    color: #32c5ff;
    filter: none !important;
    transition: color .18s ease, transform .18s ease, text-shadow .18s ease;
}
.header-tg-icon .fa{
    font-size: 1.05em;
}
.header-tg-link:hover .header-tg-icon,
.header-tg-link:focus-visible .header-tg-icon{
    color: #8ee4ff;
    text-shadow: 0 0 14px rgba(50,197,255,.36);
    transform: translateY(-1px);
}

/* =============================================================
   v1.0.257: mobile header icon controls in one row
   ============================================================= */
@media (max-width: 767.98px){
    .header-actions{
        width: 100%;
        justify-content: flex-end !important;
        align-items: center !important;
        gap: .45rem !important;
    }
    .header-actions .lang-icon-links,
    .header-actions .community-icon-links,
    .header-actions .vote-icon-links{
        width: 44px !important;
        min-width: 44px !important;
        flex: 0 0 44px !important;
        justify-content: center !important;
    }
    .header-actions .lang-icon-toggle,
    .header-actions .community-icon-toggle,
    .header-actions .vote-icon-toggle{
        width: 44px !important;
        max-width: 44px !important;
        min-width: 44px !important;
    }
}
