body:has(.membership-page) .loarea {
    height: 78px;
    background: rgba(1, 6, 16, .92);
    border-bottom: 1px solid rgba(100, 126, 219, .34);
    box-shadow: 0 12px 36px rgba(0, 5, 18, .44);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

body:has(.membership-page) .loarea .wp {
    width: min(calc(100vw - clamp(54px, 6.5vw, 160px)), 1820px);
    max-width: none;
    gap: clamp(18px, 1.8vw, 40px);
}

body:has(.membership-page) .logo {
    flex: 0 0 220px;
    width: 220px;
    height: 78px;
}

body:has(.membership-page) .logo .tp {
    height: 58px;
}

body:has(.membership-page) .logo .logo-text {
    max-width: 148px;
    font-size: 1.75rem !important;
}

body:has(.membership-page) .nav {
    flex: 1 1 auto;
    min-width: 0;
}

body:has(.membership-page) .navul {
    justify-content: center;
    gap: clamp(14px, 1.45vw, 34px);
    margin: 0;
}

body:has(.membership-page) .navul li > a {
    position: relative;
    height: 78px;
    padding: 0;
    color: rgba(190, 203, 232, .9);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
}

body:has(.membership-page) .navul li > a.act_nav,
body:has(.membership-page) .navul li > a:hover {
    color: #42adff !important;
}

body:has(.membership-page) .navul li > a.act_nav::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 46px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent 0%, #2ec8ff 18%, #348fff 58%, transparent 100%);
    box-shadow: 0 -6px 18px rgba(43, 153, 255, .72);
    transform: translateX(-50%);
}

body:has(.membership-page) .loginArea {
    flex: 0 0 auto;
    gap: 10px;
    margin-left: 0;
}

body:has(.membership-page) .couponCodeBadge,
body:has(.membership-page) .langSwitch {
    display: none !important;
}

body:has(.membership-page) .theme-toggle {
    width: 82px;
    height: 44px;
    padding: 5px;
    overflow: hidden;
    border-color: rgba(82, 112, 202, .48);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(28, 47, 95, .96), rgba(14, 25, 57, .96));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 26px rgba(0, 6, 22, .3);
}

body:has(.membership-page) .theme-toggle::before {
    left: 15px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: radial-gradient(circle, #8ea5d9 0 2px, transparent 3px), conic-gradient(from 0deg, transparent 0 8%, rgba(142, 165, 217, .9) 8% 13%, transparent 13% 25%, rgba(142, 165, 217, .9) 25% 30%, transparent 30% 42%, rgba(142, 165, 217, .9) 42% 47%, transparent 47% 59%, rgba(142, 165, 217, .9) 59% 64%, transparent 64% 76%, rgba(142, 165, 217, .9) 76% 81%, transparent 81% 100%);
    box-shadow: 0 0 16px rgba(105, 139, 221, .35);
}

body:has(.membership-page) .theme-toggle::after {
    right: 5px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: radial-gradient(circle at 36% 32%, rgba(255, 255, 255, .95) 0 10%, rgba(171, 201, 255, .92) 38%, rgba(55, 119, 255, .96) 72%, rgba(22, 57, 156, .98) 100%);
    box-shadow: 0 0 18px rgba(76, 137, 255, .76), inset 0 1px 0 rgba(255, 255, 255, .35);
    transform: translateY(-50%);
}

body:has(.membership-page) .theme-toggle:hover::after,
body:has(.membership-page) .theme-toggle:focus-within::after {
    transform: translateY(-50%);
}

body:has(.membership-page) .theme-toggle-btn,
body:has(.membership-page) .theme-toggle:hover .theme-toggle-btn:not(.is-active),
body:has(.membership-page) .theme-toggle:focus-within .theme-toggle-btn:not(.is-active) {
    display: none !important;
}

body:has(.membership-page) .loginArea .loginBtn {
    height: 44px;
    border-radius: 12px !important;
}

body:has(.membership-page) .topIntegralBadge {
    width: min(78px, 100%);
    height: 18px;
    min-height: 18px;
    padding: 0 6px;
    gap: 4px;
    border-color: rgba(75, 106, 183, .58);
    background: rgba(6, 13, 32, .66);
    color: rgba(243, 247, 255, .96);
    font-size: 10px;
}

body:has(.membership-page) .topIntegralBadge .icon {
    width: 11px;
    height: 11px;
}

body:has(.membership-page) .loginArea .loginBtn {
    min-width: 86px;
    padding: 0 20px;
    line-height: 44px;
}

body:has(.membership-page) .loginArea .avatar {
    width: 48px;
    height: 48px;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .08), 0 10px 26px rgba(0, 5, 18, .32);
}