._sidebar_hlfd7_1 {
    position: fixed;
    left: 0;
    top: var(--electron-titlebar-height, 0px);
    bottom: 0;
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-right: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    z-index: 100;
    overflow: hidden;
    transition: top var(--transition-normal)
}

._logo_hlfd7_35 {
    height: var(--header-height);
    display: flex;
    align-items: center;
    padding: 0 20px;
    gap: 12px;
    border-bottom: 1px solid var(--border-color)
}

._logoIcon_hlfd7_53 {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px var(--color-primary-glow);
    cursor: pointer
}

._logoText_hlfd7_77 {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 700;
    color: var(--bg-primary)
}

._logoTitle_hlfd7_91 {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    white-space: nowrap
}

._nav_hlfd7_109 {
    flex: 1;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto
}

._navItem_hlfd7_127 {
    text-decoration: none;
    color: var(--text-secondary);
    border-radius: var(--border-radius-sm);
    position: relative;
    overflow: hidden
}

._navItemContent_hlfd7_143 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    position: relative;
    z-index: 1
}

._navIcon_hlfd7_161 {
    font-size: 18px;
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color var(--transition-fast)
}

._navLabel_hlfd7_179 {
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap
}

._navItem_hlfd7_127:hover {
    color: var(--text-primary);
    background: var(--bg-glass-light)
}

._navItem_hlfd7_127._active_hlfd7_201 {
    color: var(--color-primary)
}

._navItem_hlfd7_127._active_hlfd7_201 ._navIcon_hlfd7_161 {
    color: var(--color-primary);
    filter: drop-shadow(0 0 8px var(--color-primary-glow))
}

._activeIndicator_hlfd7_221 {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--color-primary);
    border-radius: 0 3px 3px 0;
    box-shadow: 0 0 15px var(--color-primary-glow)
}

._collapseBtn_hlfd7_245 {
    margin: 16px 12px;
    padding: 12px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all var(--transition-fast)
}

._collapseBtn_hlfd7_245:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background: #00d4ff1a
}

._modal_l0u3h_1 .ant-modal-content {
    background: linear-gradient(180deg, #0f1423fa, #0a0f19fa) !important;
    border: 1px solid var(--border-color);
    overflow: hidden
}

._modal_l0u3h_1 .ant-modal-body {
    padding: 32px 24px
}

._header_l0u3h_23 {
    text-align: center;
    margin-bottom: 24px
}

._logoWrapper_l0u3h_33 {
    width: 64px;
    height: 64px;
    margin: 0 auto 16px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 30px var(--color-primary-glow)
}

._logo_l0u3h_33 {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 700;
    color: var(--bg-primary)
}

._title_l0u3h_71 {
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0
}

._tabs_l0u3h_89 .ant-tabs-nav {
    margin-bottom: 24px
}

._tabs_l0u3h_89 .ant-tabs-tab {
    font-size: 15px;
    padding: 8px 20px
}

._tabContent_l0u3h_107 {
    min-height: 280px
}

._input_l0u3h_117 {
    height: 44px;
    background: #0a0f19cc !important;
    border-color: var(--border-color) !important;
    border-radius: 8px !important
}

._input_l0u3h_117:hover,
._input_l0u3h_117:focus {
    border-color: var(--color-primary) !important
}

._input_l0u3h_117 .ant-input {
    background: transparent !important
}

._input_l0u3h_117 .ant-input-prefix {
    color: var(--text-muted);
    margin-right: 10px
}

._codeInput_l0u3h_161 {
    display: flex;
    gap: 12px
}

._codeInput_l0u3h_161 ._input_l0u3h_117 {
    flex: 1
}

._codeBtn_l0u3h_179 {
    height: 44px;
    min-width: 110px;
    border-radius: 8px;
    background: var(--bg-glass-light);
    border-color: var(--border-color);
    color: var(--text-primary)
}

._codeBtn_l0u3h_179:hover:not(:disabled) {
    border-color: var(--color-primary);
    color: var(--color-primary)
}

._codeBtn_l0u3h_179:disabled {
    background: var(--bg-glass);
    color: var(--text-muted)
}

._submitBtn_l0u3h_219 {
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 10px;
    margin-top: 8px
}

._forgotPassword_l0u3h_237,
._backToLogin_l0u3h_239 {
    text-align: center;
    margin-top: -8px
}

._forgotPassword_l0u3h_237 a,
._backToLogin_l0u3h_239 a {
    color: var(--text-secondary);
    font-size: 13px;
    transition: color var(--transition-fast)
}

._forgotPassword_l0u3h_237 a:hover,
._backToLogin_l0u3h_239 a:hover {
    color: var(--color-primary)
}

._resetPanel_l0u3h_275 {
    padding-top: 20px
}

._resetTitle_l0u3h_283 {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 24px
}

._steamIcon_l0u3h_301 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    background: linear-gradient(135deg, #1b2838, #2a475e);
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    color: #fff
}

._steamStatus_l0u3h_329 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    margin-bottom: 16px;
    background: var(--bg-glass);
    border-radius: 8px;
    font-size: 13px;
    color: var(--text-secondary)
}

._steamStatus_l0u3h_329._steamSuccess_l0u3h_355 {
    background: #52c41a1a;
    color: #52c41a
}

._steamStatus_l0u3h_329._steamError_l0u3h_365 {
    background: #ff4d4f1a;
    color: #ff4d4f
}

._steamLoginBtn_l0u3h_377 {
    height: 48px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 10px;
    background: linear-gradient(135deg, #1b2838, #2a475e) !important;
    border: 1px solid #2a475e !important;
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

._steamLoginBtn_l0u3h_377:hover:not(:disabled) {
    background: linear-gradient(135deg, #2a475e, #3d6a8a) !important;
    border-color: #3d6a8a !important
}

._steamLoginBtn_l0u3h_377:disabled {
    opacity: .5
}

._steamLoginBtn_l0u3h_377 ._steamIcon_l0u3h_301 {
    width: 24px;
    height: 24px;
    font-size: 14px;
    border-radius: 4px
}

._divider_l0u3h_439 {
    display: flex;
    align-items: center;
    margin: 20px 0;
    color: var(--text-muted);
    font-size: 12px
}

._divider_l0u3h_439:before,
._divider_l0u3h_439:after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--border-color)
}

._divider_l0u3h_439 span {
    padding: 0 16px
}

._steamTip_l0u3h_481 {
    text-align: center;
    padding: 8px;
    margin-bottom: 12px;
    background: #ffc1071a;
    border-radius: 6px;
    font-size: 12px;
    color: #ffc107
}

._walletCard_jbuvi_3 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px 6px 14px;
    background: var(--bg-glass);
    border: 1px solid var(--border-color);
    border-radius: 25px;
    cursor: default;
    transition: all var(--transition-normal)
}

._walletCard_jbuvi_3:hover {
    border-color: var(--color-primary);
    box-shadow: 0 0 15px var(--color-primary-glow)
}

._walletInfo_jbuvi_37 {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer
}

._coinIcon_jbuvi_51 {
    width: 22px;
    height: 22px;
    object-fit: contain
}

._balanceInfo_jbuvi_63 {
    display: flex;
    flex-direction: column;
    line-height: 1.2
}

._balanceLabel_jbuvi_75 {
    font-size: 10px;
    color: var(--text-muted)
}

._balanceValue_jbuvi_85 {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._rechargeBtn_jbuvi_99 {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: flex;
    align-items: center;
    justify-content: center
}

._rechargeBtn_jbuvi_99 .anticon {
    font-size: 14px
}

._modal_jbuvi_131 .ant-modal-content {
    background: var(--bg-card) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color)
}

._modal_jbuvi_131 .ant-modal-header {
    background: transparent !important;
    border-bottom: 1px solid var(--border-color) !important;
    padding: 16px 24px
}

._modal_jbuvi_131 .ant-modal-body {
    padding: 24px
}

._modal_jbuvi_131 .ant-modal-close-x {
    color: var(--text-secondary)
}

._modalTitle_jbuvi_171 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary)
}

._modalCoinIcon_jbuvi_189 {
    width: 24px;
    height: 24px;
    object-fit: contain
}

._modalIcon_jbuvi_201 {
    font-size: 20px;
    color: var(--color-primary)
}

._selectStep_jbuvi_213 {
    display: flex;
    flex-direction: column;
    gap: 20px
}

._currentBalance_jbuvi_225 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._currentBalanceLabel_jbuvi_245 {
    color: var(--text-secondary);
    font-size: 14px
}

._currentBalanceValue_jbuvi_255 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._smallCoinIcon_jbuvi_275 {
    width: 20px;
    height: 20px;
    object-fit: contain
}

._quickAmounts_jbuvi_289 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px
}

._quickAmountItem_jbuvi_301 {
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    padding: 14px 8px;
    text-align: center;
    cursor: pointer;
    transition: all var(--transition-normal)
}

._quickAmountItem_jbuvi_301:hover {
    border-color: var(--color-primary);
    background: #00d4ff0d
}

._quickAmountItem_jbuvi_301._active_jbuvi_331 {
    border-color: var(--color-primary);
    background: #00d4ff1a;
    box-shadow: 0 0 15px var(--color-primary-glow)
}

._quickAmountValue_jbuvi_343 {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 2px
}

._quickAmountCoins_jbuvi_357 {
    font-size: 11px;
    color: var(--color-primary)
}

._customAmount_jbuvi_369 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm)
}

._customLabel_jbuvi_389 {
    color: var(--text-secondary);
    font-size: 14px;
    white-space: nowrap
}

._amountInput_jbuvi_401 {
    width: 120px
}

._amountInput_jbuvi_401 .ant-input-number-input {
    font-size: 16px;
    font-weight: 600
}

._coinsPreview_jbuvi_419 {
    color: var(--text-secondary);
    font-size: 14px
}

._coinsValue_jbuvi_429 {
    color: var(--color-primary);
    font-weight: 600;
    font-size: 16px;
    font-family: var(--font-display)
}

._payTypeSection_jbuvi_445 {
    display: flex;
    flex-direction: column;
    gap: 10px
}

._payTypeLabel_jbuvi_457 {
    color: var(--text-secondary);
    font-size: 14px
}

._payTypeGroup_jbuvi_467 {
    display: flex;
    gap: 8px
}

._payTypeBtn_jbuvi_477 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 44px !important;
    border-radius: var(--border-radius-sm) !important
}

._alipayIcon_jbuvi_497 {
    color: #1677ff;
    font-size: 18px
}

._wxpayIcon_jbuvi_507 {
    color: #52c41a;
    font-size: 18px
}

._qqpayIcon_jbuvi_517 {
    color: #1890ff;
    font-size: 18px
}

._submitBtn_jbuvi_529 {
    height: 48px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: var(--border-radius-sm) !important;
    margin-top: 4px
}

._tips_jbuvi_545 {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.8
}

._tips_jbuvi_545 p {
    margin: 0
}

._payStep_jbuvi_567 {
    text-align: center
}

._orderInfo_jbuvi_575 {
    margin-bottom: 20px
}

._orderAmount_jbuvi_583 {
    font-size: 32px;
    font-weight: 700;
    color: var(--text-primary);
    font-family: var(--font-display)
}

._orderCoins_jbuvi_597 {
    font-size: 14px;
    color: var(--color-primary);
    margin-top: 4px
}

._qrcodeWrapper_jbuvi_609 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px
}

._qrcode_jbuvi_609 {
    padding: 12px;
    background: #fff;
    border-radius: var(--border-radius)
}

._qrcodeTip_jbuvi_635 {
    margin-top: 12px;
    color: var(--text-secondary);
    font-size: 14px
}

._payUrlLink_jbuvi_647 {
    margin-top: 8px;
    font-size: 13px
}

._payLoading_jbuvi_657 {
    padding: 40px 0;
    color: var(--text-secondary)
}

._payLoading_jbuvi_657 p {
    margin-top: 16px
}

._payActions_jbuvi_675 {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px
}

._backBtn_jbuvi_689 {
    min-width: 100px
}

._payTips_jbuvi_697 {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.8;
    text-align: left;
    padding: 12px;
    background: var(--bg-glass-light);
    border-radius: var(--border-radius-sm)
}

._payTips_jbuvi_697 p {
    margin: 0
}

._paySuccess_jbuvi_725 {
    padding: 40px 0
}

._successIcon_jbuvi_733 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-success) 0%, #52c41a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: var(--bg-primary);
    margin: 0 auto 16px;
    box-shadow: 0 0 30px #0f86
}

._paySuccess_jbuvi_725 p {
    font-size: 18px;
    color: var(--color-success);
    font-weight: 600;
    margin: 0
}

._payCanceled_jbuvi_775 {
    padding: 40px 0;
    color: var(--text-secondary)
}

._payCanceled_jbuvi_775 p,
._recordTabs_jbuvi_795 .ant-tabs-nav {
    margin-bottom: 16px
}

._tabLabel_jbuvi_803 {
    display: flex;
    align-items: center;
    gap: 6px
}

._recordList_jbuvi_815 {
    max-height: 400px;
    overflow-y: auto;
    padding-right: 4px
}

._recordLoading_jbuvi_827 {
    display: flex;
    justify-content: center;
    padding: 40px 0
}

._empty_jbuvi_839 {
    padding: 40px 0
}

._empty_jbuvi_839 .ant-empty-description {
    color: var(--text-muted)
}

._recordItem_jbuvi_857 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    margin-bottom: 8px;
    transition: all var(--transition-fast)
}

._recordItem_jbuvi_857:hover {
    border-color: var(--color-primary);
    background: #00d4ff0d
}

._recordItem_jbuvi_857:last-child {
    margin-bottom: 0
}

._recordLeft_jbuvi_899 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._recordReason_jbuvi_911 {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 500
}

._recordTime_jbuvi_923 {
    font-size: 12px;
    color: var(--text-muted)
}

._recordAmount_jbuvi_933 {
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-display)
}

._recordAmount_jbuvi_933._positive_jbuvi_945 {
    color: var(--color-success)
}

._recordAmount_jbuvi_933._negative_jbuvi_953 {
    color: var(--color-danger)
}

._orderItem_jbuvi_963 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    margin-bottom: 8px;
    transition: all var(--transition-fast)
}

._orderItem_jbuvi_963:hover {
    border-color: var(--color-primary);
    background: #00d4ff0d
}

._orderItem_jbuvi_963:last-child {
    margin-bottom: 0
}

._orderLeft_jbuvi_1005 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._orderTitle_jbuvi_1017 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 500
}

._orderStatus_jbuvi_1035 {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500
}

._statusPending_jbuvi_1049 {
    background: #ffaa0026;
    color: var(--color-warning)
}

._statusSuccess_jbuvi_1059 {
    background: #00ff8826;
    color: var(--color-success)
}

._statusCanceled_jbuvi_1069 {
    background: #ff475726;
    color: var(--color-danger)
}

._orderMeta_jbuvi_1079 {
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 6px
}

._orderDivider_jbuvi_1095 {
    opacity: .5
}

._orderAmount_jbuvi_583 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    font-family: var(--font-display)
}

._vipTypeBadge_jbuvi_1119 {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    margin-right: 6px
}

._vipTypeBadge_jbuvi_1119[data-type=ladder] {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff
}

._vipTypeBadge_jbuvi_1119[data-type=vip] {
    background: linear-gradient(135deg, #f093fb, #f5576c);
    color: #fff
}

._vipTypeBadge_jbuvi_1119[data-type=svip] {
    background: linear-gradient(135deg, #fa709a, #fee140);
    color: #fff
}

._vipTypeBadge_jbuvi_1119[data-type=pro] {
    background: linear-gradient(135deg, #ff9a9e, #fecfef, #fecfef);
    color: #333
}

._vipOrderPrice_jbuvi_1177 {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-display);
    color: var(--text-primary)
}

._vipOrderPrice_jbuvi_1177 ._coinPrice_jbuvi_1191 {
    color: var(--color-primary)
}

@media (max-width: 480px) {
    ._quickAmounts_jbuvi_289 {
        grid-template-columns: repeat(2, 1fr)
    }
    ._customAmount_jbuvi_369,
    ._payTypeGroup_jbuvi_467 {
        flex-wrap: wrap
    }
}

._modal_1rwdw_1 .ant-modal-content {
    background: linear-gradient(180deg, #1a1a2e, #16213e);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px
}

._modal_1rwdw_1 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._modal_1rwdw_1 .ant-modal-title {
    color: #fff
}

._modal_1rwdw_1 .ant-modal-close-x,
._modal_1rwdw_1 .ant-tabs-tab {
    color: #fff9
}

._modal_1rwdw_1 .ant-tabs-tab-active .ant-tabs-tab-btn {
    color: #fff !important
}

._modal_1rwdw_1 .ant-tabs-ink-bar {
    background: #ff6b35
}

._modalTitle_1rwdw_63 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 16px
}

._modalTitle_1rwdw_63 .anticon {
    color: #ff6b35;
    font-size: 18px
}

._submitForm_1rwdw_91 {
    padding: 16px 0
}

._remainingInfo_1rwdw_99 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #ff6b351a;
    border: 1px solid rgba(255, 107, 53, .3);
    border-radius: 8px;
    margin-bottom: 20px;
    color: #ff6b35
}

._remainingInfo_1rwdw_99 strong {
    color: #fff;
    font-size: 16px
}

._formItem_1rwdw_133 {
    margin-bottom: 20px
}

._formItem_1rwdw_133 label {
    display: block;
    color: #fffc;
    margin-bottom: 8px;
    font-weight: 500
}

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

._matchMap_1rwdw_167 {
    font-weight: 600;
    color: #fff;
    min-width: 80px
}

._matchScore_1rwdw_179 {
    color: #ff6b35;
    font-weight: 500
}

._matchTime_1rwdw_189 {
    color: #ffffff80;
    font-size: 12px;
    margin-left: auto
}

._loadingPlayers_1rwdw_201 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff9;
    padding: 20px;
    justify-content: center
}

._playerList_1rwdw_219 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 200px;
    overflow-y: auto;
    padding: 4px 0
}

._playerItem_1rwdw_237 {
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    padding: 8px 12px;
    background: #ffffff0d;
    border-radius: 8px;
    transition: background .2s
}

._playerItem_1rwdw_237:hover {
    background: #ffffff1a
}

._playerItem_1rwdw_237 .ant-radio {
    margin-right: 0
}

._playerName_1rwdw_273 {
    flex: 1;
    color: #fff;
    font-weight: 500
}

._hint_1rwdw_285 {
    color: #fff6;
    text-align: center;
    padding: 20px
}

._reportList_1rwdw_299 {
    min-height: 300px;
    max-height: 450px;
    overflow-y: auto;
    padding: 8px 0
}

._loading_1rwdw_201 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px
}

._reportCard_1rwdw_327 {
    background: #ffffff0d;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    border: 1px solid rgba(255, 255, 255, .08);
    transition: border-color .2s
}

._reportCard_1rwdw_327:hover {
    border-color: #ffffff26
}

._reportHeader_1rwdw_353 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px
}

._reportInfo_1rwdw_367 {
    flex: 1;
    margin-left: 4px
}

._reportName_1rwdw_377 {
    color: #fff;
    font-weight: 600;
    font-size: 14px
}

._reportMeta_1rwdw_389 {
    display: flex;
    gap: 16px;
    color: #ffffff80;
    font-size: 12px;
    margin-top: 4px
}

._reportBody_1rwdw_405 {
    padding-left: 52px
}

._reportReason_1rwdw_413 {
    color: #fffc;
    font-size: 14px
}

._reportReason_1rwdw_413 strong {
    color: #fff9;
    font-weight: 500
}

._reportDesc_1rwdw_433 {
    color: #ffffff80;
    font-size: 13px;
    margin-top: 8px;
    padding: 8px 12px;
    background: #0003;
    border-radius: 6px
}

._resultReason_1rwdw_451 {
    color: #ffffffb3;
    font-size: 13px;
    margin-top: 8px;
    padding: 8px 12px;
    background: #ff6b351a;
    border-left: 3px solid #ff6b35;
    border-radius: 0 6px 6px 0
}

._resultReason_1rwdw_451 strong {
    color: #ff6b35
}

._pagination_1rwdw_479 {
    display: flex;
    justify-content: center;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .08)
}

._reportList_1rwdw_299::-webkit-scrollbar,
._playerList_1rwdw_219::-webkit-scrollbar {
    width: 6px
}

._reportList_1rwdw_299::-webkit-scrollbar-track,
._playerList_1rwdw_219::-webkit-scrollbar-track {
    background: #ffffff0d;
    border-radius: 3px
}

._reportList_1rwdw_299::-webkit-scrollbar-thumb,
._playerList_1rwdw_219::-webkit-scrollbar-thumb {
    background: #fff3;
    border-radius: 3px
}

._reportList_1rwdw_299::-webkit-scrollbar-thumb:hover,
._playerList_1rwdw_219::-webkit-scrollbar-thumb:hover {
    background: #ffffff4d
}

._modal_1rwdw_1 .ant-select-selector,
._modal_1rwdw_1 .ant-input,
._modal_1rwdw_1 .ant-input-textarea textarea {
    background: #ffffff14 !important;
    border-color: #ffffff26 !important;
    color: #fff !important
}

._modal_1rwdw_1 .ant-select-selector:hover,
._modal_1rwdw_1 .ant-input:hover,
._modal_1rwdw_1 .ant-input-textarea textarea:hover {
    border-color: #ffffff4d !important
}

._modal_1rwdw_1 .ant-select-arrow,
._modal_1rwdw_1 .ant-select-clear {
    color: #ffffff80
}

._modal_1rwdw_1 .ant-select-selection-placeholder,
._modal_1rwdw_1 .ant-input::placeholder,
._modal_1rwdw_1 .ant-input-textarea textarea::placeholder {
    color: #ffffff4d !important
}

._modal_1rwdw_1 .ant-input-textarea-show-count:after {
    color: #fff6
}

._modal_1rwdw_1 .ant-empty-description {
    color: #fff6
}

._modal_1rwdw_1 .ant-radio-wrapper {
    color: #fff
}

._evidenceHint_1rwdw_619 {
    margin-left: 8px;
    font-size: 12px;
    color: #ff6b35;
    font-weight: 400
}

._evidenceList_1rwdw_633 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px
}

._evidenceItem_1rwdw_647 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #ffffff14;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, .1)
}

._evidenceIcon_1rwdw_667 {
    font-size: 18px;
    color: #ff6b35
}

._evidenceName_1rwdw_677 {
    flex: 1;
    color: #fff;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._evidenceSize_1rwdw_695 {
    color: #ffffff80;
    font-size: 12px
}

._evidenceDelete_1rwdw_705 {
    color: #ffffff80;
    cursor: pointer;
    transition: color .2s
}

._evidenceDelete_1rwdw_705:hover {
    color: #ff4d4f
}

._uploadProgress_1rwdw_725 {
    margin-bottom: 12px
}

._uploadBtn_1rwdw_733 {
    width: 100%;
    background: #ffffff14 !important;
    border-color: #fff3 !important;
    color: #fffc !important
}

._uploadBtn_1rwdw_733:hover {
    background: #ffffff1f !important;
    border-color: #ffffff4d !important;
    color: #fff !important
}

._header_o035f_1 {
    position: fixed;
    top: var(--electron-titlebar-height, 0px);
    right: 0;
    left: var(--current-sidebar-width, var(--sidebar-width));
    height: var(--header-height);
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    z-index: 99;
    transition: left var(--transition-normal), top var(--transition-normal)
}

._left_o035f_39 {
    display: flex;
    align-items: center;
    gap: 24px
}

._right_o035f_51 {
    display: flex;
    align-items: center;
    gap: 16px
}

._onlineStatus_o035f_65 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    background: #ffffff0d;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 20px;
    transition: all .3s ease
}

._onlineStatus_o035f_65:hover {
    background: #ffffff14
}

._onlineDot_o035f_95 {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transition: all .3s ease
}

._dotConnected_o035f_111 {
    background: var(--color-success);
    box-shadow: 0 0 8px #00ff8880;
    animation: _pulse_o035f_1 2s infinite
}

._dotConnecting_o035f_125 {
    background: #ffa502;
    box-shadow: 0 0 8px #ffa50280;
    animation: _pulse_o035f_1 1s infinite
}

._dotDisconnected_o035f_139 {
    background: #ff4757;
    box-shadow: 0 0 8px #ff475780
}

._onlineText_o035f_149 {
    font-size: 13px;
    color: #fffc;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px
}

._pingBadge_o035f_167 {
    font-size: 11px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 8px
}

._pingBadge_o035f_167._pingGood_o035f_181 {
    background: #52c41a33;
    color: #52c41a
}

._pingBadge_o035f_167._pingMedium_o035f_191 {
    background: #faad1433;
    color: #faad14
}

._pingBadge_o035f_167._pingBad_o035f_167 {
    background: #f5222d33;
    color: #f5222d
}

._iconBtn_o035f_213 {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    color: var(--text-secondary);
    font-size: 18px
}

._iconBtn_o035f_213:hover {
    color: var(--color-primary);
    background: #00d4ff1a
}

._userInfo_o035f_241 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 12px 6px 6px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: 25px;
    cursor: pointer;
    transition: all var(--transition-fast)
}

._userInfo_o035f_241:hover {
    border-color: var(--color-primary);
    box-shadow: 0 0 15px var(--color-primary-glow)
}

._avatar_o035f_275 {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%)
}

._userDetails_o035f_283 {
    display: flex;
    flex-direction: column;
    gap: 2px
}

._username_o035f_295 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2
}

._rank_o035f_309 {
    font-size: 12px;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: 4px
}

._authButtons_o035f_327 {
    display: flex;
    gap: 12px
}

._loginBtn_o035f_337,
._registerBtn_o035f_345 {
    min-width: 80px
}

@keyframes _pulse_o035f_1 {
    0%,
    to {
        opacity: 1;
        transform: scale(1)
    }
    50% {
        opacity: .6;
        transform: scale(1.1)
    }
}

._clientStatus_o035f_377 {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    transition: all var(--transition-fast)
}

._clientStatus_o035f_377._connected_o035f_399 {
    background: #00ff881a;
    border: 1px solid rgba(0, 255, 136, .3);
    color: var(--color-success)
}

._clientStatus_o035f_377._disconnected_o035f_411 {
    background: #ff4d4f1a;
    border: 1px solid rgba(255, 77, 79, .3);
    color: var(--color-error)
}

._clientStatus_o035f_377._disconnected_o035f_411:hover {
    background: #ff4d4f26;
    border-color: #ff4d4f80
}

._clientIcon_o035f_433 {
    font-size: 14px
}

._clientText_o035f_441 {
    line-height: 1
}

._reconnectIcon_o035f_449 {
    font-size: 12px;
    margin-left: 4px;
    opacity: .7
}

._messageModal_o035f_463 .ant-modal-body {
    padding: 0 16px 16px
}

._messageList_o035f_471 {
    max-height: 400px;
    overflow-y: auto;
    min-height: 200px
}

._messageItem_o035f_483 {
    display: flex;
    align-items: center;
    padding: 12px 8px;
    border-bottom: 1px solid var(--border-color);
    transition: background .2s
}

._messageItem_o035f_483:hover {
    background: var(--bg-hover)
}

._messageItem_o035f_483:last-child {
    border-bottom: none
}

._messageInfo_o035f_515 {
    flex: 1;
    margin-left: 12px;
    min-width: 0
}

._messageName_o035f_527 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 2px
}

._messageTime_o035f_541 {
    font-size: 12px;
    color: var(--text-tertiary)
}

._messageSubInfo_o035f_551 {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: var(--text-secondary)
}

._messageActions_o035f_565 {
    display: flex;
    gap: 6px;
    margin-left: 8px
}

._container_1jovw_3 {
    position: fixed;
    top: calc(var(--header-height) + 12px);
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    z-index: 1000;
    pointer-events: none
}

._bar_1jovw_25 {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10px 20px;
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: 50px;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative;
    overflow: hidden;
    min-width: 400px;
    pointer-events: auto
}

._bar_1jovw_25:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-glow);
    transform: translateY(-2px)
}

._bar_1jovw_25:hover ._glowEffect_1jovw_73 {
    opacity: 1
}

._glowEffect_1jovw_73 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 212, 255, .1) 0%, transparent 50%, rgba(0, 212, 255, .05) 100%);
    opacity: 0;
    transition: opacity var(--transition-normal);
    pointer-events: none
}

._modeSection_1jovw_119 {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0
}

._modeIcon_1jovw_133 {
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--bg-primary);
    box-shadow: 0 2px 10px var(--color-primary-glow)
}

._modeInfo_1jovw_159 {
    display: flex;
    flex-direction: column;
    gap: 2px
}

._modeName_1jovw_171 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2
}

._playerCount_1jovw_185 {
    font-size: 12px;
    color: var(--color-primary);
    font-weight: 500
}

._playersSection_1jovw_199 {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color)
}

._playerSlot_1jovw_217 {
    position: relative;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    transition: all var(--transition-fast)
}

._playerSlot_1jovw_217._filled_1jovw_233:hover {
    transform: scale(1.1);
    z-index: 1
}

._playerAvatar_1jovw_243 {
    width: 100%;
    height: 100%;
    border: 2px solid var(--color-primary);
    box-shadow: 0 2px 8px #00d4ff4d
}

._emptySlot_1jovw_257 {
    width: 100%;
    height: 100%;
    background: var(--bg-tertiary);
    border: 2px dashed var(--border-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    font-size: 14px
}

._readyBadge_1jovw_283 {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 12px;
    height: 12px;
    background: var(--color-success);
    border: 2px solid var(--bg-primary);
    border-radius: 50%;
    box-shadow: 0 0 8px #00ff8880
}

._actionSection_1jovw_309 {
    flex-shrink: 0;
    min-width: 110px
}

._matchingStatus_1jovw_319 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    background: linear-gradient(135deg, #fa03, #ff6b351a);
    border: 1px solid rgba(255, 170, 0, .4);
    border-radius: 20px
}

._matchingIcon_1jovw_339 {
    color: var(--color-warning);
    font-size: 14px
}

._matchingTime_1jovw_349 {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-warning);
    font-family: var(--font-display)
}

._returnBtn_1jovw_363 {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: linear-gradient(135deg, #00d4ff33, #00a8cc1a);
    border: 1px solid rgba(0, 212, 255, .4);
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-primary);
    transition: all var(--transition-fast)
}

._bar_1jovw_25:hover ._returnBtn_1jovw_363 {
    background: linear-gradient(135deg, #00d4ff4d, #00a8cc33);
    border-color: var(--color-primary)
}

@media (max-width: 768px) {
    ._container_1jovw_3 {
        top: auto;
        bottom: 20px
    }
    ._bar_1jovw_25 {
        padding: 8px 16px;
        gap: 12px;
        min-width: auto
    }
    ._modeInfo_1jovw_159 {
        display: none
    }
    ._playersSection_1jovw_199 {
        padding: 0 8px;
        gap: 4px
    }
    ._playerSlot_1jovw_217 {
        width: 30px;
        height: 30px
    }
    ._playerAvatar_1jovw_243 {
        width: 100%;
        height: 100%
    }
    ._emptySlot_1jovw_257 {
        font-size: 12px
    }
    ._readyBadge_1jovw_283 {
        width: 10px;
        height: 10px
    }
    ._matchingTime_1jovw_349 {
        font-size: 12px
    }
    ._returnBtn_1jovw_363 span {
        display: none
    }
}

@keyframes _pulse_1jovw_1 {
    0%,
    to {
        box-shadow: 0 0 #00d4ff66
    }
    50% {
        box-shadow: 0 0 0 10px #00d4ff00
    }
}

._bar_1jovw_25._matching_1jovw_319 {
    animation: _pulse_1jovw_1 2s ease-in-out infinite
}

._contextMenu_1695b_3 {
    position: fixed;
    min-width: 160px;
    background: #141824f2;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 8px;
    padding: 6px 0;
    box-shadow: 0 8px 32px #00000080;
    z-index: 9999;
    animation: _contextMenuFadeIn_1695b_1 .15s ease-out
}

@keyframes _contextMenuFadeIn_1695b_1 {
    0% {
        opacity: 0;
        transform: scale(.95)
    }
    to {
        opacity: 1;
        transform: scale(1)
    }
}

._menuItem_1695b_53 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    font-size: 13px;
    color: var(--text-primary);
    cursor: pointer;
    transition: background-color .15s ease;
    -webkit-user-select: none;
    user-select: none
}

._menuItem_1695b_53:hover {
    background: #ffffff14
}

._menuItem_1695b_53._danger_1695b_85 {
    color: var(--color-error)
}

._menuItem_1695b_53._danger_1695b_85:hover {
    background: #ff4d4f26
}

._menuItem_1695b_53._disabled_1695b_101 {
    color: var(--text-muted);
    cursor: not-allowed;
    opacity: .5
}

._menuItem_1695b_53._disabled_1695b_101:hover {
    background: transparent
}

._menuIcon_1695b_121 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    font-size: 14px;
    color: inherit
}

._menuLabel_1695b_139 {
    flex: 1
}

._divider_1695b_147 {
    height: 1px;
    background: #ffffff14;
    margin: 6px 0
}

@keyframes marching-ants {
    0% {
        background-position: 0 0, 0 100%, 0 0, 100% 0
    }
    to {
        background-position: 20px 0, -20px 100%, 0 -20px, 100% 20px
    }
}

:root {
    --rc-drag-handle-size: 12px;
    --rc-drag-handle-mobile-size: 24px;
    --rc-drag-handle-bg-colour: rgba(0, 0, 0, .2);
    --rc-drag-bar-size: 6px;
    --rc-border-color: rgba(255, 255, 255, .7);
    --rc-focus-color: #0088ff
}

.ReactCrop {
    position: relative;
    display: inline-block;
    cursor: crosshair;
    max-width: 100%
}

.ReactCrop *,
.ReactCrop *:before,
.ReactCrop *:after {
    box-sizing: border-box
}

.ReactCrop--disabled,
.ReactCrop--locked {
    cursor: inherit
}

.ReactCrop__child-wrapper {
    overflow: hidden;
    max-height: inherit
}

.ReactCrop__child-wrapper>img,
.ReactCrop__child-wrapper>video {
    display: block;
    max-width: 100%;
    max-height: inherit
}

.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,
.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video {
    touch-action: none
}

.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection {
    touch-action: none
}

.ReactCrop__crop-mask {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    width: calc(100% + .5px);
    height: calc(100% + .5px)
}

.ReactCrop__crop-selection {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateZ(0);
    cursor: move
}

.ReactCrop--disabled .ReactCrop__crop-selection {
    cursor: inherit
}

.ReactCrop--circular-crop .ReactCrop__crop-selection {
    border-radius: 50%
}

.ReactCrop--circular-crop .ReactCrop__crop-selection:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    border: 1px solid var(--rc-border-color);
    opacity: .3
}

.ReactCrop--no-animate .ReactCrop__crop-selection {
    outline: 1px dashed white
}

.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection) {
    animation: marching-ants 1s;
    background-image: linear-gradient(to right, #fff 50%, #444 50%), linear-gradient(to right, #fff 50%, #444 50%), linear-gradient(to bottom, #fff 50%, #444 50%), linear-gradient(to bottom, #fff 50%, #444 50%);
    background-size: 10px 1px, 10px 1px, 1px 10px, 1px 10px;
    background-position: 0 0, 0 100%, 0 0, 100% 0;
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    color: #fff;
    animation-play-state: running;
    animation-timing-function: linear;
    animation-iteration-count: infinite
}

.ReactCrop__crop-selection:focus {
    outline: 2px solid var(--rc-focus-color);
    outline-offset: -1px
}

.ReactCrop--invisible-crop .ReactCrop__crop-mask,
.ReactCrop--invisible-crop .ReactCrop__crop-selection {
    display: none
}

.ReactCrop__rule-of-thirds-vt:before,
.ReactCrop__rule-of-thirds-vt:after,
.ReactCrop__rule-of-thirds-hz:before,
.ReactCrop__rule-of-thirds-hz:after {
    content: "";
    display: block;
    position: absolute;
    background-color: #fff6
}

.ReactCrop__rule-of-thirds-vt:before,
.ReactCrop__rule-of-thirds-vt:after {
    width: 1px;
    height: 100%
}

.ReactCrop__rule-of-thirds-vt:before {
    left: 33.3333333333%
}

.ReactCrop__rule-of-thirds-vt:after {
    left: 66.6666666667%
}

.ReactCrop__rule-of-thirds-hz:before,
.ReactCrop__rule-of-thirds-hz:after {
    width: 100%;
    height: 1px
}

.ReactCrop__rule-of-thirds-hz:before {
    top: 33.3333333333%
}

.ReactCrop__rule-of-thirds-hz:after {
    top: 66.6666666667%
}

.ReactCrop__drag-handle {
    position: absolute;
    width: var(--rc-drag-handle-size);
    height: var(--rc-drag-handle-size);
    background-color: var(--rc-drag-handle-bg-colour);
    border: 1px solid var(--rc-border-color)
}

.ReactCrop__drag-handle:focus {
    background: var(--rc-focus-color)
}

.ReactCrop .ord-nw {
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    cursor: nw-resize
}

.ReactCrop .ord-n {
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: n-resize
}

.ReactCrop .ord-ne {
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    cursor: ne-resize
}

.ReactCrop .ord-e {
    top: 50%;
    right: 0;
    transform: translate(50%, -50%);
    cursor: e-resize
}

.ReactCrop .ord-se {
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
    cursor: se-resize
}

.ReactCrop .ord-s {
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 50%);
    cursor: s-resize
}

.ReactCrop .ord-sw {
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%);
    cursor: sw-resize
}

.ReactCrop .ord-w {
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    cursor: w-resize
}

.ReactCrop__disabled .ReactCrop__drag-handle {
    cursor: inherit
}

.ReactCrop__drag-bar {
    position: absolute
}

.ReactCrop__drag-bar.ord-n {
    top: 0;
    left: 0;
    width: 100%;
    height: var(--rc-drag-bar-size);
    transform: translateY(-50%)
}

.ReactCrop__drag-bar.ord-e {
    right: 0;
    top: 0;
    width: var(--rc-drag-bar-size);
    height: 100%;
    transform: translate(50%)
}

.ReactCrop__drag-bar.ord-s {
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--rc-drag-bar-size);
    transform: translateY(50%)
}

.ReactCrop__drag-bar.ord-w {
    top: 0;
    left: 0;
    width: var(--rc-drag-bar-size);
    height: 100%;
    transform: translate(-50%)
}

.ReactCrop--new-crop .ReactCrop__drag-bar,
.ReactCrop--new-crop .ReactCrop__drag-handle,
.ReactCrop--fixed-aspect .ReactCrop__drag-bar,
.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,
.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,
.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,
.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w {
    display: none
}

@media (pointer: coarse) {
    .ReactCrop .ord-n,
    .ReactCrop .ord-e,
    .ReactCrop .ord-s,
    .ReactCrop .ord-w {
        display: none
    }
    .ReactCrop__drag-handle {
        width: var(--rc-drag-handle-mobile-size);
        height: var(--rc-drag-handle-mobile-size)
    }
}

._modal_7cnhy_1 .ant-modal-content {
    background: var(--bg-card) !important
}

._cropperContainer_7cnhy_9 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 300px;
    background: #0003;
    border-radius: var(--border-radius);
    overflow: hidden;
    margin-bottom: 16px
}

._cropper_7cnhy_9 {
    max-width: 100%
}

._cropper_7cnhy_9 .ReactCrop__crop-selection {
    border: 2px solid var(--color-primary);
    box-shadow: 0 0 0 9999px #00000080
}

._controls_7cnhy_49 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    background: var(--bg-glass-light);
    border-radius: var(--border-radius-sm)
}

._controlItem_7cnhy_69 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    color: var(--text-secondary)
}

._slider_7cnhy_85 {
    flex: 1;
    margin: 0 8px
}

._slider_7cnhy_85 .ant-slider-track {
    background: var(--color-primary)
}

._slider_7cnhy_85 .ant-slider-handle:after {
    box-shadow: 0 0 0 2px var(--color-primary)
}

._nameInputContainer_7cnhy_113 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding: 12px 16px;
    background: var(--bg-glass-light);
    border-radius: var(--border-radius-sm)
}

._nameLabel_7cnhy_133 {
    color: var(--text-secondary);
    font-size: 14px;
    white-space: nowrap
}

._nameInput_7cnhy_113 {
    flex: 1;
    background: #ffffff0d !important;
    border-color: #ffffff26 !important;
    color: var(--text-primary) !important
}

._nameInput_7cnhy_113::placeholder {
    color: var(--text-muted) !important
}

._panelContainer_mvhmg_3 {
    position: fixed;
    right: 0;
    top: var(--header-height);
    bottom: 0;
    width: 320px;
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-left: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    z-index: 150;
    transform: translate(100%);
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
    box-shadow: -4px 0 20px #0000004d
}

._panelContainer_mvhmg_3._visible_mvhmg_39 {
    transform: translate(0)
}

._toggleBtn_mvhmg_49 {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 80px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid var(--border-color);
    border-right: none;
    border-radius: 8px 0 0 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    color: var(--text-secondary);
    transition: all .3s cubic-bezier(.34, 1.56, .64, 1);
    z-index: 151
}

._toggleBtn_mvhmg_49:hover {
    background: #00d4ff1a;
    color: var(--color-primary);
    border-color: var(--color-primary)
}

._toggleBtn_mvhmg_49._panelOpen_mvhmg_107 {
    right: 320px
}

._toggleIcon_mvhmg_115 {
    font-size: 14px
}

._unreadBadge_mvhmg_123 {
    position: absolute;
    top: 8px;
    right: 4px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    background: var(--color-danger);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: _pulse_mvhmg_1 2s infinite
}

@keyframes _pulse_mvhmg_1 {
    0%,
    to {
        transform: scale(1)
    }
    50% {
        transform: scale(1.1)
    }
}

._panelHeader_mvhmg_179 {
    padding: 16px;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0
}

._panelTabs_mvhmg_191 {
    display: flex;
    gap: 8px
}

._tabBtn_mvhmg_201 {
    flex: 1;
    padding: 10px 12px;
    background: transparent;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    color: var(--text-secondary);
    font-size: 13px;
    cursor: pointer;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

._tabBtn_mvhmg_201:hover {
    border-color: var(--color-primary);
    color: var(--color-primary)
}

._tabBtn_mvhmg_201._active_mvhmg_243 {
    background: linear-gradient(135deg, #00d4ff26, #00d4ff0d);
    border-color: var(--color-primary);
    color: var(--color-primary)
}

._tabBadge_mvhmg_255 {
    font-size: 12px;
    color: var(--text-muted)
}

._actionBar_mvhmg_267 {
    padding: 12px 16px;
    display: flex;
    gap: 8px;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0
}

._searchInput_mvhmg_283 {
    flex: 1
}

._addBtn_mvhmg_291 {
    flex-shrink: 0
}

._listContainer_mvhmg_301 {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

._scrollList_mvhmg_317 {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .1) transparent
}

._scrollList_mvhmg_317::-webkit-scrollbar {
    width: 6px
}

._scrollList_mvhmg_317::-webkit-scrollbar-track {
    background: transparent
}

._scrollList_mvhmg_317::-webkit-scrollbar-thumb {
    background: #ffffff1a;
    border-radius: 3px
}

._scrollList_mvhmg_317::-webkit-scrollbar-thumb:hover {
    background: #fff3
}

._friendItem_mvhmg_371 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background var(--transition-fast);
    position: relative
}

._friendItem_mvhmg_371:hover {
    background: #00d4ff0d
}

._friendItem_mvhmg_371._offline_mvhmg_399 {
    opacity: .6
}

._avatarWrapper_mvhmg_407 {
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
    transition: transform var(--transition-fast)
}

._avatarWrapper_mvhmg_407:hover {
    transform: scale(1.05)
}

._onlineIndicator_mvhmg_429 {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--bg-secondary)
}

._onlineIndicator_mvhmg_429._online_mvhmg_429 {
    background: var(--color-success)
}

._onlineIndicator_mvhmg_429._offline_mvhmg_399 {
    background: var(--text-muted)
}

._onlineIndicator_mvhmg_429._inRoom_mvhmg_465 {
    background: var(--color-warning)
}

._onlineIndicator_mvhmg_429._inGame_mvhmg_473 {
    background: var(--color-primary)
}

._friendInfo_mvhmg_481 {
    flex: 1;
    min-width: 0;
    overflow: hidden
}

._friendName_mvhmg_493 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
    gap: 6px
}

._friendStatus_mvhmg_517 {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._friendStatus_mvhmg_517._idle_mvhmg_535 {
    color: var(--color-success)
}

._friendStatus_mvhmg_517._inRoom_mvhmg_465 {
    color: var(--color-warning)
}

._friendStatus_mvhmg_517._inGame_mvhmg_473 {
    color: var(--color-primary)
}

._rankIcon_mvhmg_559 {
    width: 20px;
    height: 20px
}

._friendActions_mvhmg_569 {
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity var(--transition-fast);
    flex-shrink: 0
}

._friendItem_mvhmg_371:hover ._friendActions_mvhmg_569 {
    opacity: 1
}

._unreadDot_mvhmg_593 {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: var(--color-danger);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center
}

._friendItem_mvhmg_371:hover ._unreadDot_mvhmg_593 {
    display: none
}

._emptyState_mvhmg_639 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    color: var(--text-muted);
    flex: 1
}

._emptyIcon_mvhmg_659 {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: .5
}

._emptyText_mvhmg_671 {
    font-size: 14px;
    text-align: center
}

._requestSection_mvhmg_683 {
    border-bottom: 1px solid var(--border-color);
    padding: 12px 16px;
    background: #ffaa000d;
    flex-shrink: 0
}

._requestHeader_mvhmg_697 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer
}

._requestTitle_mvhmg_711 {
    font-size: 13px;
    color: var(--color-warning);
    display: flex;
    align-items: center;
    gap: 6px
}

._requestList_mvhmg_727 {
    margin-top: 12px
}

._requestItem_mvhmg_735 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0
}

._requestInfo_mvhmg_749 {
    flex: 1;
    min-width: 0
}

._requestName_mvhmg_759 {
    font-size: 13px;
    color: var(--text-primary)
}

._requestActions_mvhmg_769 {
    display: flex;
    gap: 6px
}

._loading_mvhmg_781 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: var(--text-muted);
    flex: 1
}

._groupTitle_mvhmg_801 {
    padding: 8px 16px 4px;
    font-size: 12px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .5px;
    position: sticky;
    top: 0;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 1
}

._inviteModal_mvhmg_829 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #0009;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px)
}

._inviteContent_mvhmg_851 {
    width: 400px;
    max-height: 80vh;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column
}

._inviteHeader_mvhmg_873 {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between
}

._inviteTitle_mvhmg_889 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary)
}

._inviteCloseBtn_mvhmg_901 {
    background: transparent;
    border: none;
    color: var(--text-muted);
    font-size: 18px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color var(--transition-fast)
}

._inviteCloseBtn_mvhmg_901:hover {
    color: var(--text-primary)
}

._inviteTabs_mvhmg_935 {
    display: flex;
    border-bottom: 1px solid var(--border-color)
}

._inviteTab_mvhmg_935 {
    flex: 1;
    padding: 12px;
    background: transparent;
    border: none;
    color: var(--text-secondary);
    font-size: 14px;
    cursor: pointer;
    transition: all var(--transition-fast);
    border-bottom: 2px solid transparent
}

._inviteTab_mvhmg_935:hover {
    color: var(--color-primary)
}

._inviteTab_mvhmg_935._active_mvhmg_243 {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary)
}

._inviteList_mvhmg_987 {
    flex: 1;
    overflow-y: auto;
    max-height: 400px
}

._inviteItem_mvhmg_999 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    cursor: pointer;
    transition: background var(--transition-fast)
}

._inviteItem_mvhmg_999:hover {
    background: #00d4ff0d
}

._inviteItem_mvhmg_999._disabled_mvhmg_1025 {
    opacity: .5;
    cursor: not-allowed
}

._inviteItemInfo_mvhmg_1035 {
    flex: 1;
    min-width: 0
}

._inviteItemName_mvhmg_1045 {
    font-size: 14px;
    color: var(--text-primary)
}

._inviteItemStatus_mvhmg_1055 {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px
}

._inviteBtn_mvhmg_1067 {
    flex-shrink: 0
}

._chatWrapper_19859_3 {
    position: fixed;
    z-index: 200;
    will-change: transform;
    transform: translateZ(0);
    transition: height .2s ease, width .2s ease
}

._chatWrapper_19859_3._noTransition_19859_23,
._chatWrapper_19859_3._noTransition_19859_23 ._chatContainer_19859_25 {
    transition: none !important
}

._chatContainer_19859_25 {
    width: 100%;
    height: 100%;
    background: #0f121ceb;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px #00000080;
    overflow: hidden;
    contain: layout style paint
}

._resizeHandle_19859_75 {
    position: absolute;
    z-index: 10;
    background: transparent
}

._resizeN_19859_91 {
    top: -5px;
    left: 12px;
    right: 12px;
    height: 10px;
    cursor: n-resize
}

._resizeS_19859_109 {
    bottom: -5px;
    left: 12px;
    right: 12px;
    height: 10px;
    cursor: s-resize
}

._resizeW_19859_127 {
    left: -5px;
    top: 12px;
    bottom: 12px;
    width: 10px;
    cursor: w-resize
}

._resizeE_19859_145 {
    right: -5px;
    top: 12px;
    bottom: 12px;
    width: 10px;
    cursor: e-resize
}

._resizeNW_19859_163 {
    top: -5px;
    left: -5px;
    width: 16px;
    height: 16px;
    cursor: nw-resize
}

._resizeNE_19859_179 {
    top: -5px;
    right: -5px;
    width: 16px;
    height: 16px;
    cursor: ne-resize
}

._resizeSW_19859_195 {
    bottom: -5px;
    left: -5px;
    width: 16px;
    height: 16px;
    cursor: sw-resize
}

._resizeSE_19859_211 {
    bottom: -5px;
    right: -5px;
    width: 16px;
    height: 16px;
    cursor: se-resize
}

._chatHeader_19859_229 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: linear-gradient(135deg, #00d4ff1f, #00d4ff05);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    -webkit-user-select: none;
    user-select: none;
    flex-shrink: 0;
    border-radius: 12px 12px 0 0
}

._chatAvatar_19859_253 {
    position: relative;
    flex-shrink: 0
}

._onlineIndicator_19859_263 {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid rgba(15, 18, 28, .92);
    background: var(--color-success)
}

._onlineIndicator_19859_263._offline_19859_285 {
    background: var(--text-muted)
}

._chatInfo_19859_293 {
    flex: 1;
    min-width: 0;
    cursor: inherit
}

._chatName_19859_305 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._chatStatus_19859_323 {
    font-size: 12px;
    color: var(--text-muted)
}

._chatStatus_19859_323._online_19859_263 {
    color: var(--color-success)
}

._chatHeaderActions_19859_341 {
    display: flex;
    gap: 2px;
    flex-shrink: 0
}

._messageList_19859_355 {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .1) transparent
}

._messageList_19859_355::-webkit-scrollbar {
    width: 6px
}

._messageList_19859_355::-webkit-scrollbar-track {
    background: transparent
}

._messageList_19859_355::-webkit-scrollbar-thumb {
    background: #ffffff1a;
    border-radius: 3px
}

._messageList_19859_355::-webkit-scrollbar-thumb:hover {
    background: #fff3
}

._messageList_19859_355._hidden_19859_415 {
    display: none
}

._messageItem_19859_425 {
    display: flex;
    gap: 10px;
    max-width: 85%
}

._messageItem_19859_425._self_19859_437 {
    flex-direction: row-reverse;
    align-self: flex-end
}

._messageItem_19859_425._other_19859_447 {
    align-self: flex-start
}

._messageAvatar_19859_455 {
    flex-shrink: 0;
    transition: transform var(--transition-fast)
}

._messageAvatar_19859_455:hover {
    transform: scale(1.05)
}

._messageContent_19859_473 {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: 100%
}

._messageItem_19859_425._self_19859_437 ._messageContent_19859_473 {
    align-items: flex-end
}

._messageSender_19859_495 {
    font-size: 12px;
    color: var(--text-muted)
}

._messageBubble_19859_505 {
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.5;
    word-break: break-word
}

._messageItem_19859_425._self_19859_437 ._messageBubble_19859_505 {
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    color: #fff;
    border-bottom-right-radius: 4px
}

._messageItem_19859_425._other_19859_447 ._messageBubble_19859_505 {
    background: #ffffff14;
    color: var(--text-primary);
    border-bottom-left-radius: 4px
}

._messageTime_19859_545 {
    font-size: 11px;
    color: var(--text-muted)
}

._messageImages_19859_557 {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 240px
}

._messageImage_19859_557 {
    max-width: 200px;
    max-height: 200px;
    border-radius: 8px;
    cursor: pointer;
    object-fit: cover
}

._systemMessage_19859_589 {
    text-align: center;
    font-size: 12px;
    color: var(--text-muted);
    padding: 8px 0
}

._inputArea_19859_605 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid rgba(255, 255, 255, .08);
    background: #0003;
    flex-shrink: 0;
    border-radius: 0 0 12px 12px
}

._inputArea_19859_605._hidden_19859_415 {
    display: none
}

._inputField_19859_635 {
    flex: 1
}

._sendBtn_19859_643 {
    flex-shrink: 0
}

._emptyMessages_19859_653 {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    font-size: 14px
}

._emptyIcon_19859_673 {
    font-size: 48px;
    margin-bottom: 12px;
    opacity: .4
}

._loadingOverlay_19859_687 {
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translate(-50%);
    padding: 6px 16px;
    background: #000000b3;
    border-radius: 16px;
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 8px;
    z-index: 10;
    pointer-events: none
}

._loadMoreHint_19859_721 {
    text-align: center;
    padding: 8px;
    font-size: 12px;
    color: var(--color-primary);
    cursor: pointer;
    transition: opacity var(--transition-fast)
}

._loadMoreHint_19859_721:hover {
    opacity: .8
}

._noMoreHint_19859_747 {
    text-align: center;
    padding: 8px;
    font-size: 12px;
    color: var(--text-muted)
}

._typing_19859_763 {
    font-size: 12px;
    color: var(--text-muted);
    font-style: italic;
    padding: 0 16px 8px
}

._cardMessage_19859_779 {
    background: #ffffff0d;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 12px;
    cursor: pointer;
    transition: border-color var(--transition-fast)
}

._cardMessage_19859_779:hover {
    border-color: var(--color-primary)
}

._cardTitle_19859_805 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px
}

._cardDesc_19859_819 {
    font-size: 12px;
    color: var(--text-muted)
}

._replyPreview_19859_831 {
    font-size: 12px;
    color: var(--text-muted);
    padding: 6px 10px;
    background: #0003;
    border-left: 2px solid var(--color-primary);
    border-radius: 0 4px 4px 0;
    margin-bottom: 4px;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._withdrawnMessage_19859_861 {
    font-size: 13px;
    color: var(--text-muted);
    font-style: italic
}

._inviteCard_19859_875 {
    background: linear-gradient(135deg, #00d4ff1a, #00d4ff05);
    border: 1px solid rgba(0, 212, 255, .3);
    border-radius: 8px;
    padding: 12px
}

._inviteTitle_19859_889 {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px
}

._inviteInfo_19859_909 {
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 8px
}

._inviteActions_19859_921 {
    display: flex;
    gap: 8px
}

._loadMore_19859_721 {
    text-align: center;
    padding: 8px
}

._loadMoreBtn_19859_943 {
    font-size: 12px;
    color: var(--color-primary);
    cursor: pointer
}

._loadMoreBtn_19859_943:hover {
    text-decoration: underline
}

._loadingMore_19859_963 {
    text-align: center;
    padding: 12px;
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

._dragHandle_19859_987 {
    display: none
}

._titlebar_1mueg_3 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--electron-titlebar-height, 36px);
    background: linear-gradient(180deg, #111820fa, #0a0e14f2);
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 99999;
    -webkit-app-region: drag;
    -webkit-user-select: none;
    user-select: none;
    border-bottom: 1px solid rgba(0, 212, 255, .15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px)
}

._left_1mueg_39 {
    display: flex;
    align-items: center;
    padding-left: 12px;
    gap: 10px
}

._logo_1mueg_53 {
    width: 20px;
    height: 20px;
    background: linear-gradient(135deg, #00d4ff, #00a8cc);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
    color: #0a0e14;
    font-family: var(--font-display)
}

._title_1mueg_3 {
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 600;
    color: #e8edf5;
    letter-spacing: 1px
}

._version_1mueg_97 {
    font-size: 10px;
    color: #5a6a80;
    background: #00d4ff1a;
    padding: 2px 6px;
    border-radius: 4px
}

._navButtons_1mueg_113 {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: 12px;
    -webkit-app-region: no-drag
}

._navBtn_1mueg_129 {
    width: 28px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: #6482aa1a;
    color: #8b9cb5;
    cursor: pointer;
    transition: all .2s ease;
    border-radius: 4px
}

._navBtn_1mueg_129:hover {
    background: #6482aa40;
    color: #e8edf5
}

._navBtn_1mueg_129:active {
    background: #6482aa59
}

._controls_1mueg_175 {
    display: flex;
    -webkit-app-region: no-drag
}

._btn_1mueg_185 {
    width: 46px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: #8b9cb5;
    cursor: pointer;
    transition: all .2s ease
}

._btn_1mueg_185:hover {
    background: #6482aa33;
    color: #e8edf5
}

._closeBtn_1mueg_221:hover {
    background: #ff4757 !important;
    color: #fff !important
}

._modalWrap_1862z_1 {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

._modal_1862z_1 .ant-modal-content {
    background: linear-gradient(180deg, #0f1423fa, #0a0f19fa) !important;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg) !important;
    overflow: hidden
}

._modal_1862z_1 .ant-modal-body {
    padding: 0
}

._container_1862z_31 {
    padding: 28px 24px
}

._header_1862z_41 {
    text-align: center;
    margin-bottom: 20px
}

._iconWrapper_1862z_51 {
    width: 56px;
    height: 56px;
    margin: 0 auto 12px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px var(--color-primary-glow)
}

._icon_1862z_51 {
    font-size: 28px
}

._title_1862z_83 {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px
}

._subtitle_1862z_99 {
    display: inline-block;
    font-size: 12px;
    color: var(--color-primary);
    padding: 4px 12px;
    background: #00d4ff1a;
    border: 1px solid rgba(0, 212, 255, .2);
    border-radius: 20px
}

._mapSection_1862z_121 {
    margin-bottom: 20px
}

._mapImage_1862z_129 {
    width: 100%;
    height: 120px;
    background-size: cover;
    background-position: center;
    border-radius: var(--border-radius);
    position: relative;
    overflow: hidden;
    border: 1px solid var(--border-color)
}

._mapOverlay_1862z_151 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(to bottom, #0a0e141a, #0a0e14cc)
}

._mapInfo_1862z_171 {
    position: absolute;
    bottom: 12px;
    left: 14px;
    display: flex;
    align-items: center;
    gap: 8px
}

._mapIcon_1862z_189 {
    color: var(--color-primary);
    font-size: 14px
}

._mapName_1862z_199 {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    text-shadow: 0 2px 8px rgba(0, 0, 0, .8)
}

._readySection_1862z_217 {
    background: #0a0f1999;
    border-radius: var(--border-radius);
    padding: 16px;
    margin-bottom: 20px;
    border: 1px solid var(--border-color)
}

._readyHeader_1862z_233 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 14px
}

._readyHeader_1862z_233 .anticon {
    color: var(--color-primary)
}

._readyCount_1862z_259 {
    margin-left: auto;
    color: var(--text-muted)
}

._readyNumber_1862z_269 {
    color: var(--color-success);
    font-weight: 600;
    font-family: var(--font-display)
}

._readyGrid_1862z_281 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px
}

._readyGrid_1862z_281:has(._readySlot1v1_1862z_295) {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px
}

._readySlot_1862z_295 {
    aspect-ratio: 1;
    background: #0a0f19cc;
    border-radius: var(--border-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 2px solid var(--border-color);
    transition: all .2s ease
}

._readySlot_1862z_295._ready_1862z_217 {
    background: #00ff881a;
    border-color: var(--color-success)
}

._readySlot_1862z_295._me_1862z_339 {
    border-color: var(--color-primary);
    box-shadow: 0 0 8px var(--color-primary-glow)
}

._readySlot_1862z_295._me_1862z_339._ready_1862z_217 {
    border-color: var(--color-success);
    box-shadow: 0 0 8px #00ff884d
}

._readySlot1v1_1862z_295 {
    aspect-ratio: auto;
    height: 80px;
    flex-direction: column;
    gap: 8px
}

._playerLabel_1862z_375 {
    font-size: 11px;
    color: var(--text-muted);
    margin-top: 4px
}

._readyIcon_1862z_387 {
    font-size: 20px;
    color: var(--color-success)
}

._waitingDot_1862z_397 {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--text-muted);
    animation: _pulse_1862z_1 1.5s ease-in-out infinite
}

@keyframes _pulse_1862z_1 {
    0%,
    to {
        opacity: .4
    }
    50% {
        opacity: 1
    }
}

._meTag_1862z_423 {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translate(-50%);
    font-size: 10px;
    font-weight: 600;
    color: var(--color-primary);
    background: #00d4ff26;
    padding: 1px 6px;
    border-radius: 8px;
    border: 1px solid rgba(0, 212, 255, .3)
}

._countdownSection_1862z_453 {
    margin-bottom: 20px
}

._progressTrack_1862z_461 {
    height: 6px;
    background: #6482aa26;
    border-radius: 3px;
    overflow: hidden
}

._progressBar_1862z_475 {
    height: 100%;
    background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    border-radius: 3px;
    transition: width 1s linear
}

._progressBar_1862z_475._urgent_1862z_489 {
    background: linear-gradient(90deg, var(--color-danger) 0%, #ff6b6b 100%)
}

._countdownText_1862z_497 {
    text-align: center;
    font-size: 13px;
    color: var(--text-secondary);
    margin-top: 10px
}

._countdownText_1862z_497 span {
    font-weight: 600;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._urgentText_1862z_523 {
    color: var(--color-danger) !important;
    animation: _blink_1862z_1 .5s ease-in-out infinite
}

@keyframes _blink_1862z_1 {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}

._timeoutText_1862z_543 {
    color: var(--color-danger);
    font-weight: 600
}

._actionSection_1862z_555 {
    margin-bottom: 16px
}

._confirmBtn_1862z_563 {
    width: 100%;
    height: 48px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border: none;
    box-shadow: 0 4px 20px var(--color-primary-glow);
    transition: all .2s ease
}

._confirmBtn_1862z_563:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px var(--color-primary-glow)
}

._confirmBtn_1862z_563:disabled {
    opacity: .7
}

._readyBtn_1862z_605 {
    width: 100%;
    height: 48px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    background: #00ff881a !important;
    border: 1px solid var(--color-success) !important;
    color: var(--color-success) !important
}

._readyBtn_1862z_605:disabled {
    opacity: .9
}

._timeoutBtn_1862z_635 {
    width: 100%;
    height: 48px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    background: #ff47571a !important;
    border: 1px solid var(--color-danger) !important;
    color: var(--color-danger) !important
}

._tips_1862z_659 {
    text-align: center
}

._tips_1862z_659 p {
    margin: 0;
    font-size: 12px;
    color: var(--text-muted)
}

@media (max-width: 480px) {
    ._container_1862z_31 {
        padding: 20px 16px
    }
    ._iconWrapper_1862z_51 {
        width: 48px;
        height: 48px
    }
    ._icon_1862z_51 {
        font-size: 24px
    }
    ._title_1862z_83 {
        font-size: 18px
    }
    ._mapImage_1862z_129 {
        height: 100px
    }
    ._readyGrid_1862z_281 {
        gap: 6px
    }
    ._confirmBtn_1862z_563,
    ._readyBtn_1862z_605,
    ._timeoutBtn_1862z_635 {
        height: 44px;
        font-size: 14px
    }
}

._layout_15a2m_1 {
    height: 100vh;
    display: flex;
    overflow: hidden
}

._main_15a2m_13 {
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 100vh;
    transition: margin-left var(--transition-normal), margin-right var(--transition-normal)
}

._content_15a2m_29 {
    flex: 1;
    padding: 24px;
    margin-top: calc(var(--header-height) + var(--electron-titlebar-height, 0px));
    height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px));
    overflow-y: auto;
    overflow-x: hidden;
    box-sizing: border-box
}

._page_6ud1d_1 {
    padding: 24px;
    min-height: 100%
}

._header_6ud1d_13 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px
}

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

._headerIcon_6ud1d_43 {
    font-size: 28px;
    color: var(--color-primary)
}

._title_6ud1d_53 {
    font-size: 24px;
    font-weight: 600;
    margin: 0;
    color: var(--text-primary)
}

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

._searchInput_6ud1d_79 {
    width: 240px
}

._mainContent_6ud1d_89 {
    display: flex;
    gap: 24px
}

._leftColumn_6ud1d_99 {
    flex: 1;
    min-width: 0
}

._rightColumn_6ud1d_109 {
    width: 320px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 16px
}

._loading_6ud1d_127 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 16px;
    color: var(--text-secondary)
}

._postGrid_6ud1d_149 {
    display: flex;
    flex-direction: column;
    gap: 12px
}

._postCard_6ud1d_163 {
    background: var(--bg-secondary);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    gap: 16px;
    cursor: pointer;
    transition: all .2s ease;
    border: 1px solid var(--border-color)
}

._postCard_6ud1d_163:hover {
    transform: translateY(-2px);
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #00000026
}

._postCard_6ud1d_163._pinned_6ud1d_197 {
    background: linear-gradient(135deg, rgba(255, 107, 0, .05) 0%, var(--bg-secondary) 100%);
    border-color: #ff6b004d
}

._postAvatar_6ud1d_209 {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--bg-tertiary)
}

._postAvatar_6ud1d_209 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._postInfo_6ud1d_241 {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px
}

._postHeader_6ud1d_257 {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

._pinnedTag_6ud1d_271 {
    font-size: 11px;
    margin: 0
}

._postTitle_6ud1d_281 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._postPreview_6ud1d_299 {
    font-size: 13px;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

._postMeta_6ud1d_321 {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    color: var(--text-tertiary);
    flex-wrap: wrap
}

._author_6ud1d_339 {
    color: var(--color-primary);
    font-weight: 500
}

._metaItem_6ud1d_349 {
    display: flex;
    align-items: center;
    gap: 4px
}

._postThumbnail_6ud1d_363 {
    flex-shrink: 0;
    width: 100px;
    height: 70px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg-tertiary)
}

._postThumbnail_6ud1d_363 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._pagination_6ud1d_395 {
    margin-top: 32px;
    display: flex;
    justify-content: center
}

._announcementCard_6ud1d_409 {
    background: var(--bg-secondary);
    border-color: var(--border-color)
}

._announcementCard_6ud1d_409 .ant-card-head {
    background: linear-gradient(135deg, rgba(255, 107, 0, .1) 0%, transparent 100%);
    border-color: var(--border-color);
    color: var(--color-primary);
    font-weight: 600
}

._announcementCard_6ud1d_409 .ant-card-body {
    padding: 16px
}

._announcementContent_6ud1d_441 {
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.6
}

._announcementContent_6ud1d_441 p {
    margin: 0 0 8px
}

._announcementContent_6ud1d_441 p:last-child {
    margin-bottom: 0
}

._announcementContent_6ud1d_441 a {
    color: var(--color-primary)
}

._eventsCard_6ud1d_479 {
    background: var(--bg-secondary);
    border-color: var(--border-color)
}

._eventsCard_6ud1d_479 .ant-card-head {
    background: linear-gradient(135deg, rgba(0, 150, 255, .1) 0%, transparent 100%);
    border-color: var(--border-color);
    color: var(--color-primary);
    font-weight: 600
}

._eventsCard_6ud1d_479 .ant-card-body {
    padding: 12px
}

._eventsCard_6ud1d_479 .ant-tabs-nav {
    margin-bottom: 8px
}

._csIcon_6ud1d_519 {
    width: 14px;
    height: 14px;
    margin-right: 4px;
    vertical-align: middle
}

._eventList_6ud1d_535 {
    max-height: 280px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px
}

._eventList_6ud1d_535::-webkit-scrollbar {
    width: 4px
}

._eventList_6ud1d_535::-webkit-scrollbar-track {
    background: transparent
}

._eventList_6ud1d_535::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 2px
}

._eventList_6ud1d_535::-webkit-scrollbar-thumb:hover {
    background: var(--text-tertiary)
}

._eventEmpty_6ud1d_585 {
    text-align: center;
    color: var(--text-tertiary);
    padding: 20px;
    font-size: 13px
}

._eventItem_6ud1d_599 {
    padding: 10px 0;
    border-bottom: 1px solid var(--border-color)
}

._eventItem_6ud1d_599:last-child {
    border-bottom: none
}

._eventItem_6ud1d_599._clickable_6ud1d_617 {
    cursor: pointer;
    transition: background .2s;
    margin: 0 -8px;
    padding: 10px 8px;
    border-radius: 6px
}

._eventItem_6ud1d_599._clickable_6ud1d_617:hover {
    background: var(--bg-tertiary)
}

._eventHeader_6ud1d_641 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px
}

._eventTime_6ud1d_655 {
    font-size: 12px;
    color: var(--text-tertiary);
    margin-left: auto
}

._linkIcon_6ud1d_667 {
    color: var(--text-tertiary);
    font-size: 12px;
    flex-shrink: 0
}

._eventTitle_6ud1d_679 {
    font-size: 13px;
    color: var(--text-primary);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._loadMore_6ud1d_699 {
    text-align: center;
    padding: 12px 0;
    color: var(--color-primary);
    font-size: 13px;
    cursor: pointer;
    transition: opacity .2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

._loadMore_6ud1d_699:hover {
    opacity: .8
}

._eventDetailContent_6ud1d_735 {
    padding: 0
}

._eventDetailMeta_6ud1d_743 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--border-color)
}

._eventDetailTime_6ud1d_761 {
    font-size: 13px;
    color: var(--text-tertiary)
}

._eventDetailBody_6ud1d_771 {
    font-size: 14px;
    line-height: 1.8;
    color: var(--text-primary)
}

._eventDetailBody_6ud1d_771 p {
    margin: 0 0 12px
}

._eventDetailBody_6ud1d_771 p:last-child {
    margin-bottom: 0
}

._eventDetailBody_6ud1d_771 img {
    max-width: 100%;
    border-radius: 8px;
    margin: 8px 0
}

._editor_6ud1d_813 {
    background: var(--bg-tertiary);
    border-radius: 8px
}

._editor_6ud1d_813 .ql-toolbar {
    background: var(--bg-secondary);
    border-color: var(--border-color);
    border-radius: 8px 8px 0 0
}

._editor_6ud1d_813 .ql-container {
    border-color: var(--border-color);
    border-radius: 0 0 8px 8px;
    font-size: 14px;
    min-height: 200px
}

._editor_6ud1d_813 .ql-editor {
    min-height: 200px;
    color: var(--text-primary)
}

._editor_6ud1d_813 .ql-editor.ql-blank:before {
    color: var(--text-tertiary);
    font-style: normal
}

._editor_6ud1d_813 .ql-snow .ql-stroke {
    stroke: var(--text-secondary)
}

._editor_6ud1d_813 .ql-snow .ql-fill {
    fill: var(--text-secondary)
}

._editor_6ud1d_813 .ql-snow .ql-picker {
    color: var(--text-secondary)
}

@media (max-width: 1024px) {
    ._mainContent_6ud1d_89 {
        flex-direction: column
    }
    ._rightColumn_6ud1d_109 {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap
    }
    ._announcementCard_6ud1d_409,
    ._eventsCard_6ud1d_479 {
        flex: 1;
        min-width: 280px
    }
}

@media (max-width: 768px) {
    ._page_6ud1d_1 {
        padding: 16px
    }
    ._header_6ud1d_13 {
        flex-direction: column;
        align-items: stretch
    }
    ._headerRight_6ud1d_67 {
        flex-direction: column
    }
    ._searchInput_6ud1d_79 {
        width: 100%
    }
    ._postCard_6ud1d_163 {
        flex-direction: column;
        padding: 16px
    }
    ._postAvatar_6ud1d_209 {
        width: 40px;
        height: 40px
    }
    ._postThumbnail_6ud1d_363 {
        width: 100%;
        height: 160px
    }
    ._postMeta_6ud1d_321 {
        gap: 12px
    }
    ._rightColumn_6ud1d_109 {
        flex-direction: column
    }
    ._announcementCard_6ud1d_409,
    ._eventsCard_6ud1d_479 {
        min-width: 100%
    }
}

/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */

.ql-container {
    box-sizing: border-box;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    height: 100%;
    margin: 0;
    position: relative
}

.ql-container.ql-disabled .ql-tooltip {
    visibility: hidden
}

.ql-container.ql-disabled .ql-editor ul[data-checked]>li:before {
    pointer-events: none
}

.ql-clipboard {
    left: -100000px;
    height: 1px;
    overflow-y: hidden;
    position: absolute;
    top: 50%
}

.ql-clipboard p {
    margin: 0;
    padding: 0
}

.ql-editor {
    box-sizing: border-box;
    line-height: 1.42;
    height: 100%;
    outline: none;
    overflow-y: auto;
    padding: 12px 15px;
    tab-size: 4;
    -moz-tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
    word-wrap: break-word
}

.ql-editor>* {
    cursor: text
}

.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
    margin: 0;
    padding: 0;
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol,
.ql-editor ul {
    padding-left: 1.5em
}

.ql-editor ol>li,
.ql-editor ul>li {
    list-style-type: none
}

.ql-editor ul>li:before {
    content: "•"
}

.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
    pointer-events: none
}

.ql-editor ul[data-checked=true]>li *,
.ql-editor ul[data-checked=false]>li * {
    pointer-events: all
}

.ql-editor ul[data-checked=true]>li:before,
.ql-editor ul[data-checked=false]>li:before {
    color: #777;
    cursor: pointer;
    pointer-events: all
}

.ql-editor ul[data-checked=true]>li:before {
    content: "☑"
}

.ql-editor ul[data-checked=false]>li:before {
    content: "☐"
}

.ql-editor li:before {
    display: inline-block;
    white-space: nowrap;
    width: 1.2em
}

.ql-editor li:not(.ql-direction-rtl):before {
    margin-left: -1.5em;
    margin-right: .3em;
    text-align: right
}

.ql-editor li.ql-direction-rtl:before {
    margin-left: .3em;
    margin-right: -1.5em
}

.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
    padding-left: 1.5em
}

.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
    padding-right: 1.5em
}

.ql-editor ol li {
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    counter-increment: list-0
}

.ql-editor ol li:before {
    content: counter(list-0, decimal) ". "
}

.ql-editor ol li.ql-indent-1 {
    counter-increment: list-1
}

.ql-editor ol li.ql-indent-1:before {
    content: counter(list-1, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-1 {
    counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-2 {
    counter-increment: list-2
}

.ql-editor ol li.ql-indent-2:before {
    content: counter(list-2, lower-roman) ". "
}

.ql-editor ol li.ql-indent-2 {
    counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-3 {
    counter-increment: list-3
}

.ql-editor ol li.ql-indent-3:before {
    content: counter(list-3, decimal) ". "
}

.ql-editor ol li.ql-indent-3 {
    counter-reset: list-4 list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-4 {
    counter-increment: list-4
}

.ql-editor ol li.ql-indent-4:before {
    content: counter(list-4, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-4 {
    counter-reset: list-5 list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-5 {
    counter-increment: list-5
}

.ql-editor ol li.ql-indent-5:before {
    content: counter(list-5, lower-roman) ". "
}

.ql-editor ol li.ql-indent-5 {
    counter-reset: list-6 list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-6 {
    counter-increment: list-6
}

.ql-editor ol li.ql-indent-6:before {
    content: counter(list-6, decimal) ". "
}

.ql-editor ol li.ql-indent-6 {
    counter-reset: list-7 list-8 list-9
}

.ql-editor ol li.ql-indent-7 {
    counter-increment: list-7
}

.ql-editor ol li.ql-indent-7:before {
    content: counter(list-7, lower-alpha) ". "
}

.ql-editor ol li.ql-indent-7 {
    counter-reset: list-8 list-9
}

.ql-editor ol li.ql-indent-8 {
    counter-increment: list-8
}

.ql-editor ol li.ql-indent-8:before {
    content: counter(list-8, lower-roman) ". "
}

.ql-editor ol li.ql-indent-8 {
    counter-reset: list-9
}

.ql-editor ol li.ql-indent-9 {
    counter-increment: list-9
}

.ql-editor ol li.ql-indent-9:before {
    content: counter(list-9, decimal) ". "
}

.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 3em
}

.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 4.5em
}

.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 3em
}

.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 4.5em
}

.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 6em
}

.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 7.5em
}

.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 6em
}

.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 7.5em
}

.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 9em
}

.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 10.5em
}

.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 9em
}

.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 10.5em
}

.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 12em
}

.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 13.5em
}

.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 12em
}

.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 13.5em
}

.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 15em
}

.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 16.5em
}

.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 15em
}

.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 16.5em
}

.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 18em
}

.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 19.5em
}

.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 18em
}

.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 19.5em
}

.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 21em
}

.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 22.5em
}

.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 21em
}

.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 22.5em
}

.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 24em
}

.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 25.5em
}

.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 24em
}

.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 25.5em
}

.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 27em
}

.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 28.5em
}

.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 27em
}

.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 28.5em
}

.ql-editor .ql-video {
    display: block;
    max-width: 100%
}

.ql-editor .ql-video.ql-align-center {
    margin: 0 auto
}

.ql-editor .ql-video.ql-align-right {
    margin: 0 0 0 auto
}

.ql-editor .ql-bg-black {
    background-color: #000
}

.ql-editor .ql-bg-red {
    background-color: #e60000
}

.ql-editor .ql-bg-orange {
    background-color: #f90
}

.ql-editor .ql-bg-yellow {
    background-color: #ff0
}

.ql-editor .ql-bg-green {
    background-color: #008a00
}

.ql-editor .ql-bg-blue {
    background-color: #06c
}

.ql-editor .ql-bg-purple {
    background-color: #93f
}

.ql-editor .ql-color-white {
    color: #fff
}

.ql-editor .ql-color-red {
    color: #e60000
}

.ql-editor .ql-color-orange {
    color: #f90
}

.ql-editor .ql-color-yellow {
    color: #ff0
}

.ql-editor .ql-color-green {
    color: #008a00
}

.ql-editor .ql-color-blue {
    color: #06c
}

.ql-editor .ql-color-purple {
    color: #93f
}

.ql-editor .ql-font-serif {
    font-family: Georgia, Times New Roman, serif
}

.ql-editor .ql-font-monospace {
    font-family: Monaco, Courier New, monospace
}

.ql-editor .ql-size-small {
    font-size: .75em
}

.ql-editor .ql-size-large {
    font-size: 1.5em
}

.ql-editor .ql-size-huge {
    font-size: 2.5em
}

.ql-editor .ql-direction-rtl {
    direction: rtl;
    text-align: inherit
}

.ql-editor .ql-align-center {
    text-align: center
}

.ql-editor .ql-align-justify {
    text-align: justify
}

.ql-editor .ql-align-right {
    text-align: right
}

.ql-editor.ql-blank:before {
    color: #0009;
    content: attr(data-placeholder);
    font-style: italic;
    left: 15px;
    pointer-events: none;
    position: absolute;
    right: 15px
}

.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    padding: 3px 5px;
    width: 28px
}

.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
    float: left;
    height: 100%
}

.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
    outline: none
}

.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
    display: none
}

.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
    color: #06c
}

.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
    fill: #06c
}

.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #06c
}

@media (pointer: coarse) {
    .ql-snow.ql-toolbar button:hover:not(.ql-active),
    .ql-snow .ql-toolbar button:hover:not(.ql-active) {
        color: #444
    }
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: #444
    }
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: #444
    }
}

.ql-snow,
.ql-snow * {
    box-sizing: border-box
}

.ql-snow .ql-hidden {
    display: none
}

.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
    visibility: hidden
}

.ql-snow .ql-tooltip {
    position: absolute;
    transform: translateY(10px)
}

.ql-snow .ql-tooltip a {
    cursor: pointer;
    text-decoration: none
}

.ql-snow .ql-tooltip.ql-flip {
    transform: translateY(-10px)
}

.ql-snow .ql-formats {
    display: inline-block;
    vertical-align: middle
}

.ql-snow .ql-formats:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow .ql-stroke {
    fill: none;
    stroke: #444;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2
}

.ql-snow .ql-stroke-miter {
    fill: none;
    stroke: #444;
    stroke-miterlimit: 10;
    stroke-width: 2
}

.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
    fill: #444
}

.ql-snow .ql-empty {
    fill: none
}

.ql-snow .ql-even {
    fill-rule: evenodd
}

.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
    stroke-width: 1
}

.ql-snow .ql-transparent {
    opacity: .4
}

.ql-snow .ql-direction svg:last-child {
    display: none
}

.ql-snow .ql-direction.ql-active svg:last-child {
    display: inline
}

.ql-snow .ql-direction.ql-active svg:first-child {
    display: none
}

.ql-snow .ql-editor h1 {
    font-size: 2em
}

.ql-snow .ql-editor h2 {
    font-size: 1.5em
}

.ql-snow .ql-editor h3 {
    font-size: 1.17em
}

.ql-snow .ql-editor h4 {
    font-size: 1em
}

.ql-snow .ql-editor h5 {
    font-size: .83em
}

.ql-snow .ql-editor h6 {
    font-size: .67em
}

.ql-snow .ql-editor a {
    text-decoration: underline
}

.ql-snow .ql-editor blockquote {
    border-left: 4px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 16px
}

.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
    background-color: #f0f0f0;
    border-radius: 3px
}

.ql-snow .ql-editor pre {
    white-space: pre-wrap;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 10px
}

.ql-snow .ql-editor code {
    font-size: 85%;
    padding: 2px 4px
}

.ql-snow .ql-editor pre.ql-syntax {
    background-color: #23241f;
    color: #f8f8f2;
    overflow: visible
}

.ql-snow .ql-editor img {
    max-width: 100%
}

.ql-snow .ql-picker {
    color: #444;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle
}

.ql-snow .ql-picker-label {
    cursor: pointer;
    display: inline-block;
    height: 100%;
    padding-left: 8px;
    padding-right: 2px;
    position: relative;
    width: 100%
}

.ql-snow .ql-picker-label:before {
    display: inline-block;
    line-height: 22px
}

.ql-snow .ql-picker-options {
    background-color: #fff;
    display: none;
    min-width: 100%;
    padding: 4px 8px;
    position: absolute;
    white-space: nowrap
}

.ql-snow .ql-picker-options .ql-picker-item {
    cursor: pointer;
    display: block;
    padding-bottom: 5px;
    padding-top: 5px
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: #ccc;
    z-index: 2
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    display: block;
    margin-top: -1px;
    top: 100%;
    z-index: 1
}

.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
    width: 28px
}

.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
    right: 4px
}

.ql-snow .ql-icon-picker .ql-picker-options {
    padding: 4px 0
}

.ql-snow .ql-icon-picker .ql-picker-item {
    height: 24px;
    width: 24px;
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-options {
    padding: 3px 5px;
    width: 152px
}

.ql-snow .ql-color-picker .ql-picker-item {
    border: 1px solid transparent;
    float: left;
    height: 16px;
    margin: 2px;
    padding: 0;
    width: 16px
}

.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
    position: absolute;
    margin-top: -9px;
    right: 0;
    top: 50%;
    width: 18px
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before {
    content: attr(data-label)
}

.ql-snow .ql-picker.ql-header {
    width: 98px
}

.ql-snow .ql-picker.ql-header .ql-picker-label:before,
.ql-snow .ql-picker.ql-header .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    content: "Heading 1"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    content: "Heading 2"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    content: "Heading 3"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    content: "Heading 4"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    content: "Heading 5"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    content: "Heading 6"
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    font-size: 2em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    font-size: 1.5em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    font-size: 1.17em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    font-size: 1em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    font-size: .83em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    font-size: .67em
}

.ql-snow .ql-picker.ql-font {
    width: 108px
}

.ql-snow .ql-picker.ql-font .ql-picker-label:before,
.ql-snow .ql-picker.ql-font .ql-picker-item:before {
    content: "Sans Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    content: "Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    content: "Monospace"
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    font-family: Georgia, Times New Roman, serif
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    font-family: Monaco, Courier New, monospace
}

.ql-snow .ql-picker.ql-size {
    width: 98px
}

.ql-snow .ql-picker.ql-size .ql-picker-label:before,
.ql-snow .ql-picker.ql-size .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    content: "Small"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    content: "Large"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    content: "Huge"
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    font-size: 10px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    font-size: 18px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    font-size: 32px
}

.ql-snow .ql-color-picker.ql-background .ql-picker-item {
    background-color: #fff
}

.ql-snow .ql-color-picker.ql-color .ql-picker-item {
    background-color: #000
}

.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    padding: 8px
}

.ql-toolbar.ql-snow .ql-formats {
    margin-right: 15px
}

.ql-toolbar.ql-snow .ql-picker-label {
    border: 1px solid transparent
}

.ql-toolbar.ql-snow .ql-picker-options {
    border: 1px solid transparent;
    box-shadow: #0003 0 2px 8px
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: #ccc
}

.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
    border-color: #000
}

.ql-toolbar.ql-snow+.ql-container.ql-snow {
    border-top: 0px
}

.ql-snow .ql-tooltip {
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 0 5px #ddd;
    color: #444;
    padding: 5px 12px;
    white-space: nowrap
}

.ql-snow .ql-tooltip:before {
    content: "Visit URL:";
    line-height: 26px;
    margin-right: 8px
}

.ql-snow .ql-tooltip input[type=text] {
    display: none;
    border: 1px solid #ccc;
    font-size: 13px;
    height: 26px;
    margin: 0;
    padding: 3px 5px;
    width: 170px
}

.ql-snow .ql-tooltip a.ql-preview {
    display: inline-block;
    max-width: 200px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    vertical-align: top
}

.ql-snow .ql-tooltip a.ql-action:after {
    border-right: 1px solid #ccc;
    content: "Edit";
    margin-left: 16px;
    padding-right: 8px
}

.ql-snow .ql-tooltip a.ql-remove:before {
    content: "Remove";
    margin-left: 8px
}

.ql-snow .ql-tooltip a {
    line-height: 26px
}

.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
    display: none
}

.ql-snow .ql-tooltip.ql-editing input[type=text] {
    display: inline-block
}

.ql-snow .ql-tooltip.ql-editing a.ql-action:after {
    border-right: 0px;
    content: "Save";
    padding-right: 0
}

.ql-snow .ql-tooltip[data-mode=link]:before {
    content: "Enter link:"
}

.ql-snow .ql-tooltip[data-mode=formula]:before {
    content: "Enter formula:"
}

.ql-snow .ql-tooltip[data-mode=video]:before {
    content: "Enter video:"
}

.ql-snow a {
    color: #06c
}

.ql-container.ql-snow {
    border: 1px solid #ccc
}

._page_1so1m_1 {
    min-height: 100%;
    padding-bottom: 60px
}

._loadingContainer_1so1m_11 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px
}

._topBar_1so1m_27 {
    background: var(--color-bg-secondary);
    border-bottom: 1px solid var(--color-border);
    padding: 12px 24px;
    position: sticky;
    top: 0;
    z-index: 100
}

._backBtn_1so1m_45 {
    color: var(--color-text-secondary);
    font-size: 14px
}

._backBtn_1so1m_45:hover {
    color: var(--color-accent)
}

._container_1so1m_65 {
    max-width: 900px;
    margin: 0 auto;
    padding: 24px
}

._postCard_1so1m_79 {
    background: var(--color-bg-elevated);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: 32px;
    margin-bottom: 24px
}

._postHeader_1so1m_95 {
    margin-bottom: 20px
}

._postTitle_1so1m_103 {
    font-size: 26px;
    font-weight: 700;
    color: var(--color-text);
    margin: 12px 0 0;
    line-height: 1.4
}

._postMeta_1so1m_119 {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border);
    flex-wrap: wrap
}

._authorInfo_1so1m_137 {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: opacity .2s
}

._authorInfo_1so1m_137:hover {
    opacity: .8
}

._authorAvatar_1so1m_161 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--color-border)
}

._authorName_1so1m_177 {
    font-weight: 600;
    color: var(--color-accent);
    font-size: 15px
}

._metaItem_1so1m_189 {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--color-text-tertiary);
    font-size: 14px
}

._postContent_1so1m_207 {
    padding: 24px 0;
    line-height: 1.8;
    font-size: 15px;
    color: var(--color-text)
}

._postContent_1so1m_207 img {
    max-width: 100%;
    border-radius: 8px;
    margin: 12px 0
}

._postContent_1so1m_207 p {
    margin-bottom: 16px
}

._postContent_1so1m_207 h1,
._postContent_1so1m_207 h2,
._postContent_1so1m_207 h3 {
    margin-top: 24px;
    margin-bottom: 12px;
    color: var(--color-text)
}

._postContent_1so1m_207 blockquote {
    border-left: 4px solid var(--color-accent);
    margin: 16px 0;
    color: var(--color-text-secondary);
    background: var(--color-bg-secondary);
    padding: 16px;
    border-radius: 0 8px 8px 0
}

._postContent_1so1m_207 pre {
    background: var(--color-bg-secondary);
    border-radius: 8px;
    padding: 16px;
    overflow-x: auto
}

._postContent_1so1m_207 code {
    background: var(--color-bg-secondary);
    padding: 2px 6px;
    border-radius: 4px;
    font-family: Fira Code, monospace
}

._postActions_1so1m_307 {
    display: flex;
    gap: 12px;
    padding-top: 20px;
    border-top: 1px solid var(--color-border)
}

._likeBtn_1so1m_321 {
    min-width: 100px
}

._commentSection_1so1m_331 {
    background: var(--color-bg-elevated);
    border-radius: 16px;
    border: 1px solid var(--color-border);
    padding: 24px
}

._commentTitle_1so1m_345 {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 8px
}

._commentInput_1so1m_367 {
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--color-border)
}

._replyHint_1so1m_379 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--color-text-secondary)
}

._replyHint_1so1m_379 span {
    color: var(--color-accent);
    font-weight: 500
}

._inputRow_1so1m_407 {
    display: flex;
    gap: 12px;
    align-items: flex-end
}

._inputRow_1so1m_407 .ant-input-textarea {
    flex: 1
}

._inputRow_1so1m_407 .ant-input-textarea textarea {
    background: var(--color-bg-secondary);
    border-color: var(--color-border);
    resize: none
}

._commentList_1so1m_441 {
    min-height: 100px
}

._emptyComments_1so1m_449 {
    padding: 40px 0
}

._commentItem_1so1m_459 {
    display: flex;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border)
}

._commentItem_1so1m_459:last-child {
    border-bottom: none
}

._commentItem_1so1m_459._reply_1so1m_379 {
    margin-left: 48px;
    padding: 12px 0;
    border-bottom: none
}

._commentItem_1so1m_459._reply_1so1m_379 ._commentAvatar_1so1m_493 img {
    width: 32px;
    height: 32px
}

._commentAvatar_1so1m_493 img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    cursor: pointer;
    transition: opacity .2s
}

._commentAvatar_1so1m_493 img:hover {
    opacity: .8
}

._commentContent_1so1m_529 {
    flex: 1;
    min-width: 0
}

._commentHeader_1so1m_539 {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 6px
}

._commentAuthor_1so1m_555 {
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer
}

._commentAuthor_1so1m_555:hover {
    color: var(--color-accent)
}

._replyTo_1so1m_575 {
    font-size: 13px;
    color: var(--color-text-tertiary)
}

._replyTarget_1so1m_585 {
    color: var(--color-accent)
}

._commentTime_1so1m_593 {
    font-size: 12px;
    color: var(--color-text-tertiary)
}

._commentText_1so1m_603 {
    color: var(--color-text);
    line-height: 1.6;
    font-size: 14px;
    word-break: break-word
}

._commentText_1so1m_603 p {
    margin: 0
}

._commentActions_1so1m_625 {
    display: flex;
    gap: 16px;
    margin-top: 8px
}

._actionBtn_1so1m_637 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: var(--color-text-tertiary);
    cursor: pointer;
    transition: color .2s
}

._actionBtn_1so1m_637:hover {
    color: var(--color-text-secondary)
}

._actionBtn_1so1m_637._liked_1so1m_665 {
    color: var(--color-accent)
}

._replies_1so1m_675 {
    margin-top: 12px;
    padding-left: 12px;
    border-left: 2px solid var(--color-border)
}

@media (max-width: 768px) {
    ._container_1so1m_65 {
        padding: 16px
    }
    ._postCard_1so1m_79 {
        padding: 20px;
        border-radius: 12px
    }
    ._postTitle_1so1m_103 {
        font-size: 20px
    }
    ._postMeta_1so1m_119 {
        gap: 12px
    }
    ._commentItem_1so1m_459._reply_1so1m_379 {
        margin-left: 24px
    }
    ._inputRow_1so1m_407 {
        flex-direction: column
    }
    ._inputRow_1so1m_407 button {
        width: 100%
    }
}

._page_dljfg_1 {
    padding: 24px
}

._header_dljfg_9 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px
}

._title_dljfg_27 {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px
}

._title_dljfg_27 .anticon {
    color: var(--primary-color)
}

._joinRoom_dljfg_55 {
    display: flex;
    gap: 12px
}

._joinInput_dljfg_65 {
    width: 200px
}

._gameTabs_dljfg_73 {
    margin-bottom: 24px
}

._gameTabs_dljfg_73 .ant-tabs-tab {
    font-size: 16px;
    font-weight: 500
}

._modeGrid_dljfg_91 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px
}

._modeCard_dljfg_103 {
    background-color: transparent !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    position: relative;
    min-height: 200px;
    border: none !important;
    border-radius: var(--border-radius);
    overflow: hidden;
    transition: all var(--transition-normal);
    cursor: pointer
}

._modeCard_dljfg_103.ant-card {
    background-color: transparent !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important
}

._modeCard_dljfg_103:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, #000000bf, #00000080);
    transition: background var(--transition-normal);
    z-index: 1;
    pointer-events: none
}

._modeCard_dljfg_103:hover:before {
    background: linear-gradient(135deg, #0009, #00000059)
}

._modeCard_dljfg_103:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px #0000004d
}

._modeCard_dljfg_103 .ant-card-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    z-index: 2
}

._modeOverlay_dljfg_211 {
    display: none
}

._modeContent_dljfg_219 {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    z-index: 1
}

._modeIcon_dljfg_237 {
    font-size: 36px;
    line-height: 1;
    opacity: .9
}

._modeInfo_dljfg_249 {
    flex: 1
}

._modeName_dljfg_257 {
    font-size: 18px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 6px
}

._modeDesc_dljfg_271 {
    font-size: 13px;
    color: var(--text-muted);
    margin: 0 0 10px;
    line-height: 1.5
}

._modeTag_dljfg_285 {
    font-size: 12px
}

._modeAction_dljfg_293 {
    display: flex;
    justify-content: flex-end
}

._loginHint_dljfg_303 {
    margin-top: 40px;
    text-align: center;
    padding: 24px;
    background: #faad141a;
    border: 1px solid rgba(250, 173, 20, .3);
    border-radius: var(--border-radius)
}

._loginHint_dljfg_303 p {
    margin: 0;
    color: #faad14;
    font-size: 14px
}

@media (max-width: 768px) {
    ._header_dljfg_9 {
        flex-direction: column;
        align-items: flex-start
    }
    ._joinRoom_dljfg_55 {
        width: 100%
    }
    ._joinInput_dljfg_65 {
        flex: 1
    }
    ._modeGrid_dljfg_91 {
        grid-template-columns: 1fr
    }
}

._modalWrap_l8afr_1 {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

._modal_l8afr_1 .ant-modal-content {
    background: linear-gradient(145deg, #1a1a2e, #16213e, #0f3460);
    border: 1px solid rgba(24, 144, 255, .3);
    border-radius: 16px;
    box-shadow: 0 0 40px #1890ff33, 0 0 80px #1890ff1a, inset 0 1px #ffffff1a;
    overflow: hidden
}

._modal_l8afr_1 .ant-modal-body {
    padding: 0
}

._container_l8afr_39 {
    padding: 24px
}

._header_l8afr_49 {
    text-align: center;
    margin-bottom: 24px
}

._title_l8afr_59 {
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .5)
}

._titleIcon_l8afr_81 {
    font-size: 32px;
    color: #52c41a;
    animation: _bounce_l8afr_1 1s ease-in-out infinite
}

@keyframes _bounce_l8afr_1 {
    0%,
    to {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-5px)
    }
}

._subtitle_l8afr_103 {
    font-size: 14px;
    color: #fff9;
    margin-top: 8px
}

._infoSection_l8afr_117 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px
}

._infoItem_l8afr_131 {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #0000004d;
    border-radius: 10px;
    padding: 14px 16px
}

._infoIcon_l8afr_149 {
    font-size: 24px;
    color: #1890ff
}

._infoContent_l8afr_159 {
    display: flex;
    flex-direction: column;
    gap: 2px
}

._infoLabel_l8afr_171 {
    font-size: 12px;
    color: #ffffff80
}

._infoValue_l8afr_181 {
    font-size: 16px;
    font-weight: 600;
    color: #fff
}

._serverSection_l8afr_195 {
    margin-bottom: 24px
}

._serverAddress_l8afr_203 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #00000080;
    border-radius: 10px;
    padding: 12px 16px;
    border: 1px solid rgba(24, 144, 255, .3)
}

._serverAddress_l8afr_203 code {
    font-family: Consolas, Monaco, monospace;
    font-size: 14px;
    color: #52c41a;
    word-break: break-all
}

._copyBtn_l8afr_237 {
    color: #fff9;
    transition: all .3s ease
}

._copyBtn_l8afr_237:hover {
    color: #1890ff
}

._actionSection_l8afr_257 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px
}

._connectBtn_l8afr_271 {
    width: 100%;
    height: 52px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 10px;
    background: linear-gradient(135deg, #1890ff, #096dd9);
    border: none;
    box-shadow: 0 4px 20px #1890ff66;
    transition: all .3s ease
}

._connectBtn_l8afr_271:hover {
    background: linear-gradient(135deg, #40a9ff, #1890ff);
    transform: translateY(-2px);
    box-shadow: 0 6px 24px #1890ff80
}

._closeBtn_l8afr_307 {
    width: 100%;
    height: 44px;
    font-size: 14px;
    border-radius: 10px;
    background: #ffffff1a;
    border: 1px solid rgba(255, 255, 255, .2);
    color: #ffffffb3
}

._closeBtn_l8afr_307:hover {
    background: #ffffff26;
    border-color: #ffffff4d;
    color: #fff
}

._tips_l8afr_341 {
    text-align: center
}

._tips_l8afr_341 p {
    margin: 4px 0;
    font-size: 12px;
    color: #ffffff80
}

@media (max-width: 480px) {
    ._container_l8afr_39 {
        padding: 16px
    }
    ._title_l8afr_59 {
        font-size: 22px
    }
    ._infoItem_l8afr_131 {
        padding: 12px 14px
    }
    ._connectBtn_l8afr_271 {
        height: 48px;
        font-size: 14px
    }
    ._closeBtn_l8afr_307 {
        height: 40px
    }
}

._modal_f4khd_1 .ant-modal-content {
    background: linear-gradient(180deg, #0f1423fa, #0a0f19fa) !important;
    border: 1px solid var(--border-color);
    overflow: hidden
}

._container_f4khd_13 {
    padding: 24px
}

._header_f4khd_23 {
    text-align: center;
    margin-bottom: 24px;
    position: relative
}

._title_f4khd_35 {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 8px
}

._phaseInfo_f4khd_49 {
    font-size: 14px;
    color: var(--text-secondary)
}

._roundInfo_f4khd_59 {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 4px
}

._countdown_f4khd_71 {
    position: absolute;
    top: 0;
    right: 0
}

._teams_f4khd_85 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin-bottom: 24px
}

._team_f4khd_85 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 24px;
    background: var(--bg-glass);
    border-radius: 8px;
    border: 2px solid transparent;
    transition: all .3s ease
}

._team_f4khd_85._active_f4khd_123 {
    border-color: var(--color-primary);
    background: rgba(var(--color-primary-rgb), .1)
}

._teamName_f4khd_133 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary)
}

._turnIndicator_f4khd_145 {
    font-size: 12px;
    color: var(--color-primary);
    margin-top: 4px
}

._vsText_f4khd_157 {
    font-size: 20px;
    font-weight: 700;
    color: var(--text-muted)
}

._mapsSection_f4khd_171,
._serversSection_f4khd_173 {
    margin-bottom: 24px
}

._sectionTitle_f4khd_181 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    text-align: center
}

._mapsGrid_f4khd_197 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px
}

._mapCard_f4khd_209 {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    cursor: default;
    border: 2px solid var(--border-color);
    transition: all .3s ease
}

._mapCard_f4khd_209._selectable_f4khd_227 {
    cursor: pointer
}

._mapCard_f4khd_209._selectable_f4khd_227:hover {
    border-color: var(--color-primary);
    transform: translateY(-2px)
}

._mapCard_f4khd_209._banned_f4khd_245 {
    opacity: .5
}

._mapCard_f4khd_209._picked_f4khd_253 {
    border-color: #52c41a
}

._mapImage_f4khd_261 {
    width: 100%;
    height: 80px;
    background-size: cover;
    background-position: center
}

._mapOverlay_f4khd_275 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00000080;
    opacity: 0;
    transition: opacity .3s ease
}

._mapCard_f4khd_209._banned_f4khd_245 ._mapOverlay_f4khd_275,
._mapCard_f4khd_209._picked_f4khd_253 ._mapOverlay_f4khd_275 {
    opacity: 1
}

._bannedIcon_f4khd_313,
._pickedIcon_f4khd_315 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 24px
}

._bannedIcon_f4khd_313 {
    color: #ff4d4f
}

._pickedIcon_f4khd_315 {
    color: #52c41a
}

._bannedIcon_f4khd_313 span,
._pickedIcon_f4khd_315 span {
    font-size: 12px
}

._mapName_f4khd_357 {
    padding: 8px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: var(--text-primary);
    background: var(--bg-glass)
}

._selectedMap_f4khd_377 {
    text-align: center;
    margin-bottom: 16px;
    font-size: 14px;
    color: var(--text-secondary)
}

._selectedMap_f4khd_377 strong {
    color: var(--color-primary);
    margin-left: 8px
}

._serversGrid_f4khd_401 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px
}

._serverCard_f4khd_413 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    background: var(--bg-glass);
    border: 2px solid var(--border-color);
    border-radius: 8px;
    cursor: default;
    transition: all .3s ease
}

._serverCard_f4khd_413._selectable_f4khd_227 {
    cursor: pointer
}

._serverCard_f4khd_413._selectable_f4khd_227:hover {
    border-color: var(--color-primary);
    background: rgba(var(--color-primary-rgb), .1)
}

._serverCard_f4khd_413._picked_f4khd_253 {
    border-color: #52c41a;
    background: #52c41a1a
}

._serverIcon_f4khd_467 {
    font-size: 20px;
    color: var(--text-secondary)
}

._serverName_f4khd_477 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary)
}

._pickedCheck_f4khd_489 {
    color: #52c41a;
    font-size: 16px
}

._voteCount_f4khd_501 {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(var(--color-primary-rgb), .9);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    justify-content: center
}

._voteCount_f4khd_501 span {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    line-height: 1
}

._voteCount_f4khd_501 small {
    font-size: 10px;
    color: #fffc
}

._mapCard_f4khd_209._voted_f4khd_547 {
    border-color: var(--color-primary);
    box-shadow: 0 0 12px rgba(var(--color-primary-rgb), .5)
}

._mapCard_f4khd_209._voted_f4khd_547 ._mapOverlay_f4khd_275 {
    opacity: 1;
    background: rgba(var(--color-primary-rgb), .3)
}

._mapCard_f4khd_209._eliminated_f4khd_567 {
    opacity: .4;
    filter: grayscale(100%);
    pointer-events: none
}

._mapCard_f4khd_209._eliminated_f4khd_567 ._mapOverlay_f4khd_275 {
    opacity: 1;
    background: #000000b3
}

._eliminatedIcon_f4khd_589 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 24px;
    color: #ff4d4f
}

._eliminatedIcon_f4khd_589 span {
    font-size: 12px
}

._serverCard_f4khd_413._eliminated_f4khd_567 {
    opacity: .4;
    filter: grayscale(100%);
    pointer-events: none
}

._eliminatedCheck_f4khd_627 {
    color: #ff4d4f;
    font-size: 16px
}

._myVoteBadge_f4khd_637 {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 6px;
    background: var(--color-primary);
    color: #fff;
    font-size: 10px;
    border-radius: 4px
}

._serverCard_f4khd_413._voted_f4khd_547 {
    border-color: var(--color-primary);
    background: rgba(var(--color-primary-rgb), .2)
}

._serverVoteCount_f4khd_667 {
    font-size: 12px;
    color: var(--color-primary);
    font-weight: 600
}

._coachHint_f4khd_679 {
    text-align: center;
    padding: 12px;
    color: var(--text-muted);
    font-size: 14px;
    font-style: italic
}

._completeSection_f4khd_697 {
    text-align: center;
    padding: 32px
}

._completeIcon_f4khd_707 {
    font-size: 48px;
    color: #52c41a;
    margin-bottom: 16px
}

._completeSection_f4khd_697 h3 {
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 24px
}

._result_f4khd_733 {
    display: flex;
    justify-content: center;
    gap: 48px;
    margin-bottom: 24px
}

._resultItem_f4khd_747 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px
}

._resultItem_f4khd_747 span {
    font-size: 12px;
    color: var(--text-secondary)
}

._resultItem_f4khd_747 strong {
    font-size: 18px;
    color: var(--color-primary)
}

._waitingText_f4khd_781 {
    font-size: 14px;
    color: var(--text-muted)
}

._actionHint_f4khd_793 {
    text-align: center;
    padding: 16px;
    background: rgba(var(--color-primary-rgb), .1);
    border-radius: 8px;
    border: 1px solid var(--color-primary)
}

._yourTurn_f4khd_809 {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 4px
}

._actionHint_f4khd_793 span:last-child {
    font-size: 14px;
    color: var(--text-secondary)
}

._loading_1xsoq_1 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px
}

._content_1xsoq_15 {
    padding: 8px 0
}

._section_1xsoq_23 {
    margin-bottom: 8px
}

._section_1xsoq_23 h5 {
    margin-bottom: 12px;
    color: var(--text-primary)
}

._selectGroup_1xsoq_41 {
    width: 100%
}

._selectItem_1xsoq_49 {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    width: 100%
}

._selectLabel_1xsoq_63 {
    width: 140px;
    flex-shrink: 0;
    color: var(--text-secondary)
}

._required_1xsoq_75 {
    color: #ff4d4f;
    margin-left: 4px
}

._select_1xsoq_41 {
    flex: 1
}

._teamTag_1xsoq_93 {
    color: var(--text-tertiary);
    font-size: 12px
}

._tips_1xsoq_103 {
    margin-top: 16px;
    padding: 12px;
    background: var(--bg-tertiary);
    border-radius: 6px
}

._page_nt99l_1 {
    padding: 16px 20px;
    height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px) - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: linear-gradient(135deg, #0f0f1a, #1a1a2e, #16213e);
    position: relative
}

._page_nt99l_1:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: radial-gradient(ellipse at 30% 20%, rgba(99, 102, 241, .08) 0%, transparent 50%), radial-gradient(ellipse at 70% 80%, rgba(236, 72, 153, .06) 0%, transparent 50%);
    pointer-events: none
}

._loading_nt99l_41 {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    color: var(--text-muted)
}

._topActions_nt99l_63 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    margin-bottom: 12px;
    flex-shrink: 0;
    position: relative;
    z-index: 1
}

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

._gameTag_nt99l_99 {
    font-weight: 600;
    font-size: 13px
}

._modeName_nt99l_109 {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    letter-spacing: .5px
}

._roomIdBox_nt99l_123 {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #ffffff0f;
    border-radius: 8px;
    font-size: 13px;
    color: var(--text-muted)
}

._roomIdValue_nt99l_145 {
    color: #6366f1;
    font-weight: 600;
    font-family: JetBrains Mono, monospace
}

._copyIcon_nt99l_157 {
    cursor: pointer;
    color: var(--text-muted);
    transition: all .2s
}

._copyIcon_nt99l_157:hover {
    color: #6366f1;
    transform: scale(1.1)
}

._actionButtons_nt99l_179 {
    display: flex;
    gap: 10px;
    align-items: center
}

._actionButtons_nt99l_179 button {
    border-radius: 8px;
    font-weight: 500
}

._mainContent_nt99l_203 {
    flex: 1;
    display: flex;
    gap: 16px;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1
}

._playersArea_nt99l_227 {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0
}

._playersHeader_nt99l_243 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 12px;
    flex-shrink: 0
}

._playersHeader_nt99l_243 .anticon {
    color: #6366f1
}

._playerCount_nt99l_273 {
    color: var(--text-muted);
    font-weight: 400
}

._playerCards_nt99l_285 {
    display: flex;
    gap: 20px;
    flex: 1;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px
}

._players1v1_nt99l_307 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 60px;
    padding: 20px
}

._player1v1Left_nt99l_325,
._player1v1Right_nt99l_327 {
    display: flex;
    align-items: center;
    justify-content: center
}

._players1v1_nt99l_307 ._playerCard_nt99l_285 {
    width: 200px;
    min-width: 180px;
    max-width: 240px;
    aspect-ratio: 2 / 5
}

._vsText_nt99l_353 {
    font-size: 48px;
    font-weight: 900;
    color: #6366f1;
    text-shadow: 0 0 30px rgba(99, 102, 241, .5);
    letter-spacing: 4px
}

._playersTenMan_nt99l_371 {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    padding: 4px 0;
    min-height: 0
}

._teamSection_nt99l_391 {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-height: 0
}

._teamLabel_nt99l_407 {
    font-size: 11px;
    font-weight: 700;
    color: #ffffffe6;
    text-align: center;
    padding: 3px 10px;
    background: linear-gradient(135deg, #6366f14d, #8b5cf64d);
    border-radius: 6px;
    display: inline-block;
    margin: 0 auto;
    letter-spacing: 1px;
    flex-shrink: 0
}

._tenManRow_nt99l_435 {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: stretch;
    flex: 1;
    min-height: 0
}

._tenManRow_nt99l_435 ._playerCard_nt99l_285 {
    flex: 0 0 auto;
    width: auto;
    min-width: 80px;
    max-width: 140px;
    height: 100%;
    aspect-ratio: 2 / 5;
    border-radius: 12px
}

._tenManRow_nt99l_435 ._cardContent_nt99l_477 {
    padding: 10px 8px
}

._tenManRow_nt99l_435 ._avatarWrapper_nt99l_485 {
    margin-top: 45px;
    padding: 3px
}

._tenManRow_nt99l_435 ._avatarWrapper_nt99l_485 .ant-avatar {
    width: 48px !important;
    height: 48px !important;
    border-width: 2px !important
}

._tenManRow_nt99l_435 ._playerName_nt99l_507 {
    margin-top: 8px;
    font-size: 12px;
    padding: 0 4px
}

._tenManRow_nt99l_435 ._cardBadges_nt99l_519 {
    top: 8px;
    gap: 4px
}

._tenManRow_nt99l_435 ._capBadge_nt99l_529,
._tenManRow_nt99l_435 ._readyBadge_nt99l_531,
._tenManRow_nt99l_435 ._offlineBadge_nt99l_533,
._tenManRow_nt99l_435 ._mismatchBadge_nt99l_535 {
    padding: 3px 6px;
    font-size: 9px;
    border-radius: 8px;
    gap: 3px
}

._tenManRow_nt99l_435 ._playerRankInfo_nt99l_549 {
    gap: 6px
}

._tenManRow_nt99l_435 ._levelIcon_nt99l_557 {
    height: 20px
}

._tenManRow_nt99l_435 ._rankDisplay_nt99l_565 {
    gap: 5px
}

._tenManRow_nt99l_435 ._rankIcon_nt99l_573 {
    height: 26px
}

._tenManRow_nt99l_435 ._rankScore_nt99l_581 {
    font-size: 11px
}

._tenManRow_nt99l_435 ._creditInfo_nt99l_589 {
    font-size: 10px;
    padding: 2px 6px;
    margin-top: 4px
}

._tenManRow_nt99l_435 ._emptyCard_nt99l_601 {
    gap: 10px
}

._tenManRow_nt99l_435 ._emptyIcon_nt99l_609 {
    width: 40px;
    height: 40px;
    font-size: 20px
}

._tenManRow_nt99l_435 ._emptyCard_nt99l_601 span {
    font-size: 12px;
    font-weight: 500
}

._tenManRow_nt99l_435 ._kickBtn_nt99l_631 {
    font-size: 11px;
    padding: 0 6px;
    height: auto;
    bottom: 8px
}

._tenManRow_nt99l_435 ._coachCard_nt99l_645 {
    border: 2px solid rgba(250, 173, 20, .5);
    background: linear-gradient(180deg, rgba(250, 173, 20, .1), transparent)
}

._tenManRow_nt99l_435 ._coachCard_nt99l_645:before {
    content: "教练";
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translate(-50%);
    font-size: 10px;
    font-weight: 600;
    color: #faad14;
    background: #000000b3;
    padding: 2px 8px;
    border-radius: 4px;
    z-index: 10
}

._rightPanel_nt99l_687 {
    width: 320px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex-shrink: 0
}

._playerCard_nt99l_285 {
    position: relative;
    width: 160px;
    min-width: 140px;
    max-width: 200px;
    aspect-ratio: 2 / 5;
    border-radius: 16px;
    overflow: hidden;
    flex-shrink: 0;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    cursor: default
}

._playerCard_nt99l_285:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px #0006, 0 0 30px #6366f133
}

._cardBg_nt99l_741 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    transition: transform .4s
}

._playerCard_nt99l_285:hover ._cardBg_nt99l_741 {
    transform: scale(1.05)
}

._cardOverlay_nt99l_765 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, #0000004d, #0000001a 30%, #0006 70%, #000c)
}

._playerCard_nt99l_285._empty_nt99l_601 {
    border: 2px dashed rgba(255, 255, 255, .15);
    background: #0003;
    cursor: pointer;
    transition: all .3s ease
}

._playerCard_nt99l_285._empty_nt99l_601:hover {
    border-color: var(--color-primary);
    background: #00d4ff0d;
    transform: translateY(-2px)
}

._playerCard_nt99l_285._empty_nt99l_601:hover ._emptyIcon_nt99l_609 {
    background: #00d4ff33;
    border-color: var(--color-primary)
}

._playerCard_nt99l_285._empty_nt99l_601:hover ._emptyCard_nt99l_601 {
    color: var(--color-primary)
}

._playerCard_nt99l_285._empty_nt99l_601 ._cardBg_nt99l_741,
._playerCard_nt99l_285._empty_nt99l_601 ._cardOverlay_nt99l_765 {
    display: none
}

._playerCard_nt99l_285._coach_nt99l_645 {
    border-color: #a855f7
}

._playerCard_nt99l_285._swapTarget_nt99l_851 {
    cursor: pointer !important;
    border-color: #faad14 !important;
    animation: _swapPulse_nt99l_1 1.5s ease-in-out infinite
}

._playerCard_nt99l_285._swapTarget_nt99l_851:hover {
    border-color: #ffc53d !important;
    box-shadow: 0 0 20px #faad1466 !important
}

._playerCard_nt99l_285._swapSource_nt99l_873 {
    border-color: #52c41a !important;
    box-shadow: 0 0 15px #52c41a4d
}

@keyframes _swapPulse_nt99l_1 {
    0%,
    to {
        box-shadow: 0 0 10px #faad1433
    }
    50% {
        box-shadow: 0 0 20px #faad1466
    }
}

._swapOverlay_nt99l_901 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0009;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-radius: 16px
}

._swapHint_nt99l_929 {
    font-size: 12px;
    color: #faad14;
    font-weight: 500;
    text-align: center;
    padding: 8px
}

._playerCard_nt99l_285._swapSource_nt99l_873 ._swapHint_nt99l_929 {
    color: #52c41a
}

._emptyCard_nt99l_601 {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #ffffff4d
}

._emptyIcon_nt99l_609 {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #ffffff0d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px
}

._emptyCard_nt99l_601 span {
    font-size: 13px
}

._cardContent_nt99l_477 {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 16px 12px
}

._cardBadges_nt99l_519 {
    position: absolute;
    top: 12px;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px
}

._capBadge_nt99l_529 {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    box-shadow: 0 2px 8px #f59e0b66
}

._readyBadge_nt99l_531 {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #10b981, #059669);
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    box-shadow: 0 2px 8px #10b98166
}

._offlineBadge_nt99l_533 {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #6b7280, #4b5563);
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    box-shadow: 0 2px 8px #6b728066
}

._mismatchBadge_nt99l_535 {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    box-shadow: 0 2px 8px #ef444466
}

._disconnected_nt99l_1159 {
    opacity: .6
}

._disconnected_nt99l_1159 ._cardOverlay_nt99l_765 {
    background: linear-gradient(to bottom, #0000004d, #000000b3) !important
}

._steamidMismatch_nt99l_1177 {
    border: 2px solid #ef4444 !important
}

._steamidMismatch_nt99l_1177 ._cardOverlay_nt99l_765 {
    background: linear-gradient(to bottom, #ef444433, #000000b3) !important
}

._avatarWrapper_nt99l_485 {
    margin-top: 70px;
    padding: 4px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    box-shadow: 0 4px 20px #6366f166;
    transition: transform .2s ease, box-shadow .2s ease
}

._avatarWrapper_nt99l_485:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 24px #6366f199
}

._avatarWrapper_nt99l_485 .ant-avatar {
    border: 3px solid #1a1a2e;
    width: 72px !important;
    height: 72px !important
}

._playerName_nt99l_507 {
    margin-top: 14px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 2px 4px rgba(0, 0, 0, .5);
    transition: color .2s ease
}

._playerName_nt99l_507:hover {
    color: #a5b4fc;
    text-decoration: underline
}

._playerRankInfo_nt99l_549 {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px
}

._levelIcon_nt99l_557 {
    height: 28px;
    width: auto;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3))
}

._rankDisplay_nt99l_565 {
    display: flex;
    align-items: center;
    gap: 8px
}

._rankIcon_nt99l_573 {
    height: 36px;
    width: auto;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .3))
}

._rankScore_nt99l_581 {
    font-size: 14px;
    font-weight: 700;
    color: #6366f1;
    text-shadow: 0 0 10px rgba(99, 102, 241, .5)
}

._creditInfo_nt99l_589 {
    margin-top: 8px;
    padding: 3px 10px;
    background: #ffffff1a;
    border-radius: 6px;
    font-size: 11px;
    color: #ffffffb3
}

._kickBtn_nt99l_631 {
    position: absolute;
    bottom: 12px;
    opacity: 0;
    transition: opacity .2s
}

._playerCard_nt99l_285:hover ._kickBtn_nt99l_631 {
    opacity: 1
}

._chatSection_nt99l_1379 {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: #0000004d;
    border-radius: 12px;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .06);
    min-height: 200px
}

._chatHeader_nt99l_1401 {
    font-size: 13px;
    font-weight: 600;
    color: #ffffffb3;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    flex-shrink: 0
}

._chatList_nt99l_1421 {
    flex: 1;
    overflow-y: auto;
    margin-bottom: 10px
}

._chatList_nt99l_1421::-webkit-scrollbar {
    width: 4px
}

._chatList_nt99l_1421::-webkit-scrollbar-track {
    background: #0003
}

._chatList_nt99l_1421::-webkit-scrollbar-thumb {
    background: #6366f166;
    border-radius: 2px
}

._chatEmpty_nt99l_1459 {
    text-align: center;
    color: #ffffff4d;
    font-size: 13px;
    padding: 20px
}

._chatMessage_nt99l_1473 {
    padding: 5px 0;
    font-size: 13px;
    line-height: 1.4
}

._chatUser_nt99l_1485 {
    color: #6366f1;
    font-weight: 500;
    margin-right: 6px
}

._chatContent_nt99l_1497 {
    color: #ffffffd9;
    word-break: break-all
}

._chatInput_nt99l_1507 {
    display: flex;
    gap: 8px;
    flex-shrink: 0
}

._chatInput_nt99l_1507 input {
    flex: 1;
    background: #0000004d !important;
    border-color: #ffffff1a !important
}

._readySection_nt99l_1533 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    background: #0000004d;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, .06);
    flex-shrink: 0
}

._quickToolbar_nt99l_1559 {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-bottom: 12px
}

._toolItem_nt99l_1575 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: all .2s ease;
    position: relative;
    background: #ffffff0d;
    border: 1px solid rgba(255, 255, 255, .1);
    min-width: 48px
}

._toolItem_nt99l_1575:hover:not(._toolItemDisabled_nt99l_1605) {
    background: #ffffff1a;
    border-color: #fff3
}

._toolItemDisabled_nt99l_1605 {
    opacity: .4;
    cursor: not-allowed
}

._toolItemDisabled_nt99l_1605:hover {
    transform: none;
    box-shadow: none
}

._toolItemActive_nt99l_1635 {
    background: #10b98126 !important
}

._toolItemActive_nt99l_1635:hover:not(._toolItemDisabled_nt99l_1605) {
    background: #10b98140 !important
}

._toolItemPersonal_nt99l_1651 {
    background: transparent
}

._toolItemPersonal_nt99l_1651:hover:not(._toolItemDisabled_nt99l_1605) {
    background: #8b5cf626
}

._toolIcon_nt99l_1667 {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #ffffffd9;
    transition: all .2s ease
}

._toolItem_nt99l_1575:hover:not(._toolItemDisabled_nt99l_1605) ._toolIcon_nt99l_1667 {
    color: #fff;
    transform: scale(1.1)
}

._toolItemActive_nt99l_1635 ._toolIcon_nt99l_1667 {
    color: #10b981
}

._toolItemPersonal_nt99l_1651 ._toolIcon_nt99l_1667 {
    color: #a78bfa
}

._toolLabel_nt99l_1715 {
    font-size: 10px;
    color: #ffffffa6;
    font-weight: 500;
    white-space: nowrap
}

._toolItem_nt99l_1575:hover:not(._toolItemDisabled_nt99l_1605) ._toolLabel_nt99l_1715 {
    color: #ffffffe6
}

._toolActiveDot_nt99l_1737 {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 6px;
    height: 6px;
    background: #10b981;
    border-radius: 50%;
    animation: _pulse_nt99l_1 2s ease-in-out infinite
}

@keyframes _pulse_nt99l_1 {
    0%,
    to {
        opacity: 1;
        transform: scale(1)
    }
    50% {
        opacity: .6;
        transform: scale(.8)
    }
}

._readyBtnWrapper_nt99l_1769 {
    width: 100%
}

._readyBtn_nt99l_1769 {
    width: 100%;
    height: 56px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 12px;
    background: linear-gradient(135deg, #10b981, #059669) !important;
    border: none !important;
    box-shadow: 0 4px 20px #10b98166;
    transition: all .3s !important
}

._readyBtn_nt99l_1769:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px #10b98180
}

._unreadyBtn_nt99l_1811 {
    width: 100%;
    height: 56px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 12px;
    background: #ffffff1a !important;
    border: 1px solid rgba(255, 255, 255, .2) !important;
    color: #fff !important;
    transition: all .3s !important
}

._unreadyBtn_nt99l_1811:hover:not(:disabled) {
    background: #ef444433 !important;
    border-color: #ef4444 !important;
    color: #ef4444 !important
}

._matchingBtn_nt99l_1847 {
    width: 100%;
    height: 56px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 12px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 20px #6366f166;
    animation: _matchingPulse_nt99l_1 1.5s ease-in-out infinite
}

._cancelMatchingBtn_nt99l_1873 {
    width: 100%;
    height: 56px;
    font-size: 16px;
    font-weight: 700;
    border-radius: 12px;
    background: linear-gradient(135deg, #ef4444, #dc2626) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 20px #ef444466;
    transition: all .3s !important;
    animation: _cancelMatchingPulse_nt99l_1 1.5s ease-in-out infinite
}

._cancelMatchingBtn_nt99l_1873:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px #ef444480
}

@keyframes _matchingPulse_nt99l_1 {
    0%,
    to {
        box-shadow: 0 4px 20px #6366f166
    }
    50% {
        box-shadow: 0 4px 30px #6366f199
    }
}

@keyframes _cancelMatchingPulse_nt99l_1 {
    0%,
    to {
        box-shadow: 0 4px 20px #ef444466
    }
    50% {
        box-shadow: 0 4px 30px #ef444499
    }
}

._readyStatus_nt99l_1947 {
    font-size: 14px;
    color: #fff9
}

._settingsModal_nt99l_1959 .ant-modal-content {
    background: #1a1a2e;
    border: 1px solid rgba(255, 255, 255, .1)
}

._settingsModal_nt99l_1959 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._settingsModal_nt99l_1959 .ant-modal-title {
    color: #fff
}

._settingsModal_nt99l_1959 .ant-modal-close-x {
    color: #fff9
}

._viewOnlyTip_nt99l_1997 {
    background: #f59e0b26;
    border: 1px solid rgba(245, 158, 11, .3);
    color: #f59e0b;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    margin-bottom: 16px;
    text-align: center
}

._mapItemDisabled_nt99l_2021 {
    cursor: default
}

._mapItemDisabled_nt99l_2021:hover {
    transform: none;
    box-shadow: none
}

._serverItemDisabled_nt99l_2041 {
    cursor: default
}

._serverItemDisabled_nt99l_2041:hover {
    background: #ffffff05
}

._serverUnavailable_nt99l_2057 {
    opacity: .5;
    cursor: not-allowed
}

._serverUnavailable_nt99l_2057 ._serverName_nt99l_2067 {
    color: #fff6
}

._serverUnavailableTag_nt99l_2075 {
    color: #ff4d4f;
    font-size: 11px;
    margin-left: 8px
}

._serverPingUnavailable_nt99l_2087 {
    color: #ffffff4d;
    font-size: 13px
}

._settingsList_nt99l_2097 {
    display: flex;
    flex-direction: column;
    gap: 16px
}

._settingItem_nt99l_2109 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #0003;
    border-radius: 8px;
    font-size: 14px;
    color: #ffffffd9
}

._mapsModal_nt99l_2133 .ant-modal-content {
    background: #1a1a2e;
    border: 1px solid rgba(255, 255, 255, .1)
}

._mapsModal_nt99l_2133 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._mapsModal_nt99l_2133 .ant-modal-title {
    color: #fff
}

._mapsList_nt99l_2161 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
    max-height: 400px;
    overflow-y: auto;
    padding: 4px
}

._mapItem_nt99l_2021 {
    position: relative;
    aspect-ratio: 16/9;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all .2s
}

._mapItem_nt99l_2021:hover {
    transform: scale(1.02)
}

._mapItem_nt99l_2021._selected_nt99l_2207 {
    border-color: #6366f1;
    box-shadow: 0 0 15px #6366f166
}

._mapItem_nt99l_2021 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._mapOverlay_nt99l_2229 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .8) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 8px
}

._mapOverlay_nt99l_2229 span {
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .8)
}

._mapOverlay_nt99l_2229 .ant-checkbox {
    position: absolute;
    top: 8px;
    right: 8px
}

._selectedCount_nt99l_2275 {
    margin-top: 12px;
    text-align: center;
    color: #fff9;
    font-size: 13px
}

._serversModal_nt99l_2291 .ant-modal-content {
    background: #1a1a2e;
    border: 1px solid rgba(255, 255, 255, .1)
}

._serversModal_nt99l_2291 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._serversModal_nt99l_2291 .ant-modal-title {
    color: #fff
}

._serversList_nt99l_2319 {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 400px;
    overflow-y: auto
}

._serverItem_nt99l_2041 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #0003;
    border-radius: 8px;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all .2s
}

._serverItem_nt99l_2041:hover {
    background: #6366f11a
}

._serverItem_nt99l_2041._selected_nt99l_2207 {
    border-color: #6366f1;
    background: #6366f126
}

._serverInfo_nt99l_2377 {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1
}

._serverName_nt99l_2067 {
    font-size: 14px;
    font-weight: 600;
    color: #fff
}

._serverDesc_nt99l_2403 {
    font-size: 12px;
    color: #ffffff80
}

._serverDistance_nt99l_2413 {
    color: #6366f1cc;
    font-weight: 500
}

._serverPingWrapper_nt99l_2423 {
    min-width: 50px;
    text-align: right
}

._serverPing_nt99l_2087 {
    font-size: 12px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px
}

._serverPing_nt99l_2087._pingGood_nt99l_2447 {
    background: #52c41a33;
    color: #52c41a
}

._serverPing_nt99l_2087._pingMedium_nt99l_2457 {
    background: #faad1433;
    color: #faad14
}

._serverPing_nt99l_2087._pingBad_nt99l_2467 {
    background: #f5222d33;
    color: #f5222d
}

._serverPingLoading_nt99l_2477 {
    font-size: 12px;
    color: #ffffff4d
}

@media (max-width: 1200px) {
    ._playerCard_nt99l_285 {
        width: 120px;
        min-width: 120px
    }
    ._tenManRow_nt99l_435 ._playerCard_nt99l_285 {
        width: 100px;
        min-width: 100px
    }
    ._avatarWrapper_nt99l_485 {
        margin-top: 50px
    }
    ._avatarWrapper_nt99l_485 .ant-avatar {
        width: 50px !important;
        height: 50px !important
    }
    ._rightPanel_nt99l_687 {
        width: 280px
    }
}

@media (max-width: 1000px) {
    ._mainContent_nt99l_203 {
        flex-direction: column
    }
    ._rightPanel_nt99l_687 {
        width: 100%;
        flex-direction: row;
        gap: 16px
    }
    ._chatSection_nt99l_1379 {
        flex: 1;
        min-height: 150px;
        max-height: 200px
    }
    ._readySection_nt99l_1533 {
        width: 280px;
        flex-shrink: 0
    }
    ._playerCards_nt99l_285 {
        justify-content: center
    }
    ._players1v1_nt99l_307 {
        gap: 20px
    }
    ._vsText_nt99l_353 {
        font-size: 32px
    }
}

@media (max-width: 1200px) {
    ._playerCard_nt99l_285 {
        width: 140px;
        min-width: 120px
    }
    ._players1v1_nt99l_307 ._playerCard_nt99l_285 {
        width: 180px;
        min-width: 160px
    }
    ._avatarWrapper_nt99l_485 .ant-avatar {
        width: 64px !important;
        height: 64px !important
    }
}

@media (max-width: 768px) {
    ._topActions_nt99l_63 {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start
    }
    ._actionButtons_nt99l_179 {
        width: 100%;
        justify-content: flex-end
    }
    ._rightPanel_nt99l_687 {
        flex-direction: column
    }
    ._readySection_nt99l_1533 {
        width: 100%
    }
    ._playerCard_nt99l_285 {
        width: 120px;
        min-width: 100px
    }
    ._players1v1_nt99l_307 ._playerCard_nt99l_285 {
        width: 150px;
        min-width: 130px
    }
    ._tenManRow_nt99l_435 ._playerCard_nt99l_285 {
        width: 90px;
        min-width: 80px
    }
    ._avatarWrapper_nt99l_485 {
        margin-top: 50px
    }
    ._avatarWrapper_nt99l_485 .ant-avatar {
        width: 52px !important;
        height: 52px !important
    }
    ._playerName_nt99l_507 {
        font-size: 13px
    }
    ._rankIcon_nt99l_573 {
        height: 28px
    }
    ._rankScore_nt99l_581 {
        font-size: 14px
    }
}

@media (max-width: 600px) {
    ._page_nt99l_1 {
        padding: 12px
    }
    ._actionButtons_nt99l_179 button span:not(._anticon_nt99l_265) {
        display: none
    }
    ._vsText_nt99l_353 {
        font-size: 24px
    }
    ._playerCard_nt99l_285 {
        width: 100px;
        min-width: 90px
    }
    ._players1v1_nt99l_307 ._playerCard_nt99l_285 {
        width: 120px;
        min-width: 100px
    }
    ._tenManRow_nt99l_435 {
        gap: 8px
    }
    ._tenManRow_nt99l_435 ._playerCard_nt99l_285 {
        width: 75px;
        min-width: 70px
    }
    ._avatarWrapper_nt99l_485 {
        margin-top: 40px
    }
    ._avatarWrapper_nt99l_485 .ant-avatar {
        width: 44px !important;
        height: 44px !important
    }
    ._levelIcon_nt99l_557 {
        height: 20px
    }
    ._rankIcon_nt99l_573 {
        height: 24px
    }
}

._modeModal_nt99l_2859 .ant-modal-content {
    background: #0f0f19fa;
    border: 1px solid rgba(255, 255, 255, .1)
}

._modeModal_nt99l_2859 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._modeModal_nt99l_2859 .ant-modal-title {
    color: #fff
}

._modeList_nt99l_2887 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 12px
}

._modeItem_nt99l_2899 {
    position: relative;
    height: 100px;
    border-radius: 10px;
    cursor: pointer;
    background-size: cover;
    background-position: center;
    transition: all .3s;
    outline: 2px solid transparent;
    outline-offset: -2px
}

._modeItem_nt99l_2899:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(135deg, #000000b3, #0006);
    transition: background .3s;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit
}

._modeItem_nt99l_2899:hover:before {
    background: linear-gradient(135deg, #00000080, #0003)
}

._modeItem_nt99l_2899:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px #0006
}

._modeItem_nt99l_2899._active_nt99l_2963 {
    outline-color: #6366f1;
    box-shadow: 0 0 20px #6366f166
}

._modeItemOverlay_nt99l_2975 {
    display: none
}

._modeItemContent_nt99l_2983 {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 16px
}

._modeItemName_nt99l_3003 {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 4px
}

._modeItemDesc_nt99l_3017 {
    font-size: 12px;
    color: #ffffffb3
}

._modeSwitching_nt99l_3027 {
    text-align: center;
    padding: 16px;
    color: #ffffffb3;
    font-size: 14px
}

._recruitmentModal_nt99l_3043 .ant-modal-content {
    background: var(--bg-card);
    border: 1px solid var(--border-color)
}

._recruitmentModal_nt99l_3043 .ant-modal-header {
    background: transparent;
    border-bottom: 1px solid var(--border-color)
}

._recruitmentModal_nt99l_3043 .ant-modal-title {
    color: var(--text-primary)
}

._recruitmentContent_nt99l_3071 {
    display: flex;
    flex-direction: column;
    gap: 16px
}

._recruitmentSwitch_nt99l_3083 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm)
}

._recruitmentSwitch_nt99l_3083 span {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 500
}

._recruitmentTip_nt99l_3115 {
    font-size: 12px;
    color: var(--text-muted);
    padding: 0 4px
}

._recruitmentTitleInput_nt99l_3127 {
    display: flex;
    flex-direction: column;
    gap: 8px
}

._recruitmentTitleInput_nt99l_3127 span {
    font-size: 14px;
    color: var(--text-secondary)
}

._recruitmentTitleInput_nt99l_3127 .ant-input {
    background: var(--bg-glass-light);
    border-color: var(--border-color)
}

._recruitmentTitleInput_nt99l_3127 .ant-input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px var(--color-primary-glow)
}

._container_1sqh3_1 {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 80px;
    height: 80px;
    cursor: pointer;
    z-index: 1000;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .3));
    transition: transform .2s ease
}

._container_1sqh3_1:hover {
    transform: scale(1.1)
}

._container_1sqh3_1:hover ._statusIndicator_1sqh3_33 {
    opacity: 1
}

._vinyl_1sqh3_43 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

._vinylDisc_1sqh3_59 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: linear-gradient(135deg, #1a1a1a, #2d2d2d, #1a1a1a, #2d2d2d, #1a1a1a);
    box-shadow: 0 0 0 3px #333, 0 0 0 4px #111, inset 0 0 10px #00000080
}

._vinylDisc_1sqh3_59._spinning_1sqh3_97 {
    animation: _spin_1sqh3_97 3s linear infinite
}

@keyframes _spin_1sqh3_97 {
    0% {
        transform: rotate(0)
    }
    to {
        transform: rotate(360deg)
    }
}

._grooves_1sqh3_125 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    height: 90%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: repeating-radial-gradient(circle at center, transparent 0px, transparent 2px, rgba(255, 255, 255, .05) 2px, rgba(255, 255, 255, .05) 3px)
}

._center_1sqh3_161 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40%;
    height: 40%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    overflow: hidden;
    background: #333;
    box-shadow: inset 0 0 5px #00000080
}

._coverImage_1sqh3_187 {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._centerDot_1sqh3_201 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: linear-gradient(135deg, #666, #333);
    box-shadow: 0 0 2px #00000080
}

._tonearm_1sqh3_227 {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 40px;
    height: 50px;
    transform-origin: top right;
    transition: transform .5s ease;
    transform: rotate(-30deg)
}

._tonearm_1sqh3_227._playing_1sqh3_249 {
    transform: rotate(0)
}

._tonearmBase_1sqh3_257 {
    position: absolute;
    top: 0;
    right: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: linear-gradient(135deg, #888, #555);
    box-shadow: 0 2px 4px #0000004d
}

._tonearmArm_1sqh3_279 {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 30px;
    height: 3px;
    background: linear-gradient(to right, #888, #666);
    transform-origin: right center;
    transform: rotate(45deg);
    border-radius: 1px
}

._tonearmHead_1sqh3_303 {
    position: absolute;
    bottom: 5px;
    left: 5px;
    width: 6px;
    height: 8px;
    background: linear-gradient(to bottom, #888, #444);
    border-radius: 1px;
    transform: rotate(45deg)
}

._statusIndicator_1sqh3_33 {
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translate(-50%);
    font-size: 12px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
    opacity: 0;
    transition: opacity .2s ease;
    white-space: nowrap;
    background: #0009;
    padding: 2px 8px;
    border-radius: 10px
}

._page_u21dw_3 {
    position: relative;
    max-width: 1400px;
    margin: 0 auto;
    height: calc(100vh - 120px);
    overflow: hidden
}

._pageContent_u21dw_19 {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column
}

._seasonSelector_u21dw_37 {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
    flex-shrink: 0
}

._loading_u21dw_51,
._empty_u21dw_53 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
    color: var(--text-secondary)
}

._header_u21dw_75 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    overflow: hidden;
    margin-bottom: 20px;
    flex-shrink: 0
}

._headerContent_u21dw_95 {
    padding: 24px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px
}

._headerLeft_u21dw_111 {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 1
}

._headerRight_u21dw_125 {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start
}

._avatarWrapper_u21dw_141 {
    position: relative;
    flex-shrink: 0
}

._avatar_u21dw_141,
._avatarImg_u21dw_153 {
    width: 88px;
    height: 88px;
    border-radius: 16px;
    object-fit: cover
}

._avatar_u21dw_141 {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-size: 36px;
    font-weight: 700;
    color: var(--bg-primary);
    box-shadow: 0 4px 20px var(--color-primary-glow)
}

._onlineBadge_u21dw_191 {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 16px;
    height: 16px;
    background: var(--color-success);
    border: 2px solid var(--bg-primary);
    border-radius: 50%
}

._userInfo_u21dw_215 {
    flex: 1;
    min-width: 0
}

._nameRow_u21dw_225 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    flex-wrap: wrap
}

._username_u21dw_241 {
    font-family: var(--font-display);
    font-size: 26px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0
}

._uidBadge_u21dw_257 {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    background: #ffffff14;
    border-radius: 12px;
    font-size: 13px;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all .2s ease;
    -webkit-user-select: none;
    user-select: none
}

._uidBadge_u21dw_257:hover {
    background: #ffffff26;
    color: var(--text-primary)
}

._addFriendBtn_u21dw_295 {
    margin-left: 4px
}

._metaRow_u21dw_303 {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: 8px
}

._metaRow_u21dw_303 span {
    display: flex;
    align-items: center;
    gap: 6px
}

._teamInfo_u21dw_335 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding: 6px 14px;
    background: #00d4ff1a;
    border-radius: var(--border-radius-sm);
    width: fit-content;
    font-size: 14px;
    cursor: pointer;
    transition: all .2s ease
}

._teamInfo_u21dw_335:hover {
    background: #00d4ff33;
    transform: translate(4px)
}

._teamAvatar_u21dw_373 {
    border: 1px solid var(--border-color)
}

._teamName_u21dw_381 {
    font-weight: 600;
    color: var(--color-primary)
}

._levelBar_u21dw_391 {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 260px
}

._levelIcon_u21dw_405 {
    height: 28px;
    width: auto;
    object-fit: contain
}

._levelText_u21dw_417 {
    font-weight: 600;
    color: var(--color-primary);
    font-size: 14px
}

._xpText_u21dw_429 {
    font-size: 12px;
    color: var(--text-muted)
}

._levelBar_u21dw_391 .ant-progress {
    flex: 1
}

._rankBox_u21dw_449 {
    background: #0006;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 14px 24px;
    text-align: center;
    min-width: 120px
}

._rankTitle_u21dw_467 {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 4px
}

._rankMainWithIcon_u21dw_479 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

._rankIconLarge_u21dw_493 {
    height: 40px;
    width: auto;
    object-fit: contain
}

._rankMain_u21dw_479 {
    font-family: var(--font-display);
    font-size: 26px;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.2
}

._rankMax_u21dw_521 {
    font-size: 11px;
    color: var(--text-muted);
    margin-top: 4px
}

._thirdPartyMiniWrapper_u21dw_535 {
    display: flex;
    flex-direction: column;
    gap: 6px
}

._thirdPartyMiniLoading_u21dw_547 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 160px;
    height: 70px;
    background: #0000004d;
    border-radius: var(--border-radius);
    color: var(--text-muted);
    font-size: 18px
}

._thirdPartyMini_u21dw_535 {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: var(--border-radius-sm);
    min-width: 160px;
    cursor: default;
    transition: transform var(--transition-fast)
}

._thirdPartyMini_u21dw_535:hover {
    transform: translate(2px)
}

._thirdParty5E_u21dw_603 {
    background: linear-gradient(135deg, #f39c1226, #f39c120d);
    border: 1px solid rgba(243, 156, 18, .3)
}

._thirdPartyWM_u21dw_613 {
    background: linear-gradient(135deg, #3498db26, #3498db0d);
    border: 1px solid rgba(52, 152, 219, .3)
}

._thirdPartyLogo_u21dw_623 {
    width: 24px;
    height: 24px;
    object-fit: contain;
    flex-shrink: 0
}

._thirdPartyMiniContent_u21dw_637 {
    flex: 1;
    min-width: 0
}

._thirdPartyMiniName_u21dw_647 {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 1px
}

._thirdPartyMiniStats_u21dw_667 {
    display: flex;
    gap: 8px;
    font-size: 10px
}

._thirdParty5E_u21dw_603 ._thirdPartyMiniElo_u21dw_679 {
    color: #f39c12
}

._thirdParty5E_u21dw_603 ._thirdPartyMiniRating_u21dw_687,
._thirdPartyWM_u21dw_613 ._thirdPartyMiniElo_u21dw_679,
._thirdPartyWM_u21dw_613 ._thirdPartyMiniRating_u21dw_687 {
    color: #3498db
}

._thirdPartyBanImg_u21dw_711 {
    position: absolute;
    top: 50%;
    left: 70%;
    transform: translate(-50%, -50%) rotate(-15deg);
    width: 80px;
    opacity: .9;
    pointer-events: none
}

._content_u21dw_733 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    padding: 20px 24px;
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

._tabs_u21dw_757 {
    height: 100%;
    display: flex;
    flex-direction: column
}

._tabs_u21dw_757 .ant-tabs-nav {
    margin-bottom: 16px;
    flex-shrink: 0
}

._tabs_u21dw_757 .ant-tabs-content-holder {
    flex: 1;
    overflow: hidden;
    min-height: 0
}

._tabs_u21dw_757 .ant-tabs-content {
    height: 100%
}

._tabs_u21dw_757 .ant-tabs-tabpane {
    height: 100%;
    overflow: hidden
}

._overview_u21dw_811 {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%
}

._typeSwitch_u21dw_827 {
    display: flex;
    justify-content: flex-start;
    flex-shrink: 0
}

._sectionTitle_u21dw_839 {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 8px
}

._sectionTitle_u21dw_839 .anticon {
    color: var(--color-primary)
}

._coreStats_u21dw_869 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    flex: 1;
    min-height: 0
}

@media (max-width: 1100px) {
    ._coreStats_u21dw_869 {
        grid-template-columns: 1fr
    }
}

._statsColumn_u21dw_897 {
    background: #0003;
    border-radius: var(--border-radius);
    padding: 16px
}

._sideColumn_u21dw_909 {
    display: flex;
    flex-direction: column;
    gap: 16px
}

._statsGrid_u21dw_923 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 14px
}

@media (max-width: 600px) {
    ._statsGrid_u21dw_923 {
        grid-template-columns: repeat(3, 1fr)
    }
}

._statItem_u21dw_949 {
    text-align: center;
    padding: 12px 8px;
    background: #0003;
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast)
}

._statItem_u21dw_949:hover {
    background: #0000004d
}

._statItem_u21dw_949._highlight_u21dw_973 {
    background: #00d4ff1a;
    border: 1px solid rgba(0, 212, 255, .2)
}

._statValue_u21dw_983 {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2
}

._statLabel_u21dw_999 {
    font-size: 11px;
    color: var(--text-muted);
    margin-top: 4px
}

._winLoseBar_u21dw_1013 {
    display: flex;
    height: 6px;
    border-radius: 3px;
    overflow: hidden;
    background: #0000004d
}

._winPart_u21dw_1029 {
    background: var(--color-success);
    transition: flex .5s ease
}

._drawPart_u21dw_1039 {
    background: var(--text-muted);
    transition: flex .5s ease
}

._losePart_u21dw_1049 {
    background: var(--color-danger);
    transition: flex .5s ease
}

._chartCard_u21dw_1061 {
    background: #0003;
    border-radius: var(--border-radius);
    padding: 16px;
    flex: 1
}

._mapCard_u21dw_1075 {
    background: #0003;
    border-radius: var(--border-radius);
    padding: 16px
}

._performanceChart_u21dw_1089 {
    display: flex;
    gap: 20px
}

._chartSection_u21dw_1099 {
    flex: 1
}

._chartHeader_u21dw_1107 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px
}

._chartLabel_u21dw_1121 {
    font-size: 12px;
    color: var(--text-muted)
}

._chartAvg_u21dw_1131 {
    font-size: 11px;
    color: var(--text-secondary)
}

._chartBars_u21dw_1141 {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 60px
}

._chartBar_u21dw_1141 {
    flex: 1;
    min-height: 4px;
    border-radius: 2px 2px 0 0;
    transition: all var(--transition-fast);
    cursor: pointer
}

._chartBar_u21dw_1141:hover {
    opacity: .8;
    transform: scaleY(1.05)
}

._mapGrid_u21dw_1183 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px
}

._mapItem_u21dw_1195 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    background: #0003;
    border-radius: var(--border-radius-sm)
}

._mapIcon_u21dw_1213 {
    width: 40px;
    height: 26px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0
}

._mapInfo_u21dw_1229 {
    flex: 1;
    min-width: 0
}

._mapName_u21dw_1239 {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    text-transform: capitalize;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._mapRecord_u21dw_1259 {
    font-size: 11px;
    color: var(--text-muted)
}

._mapWinRate_u21dw_1269 {
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0
}

._winRateGood_u21dw_1283 {
    color: var(--color-success)
}

._winRateBad_u21dw_1291 {
    color: var(--color-danger)
}

._noData_u21dw_1299 {
    text-align: center;
    padding: 20px;
    color: var(--text-muted);
    font-size: 13px;
    grid-column: 1 / -1
}

._noDataSmall_u21dw_1315 {
    text-align: center;
    padding: 16px;
    color: var(--text-muted);
    font-size: 12px
}

._matchListContainer_u21dw_1331 {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    overflow: hidden
}

._matchListScroll_u21dw_1347 {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px
}

._matchListScroll_u21dw_1347::-webkit-scrollbar {
    width: 8px
}

._matchListScroll_u21dw_1347::-webkit-scrollbar-track {
    background: #ffffff0d;
    border-radius: 4px
}

._matchListScroll_u21dw_1347::-webkit-scrollbar-thumb {
    background: #ffffff40;
    border-radius: 4px
}

._matchListScroll_u21dw_1347::-webkit-scrollbar-thumb:hover {
    background: #fff6
}

._matchList_u21dw_1331 {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding-bottom: 8px
}

._matchLoading_u21dw_1417 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    gap: 16px;
    color: var(--text-secondary)
}

._loadMoreContainer_u21dw_1439 {
    display: flex;
    justify-content: center;
    padding: 16px 0;
    flex-shrink: 0
}

._loadMoreBtn_u21dw_1453 {
    color: var(--text-secondary);
    font-size: 14px
}

._loadMoreBtn_u21dw_1453:hover {
    color: var(--color-primary)
}

._noMoreText_u21dw_1471 {
    color: var(--text-muted);
    font-size: 13px
}

._colMap_u21dw_1483 {
    flex: 2;
    min-width: 130px
}

._colResult_u21dw_1485,
._colScore_u21dw_1487 {
    flex: 1;
    min-width: 55px;
    text-align: center
}

._colType_u21dw_1489 {
    flex: 1.5;
    min-width: 90px;
    text-align: center
}

._colKda_u21dw_1491 {
    flex: 1.2;
    min-width: 80px;
    text-align: center
}

._colRating_u21dw_1493 {
    flex: 1;
    min-width: 60px;
    text-align: center
}

._colDamage_u21dw_1495 {
    flex: 1;
    min-width: 55px;
    text-align: center
}

._colChange_u21dw_1497 {
    flex: 1;
    min-width: 60px;
    text-align: center
}

._colTime_u21dw_1499 {
    flex: 1.2;
    min-width: 80px;
    text-align: right
}

._matchHeader_u21dw_1505 {
    display: flex;
    align-items: center;
    padding: 10px 28px 10px 16px;
    font-size: 12px;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-color);
    background: #0000004d;
    flex-shrink: 0
}

._matchItem_u21dw_1531 {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    background: #0003;
    border-radius: var(--border-radius-sm);
    border-left: 3px solid transparent;
    transition: all var(--transition-fast)
}

._matchItem_u21dw_1531:hover {
    background: #0000004d
}

._matchWin_u21dw_1559 {
    border-left-color: var(--color-success)
}

._matchLose_u21dw_1567 {
    border-left-color: var(--color-danger)
}

._matchDraw_u21dw_1575 {
    border-left-color: var(--text-muted)
}

._matchCell_u21dw_1585 {
    display: flex;
    align-items: center;
    justify-content: center
}

._matchCell_u21dw_1585._colMap_u21dw_1483 {
    justify-content: flex-start;
    gap: 10px
}

._matchCell_u21dw_1585._colTime_u21dw_1499 {
    justify-content: flex-end
}

._matchMapImg_u21dw_1617 {
    width: 48px;
    height: 32px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0
}

._matchMapName_u21dw_1633 {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    text-transform: capitalize
}

._resultWin_u21dw_1649 {
    display: inline-block;
    padding: 3px 10px;
    background: #00ff8826;
    color: var(--color-success);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600
}

._resultLose_u21dw_1669 {
    display: inline-block;
    padding: 3px 10px;
    background: #ff475726;
    color: var(--color-danger);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600
}

._resultDraw_u21dw_1689 {
    display: inline-block;
    padding: 3px 10px;
    background: #8a9cb526;
    color: var(--text-muted);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600
}

._matchScore_u21dw_1711 {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--text-secondary);
    display: flex;
    align-items: center
}

._scoreSep_u21dw_1729 {
    margin: 0 3px;
    color: var(--text-muted)
}

._myScore_u21dw_1739 {
    color: var(--color-primary)
}

._matchTypeBadge_u21dw_1749 {
    font-size: 12px;
    color: var(--text-secondary);
    padding: 3px 8px;
    background: #ffffff0d;
    border-radius: 4px;
    white-space: nowrap
}

._matchTypeGreen_u21dw_1767 {
    background: #10b98126;
    color: #10b981
}

._kdaValue_u21dw_1779 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary)
}

._ratingGood_u21dw_1793 {
    color: var(--color-success);
    font-weight: 600;
    font-size: 14px
}

._ratingBad_u21dw_1805 {
    color: var(--color-danger);
    font-weight: 600;
    font-size: 14px
}

._damageValue_u21dw_1819 {
    font-size: 13px;
    color: var(--text-secondary)
}

._rankChangeContainer_u21dw_1831 {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer
}

._rankIconSmall_u21dw_1845 {
    width: 32px;
    height: 32px;
    object-fit: contain
}

._rankScore_u21dw_1857 {
    font-size: 12px;
    color: var(--text-secondary);
    min-width: 28px
}

._rankUp_u21dw_1869 {
    color: var(--color-success);
    font-weight: 600;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 2px
}

._rankDown_u21dw_1887 {
    color: var(--color-danger);
    font-weight: 600;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 2px
}

._rankSame_u21dw_1905 {
    color: var(--text-muted);
    font-size: 12px
}

._placementProgress_u21dw_1915 {
    color: var(--color-warning);
    font-weight: 600;
    font-size: 12px
}

._matchTime_u21dw_1929 {
    font-size: 13px;
    color: var(--text-muted)
}

._placeholder_u21dw_1941 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 50px 20px;
    text-align: center;
    color: var(--text-secondary)
}

._placeholderIcon_u21dw_1961 {
    font-size: 48px;
    color: var(--color-primary);
    margin-bottom: 16px;
    opacity: .5
}

._placeholder_u21dw_1941 h3 {
    font-size: 18px;
    color: var(--text-primary);
    margin: 0 0 8px
}

._placeholder_u21dw_1941 p {
    margin: 0;
    color: var(--text-muted);
    font-size: 14px
}

@media (max-width: 1000px) {
    ._matchHeader_u21dw_1505 {
        display: none
    }
    ._matchItem_u21dw_1531 {
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px
    }
    ._matchCell_u21dw_1585 {
        flex: none !important;
        min-width: auto !important
    }
    ._matchCell_u21dw_1585._colMap_u21dw_1483 {
        flex: 1 1 100% !important
    }
    ._matchCell_u21dw_1585._colTime_u21dw_1499 {
        position: absolute;
        top: 12px;
        right: 12px
    }
    ._matchItem_u21dw_1531 {
        position: relative;
        padding-right: 80px
    }
    ._colResult_u21dw_1485,
    ._colScore_u21dw_1487,
    ._colType_u21dw_1489,
    ._colKda_u21dw_1491,
    ._colRating_u21dw_1493,
    ._colDamage_u21dw_1495,
    ._colChange_u21dw_1497 {
        flex: 0 0 auto !important
    }
}

@media (max-width: 768px) {
    ._headerContent_u21dw_95 {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px
    }
    ._headerLeft_u21dw_111 {
        width: 100%
    }
    ._headerRight_u21dw_125 {
        width: 100%;
        justify-content: center
    }
    ._performanceChart_u21dw_1089 {
        flex-direction: column;
        gap: 16px
    }
    ._mapGrid_u21dw_1183 {
        grid-template-columns: repeat(2, 1fr)
    }
}

._highlightLoading_u21dw_2127 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    gap: 16px;
    color: var(--text-secondary)
}

._highlightContainer_u21dw_2147 {
    height: 100%;
    overflow-y: auto;
    padding-right: 8px
}

._highlightContainer_u21dw_2147::-webkit-scrollbar {
    width: 6px
}

._highlightContainer_u21dw_2147::-webkit-scrollbar-track {
    background: #ffffff0d;
    border-radius: 3px
}

._highlightContainer_u21dw_2147::-webkit-scrollbar-thumb {
    background: #fff3;
    border-radius: 3px
}

._highlightGrid_u21dw_2187 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px
}

._highlightCard_u21dw_2199 {
    background: #0000004d;
    border-radius: var(--border-radius);
    overflow: hidden;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast)
}

._highlightCard_u21dw_2199:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px #0000004d
}

._highlightCover_u21dw_2223 {
    position: relative;
    aspect-ratio: 16 / 9;
    cursor: pointer;
    overflow: hidden
}

._highlightCover_u21dw_2223 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal)
}

._highlightCard_u21dw_2199:hover ._highlightCover_u21dw_2223 img {
    transform: scale(1.05)
}

._highlightOverlay_u21dw_2259 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0006;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity var(--transition-fast)
}

._highlightCard_u21dw_2199:hover ._highlightOverlay_u21dw_2259 {
    opacity: 1
}

._playIcon_u21dw_2295 {
    font-size: 48px;
    color: var(--color-primary);
    transition: transform var(--transition-fast)
}

._highlightCard_u21dw_2199:hover ._playIcon_u21dw_2295 {
    transform: scale(1.1)
}

._highlightType_u21dw_2315 {
    position: absolute;
    top: 8px;
    left: 8px;
    display: flex;
    gap: 4px
}

._highlightType_u21dw_2315 .ant-tag {
    margin: 0;
    font-size: 11px
}

._highlightInfo_u21dw_2341 {
    padding: 12px
}

._highlightMeta_u21dw_2349 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px
}

._highlightMap_u21dw_2363 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary)
}

._highlightRound_u21dw_2375 {
    font-size: 12px;
    color: var(--text-muted)
}

._highlightTime_u21dw_2385 {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 8px
}

._highlightStats_u21dw_2397 {
    display: flex;
    gap: 16px
}

._highlightStat_u21dw_2397 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-secondary)
}

._highlightStat_u21dw_2397._likeable_u21dw_2423 {
    cursor: pointer;
    transition: color var(--transition-fast)
}

._highlightStat_u21dw_2397._likeable_u21dw_2423:hover,
._highlightStat_u21dw_2397._liked_u21dw_2441 {
    color: var(--color-accent)
}

._highlightStatus_u21dw_2449 {
    margin-top: 8px;
    font-size: 11px;
    color: var(--text-muted);
    padding: 4px 8px;
    background: #ffffff0d;
    border-radius: 4px;
    text-align: center
}

._highlightStatus_u21dw_2449._statusError_u21dw_2469 {
    color: var(--color-danger);
    background: #ff47571a
}

._videoModal_u21dw_2481 .ant-modal-content {
    background: var(--bg-primary);
    padding: 0
}

._videoModal_u21dw_2481 .ant-modal-close {
    color: var(--text-primary)
}

._videoContainer_u21dw_2499 {
    display: flex;
    flex-direction: column
}

._videoPlayer_u21dw_2509 {
    width: 100%;
    max-height: 70vh;
    background: #000;
    border-radius: var(--border-radius) var(--border-radius) 0 0
}

._videoInfo_u21dw_2523 {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--bg-secondary);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    font-size: 14px;
    color: var(--text-primary)
}

._videoInfo_u21dw_2523 .ant-tag {
    margin: 0
}

@media (max-width: 768px) {
    ._highlightGrid_u21dw_2187 {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px
    }
    ._highlightInfo_u21dw_2341 {
        padding: 10px
    }
    ._highlightMap_u21dw_2363 {
        font-size: 13px
    }
}

._thirdPartySection_u21dw_2585 {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .1)
}

._thirdPartyLoading_u21dw_2597 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-muted);
    padding: 20px 0
}

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

._thirdPartyCard_u21dw_2625 {
    background: #0000004d !important;
    border: 1px solid rgba(255, 255, 255, .1) !important
}

._thirdPartyCard_u21dw_2625 .ant-card-head {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    min-height: auto;
    padding: 8px 12px
}

._thirdPartyCard_u21dw_2625 .ant-card-head-title {
    padding: 0
}

._thirdPartyCard_u21dw_2625 .ant-card-body {
    padding: 12px
}

._thirdPartyCardHeader_u21dw_2663 {
    display: flex;
    align-items: center;
    justify-content: space-between
}

._thirdPartyPlatform_u21dw_2675 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary)
}

._thirdPartyRefresh_u21dw_2687 {
    color: var(--text-muted);
    padding: 2px 6px
}

._thirdPartyRefresh_u21dw_2687:hover {
    color: var(--color-primary)
}

._thirdPartyContent_u21dw_2705 {
    display: flex;
    flex-direction: column;
    gap: 10px
}

._thirdPartyStatus_u21dw_2717 {
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px
}

._thirdPartyBasic_u21dw_2731 {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center
}

._thirdPartyNickname_u21dw_2745 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    margin-right: 8px
}

._thirdPartyBasic_u21dw_2731 .ant-tag {
    margin: 0;
    font-size: 11px
}

._thirdPartyStats_u21dw_2769 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px
}

._thirdPartyStat_u21dw_2717 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 4px;
    background: #ffffff08;
    border-radius: 4px
}

._thirdPartyStatValue_u21dw_2799 {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary)
}

._thirdPartyStatLabel_u21dw_2811 {
    font-size: 11px;
    color: var(--text-muted);
    margin-top: 2px
}

._thirdPartyExtra_u21dw_2823 {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 12px;
    color: var(--text-secondary);
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, .05)
}

._thirdPartyError_u21dw_2843 {
    color: var(--text-muted);
    font-size: 13px;
    text-align: center;
    padding: 16px 0
}

@media (max-width: 1200px) {
    ._thirdPartyGrid_u21dw_2613 {
        grid-template-columns: 1fr
    }
}

@media (max-width: 768px) {
    ._thirdPartyStats_u21dw_2769 {
        grid-template-columns: repeat(2, 1fr)
    }
}

._page_1em6s_3 {
    position: relative;
    max-width: 1400px;
    margin: 0 auto;
    height: calc(100vh - 120px);
    display: flex;
    flex-direction: column;
    overflow: hidden
}

._loading_1em6s_23,
._empty_1em6s_25 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
    color: var(--text-secondary)
}

._backBtn_1em6s_45 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    color: var(--text-secondary);
    font-size: 14px
}

._backBtn_1em6s_45:hover {
    color: var(--color-primary)
}

._header_1em6s_73 {
    position: relative;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    overflow: hidden;
    margin-bottom: 8px;
    flex-shrink: 0
}

._mapBackground_1em6s_95 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    opacity: .25
}

._headerOverlay_1em6s_117 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, #0a0e1466, #0a0e14b3)
}

._headerContent_1em6s_143 {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 60px
}

._teamScore_1em6s_163 {
    text-align: center;
    min-width: 100px
}

._teamLabel_1em6s_173 {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 2px;
    text-transform: uppercase;
    letter-spacing: 1px
}

._score_1em6s_189 {
    font-family: var(--font-display);
    font-size: 36px;
    font-weight: 700;
    line-height: 1
}

._team1Score_1em6s_203 ._score_1em6s_189 {
    color: #5d79ae
}

._team2Score_1em6s_211 ._score_1em6s_189 {
    color: #de9b35
}

._winTag_1em6s_219 {
    margin-top: 4px;
    font-size: 11px
}

._matchInfo_1em6s_231 {
    text-align: center;
    flex: 1
}

._mapName_1em6s_241 {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    margin-bottom: 0
}

._typeName_1em6s_259 {
    font-size: 13px;
    color: var(--color-primary);
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

._greenTag_1em6s_279,
._cancelTag_1em6s_281 {
    font-size: 10px;
    padding: 0 5px;
    line-height: 16px
}

._matchMeta_1em6s_293 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 11px;
    color: var(--text-secondary);
    margin-bottom: 0
}

._matchId_1em6s_313 {
    font-family: var(--font-mono);
    background: #ffffff0d;
    padding: 2px 8px;
    border-radius: 4px
}

._matchRegion_1em6s_327 {
    background: #1890ff1a;
    color: var(--color-primary);
    padding: 2px 8px;
    border-radius: 4px
}

._matchTime_1em6s_341 {
    font-size: 11px;
    color: var(--text-muted)
}

._demoBtn_1em6s_353 {
    position: absolute;
    bottom: 12px;
    right: 12px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: var(--color-primary);
    color: var(--bg-primary);
    border-radius: var(--border-radius);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all var(--transition-fast)
}

._demoBtn_1em6s_353:hover {
    background: var(--color-primary-dark)
}

._teamsContainer_1em6s_399 {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-height: 0;
    overflow: hidden
}

._teamCard_1em6s_417 {
    flex: 1;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0
}

._team1Card_1em6s_441 {
    border-color: #5d79ae66
}

._team2Card_1em6s_449 {
    border-color: #de9b3566
}

._playerTable_1em6s_459 {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 4px 12px;
    min-height: 0
}

._playerList_1em6s_475 {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0
}

._tableHeader_1em6s_489 {
    display: flex;
    align-items: center;
    padding: 4px 12px;
    font-size: 11px;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0
}

._teamResult_1em6s_509 {
    font-weight: 600;
    margin-left: 10px;
    font-size: 13px
}

._winText_1em6s_521 {
    color: #5d79ae
}

._loseText_1em6s_529 {
    color: #de9b35
}

._playerRow_1em6s_537 {
    display: flex;
    align-items: center;
    padding: 0 12px;
    height: 38px;
    min-height: 38px;
    border-radius: var(--border-radius-sm);
    transition: background var(--transition-fast);
    cursor: pointer;
    flex-shrink: 0
}

._playerRow_1em6s_537:hover {
    background: #ffffff0d
}

._mvpRow_1em6s_569 {
    background: #ffd7000d
}

._mvpRow_1em6s_569:hover {
    background: #ffd7001a
}

._colPlayer_1em6s_587 {
    flex: 0 0 14%;
    min-width: 140px
}

._colStat_1em6s_597 {
    flex: 1;
    text-align: center;
    min-width: 40px
}

._colStatWide_1em6s_609 {
    flex: 1.2;
    text-align: center;
    min-width: 50px
}

._colMulti_1em6s_621,
._colClutch_1em6s_631 {
    flex: 1.5;
    min-width: 90px
}

._colRank_1em6s_641 {
    flex: 0 0 100px;
    text-align: right;
    min-width: 95px
}

._playerInfo_1em6s_655 {
    display: flex;
    align-items: center;
    gap: 6px
}

._mvpIcon_1em6s_667 {
    color: gold;
    font-size: 14px;
    flex-shrink: 0
}

._playerAvatar_1em6s_679 {
    flex-shrink: 0
}

._playerMeta_1em6s_687 {
    display: flex;
    flex-direction: column;
    min-width: 0
}

._playerName_1em6s_699 {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._playerRankOld_1em6s_723 {
    font-size: 11px;
    color: var(--text-muted)
}

._statusTag_1em6s_733 {
    font-size: 10px;
    padding: 0 4px;
    line-height: 16px;
    border-radius: 2px
}

._abnormalIcon_1em6s_747 {
    color: var(--color-warning);
    font-size: 12px
}

._statValue_1em6s_759 {
    font-size: 14px;
    color: var(--text-primary)
}

._statValue_1em6s_759._rating_1em6s_769 {
    font-weight: 600;
    font-size: 15px
}

._statValue_1em6s_759._positive_1em6s_779 {
    color: var(--color-success)
}

._statValue_1em6s_759._negative_1em6s_787 {
    color: var(--color-danger)
}

._badgeContainer_1em6s_797 {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center
}

._multiBadge_1em6s_811 {
    display: inline-block;
    padding: 2px 6px;
    background: #ff6b6b33;
    color: var(--color-accent);
    border-radius: 3px;
    font-size: 11px;
    font-weight: 500
}

._clutchBadge_1em6s_831 {
    display: inline-block;
    padding: 2px 6px;
    background: #00d4ff26;
    color: var(--color-primary);
    border-radius: 3px;
    font-size: 11px;
    font-weight: 500
}

._moreBadge_1em6s_851 {
    display: inline-block;
    padding: 2px 4px;
    background: #ffffff1a;
    color: var(--text-muted);
    border-radius: 3px;
    font-size: 10px
}

._noBadge_1em6s_869 {
    color: var(--text-muted);
    font-size: 13px
}

._rankInfo_1em6s_881 {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px
}

._rankIconMatch_1em6s_895 {
    height: 24px;
    width: auto;
    object-fit: contain
}

._rankOldValue_1em6s_907 {
    font-size: 12px;
    color: var(--text-primary);
    font-weight: 500
}

._rankChange_1em6s_919 {
    font-size: 11px;
    font-weight: 500;
    color: var(--text-muted)
}

._rankChange_1em6s_919._rankUp_1em6s_931 {
    color: var(--color-success)
}

._rankChange_1em6s_919._rankDown_1em6s_939 {
    color: var(--color-danger)
}

._scoreBreakdown_1em6s_949 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 4px
}

._halfScore_1em6s_969 {
    font-weight: 500;
    color: var(--text-secondary)
}

._halfScoreLabel_1em6s_979 {
    font-weight: 500;
    color: var(--text-secondary);
    font-size: 12px
}

._halfSeparator_1em6s_991 {
    color: var(--text-muted)
}

._overtimeSeparator_1em6s_999 {
    color: var(--color-warning);
    margin: 0 2px
}

._overtimeScore_1em6s_1009 {
    color: var(--color-warning);
    font-weight: 500
}

._tabsContainer_1em6s_1021 {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column
}

._tabsContainer_1em6s_1021 .ant-tabs-content {
    flex: 1;
    min-height: 0;
    overflow: auto
}

._tabsContainer_1em6s_1021 .ant-tabs-tabpane {
    height: 100%
}

._overviewContent_1em6s_1055 {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 6px
}

._roundBar_1em6s_1071 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    flex-shrink: 0;
    gap: 5px
}

._roundColumn_1em6s_1091 {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    gap: 2px
}

._roundColumn_1em6s_1091._halfSeparator_1em6s_991:after {
    content: "";
    position: absolute;
    right: -5px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--text-muted)
}

._roundIconTop_1em6s_1129,
._roundIconBottom_1em6s_1131 {
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center
}

._roundIconTop_1em6s_1129 {
    align-items: flex-end
}

._roundIconBottom_1em6s_1131 {
    align-items: flex-start
}

._roundLineSegment_1em6s_1161 {
    width: 100%;
    min-width: 24px;
    height: 4px;
    background: var(--border-color)
}

._roundLineSegment_1em6s_1161._team1Line_1em6s_1175 {
    background: #5d79ae
}

._roundLineSegment_1em6s_1161._team2Line_1em6s_1183 {
    background: #de9b35
}

._roundReasonIcon_1em6s_1191 {
    width: 18px;
    height: 18px;
    opacity: .9;
    cursor: pointer;
    transition: transform var(--transition-fast)
}

._roundReasonIcon_1em6s_1191:hover {
    transform: scale(1.2)
}

._roundReasonIcon_1em6s_1191._team1Icon_1em6s_1215 {
    filter: brightness(0) saturate(100%) invert(48%) sepia(13%) saturate(1000%) hue-rotate(182deg)
}

._roundReasonIcon_1em6s_1191._team2Icon_1em6s_1223 {
    filter: brightness(0) saturate(100%) invert(65%) sepia(50%) saturate(500%) hue-rotate(10deg)
}

._statValueHighlight_1em6s_1233 {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-primary);
    cursor: help
}

._confrontationTable_1em6s_1249 {
    padding: 16px;
    overflow: auto;
    flex: 1;
    display: flex;
    flex-direction: column
}

._confrontationTable_1em6s_1249 table {
    border-collapse: collapse;
    width: 100%;
    flex: 1
}

._confrontationTable_1em6s_1249 th,
._confrontationTable_1em6s_1249 td {
    padding: 10px 16px;
    text-align: center;
    border: 1px solid var(--border-color);
    font-size: 14px
}

._cornerCell_1em6s_1293 {
    position: relative;
    width: 120px;
    height: 50px;
    background: var(--bg-glass)
}

._cornerDiagonal_1em6s_1307 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(to bottom right, transparent calc(50% - 1px), var(--border-color) calc(50% - 1px), var(--border-color) calc(50% + 1px), transparent calc(50% + 1px))
}

._cornerTeam1_1em6s_1331 {
    position: absolute;
    bottom: 4px;
    right: 8px;
    font-size: 11px;
    color: #5d79ae
}

._cornerTeam2_1em6s_1347 {
    position: absolute;
    top: 4px;
    left: 8px;
    font-size: 11px;
    color: #de9b35
}

._headerCell_1em6s_1363 {
    background: #5d79ae1a;
    vertical-align: middle
}

._headerPlayerInfo_1em6s_1373 {
    display: flex;
    align-items: center;
    gap: 8px
}

._headerPlayerName_1em6s_1385 {
    font-size: 12px;
    color: #5d79ae;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._rowHeader_1em6s_1403 {
    background: #de9b351a
}

._rowPlayerInfo_1em6s_1411 {
    display: flex;
    align-items: center;
    gap: 8px
}

._rowPlayerName_1em6s_1423 {
    font-size: 12px;
    color: #de9b35;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._dataCell_1em6s_1441 {
    background: var(--bg-glass);
    min-width: 60px
}

._killCount_1em6s_1451 {
    color: #de9b35;
    font-weight: 600
}

._separator_1em6s_1461 {
    color: var(--text-muted);
    margin: 0 4px
}

._deathCount_1em6s_1471 {
    color: #5d79ae;
    font-weight: 600
}

._roundsDetail_1em6s_1483 {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px
}

._roundSelector_1em6s_1497 {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
    padding: 12px;
    background: var(--bg-glass);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color)
}

._roundBtn_1em6s_1519 {
    width: 36px;
    height: 40px;
    border-radius: 4px;
    border: 1px solid transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    cursor: pointer;
    transition: all var(--transition-fast);
    background: transparent
}

._roundBtn_1em6s_1519:hover {
    transform: scale(1.1)
}

._roundBtn_1em6s_1519._team1WinBtn_1em6s_1557 {
    background: #5d79ae26;
    border-color: #5d79ae66
}

._roundBtn_1em6s_1519._team2WinBtn_1em6s_1567 {
    background: #de9b3526;
    border-color: #de9b3566
}

._roundBtn_1em6s_1519._selectedRound_1em6s_1577 {
    border-color: var(--color-primary);
    box-shadow: 0 0 8px #00d4ff80
}

._roundNum_1em6s_1587 {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary)
}

._roundBtnIcon_1em6s_1599 {
    width: 14px;
    height: 14px;
    filter: brightness(0) invert(1);
    opacity: .7
}

._killsList_1em6s_1615 {
    background: var(--bg-glass);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    padding: 12px;
    min-height: 200px
}

._noKills_1em6s_1631 {
    text-align: center;
    color: var(--text-muted);
    padding: 40px
}

._killRow_1em6s_1643 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    border-radius: var(--border-radius);
    transition: background var(--transition-fast)
}

._killRow_1em6s_1643:hover {
    background: #ffffff0d
}

._killTime_1em6s_1669 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-muted);
    min-width: 50px
}

._killAttacker_1em6s_1687 {
    font-weight: 500;
    min-width: 120px;
    text-align: right
}

._killVictim_1em6s_1699 {
    font-weight: 500;
    min-width: 120px
}

._team1Player_1em6s_1709 {
    color: #5d79ae
}

._team2Player_1em6s_1717 {
    color: #de9b35
}

._killWeapon_1em6s_1725 {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 80px;
    justify-content: center
}

._weaponIcon_1em6s_1741 {
    height: 20px;
    width: auto
}

._headshotIcon_1em6s_1751 {
    width: 20px;
    height: 20px;
    object-fit: contain;
    margin-left: 4px
}

._killAssist_1em6s_1765 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-muted);
    margin-left: auto
}

._assistLabel_1em6s_1783 {
    opacity: .7
}

._assisterName_1em6s_1791 {
    color: var(--text-secondary)
}

@media (max-width: 1200px) {
    ._colMulti_1em6s_621,
    ._colClutch_1em6s_631 {
        flex: 0 0 80px;
        min-width: 70px
    }
}

@media (max-width: 1000px) {
    ._colMulti_1em6s_621,
    ._colClutch_1em6s_631 {
        display: none
    }
    ._colPlayer_1em6s_587 {
        flex: 0 0 130px;
        min-width: 120px
    }
}

@media (max-width: 768px) {
    ._headerContent_1em6s_143 {
        padding: 20px 30px
    }
    ._score_1em6s_189 {
        font-size: 42px
    }
    ._mapName_1em6s_241 {
        font-size: 24px
    }
    ._colPlayer_1em6s_587 {
        flex: 0 0 110px;
        min-width: 100px
    }
    ._playerName_1em6s_699,
    ._statValue_1em6s_759 {
        font-size: 12px
    }
    ._tableHeader_1em6s_489 {
        font-size: 11px
    }
    ._roundBar_1em6s_1071 {
        flex-wrap: wrap
    }
    ._roundDot_1em6s_1909 {
        width: 20px;
        height: 20px
    }
    ._roundReasonIcon_1em6s_1191 {
        width: 12px;
        height: 12px
    }
}

._page_rsp7n_1 {
    padding: 24px;
    height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px) - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-width: 100%
}

._header_rsp7n_21 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-shrink: 0
}

._title_rsp7n_37 {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px
}

._title_rsp7n_37 .anticon {
    color: var(--primary-color)
}

._content_rsp7n_65 {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--bg-secondary);
    border-radius: var(--border-radius);
    overflow: hidden;
    min-width: 0
}

._tabs_rsp7n_85 {
    flex-shrink: 0;
    padding: 0 20px;
    border-bottom: 1px solid var(--border-color)
}

._tabs_rsp7n_85 .ant-tabs-nav {
    margin-bottom: 0
}

._tabLabel_rsp7n_105 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px
}

._listContainer_rsp7n_119 {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 16px 20px;
    min-width: 0
}

._loading_rsp7n_137 {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: var(--text-muted)
}

._listHeader_rsp7n_157 {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    background: #0003;
    border-radius: var(--border-radius-sm);
    font-size: 13px;
    color: var(--text-muted);
    font-weight: 500;
    flex-shrink: 0;
    margin-bottom: 8px
}

._colRank_rsp7n_183 {
    width: 80px;
    text-align: center
}

._colUser_rsp7n_193 {
    flex: 1
}

._colScore_rsp7n_201 {
    width: 120px;
    text-align: center
}

._colTime_rsp7n_211 {
    width: 100px;
    text-align: center
}

._colBanTime_rsp7n_221 {
    width: 150px;
    text-align: center
}

._colSteamId_rsp7n_231,
._colMatch_rsp7n_241 {
    width: 180px;
    text-align: center
}

._list_rsp7n_119 {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0
}

._list_rsp7n_119::-webkit-scrollbar {
    width: 6px
}

._list_rsp7n_119::-webkit-scrollbar-track {
    background: #0000001a;
    border-radius: 3px
}

._list_rsp7n_119::-webkit-scrollbar-thumb {
    background: #fff3;
    border-radius: 3px
}

._list_rsp7n_119::-webkit-scrollbar-thumb:hover {
    background: #ffffff4d
}

._rankItem_rsp7n_307 {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    background: #00000026;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    transition: all var(--transition-fast);
    min-width: 0;
    flex-shrink: 0
}

._rankItem_rsp7n_307:hover {
    background: #00000040;
    transform: translate(4px)
}

._rankItem_rsp7n_307._top1_rsp7n_341 {
    background: linear-gradient(135deg, #ffd70026, #ffd7000d);
    border: 1px solid rgba(255, 215, 0, .3)
}

._rankItem_rsp7n_307._top2_rsp7n_351 {
    background: linear-gradient(135deg, #c0c0c026, #c0c0c00d);
    border: 1px solid rgba(192, 192, 192, .3)
}

._rankItem_rsp7n_307._top3_rsp7n_361 {
    background: linear-gradient(135deg, #cd7f3226, #cd7f320d);
    border: 1px solid rgba(205, 127, 50, .3)
}

._rankIndex_rsp7n_371 {
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center
}

._rankNum_rsp7n_385 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-muted)
}

._medalGold_rsp7n_397 {
    font-size: 24px;
    color: gold
}

._medalSilver_rsp7n_407 {
    font-size: 22px;
    color: silver
}

._medalBronze_rsp7n_417 {
    font-size: 20px;
    color: #cd7f32
}

._userInfo_rsp7n_427 {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0
}

._userMeta_rsp7n_443 {
    flex: 1;
    min-width: 0
}

._username_rsp7n_453 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 6px
}

._onlineDot_rsp7n_471 {
    width: 8px;
    height: 8px;
    background: #52c41a;
    border-radius: 50%;
    animation: _pulse_rsp7n_1 2s infinite
}

@keyframes _pulse_rsp7n_1 {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}

._userTags_rsp7n_497 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px
}

._level_rsp7n_511 {
    font-size: 11px;
    color: var(--primary-color);
    background: #40a9ff26;
    padding: 2px 6px;
    border-radius: 4px
}

._levelIcon_rsp7n_527 {
    height: 20px;
    width: auto;
    object-fit: contain
}

._levelIconSmall_rsp7n_539 {
    height: 16px;
    width: auto;
    object-fit: contain
}

._teamTag_rsp7n_551 {
    font-size: 11px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 4px
}

._rankIcon_rsp7n_567 {
    height: 32px;
    width: auto;
    object-fit: contain
}

._rankIconSmall_rsp7n_579 {
    height: 24px;
    width: auto;
    object-fit: contain
}

._rankScore_rsp7n_591 {
    width: 120px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px
}

._scoreValue_rsp7n_609 {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color)
}

._scoreLabel_rsp7n_621 {
    font-size: 11px;
    color: var(--text-muted)
}

._regTime_rsp7n_631 {
    width: 100px;
    text-align: center;
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

._banItem_rsp7n_655 {
    border-left: 3px solid var(--error-color)
}

._banTag_rsp7n_663 {
    margin-left: 6px;
    font-size: 10px
}

._banReason_rsp7n_673 {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 4px;
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._colBanRank_rsp7n_693 {
    width: 80px;
    text-align: center
}

._banRankInfo_rsp7n_703 {
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

._banTime_rsp7n_719 {
    width: 150px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px
}

._banTxt_rsp7n_735 {
    font-size: 14px;
    font-weight: 600;
    color: var(--error-color)
}

._banTimeAgo_rsp7n_747 {
    font-size: 11px;
    color: var(--text-muted)
}

._steamId_rsp7n_757 {
    width: 180px;
    text-align: center;
    font-size: 12px;
    color: var(--text-muted);
    font-family: monospace
}

._cheaterItem_rsp7n_775 {
    border-left: 3px solid var(--warning-color)
}

._cheaterMeta_rsp7n_783 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px
}

._matchId_rsp7n_797 {
    width: 180px;
    text-align: center;
    font-size: 12px;
    color: var(--text-muted);
    font-family: monospace
}

._pagination_rsp7n_815 {
    display: flex;
    justify-content: center;
    padding-top: 16px;
    flex-shrink: 0
}

@media (max-width: 1200px) {
    ._page_rsp7n_1 {
        padding: 16px
    }
    ._colRank_rsp7n_183 {
        width: 60px
    }
    ._colScore_rsp7n_201 {
        width: 100px
    }
    ._colTime_rsp7n_211 {
        width: 80px
    }
    ._colBanTime_rsp7n_221 {
        width: 120px
    }
    ._colSteamId_rsp7n_231 {
        width: 140px
    }
    ._rankIndex_rsp7n_371 {
        width: 60px
    }
    ._rankScore_rsp7n_591 {
        width: 100px
    }
    ._regTime_rsp7n_631 {
        width: 80px
    }
    ._banTime_rsp7n_719 {
        width: 120px
    }
    ._steamId_rsp7n_757 {
        width: 140px
    }
}

@media (max-width: 768px) {
    ._header_rsp7n_21 {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start
    }
    ._colTime_rsp7n_211,
    ._regTime_rsp7n_631,
    ._colSteamId_rsp7n_231,
    ._steamId_rsp7n_757 {
        display: none
    }
}

._pageContent_3l9yq_11 {
    max-width: 1400px;
    margin: 0 auto
}

._header_3l9yq_23 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding: 20px 24px;
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    flex-wrap: wrap;
    gap: 16px
}

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

._titleIcon_3l9yq_65 {
    font-size: 32px;
    color: var(--color-primary);
    filter: drop-shadow(0 0 8px var(--color-primary-glow))
}

._title_3l9yq_53 {
    font-size: 26px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    font-family: var(--font-display);
    letter-spacing: 1px;
    text-shadow: 0 0 20px var(--color-primary-glow)
}

._roomCount_3l9yq_97 {
    font-size: 13px;
    color: var(--color-primary);
    padding: 6px 14px;
    background: #00d4ff1a;
    border: 1px solid rgba(0, 212, 255, .3);
    border-radius: 20px;
    font-weight: 500
}

._actions_3l9yq_117 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap
}

._filterSelect_3l9yq_131 {
    min-width: 130px
}

._filterSelect_3l9yq_131 .ant-select-selector {
    background: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    height: 36px !important
}

._filterSelect_3l9yq_131 .ant-select-selection-placeholder,
._filterSelect_3l9yq_131 .ant-select-selection-item {
    line-height: 34px !important
}

._slotFilter_3l9yq_161 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    color: var(--text-secondary);
    font-size: 13px;
    transition: all var(--transition-normal)
}

._slotFilter_3l9yq_161:hover {
    border-color: var(--color-primary)
}

._autoRefresh_3l9yq_195 {
    display: flex;
    align-items: center
}

._autoRefreshBtn_3l9yq_205 {
    min-width: 80px;
    height: 36px !important;
    font-weight: 500
}

._content_3l9yq_219 {
    min-height: 300px
}

._loading_3l9yq_227,
._empty_3l9yq_229 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 20px;
    color: var(--text-secondary);
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._empty_3l9yq_229 .ant-empty-description {
    color: var(--text-muted);
    font-size: 15px
}

._roomList_3l9yq_271 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
    gap: 20px
}

._roomCard_3l9yq_285 {
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
    transition: all var(--transition-normal);
    position: relative
}

._roomCard_3l9yq_285:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-dark));
    opacity: 0;
    transition: opacity var(--transition-normal)
}

._roomCard_3l9yq_285:hover {
    transform: translateY(-2px)
}

._roomCard_3l9yq_285:hover:before {
    opacity: 1
}

._roomHeader_3l9yq_347 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color)
}

._roomTags_3l9yq_365 {
    display: flex;
    gap: 8px
}

._roomTags_3l9yq_365 .ant-tag {
    margin: 0;
    border-radius: 4px;
    font-weight: 500
}

._roomTime_3l9yq_387 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--text-muted)
}

._roomTime_3l9yq_387 .anticon {
    font-size: 13px
}

._roomBody_3l9yq_411 {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    padding: 18px;
    gap: 18px
}

._roomInfo_3l9yq_427 {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column
}

._captain_3l9yq_443 {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px
}

._captainAvatar_3l9yq_457 {
    flex-shrink: 0;
    border: 2px solid var(--color-primary) !important;
    box-shadow: 0 0 12px var(--color-primary-glow)
}

._captainInfo_3l9yq_469 {
    min-width: 0;
    flex: 1
}

._captainName_3l9yq_479 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px
}

._crownIcon_3l9yq_499 {
    color: gold;
    font-size: 15px;
    filter: drop-shadow(0 0 4px rgba(255, 215, 0, .5))
}

._captainRank_3l9yq_511 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary)
}

._rankIcon_3l9yq_527 {
    width: 22px;
    height: 22px;
    object-fit: contain
}

._roomTitle_3l9yq_541 {
    font-size: 14px;
    color: var(--text-primary);
    margin-bottom: 14px;
    padding: 12px 14px;
    background: #00d4ff0d;
    border-radius: var(--border-radius-sm);
    border-left: 3px solid var(--color-primary);
    line-height: 1.6;
    word-break: break-word;
    flex: 1
}

._playerList_3l9yq_569 {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: auto
}

._playerList_3l9yq_569 .ant-avatar-group {
    display: flex;
    flex-wrap: nowrap
}

._playerList_3l9yq_569 .ant-avatar {
    border: 2px solid var(--bg-tertiary) !important;
    transition: all var(--transition-fast)
}

._playerList_3l9yq_569 .ant-avatar:hover {
    transform: scale(1.1);
    z-index: 10
}

._playerCount_3l9yq_613 {
    font-size: 15px;
    color: var(--text-secondary);
    font-weight: 600;
    padding: 4px 10px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-sm)
}

._roomAction_3l9yq_633 {
    display: flex;
    align-items: flex-end
}

._joinBtn_3l9yq_643 {
    height: 44px !important;
    min-width: 90px;
    font-weight: 600;
    font-size: 15px;
    border-radius: var(--border-radius-sm) !important
}

._joinBtn_3l9yq_643:not(:disabled):hover {
    transform: scale(1.02)
}

@media (max-width: 900px) {
    ._page_3l9yq_3 {
        padding: 16px
    }
    ._header_3l9yq_23 {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px
    }
    ._actions_3l9yq_117 {
        width: 100%;
        justify-content: flex-start
    }
    ._roomList_3l9yq_271 {
        grid-template-columns: 1fr
    }
}

@media (max-width: 600px) {
    ._roomBody_3l9yq_411 {
        flex-direction: column
    }
    ._roomAction_3l9yq_633 {
        width: 100%;
        margin-top: 12px
    }
    ._joinBtn_3l9yq_643 {
        width: 100%
    }
    ._filterSelect_3l9yq_131 {
        min-width: 100%
    }
    ._actions_3l9yq_117 {
        flex-direction: column;
        align-items: stretch
    }
    ._slotFilter_3l9yq_161 {
        justify-content: center
    }
}

._page_1vtwm_1 {
    padding: 24px;
    min-height: calc(100vh - 80px);
    position: relative
}

._header_1vtwm_15 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    position: relative;
    z-index: 1
}

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

._headerIcon_1vtwm_45 {
    font-size: 28px;
    color: var(--color-primary)
}

._title_1vtwm_55 {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0
}

._headerRight_1vtwm_71 {
    display: flex;
    gap: 20px
}

._balanceItem_1vtwm_81 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--bg-glass-light);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    font-size: 14px;
    color: var(--text-secondary)
}

._balanceItem_1vtwm_81 .anticon {
    color: var(--color-primary)
}

._balanceValue_1vtwm_113 {
    font-weight: 600;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._tabs_1vtwm_127 {
    position: relative;
    z-index: 1
}

._tabs_1vtwm_127 .ant-tabs-nav {
    margin-bottom: 24px
}

._tabs_1vtwm_127 .ant-tabs-tab {
    font-size: 15px;
    padding: 10px 20px
}

._loading_1vtwm_157 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    gap: 16px;
    color: var(--text-muted)
}

._itemGrid_1vtwm_179 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 20px
}

._itemCard_1vtwm_193 {
    background: var(--bg-card);
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
    overflow: hidden;
    transition: all .3s ease
}

._itemCard_1vtwm_193:hover {
    transform: translateY(-4px);
    border-color: var(--border-glow);
    box-shadow: 0 8px 30px #0000004d, 0 0 20px var(--color-primary-glow)
}

._itemImage_1vtwm_221 {
    height: 160px;
    background: linear-gradient(135deg, #00d4ff1a, #0003);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden
}

._itemImage_1vtwm_221 img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

._itemIconPlaceholder_1vtwm_253 {
    font-size: 64px;
    color: var(--color-primary);
    opacity: .5
}

._limitTag_1vtwm_265 {
    position: absolute;
    top: 10px;
    right: 10px
}

._itemInfo_1vtwm_277 {
    padding: 16px
}

._itemName_1vtwm_285 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px
}

._itemDesc_1vtwm_299 {
    font-size: 13px;
    color: var(--text-secondary);
    margin: 0 0 12px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

._itemPrice_1vtwm_321 {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 16px
}

._itemPrice_1vtwm_321 .anticon {
    color: var(--color-primary);
    font-size: 16px
}

._priceValue_1vtwm_345 {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._priceCurrency_1vtwm_359 {
    font-size: 12px;
    color: var(--text-muted)
}

._priceOriginal_1vtwm_369 {
    font-size: 13px;
    color: var(--text-muted);
    text-decoration: line-through;
    margin-left: 8px
}

._buyBtn_1vtwm_383 {
    width: 100%;
    height: 40px;
    font-weight: 500
}

._inventoryGrid_1vtwm_397 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px
}

._propCard_1vtwm_411 {
    background: var(--bg-card);
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
    padding: 16px;
    display: flex;
    gap: 12px;
    transition: all .3s ease
}

._propCard_1vtwm_411:hover {
    border-color: var(--border-glow)
}

._propImage_1vtwm_439 {
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: #00d4ff1a;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

._propImage_1vtwm_439 img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

._propIconPlaceholder_1vtwm_473 {
    font-size: 28px;
    color: var(--color-primary);
    opacity: .6
}

._propInfo_1vtwm_485 {
    flex: 1;
    min-width: 0
}

._propName_1vtwm_495 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 4px
}

._propDesc_1vtwm_509 {
    font-size: 12px;
    color: var(--text-secondary);
    margin: 0 0 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._propTime_1vtwm_527 {
    font-size: 11px;
    color: var(--text-muted);
    margin-bottom: 8px
}

._useBtn_1vtwm_539 {
    font-size: 12px
}

._purchaseModal_1vtwm_549 .ant-modal-content {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color)
}

._purchaseModal_1vtwm_549 .ant-modal-header {
    background: transparent !important;
    border-bottom: 1px solid var(--border-color) !important
}

._purchaseModal_1vtwm_549 .ant-modal-title {
    color: var(--text-primary) !important
}

._purchaseContent_1vtwm_577 {
    padding: 16px 0
}

._purchaseItem_1vtwm_585 {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border-color)
}

._purchaseImage_1vtwm_601 {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    background: #00d4ff1a;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

._purchaseImage_1vtwm_601 img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

._purchaseIconPlaceholder_1vtwm_635 {
    font-size: 36px;
    color: var(--color-primary);
    opacity: .6
}

._purchaseInfo_1vtwm_647 {
    flex: 1
}

._purchaseInfo_1vtwm_647 h3 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px
}

._purchaseInfo_1vtwm_647 p {
    font-size: 13px;
    color: var(--text-secondary);
    margin: 0
}

._purchaseRow_1vtwm_681 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px
}

._purchaseRow_1vtwm_681>span:first-child {
    color: var(--text-secondary)
}

._purchasePrice_1vtwm_703 {
    font-weight: 500;
    color: var(--text-primary)
}

._purchaseTotalPrice_1vtwm_713 {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._purchaseActions_1vtwm_727 {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--border-color)
}

@media (max-width: 768px) {
    ._page_1vtwm_1 {
        padding: 16px
    }
    ._header_1vtwm_15 {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }
    ._headerRight_1vtwm_71 {
        width: 100%;
        justify-content: flex-end
    }
    ._itemGrid_1vtwm_179 {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 12px
    }
    ._itemImage_1vtwm_221 {
        height: 120px
    }
    ._inventoryGrid_1vtwm_397 {
        grid-template-columns: 1fr
    }
}

._page_ikcp0_1 {
    padding: 24px;
    min-height: 100%
}

._header_ikcp0_11 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px
}

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

._headerIcon_ikcp0_41 {
    font-size: 28px;
    color: var(--color-primary)
}

._title_ikcp0_51 {
    font-size: 24px;
    font-weight: 600;
    margin: 0;
    color: var(--text-primary)
}

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

._searchInput_ikcp0_77 {
    width: 240px
}

._content_ikcp0_85 {
    flex: 1
}

._loading_ikcp0_93 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 16px;
    color: var(--text-secondary)
}

._teamGrid_ikcp0_113 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px
}

._teamCard_ikcp0_125 {
    background: var(--bg-secondary);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    gap: 16px;
    cursor: pointer;
    transition: all .2s ease;
    border: 1px solid var(--border-color)
}

._teamCard_ikcp0_125:hover {
    transform: translateY(-2px);
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #00000026
}

._teamAvatar_ikcp0_159 {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: var(--bg-tertiary)
}

._teamAvatar_ikcp0_159 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._avatarPlaceholder_ikcp0_191 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: var(--text-tertiary);
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary))
}

._proBadge_ikcp0_213 {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 20px;
    height: 20px;
    background: linear-gradient(135deg, gold, orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: #fff
}

._teamInfo_ikcp0_243 {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px
}

._teamName_ikcp0_259 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

._proTag_ikcp0_279 {
    font-size: 11px;
    margin: 0
}

._teamDesc_ikcp0_289 {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

._teamMeta_ikcp0_309 {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    color: var(--text-tertiary)
}

._metaItem_ikcp0_325 {
    display: flex;
    align-items: center;
    gap: 4px
}

._rankIcon_ikcp0_337 {
    width: 18px;
    height: 18px;
    margin: 0 2px
}

._teamTags_ikcp0_349 {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

._teamTags_ikcp0_349 .ant-tag {
    margin: 0;
    font-size: 11px
}

._pagination_ikcp0_371 {
    margin-top: 32px;
    display: flex;
    justify-content: center
}

._formActions_ikcp0_383 {
    margin-bottom: 0;
    margin-top: 24px;
    display: flex;
    justify-content: flex-end;
    gap: 12px
}

._formActions_ikcp0_383 .ant-form-item-control-input-content {
    display: flex;
    gap: 12px
}

@media (max-width: 768px) {
    ._page_ikcp0_1 {
        padding: 16px
    }
    ._header_ikcp0_11 {
        flex-direction: column;
        align-items: stretch
    }
    ._headerRight_ikcp0_65 {
        flex-direction: column
    }
    ._searchInput_ikcp0_77 {
        width: 100%
    }
    ._teamGrid_ikcp0_113 {
        grid-template-columns: 1fr
    }
    ._teamCard_ikcp0_125 {
        padding: 16px
    }
    ._teamAvatar_ikcp0_159 {
        width: 60px;
        height: 60px
    }
}

._page_rlkjx_1 {
    padding: 24px;
    min-height: 100%
}

._loading_rlkjx_11 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 16px;
    color: var(--text-secondary);
    min-height: 60vh
}

._empty_rlkjx_33 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 24px;
    min-height: 60vh
}

._header_rlkjx_55 {
    background: var(--bg-secondary);
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid var(--border-color)
}

._headerContent_rlkjx_71 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    flex-wrap: wrap
}

._headerLeft_rlkjx_87 {
    display: flex;
    gap: 20px;
    flex: 1;
    min-width: 0
}

._teamAvatar_rlkjx_101 {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    background: var(--bg-tertiary)
}

._teamAvatar_rlkjx_101 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._avatarPlaceholder_rlkjx_133 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: var(--text-tertiary);
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary))
}

._proBadge_rlkjx_155 {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, gold, orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #fff
}

._teamInfo_rlkjx_185 {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px
}

._teamName_rlkjx_201 {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap
}

._teamDesc_rlkjx_221 {
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.5
}

._teamMeta_rlkjx_233 {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 13px;
    color: var(--text-tertiary);
    flex-wrap: wrap
}

._metaItem_rlkjx_251 {
    display: flex;
    align-items: center;
    gap: 6px
}

._rankIcon_rlkjx_263 {
    width: 20px;
    height: 20px;
    margin: 0 2px
}

._teamTags_rlkjx_275 {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

._teamTags_rlkjx_275 .ant-tag {
    margin: 0
}

._headerRight_rlkjx_295 {
    display: flex;
    gap: 12px;
    flex-shrink: 0
}

._section_rlkjx_309 {
    background: var(--bg-secondary);
    border-radius: 16px;
    padding: 24px;
    border: 1px solid var(--border-color)
}

._sectionTitle_rlkjx_323 {
    font-size: 18px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 8px
}

._memberGrid_rlkjx_343 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px
}

._memberCard_rlkjx_355 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s ease;
    border: 1px solid transparent
}

._memberCard_rlkjx_355:hover {
    border-color: var(--color-primary);
    background: var(--bg-secondary)
}

._memberAvatar_rlkjx_389 {
    position: relative;
    flex-shrink: 0
}

._onlineBadge_rlkjx_399 {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 12px;
    height: 12px;
    background: var(--color-success);
    border: 2px solid var(--bg-tertiary);
    border-radius: 50%
}

._memberInfo_rlkjx_421 {
    flex: 1;
    min-width: 0
}

._memberName_rlkjx_431 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

._roleTag_rlkjx_451 {
    font-size: 11px;
    padding: 0 6px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 3px
}

._memberRank_rlkjx_469 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-secondary);
    margin-top: 4px
}

._memberRankIcon_rlkjx_487 {
    width: 16px;
    height: 16px
}

._memberJoinTime_rlkjx_497 {
    font-size: 12px;
    color: var(--text-tertiary);
    flex-shrink: 0
}

@media (max-width: 768px) {
    ._page_rlkjx_1,
    ._header_rlkjx_55 {
        padding: 16px
    }
    ._headerContent_rlkjx_71 {
        flex-direction: column
    }
    ._headerLeft_rlkjx_87 {
        flex-direction: column;
        align-items: center;
        text-align: center
    }
    ._teamInfo_rlkjx_185 {
        align-items: center
    }
    ._teamMeta_rlkjx_233,
    ._teamTags_rlkjx_275 {
        justify-content: center
    }
    ._headerRight_rlkjx_295 {
        width: 100%;
        justify-content: center
    }
    ._memberGrid_rlkjx_343 {
        grid-template-columns: 1fr
    }
    ._section_rlkjx_309 {
        padding: 16px
    }
}

._page_kthcd_1 {
    padding: 24px;
    min-height: 100%
}

._loading_kthcd_11 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 16px;
    color: var(--text-secondary);
    min-height: 60vh
}

._empty_kthcd_33 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    gap: 24px;
    min-height: 60vh
}

._header_kthcd_55 {
    margin-bottom: 24px
}

._backBtn_kthcd_63 {
    margin-bottom: 12px;
    padding-left: 0;
    color: var(--text-secondary)
}

._backBtn_kthcd_63:hover {
    color: var(--color-primary)
}

._title_kthcd_83 {
    font-size: 22px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px
}

._content_kthcd_105 {
    background: var(--bg-secondary);
    border-radius: 16px;
    padding: 24px;
    border: 1px solid var(--border-color)
}

._tabs_kthcd_119 .ant-tabs-nav {
    margin-bottom: 24px
}

._settingsTab_kthcd_129 {
    max-width: 600px
}

._settingsForm_kthcd_137 {
    margin-bottom: 40px
}

._dangerZone_kthcd_145 {
    border-top: 1px solid var(--border-color);
    padding-top: 24px
}

._dangerTitle_kthcd_155 {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-danger);
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    gap: 8px
}

._dangerActions_kthcd_175 {
    display: flex;
    gap: 12px
}

._membersTab_kthcd_187 {
    width: 100%
}

._memberList_kthcd_195 {
    display: flex;
    flex-direction: column;
    gap: 8px
}

._memberItem_kthcd_207 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-radius: 10px;
    gap: 16px
}

._memberInfo_kthcd_227 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    cursor: pointer
}

._memberInfo_kthcd_227:hover ._memberName_kthcd_245 {
    color: var(--color-primary)
}

._memberAvatar_kthcd_253 {
    position: relative;
    flex-shrink: 0
}

._onlineBadge_kthcd_263 {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 10px;
    height: 10px;
    background: var(--color-success);
    border: 2px solid var(--bg-tertiary);
    border-radius: 50%
}

._memberDetails_kthcd_285 {
    flex: 1;
    min-width: 0
}

._memberName_kthcd_245 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    transition: color .2s
}

._roleTag_kthcd_317 {
    font-size: 11px;
    padding: 0 6px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 3px
}

._memberRank_kthcd_335 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-secondary);
    margin-top: 4px
}

._memberRankIcon_kthcd_353 {
    width: 16px;
    height: 16px
}

._memberJoinTime_kthcd_363 {
    margin-left: 12px;
    color: var(--text-tertiary)
}

._memberActions_kthcd_373 {
    display: flex;
    gap: 8px;
    flex-shrink: 0
}

._appliesTab_kthcd_387 {
    width: 100%
}

._applyList_kthcd_395 {
    display: flex;
    flex-direction: column;
    gap: 8px
}

._applyItem_kthcd_407 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-radius: 10px;
    gap: 16px
}

._applyInfo_kthcd_427 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    cursor: pointer
}

._applyInfo_kthcd_427:hover ._applyName_kthcd_445 {
    color: var(--color-primary)
}

._applyAvatar_kthcd_453 {
    flex-shrink: 0
}

._applyDetails_kthcd_461 {
    flex: 1;
    min-width: 0
}

._applyName_kthcd_445 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    transition: color .2s
}

._applyRank_kthcd_485 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-secondary);
    margin-top: 4px
}

._applyRankIcon_kthcd_503 {
    width: 16px;
    height: 16px
}

._applyTime_kthcd_513 {
    margin-left: 12px;
    color: var(--text-tertiary)
}

._applyActions_kthcd_523 {
    display: flex;
    gap: 8px;
    flex-shrink: 0
}

@media (max-width: 768px) {
    ._page_kthcd_1,
    ._content_kthcd_105 {
        padding: 16px
    }
    ._memberItem_kthcd_207,
    ._applyItem_kthcd_407 {
        flex-direction: column;
        align-items: stretch;
        gap: 12px
    }
    ._memberActions_kthcd_373,
    ._applyActions_kthcd_523 {
        justify-content: flex-end
    }
    ._memberRank_kthcd_335,
    ._applyRank_kthcd_485 {
        flex-wrap: wrap
    }
    ._memberJoinTime_kthcd_363,
    ._applyTime_kthcd_513 {
        margin-left: 0;
        display: block;
        width: 100%
    }
}

._container_fd2ja_1 {
    padding: 24px;
    min-height: 100%
}

._loading_fd2ja_11 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px
}

._title_fd2ja_25 {
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 32px;
    display: flex;
    align-items: center;
    gap: 12px
}

._title_fd2ja_25 .anticon {
    color: #faad14
}

._section_fd2ja_53 {
    margin-bottom: 40px
}

._sectionTitle_fd2ja_61 {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 20px;
    padding-left: 12px;
    border-left: 4px solid #faad14
}

._vipCards_fd2ja_81 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

@media (max-width: 1200px) {
    ._vipCards_fd2ja_81 {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 768px) {
    ._vipCards_fd2ja_81 {
        grid-template-columns: 1fr
    }
}

._vipCard_fd2ja_81 {
    background: #ffffff0d;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    overflow: hidden;
    transition: all .3s ease;
    height: 100%;
    display: flex;
    flex-direction: column
}

._vipCard_fd2ja_81:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px #0000004d;
    border-color: #fff3
}

._vipCard_fd2ja_81 .ant-card-body {
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column
}

._vipCardHeader_fd2ja_165 {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff
}

._vipIcon_fd2ja_181 {
    font-size: 28px
}

._vipName_fd2ja_189 {
    font-size: 20px;
    font-weight: 600
}

._vipCardBody_fd2ja_199 {
    padding: 20px;
    background: #0000004d;
    flex: 1;
    display: flex;
    flex-direction: column
}

._statusRow_fd2ja_215 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    color: #fffc;
    font-size: 14px
}

._statusLabel_fd2ja_233 {
    color: #fff9
}

._statusValue_fd2ja_241 {
    color: #fff
}

._remainingDays_fd2ja_249 {
    color: #52c41a;
    font-weight: 500
}

._statusInfo_fd2ja_259 {
    flex: 1;
    min-height: 72px
}

._purchaseBtn_fd2ja_269 {
    margin-top: auto;
    height: 40px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px
}

._featureCard_fd2ja_287 {
    background: #ffffff0d;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px
}

._featureCard_fd2ja_287 .ant-card-body {
    padding: 0
}

._featureCard_fd2ja_287 .ant-table {
    background: transparent
}

._featureCard_fd2ja_287 .ant-table-thead>tr>th {
    background: #ffffff14;
    color: #fff;
    font-weight: 600;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

._featureCard_fd2ja_287 .ant-table-tbody>tr>td {
    background: transparent;
    color: #ffffffd9;
    border-bottom: 1px solid rgba(255, 255, 255, .06)
}

._featureCard_fd2ja_287 .ant-table-tbody>tr:hover>td {
    background: #ffffff0d
}

._purchaseModal_fd2ja_351 {
    display: flex;
    flex-direction: column;
    gap: 20px
}

._packageSection_fd2ja_363 {
    display: flex;
    flex-direction: column;
    gap: 10px
}

._packageLabel_fd2ja_375 {
    font-size: 14px;
    color: var(--text-secondary)
}

._packageOptions_fd2ja_385 {
    display: flex;
    gap: 10px;
    width: 100%
}

._packageOption_fd2ja_385 {
    flex: 1;
    height: auto !important;
    padding: 14px 8px !important;
    border-radius: var(--border-radius-sm) !important;
    background: var(--bg-glass-light) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    transition: all var(--transition-normal) !important
}

._packageOption_fd2ja_385:hover {
    border-color: var(--color-primary) !important;
    background: #00d4ff0d !important
}

._packageOption_fd2ja_385.ant-radio-button-wrapper-checked {
    border-color: var(--color-primary) !important;
    background: #00d4ff1a !important;
    box-shadow: 0 0 15px var(--color-primary-glow) !important
}

._packageInfo_fd2ja_441 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px
}

._packageName_fd2ja_455 {
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--text-primary)
}

._discountTag_fd2ja_471 {
    font-size: 11px;
    padding: 0 4px;
    line-height: 16px
}

._packagePrice_fd2ja_483 {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
    font-family: var(--font-display)
}

._payMethodSection_fd2ja_497 {
    display: flex;
    flex-direction: column;
    gap: 10px
}

._payMethodLabel_fd2ja_509 {
    font-size: 14px;
    color: var(--text-secondary)
}

._payMethods_fd2ja_519 {
    display: flex;
    gap: 8px;
    width: 100%
}

._payMethodBtn_fd2ja_531 {
    flex: 1;
    height: 44px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: var(--border-radius-sm) !important;
    background: var(--bg-glass-light) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    transition: all var(--transition-normal) !important;
    white-space: nowrap;
    font-size: 13px;
    padding: 0 12px !important
}

._payMethodBtn_fd2ja_531:hover {
    border-color: var(--color-primary) !important;
    background: #00d4ff0d !important
}

._payMethodBtn_fd2ja_531.ant-radio-button-wrapper-checked {
    border-color: var(--color-primary) !important;
    background: #00d4ff1a !important;
    box-shadow: 0 0 15px var(--color-primary-glow) !important
}

._priceSection_fd2ja_587 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._priceLabel_fd2ja_607 {
    font-size: 14px;
    color: var(--text-secondary)
}

._priceValue_fd2ja_617 {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._balanceWarning_fd2ja_631 {
    padding: 12px;
    background: #ff4d4f26;
    color: var(--color-danger);
    border-radius: var(--border-radius-sm);
    text-align: center;
    font-size: 14px;
    border: 1px solid rgba(255, 77, 79, .3)
}

._submitBtn_fd2ja_653 {
    height: 48px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: var(--border-radius-sm) !important;
    margin-top: 4px
}

._qrcodeModal_fd2ja_671 {
    text-align: center
}

._orderInfo_fd2ja_679 {
    margin-bottom: 20px
}

._orderAmount_fd2ja_687 {
    font-size: 32px;
    font-weight: 700;
    color: var(--text-primary);
    font-family: var(--font-display)
}

._orderCoins_fd2ja_701 {
    font-size: 14px;
    color: var(--color-primary);
    margin-top: 4px
}

._qrcodeWrapper_fd2ja_713 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px
}

._qrcode_fd2ja_671 {
    padding: 12px;
    background: #fff;
    border-radius: var(--border-radius)
}

._qrcodeTip_fd2ja_739 {
    margin-top: 12px;
    color: var(--text-secondary);
    font-size: 14px
}

._payActions_fd2ja_751 {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px
}

._backBtn_fd2ja_765 {
    min-width: 100px
}

._payTips_fd2ja_773 {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.8;
    text-align: left;
    padding: 12px;
    background: var(--bg-glass-light);
    border-radius: var(--border-radius-sm)
}

._payTips_fd2ja_773 p {
    margin: 0
}

._darkModal_fd2ja_803 .ant-modal-content {
    background: var(--bg-card) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color)
}

._darkModal_fd2ja_803 .ant-modal-header {
    background: transparent !important;
    border-bottom: 1px solid var(--border-color) !important;
    padding: 16px 24px
}

._darkModal_fd2ja_803 .ant-modal-body {
    padding: 24px
}

._darkModal_fd2ja_803 .ant-modal-title {
    color: var(--text-primary)
}

._darkModal_fd2ja_803 .ant-modal-close-x {
    color: var(--text-secondary)
}

._container_jkp6b_1 {
    padding: 24px;
    min-height: 100%
}

._header_jkp6b_11 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

._title_jkp6b_25 {
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0
}

._title_jkp6b_25 .anticon {
    color: var(--color-primary)
}

._filter_jkp6b_53 {
    display: flex;
    align-items: center;
    gap: 8px
}

._filterLabel_jkp6b_65 {
    color: var(--text-secondary);
    font-size: 14px
}

._loading_jkp6b_75 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px
}

._empty_jkp6b_89 {
    padding: 80px 0
}

._empty_jkp6b_89 .ant-empty-description {
    color: var(--text-muted)
}

._grid_jkp6b_107 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

@media (max-width: 1400px) {
    ._grid_jkp6b_107 {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (max-width: 1024px) {
    ._grid_jkp6b_107 {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 600px) {
    ._grid_jkp6b_107 {
        grid-template-columns: 1fr
    }
}

._card_jkp6b_157 {
    background: #ffffff0d;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    overflow: hidden;
    transition: all .3s ease
}

._card_jkp6b_157:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px #00d4ff33;
    border-color: var(--color-primary)
}

._card_jkp6b_157 .ant-card-body {
    padding: 16px
}

._card_jkp6b_157 .ant-card-cover {
    margin: 0
}

._coverWrapper_jkp6b_203 {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background: #00000080;
    overflow: hidden
}

._cover_jkp6b_203 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease
}

._card_jkp6b_157:hover ._cover_jkp6b_203 {
    transform: scale(1.05)
}

._defaultCover_jkp6b_247 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #00d4ff33, #0064964d);
    font-size: 48px;
    color: #ffffff4d
}

._liveTag_jkp6b_277 {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #ff4757e6;
    border-radius: 4px;
    color: #fff;
    font-size: 12px;
    font-weight: 500
}

._liveDot_jkp6b_307 {
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    animation: _pulse_jkp6b_1 1.5s ease-in-out infinite
}

@keyframes _pulse_jkp6b_1 {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}

._onlineTag_jkp6b_343 {
    position: absolute;
    bottom: 10px;
    right: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    background: #000000b3;
    border-radius: 4px;
    color: #fff;
    font-size: 12px
}

._platformIcon_jkp6b_373 {
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    background: #ffffffe6;
    padding: 2px
}

._cardBody_jkp6b_397 {
    display: flex;
    flex-direction: column;
    gap: 10px
}

._roomTitle_jkp6b_409 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._streamerInfo_jkp6b_429 {
    display: flex;
    align-items: center;
    gap: 8px
}

._streamerAvatar_jkp6b_441 {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover
}

._streamerAvatarDefault_jkp6b_455 {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #ffffff1a;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--text-muted)
}

._streamerName_jkp6b_479 {
    flex: 1;
    font-size: 13px;
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._platformTag_jkp6b_497 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--text-muted);
    padding: 2px 8px;
    background: #ffffff1a;
    border-radius: 3px
}

._platformTagIcon_jkp6b_519 {
    width: 14px;
    height: 14px;
    object-fit: contain
}

._pagination_jkp6b_533 {
    display: flex;
    justify-content: center;
    margin-top: 32px
}

._pagination_jkp6b_533 .ant-pagination-item {
    background: #ffffff0d;
    border-color: var(--border-color)
}

._pagination_jkp6b_533 .ant-pagination-item a {
    color: var(--text-primary)
}

._pagination_jkp6b_533 .ant-pagination-item-active {
    background: var(--color-primary);
    border-color: var(--color-primary)
}

._pagination_jkp6b_533 .ant-pagination-item-active a {
    color: #000
}

._pagination_jkp6b_533 .ant-pagination-total-text {
    color: var(--text-secondary)
}

._container_10ai1_1 {
    min-height: 100%;
    background: #000
}

._loading_10ai1_11 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh
}

._notFound_10ai1_25 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    color: var(--text-secondary);
    gap: 16px
}

._notFoundIcon_10ai1_45 {
    font-size: 64px;
    color: var(--text-muted)
}

._header_10ai1_57 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 16px 24px;
    z-index: 10;
    background: linear-gradient(180deg, rgba(0, 0, 0, .8) 0%, transparent 100%)
}

._backBtn_10ai1_77 {
    color: #fff !important
}

._backBtn_10ai1_77:hover {
    color: var(--color-primary) !important;
    background: #ffffff1a !important
}

._playerWrapper_10ai1_97 {
    width: 100%;
    background: #000
}

._playerContainer_10ai1_107 {
    position: relative;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
    background: #0a0a0a
}

._video_10ai1_125 {
    width: 100%;
    height: 100%;
    background: #000
}

._playerError_10ai1_137 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #000000e6;
    color: var(--text-secondary);
    gap: 16px
}

._playerError_10ai1_137 p {
    margin: 0
}

._offlineOverlay_10ai1_175 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #14141ef2, #0a0a0ffa);
    color: var(--text-muted);
    gap: 16px
}

._offlineIcon_10ai1_205 {
    font-size: 72px;
    opacity: .5
}

._offlineOverlay_10ai1_175 p {
    margin: 0;
    font-size: 18px
}

._infoSection_10ai1_227 {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    background: linear-gradient(180deg, #000000e6, #14141ef2)
}

._mainInfo_10ai1_241 {
    margin-bottom: 20px
}

._title_10ai1_249 {
    font-size: 22px;
    font-weight: 600;
    color: #fff;
    margin: 0 0 12px
}

._meta_10ai1_263 {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap
}

._liveTag_10ai1_277 {
    display: flex;
    align-items: center;
    gap: 6px
}

._liveDot_10ai1_289 {
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    animation: _pulse_10ai1_1 1.5s ease-in-out infinite
}

@keyframes _pulse_10ai1_1 {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}

._online_10ai1_323 {
    color: var(--text-secondary);
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px
}

._platform_10ai1_339 {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--text-muted);
    font-size: 13px;
    padding: 4px 10px;
    background: #ffffff14;
    border-radius: 4px
}

._platformIcon_10ai1_361 {
    width: 16px;
    height: 16px;
    object-fit: contain
}

._streamerSection_10ai1_375 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background: #ffffff0d;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, .1)
}

._streamerInfo_10ai1_395 {
    display: flex;
    align-items: center;
    gap: 16px
}

._streamerAvatar_10ai1_407 {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--color-primary)
}

._streamerAvatarDefault_10ai1_423 {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #ffffff1a;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--text-muted)
}

._streamerDetail_10ai1_447 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._streamerName_10ai1_459 {
    font-size: 18px;
    font-weight: 600;
    color: #fff
}

._roomId_10ai1_471 {
    font-size: 13px;
    color: var(--text-muted)
}

@media (max-width: 768px) {
    ._infoSection_10ai1_227 {
        padding: 16px
    }
    ._title_10ai1_249 {
        font-size: 18px
    }
    ._streamerSection_10ai1_375 {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start
    }
    ._streamerSection_10ai1_375 button {
        width: 100%
    }
}

._container_1ccmb_3 {
    min-height: calc(100vh - 64px);
    padding: 0 24px 24px;
    display: flex;
    gap: 24px;
    position: relative;
    align-items: flex-start
}

._sidebarPlaceholder_1ccmb_25 {
    width: 220px;
    flex-shrink: 0
}

._sidebarFixed_1ccmb_37 {
    position: fixed;
    top: calc(var(--header-height) + 24px);
    left: calc(var(--current-sidebar-width, var(--sidebar-width)) + 24px);
    width: 220px;
    z-index: 1000;
    transition: left var(--transition-normal)
}

._sidebarCard_1ccmb_57 {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 16px 0;
    width: 220px;
    max-height: calc(100vh - var(--header-height) - 48px);
    overflow-y: auto
}

._sidebarTitle_1ccmb_77 {
    padding: 0 20px 16px;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 8px
}

._navList_1ccmb_95 {
    list-style: none;
    padding: 0;
    margin: 0
}

._navItem_1ccmb_107 {
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: var(--text-secondary);
    transition: all var(--transition-normal);
    border-left: 3px solid transparent
}

._navItem_1ccmb_107:hover {
    background: #00d4ff0d;
    color: var(--text-primary)
}

._navItem_1ccmb_107._active_1ccmb_139 {
    background: #00d4ff1a;
    color: var(--color-primary);
    border-left-color: var(--color-primary)
}

._navIcon_1ccmb_151 {
    font-size: 16px
}

._navLabel_1ccmb_159 {
    font-size: 14px;
    font-weight: 500
}

._content_1ccmb_171 {
    flex: 1;
    min-width: 0;
    padding-bottom: 80px
}

._contentCard_1ccmb_183 {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 24px
}

._contentHeader_1ccmb_197 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-color)
}

._contentTitle_1ccmb_215 {
    font-size: 20px;
    font-weight: 700;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 10px
}

._contentTitleIcon_1ccmb_233 {
    font-size: 22px;
    color: var(--color-primary)
}

._section_1ccmb_245 {
    margin-bottom: 32px
}

._section_1ccmb_245:last-child {
    margin-bottom: 0
}

._sectionTitle_1ccmb_261 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-left: 12px;
    border-left: 3px solid var(--color-primary)
}

._settingItem_1ccmb_281 {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    margin-bottom: 12px;
    transition: all var(--transition-normal)
}

._settingItem_1ccmb_281:hover {
    border-color: var(--color-primary);
    background: #00d4ff08
}

._settingItem_1ccmb_281:last-child {
    margin-bottom: 0
}

._settingInfo_1ccmb_323 {
    flex: 1;
    min-width: 0
}

._settingLabel_1ccmb_333 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px
}

._settingDesc_1ccmb_347 {
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.5
}

._settingControl_1ccmb_359 {
    flex-shrink: 0;
    margin-left: 24px;
    display: flex;
    align-items: center;
    gap: 8px
}

._avatarSection_1ccmb_377 {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    margin-bottom: 12px
}

._avatarPreview_1ccmb_399 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--color-primary);
    box-shadow: 0 0 20px var(--color-primary-glow)
}

._avatarPreview_1ccmb_399 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._avatarPlaceholder_1ccmb_429 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-glass);
    color: var(--text-muted);
    font-size: 32px
}

._avatarInfo_1ccmb_451 {
    flex: 1
}

._avatarInfo_1ccmb_451 h4 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px
}

._avatarInfo_1ccmb_451 p {
    font-size: 12px;
    color: var(--text-muted);
    margin: 0
}

._pathInput_1ccmb_487 {
    display: flex;
    gap: 8px;
    width: 100%
}

._pathInput_1ccmb_487 .ant-input {
    flex: 1;
    font-family: Consolas, Monaco, monospace;
    font-size: 12px
}

._pathTip_1ccmb_511 {
    margin-top: 12px;
    padding: 12px 16px;
    background: #ffaa001a;
    border: 1px solid rgba(255, 170, 0, .3);
    border-radius: var(--border-radius-sm);
    font-size: 12px;
    color: var(--color-warning)
}

._rateSection_1ccmb_533 {
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    margin-bottom: 12px
}

._rateHeader_1ccmb_549 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px
}

._rateInfo_1ccmb_563 {
    flex: 1
}

._rateInfo_1ccmb_563 h4 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 4px
}

._rateInfo_1ccmb_563 p {
    font-size: 12px;
    color: var(--text-muted);
    margin: 0
}

._rateValue_1ccmb_597 {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-display)
}

._rateSlider_1ccmb_611 {
    margin-bottom: 16px
}

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

._rateTestResult_1ccmb_631 {
    font-size: 13px;
    color: var(--text-secondary)
}

._rateTestResult_1ccmb_631 span {
    color: var(--color-primary);
    font-weight: 600
}

._optionGroup_1ccmb_653 {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

._optionBtn_1ccmb_665 {
    min-width: 100px
}

._helpLink_1ccmb_675 {
    font-size: 12px;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 8px
}

._helpLink_1ccmb_675:hover {
    text-decoration: underline
}

._loading_1ccmb_703 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px
}

._saveBar_1ccmb_719 {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translate(-50%);
    background: var(--bg-card);
    border: 1px solid var(--color-primary);
    border-radius: var(--border-radius-lg);
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    box-shadow: 0 8px 32px #0006, 0 0 20px var(--color-primary-glow);
    z-index: 9999;
    width: fit-content
}

._saveBarText_1ccmb_755 {
    color: var(--text-secondary);
    font-size: 14px
}

._speedTest_1ccmb_767 {
    padding: 12px 16px;
    background: #00d4ff0d;
    border-radius: var(--border-radius-sm);
    margin-top: 12px
}

._speedTestProgress_1ccmb_781 {
    margin-bottom: 8px
}

._speedTestInfo_1ccmb_789 {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--text-secondary)
}

._speedTestInfo_1ccmb_789 span:last-child {
    color: var(--color-primary);
    font-weight: 600
}

@media (max-width: 900px) {
    ._container_1ccmb_3 {
        flex-direction: column
    }
    ._sidebar_1ccmb_25 {
        width: 100%
    }
    ._sidebarCard_1ccmb_57 {
        position: static;
        width: 100%;
        max-height: none
    }
    ._navList_1ccmb_95 {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding: 0 16px
    }
    ._navItem_1ccmb_107 {
        padding: 8px 16px;
        border-left: none;
        border-radius: var(--border-radius-sm);
        border: 1px solid var(--border-color)
    }
    ._navItem_1ccmb_107._active_1ccmb_139 {
        border-color: var(--color-primary)
    }
    ._settingItem_1ccmb_281 {
        flex-direction: column;
        gap: 12px
    }
    ._settingControl_1ccmb_359 {
        margin-left: 0;
        width: 100%;
        justify-content: flex-end
    }
    ._avatarSection_1ccmb_377 {
        flex-direction: column;
        text-align: center
    }
    ._bindingItem_1ccmb_913 {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start
    }
    ._bindingActions_1ccmb_925 {
        width: 100%;
        justify-content: flex-end
    }
}

._bindingItem_1ccmb_913 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-md);
    transition: all var(--transition-fast)
}

._bindingItem_1ccmb_913:hover {
    border-color: var(--color-primary)
}

._bindingInfo_1ccmb_969 {
    display: flex;
    align-items: center;
    gap: 16px
}

._bindingIcon_1ccmb_981 {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff
}

._bindingDetails_1ccmb_1003 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._bindingName_1ccmb_1015 {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary)
}

._bindingStatus_1ccmb_1027 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary)
}

._bindingActions_1ccmb_925 {
    display: flex;
    gap: 8px
}

._bindingTip_1ccmb_1053 {
    margin-top: 12px;
    padding: 12px 16px;
    background: #00d4ff0d;
    border: 1px solid rgba(0, 212, 255, .2);
    border-radius: var(--border-radius-sm);
    font-size: 13px;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px
}

._bindingTip_1ccmb_1053 a {
    color: var(--color-primary);
    text-decoration: none
}

._bindingTip_1ccmb_1053 a:hover {
    text-decoration: underline
}

._withdrawInfo_1ccmb_1097 {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--text-secondary);
    font-size: 14px
}

._qrcodeContainer_1ccmb_1115 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 0
}

._qrcodeWrapper_1ccmb_1129 {
    padding: 16px;
    background: #fff;
    border-radius: var(--border-radius-md);
    margin-bottom: 20px
}

._qrcodeLoading_1ccmb_1143 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 40px 0;
    color: var(--text-secondary)
}

._qrcodeTip_1ccmb_1161 {
    font-size: 15px;
    color: var(--text-primary);
    margin-bottom: 8px
}

._qrcodeTip_1ccmb_1161 strong {
    color: var(--color-primary)
}

._qrcodeNote_1ccmb_1181 {
    font-size: 13px;
    color: var(--text-muted);
    text-align: center;
    max-width: 280px
}

._qrcodeError_1ccmb_1195 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 40px 0;
    color: var(--text-secondary)
}

._resourceWarning_1ccmb_1215 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #faad141a;
    border: 1px solid rgba(250, 173, 20, .3);
    border-radius: var(--border-radius-md);
    color: #faad14;
    font-size: 14px;
    margin-bottom: 24px
}

._resourceItem_1ccmb_1241 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    transition: all .2s ease
}

._resourceItem_1ccmb_1241:hover {
    background: var(--bg-tertiary)
}

._resourceInfo_1ccmb_1269 {
    display: flex;
    align-items: center;
    gap: 16px
}

._resourceIcon_1ccmb_1281 {
    width: 48px;
    height: 48px;
    border-radius: var(--border-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff
}

._resourceDetails_1ccmb_1303 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._resourceName_1ccmb_1315 {
    font-size: 15px;
    font-weight: 500;
    color: var(--text-primary)
}

._resourceDesc_1ccmb_1327 {
    font-size: 13px;
    color: var(--text-muted)
}

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

._cacheCard_1ccmb_1351 {
    padding: 20px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    border: 1px solid var(--border-color);
    transition: all .2s ease
}

._cacheCard_1ccmb_1351:hover {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary)
}

._cacheHeader_1ccmb_1377 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px
}

._cacheTitle_1ccmb_1391 {
    font-size: 15px;
    font-weight: 500;
    color: var(--text-primary)
}

._cacheStats_1ccmb_1403 {
    display: flex;
    gap: 24px;
    margin-bottom: 16px
}

._cacheStat_1ccmb_1403 {
    display: flex;
    flex-direction: column;
    gap: 4px
}

._cacheValue_1ccmb_1427 {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-primary)
}

._cacheLabel_1ccmb_1439 {
    font-size: 12px;
    color: var(--text-muted)
}

._cacheEmpty_1ccmb_1449 {
    color: var(--text-muted);
    font-size: 14px;
    padding: 8px 0
}

._gpuOptimizeContent_1ccmb_1463 {
    line-height: 1.8
}

._gpuOptimizeContent_1ccmb_1463 p {
    margin-bottom: 12px;
    color: var(--text-primary)
}

._gpuOptimizeContent_1ccmb_1463 a {
    color: var(--color-primary);
    text-decoration: none
}

._gpuOptimizeContent_1ccmb_1463 a:hover {
    text-decoration: underline
}

._gpuImage_1ccmb_1499 {
    margin: 20px 0;
    text-align: center
}

._gpuImage_1ccmb_1499 img {
    max-width: 100%;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--border-color)
}

._addressForm_1ccmb_1523 {
    display: flex;
    flex-direction: column;
    gap: 20px
}

._formRow_1ccmb_1535 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px
}

._formItem_1ccmb_1547 {
    display: flex;
    flex-direction: column;
    gap: 8px
}

._labelOptional_1ccmb_1559 {
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 400
}

._formActions_1ccmb_1571 {
    display: flex;
    gap: 12px;
    margin-top: 8px
}

._placeholderContainer_1ccmb_1585 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    text-align: center
}

._placeholderIcon_1ccmb_1603 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-primary), #722ed1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    color: #fff;
    margin-bottom: 24px
}

._placeholderTitle_1ccmb_1629 {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 12px
}

._placeholderDesc_1ccmb_1643 {
    font-size: 15px;
    color: var(--text-muted);
    margin-bottom: 32px
}

._placeholderFeatures_1ccmb_1655 {
    display: flex;
    gap: 32px
}

._placeholderFeature_1ccmb_1655 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    color: var(--text-secondary);
    font-size: 14px
}

._placeholderFeature_1ccmb_1655 .anticon {
    font-size: 24px;
    color: var(--color-primary)
}

._aboutContainer_1ccmb_1701 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px;
    text-align: center
}

._aboutLogo_1ccmb_1717 {
    width: 100px;
    height: 100px;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 24px;
    box-shadow: 0 8px 24px #0000004d
}

._logoImage_1ccmb_1735 {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._aboutTitle_1ccmb_1747 {
    font-size: 28px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 8px
}

._aboutSlogan_1ccmb_1761 {
    font-size: 15px;
    color: var(--text-muted);
    margin-bottom: 32px
}

._aboutInfo_1ccmb_1773 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px 40px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-lg);
    margin-bottom: 32px;
    min-width: 280px
}

._aboutInfoItem_1ccmb_1795 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-color)
}

._aboutInfoItem_1ccmb_1795:last-child {
    border-bottom: none
}

._aboutInfoLabel_1ccmb_1819 {
    font-size: 14px;
    color: var(--text-muted)
}

._aboutInfoValue_1ccmb_1829 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary)
}

._aboutLinks_1ccmb_1841 {
    display: flex;
    gap: 16px;
    margin-bottom: 40px
}

._aboutLink_1ccmb_1841 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    color: var(--text-secondary);
    text-decoration: none;
    transition: all .2s ease
}

._aboutLink_1ccmb_1841:hover {
    background: var(--bg-tertiary);
    color: var(--color-primary);
    transform: translateY(-2px)
}

._aboutLink_1ccmb_1841 .anticon {
    font-size: 18px
}

._aboutFooter_1ccmb_1897 {
    display: flex;
    flex-direction: column;
    gap: 8px
}

._copyright_1ccmb_1909,
._madeWith_1ccmb_1919 {
    font-size: 13px;
    color: var(--text-muted)
}

._loginHistoryTable_1ccmb_1931 {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: var(--border-radius-md);
    overflow: hidden
}

._loginHistoryHeader_1ccmb_1945 {
    display: flex;
    background: #ffffff0d;
    padding: 12px 16px;
    font-weight: 500;
    color: var(--text-secondary);
    font-size: 13px;
    border-bottom: 1px solid rgba(255, 255, 255, .08)
}

._loginHistoryRow_1ccmb_1965 {
    display: flex;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .05);
    transition: background .15s ease
}

._loginHistoryRow_1ccmb_1965:last-child {
    border-bottom: none
}

._loginHistoryRow_1ccmb_1965:hover {
    background: #ffffff08
}

._loginHistoryCol_1ccmb_1995 {
    display: flex;
    align-items: center;
    font-size: 13px;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 8px
}

._loginHistoryCol_1ccmb_1995 .anticon {
    color: var(--text-muted);
    flex-shrink: 0
}

._loginHistoryCoords_1ccmb_2027 {
    margin-left: 6px;
    font-size: 11px;
    color: var(--text-muted)
}

._loginHistoryPagination_1ccmb_2039 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .08)
}

._paginationInfo_1ccmb_2057 {
    font-size: 13px;
    color: var(--text-muted)
}

._paginationButtons_1ccmb_2067 {
    display: flex;
    gap: 8px
}

._loginHistoryEmpty_1ccmb_2077 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: var(--text-muted)
}

._loginHistoryEmpty_1ccmb_2077 p {
    margin: 0;
    font-size: 14px
}

._container_1irrm_3 {
    position: relative;
    width: 100%;
    height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px) - 48px);
    display: flex;
    flex-direction: column;
    background: var(--bg-primary);
    border-radius: var(--border-radius-lg);
    overflow: hidden
}

._iframe_1irrm_29 {
    width: 100%;
    height: 100%;
    border: none;
    background: var(--bg-primary);
    flex: 1
}

._iframeHidden_1irrm_45 {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

._loading_1irrm_59 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 16px;
    background: var(--bg-primary);
    z-index: 1
}

._loadingTip_1irrm_89 {
    color: var(--text-secondary);
    font-size: 14px
}

@media (max-width: 768px) {
    ._container_1irrm_3 {
        height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px) - 24px);
        border-radius: var(--border-radius-md)
    }
}

._container_q3xmn_1 {
    width: 100%;
    height: 100%;
    min-height: calc(100vh - var(--header-height));
    display: flex;
    flex-direction: column;
    position: relative
}

._loading_q3xmn_19 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background: var(--bg-primary);
    z-index: 10
}

._loadingTip_q3xmn_49 {
    color: var(--text-secondary);
    font-size: 14px;
    margin-top: 8px
}

._iframe_q3xmn_61 {
    width: 100%;
    height: 100%;
    flex: 1;
    border: none;
    background: var(--bg-primary)
}

._iframeHidden_q3xmn_77 {
    opacity: 0;
    position: absolute;
    pointer-events: none
}

._container_1yx4k_1 {
    padding: 24px;
    min-height: 100%
}

._toolbar_1yx4k_13 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

._toolbarLeft_1yx4k_27 {
    display: flex;
    align-items: center;
    gap: 16px
}

._title_1yx4k_39 {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px
}

._title_1yx4k_39 .anticon {
    color: var(--color-primary)
}

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

._searchInput_1yx4k_79 {
    width: 240px
}

._warning_1yx4k_89 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #faad141a;
    border: 1px solid rgba(250, 173, 20, .3);
    border-radius: var(--border-radius-md);
    color: #faad14;
    font-size: 14px;
    margin-bottom: 20px
}

._gameFilter_1yx4k_117 {
    display: flex;
    gap: 8px;
    margin-bottom: 16px
}

._typeTabs_1yx4k_131 {
    margin-bottom: 24px
}

._typeTabs_1yx4k_131 .ant-tabs-nav {
    margin-bottom: 0
}

._loading_1yx4k_149 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px
}

._empty_1yx4k_165 {
    padding: 60px 0
}

._mapGrid_1yx4k_175 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px
}

._mapCard_1yx4k_189 {
    background: var(--bg-secondary);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    border: 1px solid var(--border-color);
    transition: all .3s ease
}

._mapCard_1yx4k_189:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #0003
}

._mapCover_1yx4k_215 {
    position: relative;
    height: 160px;
    background-size: cover;
    background-position: center;
    background-color: var(--bg-tertiary)
}

._mapOverlay_1yx4k_231 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .8), transparent);
    opacity: 0;
    transition: opacity .3s ease;
    display: flex;
    align-items: center;
    justify-content: center
}

._mapCard_1yx4k_189:hover ._mapOverlay_1yx4k_231 {
    opacity: 1
}

._mapActions_1yx4k_267 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 0 16px
}

._downloadingActions_1yx4k_287 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%
}

._progressContainer_1yx4k_303 {
    width: 100%;
    text-align: center
}

._progressContainer_1yx4k_303 .ant-progress {
    margin-bottom: 4px
}

._downloadSpeed_1yx4k_321 {
    font-size: 12px;
    color: #52c41a
}

._downloadStatus_1yx4k_331 {
    font-size: 13px;
    color: #fff
}

._installedBadge_1yx4k_341 {
    position: absolute;
    top: 12px;
    right: 12px;
    background: #52c41ae6;
    color: #fff;
    padding: 4px 10px;
    border-radius: var(--border-radius-sm);
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 4px
}

._mapInfo_1yx4k_369 {
    padding: 16px
}

._mapHeader_1yx4k_377 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px
}

._mapName_1yx4k_391 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._mapDesc_1yx4k_413 {
    font-size: 13px;
    color: var(--text-muted);
    margin: 0 0 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._mapMeta_1yx4k_431 {
    display: flex;
    align-items: center;
    justify-content: space-between
}

._mapRating_1yx4k_443 {
    font-size: 12px
}

._mapRating_1yx4k_443 .ant-rate-star {
    margin-right: 2px
}

._submitContent_1yx4k_461 {
    padding: 8px 0
}

._submitTip_1yx4k_469 {
    font-size: 14px;
    color: var(--text-secondary);
    margin-bottom: 8px
}

._submitExample_1yx4k_481 {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 16px;
    padding: 8px 12px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-sm);
    word-break: break-all
}

._container_1349f_1 {
    padding: 24px;
    min-height: 100%
}

._toolbar_1349f_13 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

._toolbarLeft_1349f_27 {
    display: flex;
    align-items: center;
    gap: 16px
}

._title_1349f_39 {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px
}

._title_1349f_39 .anticon {
    color: var(--color-primary)
}

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

._searchInput_1349f_79 {
    width: 280px
}

._statsRow_1349f_89 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px
}

._statCard_1349f_103 {
    background: var(--bg-secondary);
    border-radius: var(--border-radius-lg);
    padding: 20px;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 16px
}

._statIcon_1349f_123 {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px
}

._statIcon_1349f_123._cs2_1349f_143 {
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff
}

._statIcon_1349f_123._csgo_1349f_153 {
    background: linear-gradient(135deg, #fa8c16, #d46b08);
    color: #fff
}

._statIcon_1349f_123._online_1349f_163 {
    background: linear-gradient(135deg, #52c41a, #389e0d);
    color: #fff
}

._statInfo_1349f_173 {
    flex: 1
}

._statLabel_1349f_181 {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 4px
}

._statValue_1349f_193 {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-primary)
}

._gameSwitch_1349f_207 {
    display: flex;
    gap: 8px;
    margin-bottom: 20px
}

._gameBtn_1349f_219 {
    padding: 8px 24px;
    border-radius: var(--border-radius-md);
    font-weight: 500;
    transition: all .3s ease
}

._gameBtn_1349f_219._active_1349f_233 {
    background: var(--color-primary);
    color: #fff
}

._filterRow_1349f_245 {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    flex-wrap: wrap
}

._filterItem_1349f_261 {
    display: flex;
    align-items: center;
    gap: 8px
}

._filterLabel_1349f_273 {
    font-size: 14px;
    color: var(--text-secondary)
}

._loading_1349f_285 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px
}

._empty_1349f_301 {
    padding: 60px 0
}

._serverList_1349f_311 {
    display: flex;
    flex-direction: column;
    gap: 12px
}

._serverCard_1349f_325 {
    position: relative;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    overflow: hidden;
    transition: all .3s ease
}

._serverCard_1349f_325:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 16px #00000026
}

._serverCard_1349f_325._vip_1349f_353 {
    border-color: #faad1480
}

._mapBackground_1349f_363 {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: .4;
    mask-image: linear-gradient(to right, #000, #0009, #0000);
    -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, .6) 50%, rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    transition: opacity .3s ease
}

._serverCard_1349f_325:hover ._mapBackground_1349f_363 {
    opacity: .6
}

._serverMain_1349f_405 {
    position: relative;
    display: flex;
    align-items: center;
    padding: 16px 20px;
    gap: 20px;
    z-index: 1
}

._serverStatus_1349f_425 {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0
}

._serverStatus_1349f_425._online_1349f_163 {
    background: #52c41a;
    box-shadow: 0 0 8px #52c41a80
}

._serverStatus_1349f_425._offline_1349f_449 {
    background: #ff4d4f;
    box-shadow: 0 0 8px #ff4d4f80
}

._serverInfo_1349f_461 {
    flex: 1;
    min-width: 0
}

._serverName_1349f_471 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 6px;
    display: flex;
    align-items: center;
    gap: 8px
}

._serverName_1349f_471 ._vipBadge_1349f_491 {
    background: linear-gradient(135deg, #faad14, #d48806);
    color: #fff;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 500
}

._serverMeta_1349f_509 {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    color: var(--text-muted)
}

._serverMeta_1349f_509 span {
    display: flex;
    align-items: center;
    gap: 4px
}

._playerCount_1349f_539 {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 100px
}

._playerBar_1349f_553 {
    flex: 1;
    height: 6px;
    background: var(--bg-tertiary);
    border-radius: 3px;
    overflow: hidden
}

._playerBarFill_1349f_569 {
    height: 100%;
    border-radius: 3px;
    transition: width .3s ease
}

._playerBarFill_1349f_569._low_1349f_581 {
    background: linear-gradient(90deg, #52c41a, #73d13d)
}

._playerBarFill_1349f_569._medium_1349f_589 {
    background: linear-gradient(90deg, #faad14, #ffc53d)
}

._playerBarFill_1349f_569._high_1349f_597 {
    background: linear-gradient(90deg, #ff4d4f, #ff7875)
}

._playerText_1349f_605 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 50px;
    text-align: right
}

._serverType_1349f_623 {
    padding: 4px 12px;
    border-radius: var(--border-radius-sm);
    font-size: 12px;
    font-weight: 500;
    background: var(--bg-tertiary);
    color: var(--text-secondary)
}

._serverActions_1349f_643 {
    display: flex;
    gap: 8px
}

._playerListWrapper_1349f_655 {
    border-top: 1px solid var(--border-color);
    padding: 16px 20px;
    background: var(--bg-tertiary)
}

._playerListTitle_1349f_667 {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 12px
}

._playerGrid_1349f_679 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 8px
}

._playerItem_1349f_691 {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-sm);
    font-size: 13px;
    color: var(--text-secondary)
}

._playerItem_1349f_691 .anticon {
    color: var(--text-muted);
    font-size: 12px
}

._connectModal_1349f_725 {
    text-align: center
}

._connectCommand_1349f_733 {
    background: var(--bg-tertiary);
    padding: 16px;
    border-radius: var(--border-radius-md);
    font-family: JetBrains Mono, Fira Code, monospace;
    font-size: 14px;
    color: var(--color-primary);
    margin: 16px 0;
    word-break: break-all
}

._connectTip_1349f_755 {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 8px
}

._pagination_1349f_769 {
    display: flex;
    justify-content: center;
    margin-top: 24px
}

@media (max-width: 1200px) {
    ._statsRow_1349f_89 {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 768px) {
    ._statsRow_1349f_89 {
        grid-template-columns: 1fr
    }
    ._toolbar_1349f_13 {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }
    ._toolbarRight_1349f_67 {
        width: 100%
    }
    ._searchInput_1349f_79 {
        flex: 1
    }
    ._serverMain_1349f_405 {
        flex-wrap: wrap
    }
    ._playerCount_1349f_539 {
        width: 100%;
        order: 10;
        margin-top: 8px
    }
}

._container_hsl7h_3 {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-height) - 48px);
    background: var(--bg-primary);
    border-radius: var(--border-radius-lg);
    overflow: hidden
}

._header_hsl7h_23 {
    padding: 20px 24px 0
}

._title_hsl7h_31 {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px
}

._title_hsl7h_31 .anticon {
    color: var(--color-primary)
}

._tabs_hsl7h_61 {
    padding: 0 24px
}

._tabs_hsl7h_61 .ant-tabs-nav {
    margin-bottom: 0
}

._tabs_hsl7h_61 .ant-tabs-nav-list {
    flex-wrap: wrap
}

._tabLabel_hsl7h_85 {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px
}

._content_hsl7h_101 {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

._loading_hsl7h_117 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px;
    gap: 16px
}

._loadingTip_hsl7h_137 {
    color: var(--text-secondary);
    font-size: 14px
}

._iframeContainer_hsl7h_149 {
    position: relative;
    flex: 1;
    overflow: hidden
}

._iframe_hsl7h_149 {
    width: 100%;
    height: 100%;
    border: none;
    background: var(--bg-primary)
}

._iframeHidden_hsl7h_175 {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

._placeholder_hsl7h_189 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px
}

._empty_hsl7h_205 {
    padding: 60px 0
}

._agentContainer_hsl7h_215 {
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._agentSection_hsl7h_227 {
    margin-bottom: 32px
}

._agentSection_hsl7h_227:last-child {
    margin-bottom: 0
}

._sectionTitle_hsl7h_243 {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color)
}

._teamT_hsl7h_259 {
    color: #f5a623
}

._teamCT_hsl7h_267 {
    color: #4a90d9
}

._agentGrid_hsl7h_275 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 16px
}

._agentCard_hsl7h_287 {
    position: relative;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    border: 2px solid var(--border-color);
    overflow: hidden;
    cursor: pointer;
    transition: all .3s ease
}

._agentCard_hsl7h_287:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 16px #0003
}

._agentCard_hsl7h_287._selected_hsl7h_317 {
    border-color: var(--color-success);
    background: #00ff8814
}

._agentImage_hsl7h_327 {
    position: relative;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-tertiary);
    overflow: hidden
}

._agentImage_hsl7h_327 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1
}

._agentPlaceholder_hsl7h_367 {
    font-size: 48px;
    color: var(--text-muted);
    z-index: 0
}

._agentInfo_hsl7h_379 {
    padding: 12px;
    text-align: center
}

._agentName_hsl7h_389 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._selectedBadge_hsl7h_409 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, var(--color-success) 0%, #00cc6a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bg-primary);
    font-size: 14px;
    box-shadow: 0 2px 8px #0f86
}

._mvpContainer_hsl7h_443 {
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._volumeCard_hsl7h_455 {
    margin-bottom: 16px;
    background: var(--bg-glass) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important
}

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

._volumeIcon_hsl7h_483 {
    font-size: 18px;
    color: var(--color-primary)
}

._volumeLabel_hsl7h_493 {
    font-size: 14px;
    color: var(--text-primary);
    white-space: nowrap
}

._volumeSlider_hsl7h_505 {
    flex: 1;
    margin: 0 8px
}

._volumeValue_hsl7h_515 {
    font-size: 14px;
    color: var(--text-secondary);
    min-width: 40px;
    text-align: right
}

._volumeDivider_hsl7h_529 {
    width: 1px;
    height: 24px;
    background: var(--border-color);
    margin: 0 8px
}

._inUseCard_hsl7h_543 {
    margin-bottom: 16px;
    background: var(--bg-glass) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important
}

._inUseCard_hsl7h_543 .ant-card-head {
    border-bottom-color: var(--border-color)
}

._inUseSlots_hsl7h_567 {
    display: flex;
    flex-wrap: wrap;
    gap: 16px
}

._slot_hsl7h_579 {
    flex: 1;
    min-width: 200px;
    padding: 12px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-sm)
}

._slotHeader_hsl7h_595 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px
}

._slotLabel_hsl7h_609 {
    font-size: 12px;
    color: var(--text-secondary)
}

._slotActions_hsl7h_619 {
    display: flex;
    align-items: center;
    gap: 8px
}

._slotPlayBtn_hsl7h_631 {
    color: var(--text-muted);
    font-size: 16px;
    padding: 0;
    height: auto
}

._slotPlayBtn_hsl7h_631:hover {
    color: var(--color-primary)
}

._slotPlaying_hsl7h_653 ._slotPlayBtn_hsl7h_631 {
    color: var(--color-success)
}

._slotPlaying_hsl7h_653 {
    border: 1px solid var(--color-success);
    background: #00ff880d
}

._slotClear_hsl7h_671 {
    color: var(--text-muted);
    cursor: pointer;
    transition: color .2s
}

._slotClear_hsl7h_671:hover {
    color: var(--color-danger)
}

._slotValue_hsl7h_691 {
    display: block;
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._mvpSearch_hsl7h_711 {
    margin-bottom: 16px;
    background: #0a0f1999;
    border-color: var(--border-color)
}

._mvpGrid_hsl7h_723 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px
}

._mvpCard_hsl7h_735 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius);
    border: 2px solid var(--border-color);
    padding: 16px;
    transition: all var(--transition-normal)
}

._mvpCard_hsl7h_735:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 16px #0003, 0 0 20px var(--color-primary-glow)
}

._mvpCard_hsl7h_735._playing_hsl7h_763 {
    border-color: var(--color-success);
    background: #00ff880d
}

._playBtn_hsl7h_773 {
    color: var(--text-secondary);
    font-size: 18px;
    padding: 0;
    height: auto
}

._playBtn_hsl7h_773:hover {
    color: var(--color-primary)
}

._mvpCard_hsl7h_735._playing_hsl7h_763 ._playBtn_hsl7h_773 {
    color: var(--color-success)
}

._mvpHeader_hsl7h_803 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px
}

._mvpName_hsl7h_817 {
    flex: 1;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._mvpMeta_hsl7h_837 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 12px;
    color: var(--text-muted)
}

._mvpFile_hsl7h_855 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 60%
}

._mvpComments_hsl7h_869 {
    white-space: nowrap
}

._mvpActions_hsl7h_877 {
    display: flex;
    gap: 8px
}

._uploadModal_hsl7h_889 .ant-modal-content {
    background: transparent;
    box-shadow: none;
    padding: 0
}

._uploadModal_hsl7h_889 .ant-modal-header {
    display: none
}

._uploadModal_hsl7h_889 .ant-modal-body {
    padding: 0
}

._uploadModal_hsl7h_889 .ant-modal-close {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    background: #ffffffe6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    transition: all .2s
}

._uploadModal_hsl7h_889 .ant-modal-close:hover {
    background: #fff;
    transform: scale(1.1)
}

._uploadModal_hsl7h_889 .ant-modal-close-x {
    font-size: 18px;
    color: #333
}

._uploadIframeContainer_hsl7h_967 {
    position: relative;
    width: 100%;
    height: 740px;
    border-radius: 8px;
    overflow: hidden
}

._uploadLoading_hsl7h_983 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: #00000080;
    color: #fff
}

._uploadIframe_hsl7h_967 {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px
}

._hotMusicContainer_hsl7h_1029 {
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._hotMusicTip_hsl7h_1041 {
    margin-bottom: 16px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 107, 53, .3)
}

._hotMusicTip_hsl7h_1041.ant-card {
    background: var(--bg-glass) !important;
    border-color: #ff6b354d !important
}

._hotMusicTipContent_hsl7h_1065 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-primary)
}

._hotMusicTipIcon_hsl7h_1079 {
    font-size: 18px;
    color: var(--color-accent)
}

._hotMusicSearchRow_hsl7h_1089 {
    display: flex;
    gap: 12px;
    margin-bottom: 16px
}

._hotMusicSearchInput_hsl7h_1101 {
    flex: 1;
    background: #0a0f1999;
    border-color: var(--border-color)
}

._hotMusicGrid_hsl7h_1113 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px
}

._hotMusicCard_hsl7h_1125 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: var(--border-radius);
    border: 2px solid var(--border-color);
    padding: 16px;
    transition: all var(--transition-normal)
}

._hotMusicCard_hsl7h_1125:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 16px #0003, 0 0 20px var(--color-primary-glow)
}

._hotMusicCard_hsl7h_1125._playing_hsl7h_763 {
    border-color: var(--color-success);
    background: #00ff880d
}

._hotMusicCard_hsl7h_1125._owned_hsl7h_1163 {
    border-color: var(--color-success);
    background: #00ff8814
}

._hotMusicCard_hsl7h_1125._warning_hsl7h_1173 {
    border-color: #ffaa0080;
    background: #ffaa000d
}

._hotMusicHeader_hsl7h_1183 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px
}

._hotMusicName_hsl7h_1197 {
    flex: 1;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._hotMusicMeta_hsl7h_1217 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 12px;
    color: var(--text-muted)
}

._hotMusicStats_hsl7h_1235 {
    display: flex;
    align-items: center;
    gap: 4px
}

._hotMusicDot_hsl7h_1247 {
    margin: 0 4px
}

._hotMusicActions_hsl7h_1255 {
    display: flex;
    gap: 8px
}

._hotMusicPagination_hsl7h_1265 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--border-color)
}

._hotMusicPageInfo_hsl7h_1285 {
    font-size: 14px;
    color: var(--text-secondary)
}

._deleteBtn_hsl7h_1297 {
    color: var(--text-muted)
}

._deleteBtn_hsl7h_1297:hover {
    color: var(--color-danger) !important;
    background: #ff47571a !important
}

._vipSettingsContainer_hsl7h_1317 {
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._vipWarningCard_hsl7h_1329 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 170, 0, .3);
    border-radius: var(--border-radius);
    margin-bottom: 24px
}

._vipWarningCard_hsl7h_1329.ant-card {
    background: var(--bg-glass) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 170, 0, .3) !important;
    border-radius: var(--border-radius) !important
}

._vipWarningCard_hsl7h_1329 .ant-card-body {
    padding: 16px 20px
}

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

._vipWarningIcon_hsl7h_1387 {
    font-size: 24px;
    color: var(--color-warning)
}

._vipWarningText_hsl7h_1397 {
    flex: 1;
    font-size: 14px;
    color: var(--text-primary)
}

._vipSection_hsl7h_1411 {
    margin-bottom: 32px
}

._vipSectionTitle_hsl7h_1419 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-left: 12px;
    border-left: 3px solid var(--color-primary);
    display: flex;
    align-items: center;
    gap: 8px
}

._vipSettingItem_hsl7h_1445 {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    margin-bottom: 12px;
    transition: all var(--transition-normal)
}

._vipSettingItem_hsl7h_1445:hover {
    border-color: var(--color-primary);
    background: #00d4ff08
}

._vipSettingItem_hsl7h_1445:last-child {
    margin-bottom: 0
}

._vipSettingInfo_hsl7h_1487 {
    flex: 1;
    min-width: 0
}

._vipSettingLabel_hsl7h_1497 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 6px
}

._vipSettingDesc_hsl7h_1517 {
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.5
}

._vipSettingControl_hsl7h_1529 {
    flex-shrink: 0;
    margin-left: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 200px
}

._vipSettingSelect_hsl7h_1547 {
    width: 100%;
    min-width: 180px
}

._vipSettingInput_hsl7h_1557 {
    width: 100%
}

._colorOption_hsl7h_1567 {
    display: flex;
    align-items: center;
    gap: 8px
}

._colorDot_hsl7h_1579 {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, .2);
    flex-shrink: 0
}

._colorPreview_hsl7h_1595 {
    font-size: 14px;
    font-weight: 600;
    padding: 6px 12px;
    background: var(--bg-glass);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-sm);
    min-width: 80px;
    text-align: center
}

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

._smokeColorPreview_hsl7h_1631 {
    width: 48px;
    height: 48px;
    border-radius: var(--border-radius-md);
    border: 2px solid rgba(255, 255, 255, .2);
    box-shadow: 0 0 24px var(--smoke-color, transparent);
    transition: box-shadow .3s ease
}

._vipSettingsActions_hsl7h_1651 {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border-color);
    display: flex;
    justify-content: flex-end
}

._profileMusicSection_hsl7h_1669 {
    display: flex;
    flex-direction: column;
    gap: 16px
}

._profileMusicForm_hsl7h_1681 {
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._profileMusicUrlRow_hsl7h_1695 {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px
}

._profileMusicInput_hsl7h_1709 {
    flex: 1
}

._profileMusicActions_hsl7h_1717 {
    display: flex;
    align-items: center;
    justify-content: space-between
}

._profileMusicSwitch_hsl7h_1729 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-secondary)
}

._profileMusicPreview_hsl7h_1747 {
    display: flex;
    gap: 16px;
    padding: 16px;
    background: var(--bg-glass-light);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    transition: all var(--transition-normal)
}

._profileMusicPreview_hsl7h_1747:hover {
    border-color: var(--color-primary)
}

._profileMusicCover_hsl7h_1775 {
    width: 80px;
    height: 80px;
    border-radius: var(--border-radius-md);
    overflow: hidden;
    background: var(--bg-glass);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: var(--text-muted);
    flex-shrink: 0;
    border: 2px solid var(--border-color)
}

._profileMusicCover_hsl7h_1775 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._profileMusicInfo_hsl7h_1817 {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0
}

._profileMusicName_hsl7h_1833 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._profileMusicAlbum_hsl7h_1851 {
    font-size: 13px;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._profileMusicAudio_hsl7h_1867 {
    margin-top: 8px;
    width: 100%;
    height: 36px;
    border-radius: var(--border-radius-sm)
}

._profileMusicAudio_hsl7h_1867::-webkit-media-controls-panel {
    background: var(--bg-glass);
    border-radius: var(--border-radius-sm)
}

@media (max-width: 768px) {
    ._container_hsl7h_3 {
        height: calc(100vh - var(--header-height) - 24px);
        border-radius: var(--border-radius-md)
    }
    ._header_hsl7h_23 {
        padding: 16px 16px 0
    }
    ._title_hsl7h_31 {
        font-size: 20px
    }
    ._tabs_hsl7h_61 {
        padding: 0 16px
    }
    ._tabLabel_hsl7h_85 {
        font-size: 13px
    }
    ._agentContainer_hsl7h_215,
    ._mvpContainer_hsl7h_443 {
        padding: 16px
    }
    ._agentGrid_hsl7h_275 {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 12px
    }
    ._agentImage_hsl7h_327 {
        height: 90px
    }
    ._mvpGrid_hsl7h_723 {
        grid-template-columns: 1fr
    }
    ._inUseSlots_hsl7h_567 {
        flex-direction: column
    }
    ._slot_hsl7h_579 {
        min-width: 100%
    }
    ._hotMusicContainer_hsl7h_1029 {
        padding: 16px
    }
    ._hotMusicGrid_hsl7h_1113 {
        grid-template-columns: 1fr
    }
    ._hotMusicSearchRow_hsl7h_1089 {
        flex-direction: column
    }
    ._hotMusicPagination_hsl7h_1265 {
        gap: 12px
    }
    ._vipSettingsContainer_hsl7h_1317 {
        padding: 16px
    }
    ._vipSettingItem_hsl7h_1445 {
        flex-direction: column;
        gap: 12px
    }
    ._vipSettingControl_hsl7h_1529 {
        margin-left: 0;
        width: 100%;
        min-width: auto
    }
    ._profileMusicUrlRow_hsl7h_1695 {
        flex-direction: column;
        align-items: stretch
    }
    ._profileMusicActions_hsl7h_1717 {
        flex-direction: column;
        gap: 12px;
        align-items: stretch
    }
    ._profileMusicPreview_hsl7h_1747 {
        flex-direction: column;
        align-items: center;
        text-align: center
    }
    ._profileMusicCover_hsl7h_1775 {
        width: 100px;
        height: 100px
    }
    ._profileMusicInfo_hsl7h_1817 {
        align-items: center
    }
}

._weaponIconContainer_hsl7h_2109 {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._weaponIconGrid_hsl7h_2127 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 20px
}

._weaponIconCard_hsl7h_2139 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative
}

._weaponIconCard_hsl7h_2139:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #0006, 0 0 20px var(--color-primary-glow)
}

._weaponIconCard_hsl7h_2139._selected_hsl7h_317 {
    border-color: var(--color-success);
    background: #00ff880d;
    box-shadow: 0 0 20px #0f83
}

._weaponIconCard_hsl7h_2139._locked_hsl7h_2183 {
    opacity: .6;
    cursor: not-allowed
}

._weaponIconCard_hsl7h_2139._locked_hsl7h_2183:hover {
    border-color: var(--border-color);
    box-shadow: none
}

._weaponIconPreview_hsl7h_2203 {
    position: relative;
    width: 100%;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-glass-light);
    padding: 16px
}

._weaponIconImage_hsl7h_2225 {
    max-width: 100%;
    max-height: 80px;
    object-fit: contain;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .5))
}

._weaponIconLock_hsl7h_2239 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, var(--color-warning) 0%, #cc8800 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--bg-primary);
    box-shadow: 0 2px 8px #fa06
}

._weaponIconSelected_hsl7h_2271 {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, var(--color-success) 0%, #00cc6a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--bg-primary);
    box-shadow: 0 2px 8px #0f86
}

._weaponIconInfo_hsl7h_2303 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-top: 1px solid var(--border-color)
}

._weaponIconName_hsl7h_2321 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

._weaponIconPreviewBtn_hsl7h_2339 {
    color: var(--color-primary) !important;
    padding: 0 !important;
    height: auto !important
}

._weaponIconPreviewBtn_hsl7h_2339:hover {
    color: var(--color-primary-light) !important;
    background: transparent !important
}

._weaponIconVideoContainer_hsl7h_2361 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-primary);
    border-radius: var(--border-radius-sm);
    overflow: hidden
}

._weaponIconVideo_hsl7h_2361 {
    width: 100%;
    max-height: 400px;
    object-fit: contain
}

._savingOverlay_hsl7h_2393 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0a0e14d9;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    z-index: 1000;
    color: var(--text-primary);
    font-size: 16px
}

@media (max-width: 768px) {
    ._weaponIconContainer_hsl7h_2109 {
        padding: 16px
    }
    ._weaponIconGrid_hsl7h_2127 {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px
    }
    ._weaponIconPreview_hsl7h_2203 {
        height: 100px
    }
    ._weaponIconImage_hsl7h_2225 {
        max-height: 60px
    }
    ._weaponIconInfo_hsl7h_2303 {
        padding: 10px 12px
    }
    ._weaponIconName_hsl7h_2321 {
        font-size: 13px
    }
}

@media (max-width: 480px) {
    ._weaponIconGrid_hsl7h_2127 {
        grid-template-columns: 1fr 1fr;
        gap: 10px
    }
    ._weaponIconPreview_hsl7h_2203 {
        height: 80px
    }
    ._weaponIconImage_hsl7h_2225 {
        max-height: 50px
    }
    ._weaponIconLock_hsl7h_2239,
    ._weaponIconSelected_hsl7h_2271 {
        width: 24px;
        height: 24px;
        font-size: 12px
    }
}

._scoreboardContainer_hsl7h_2533 {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._scoreboardGrid_hsl7h_2551 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 16px
}

._scoreboardCard_hsl7h_2563 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative
}

._scoreboardCard_hsl7h_2563:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #0006, 0 0 20px var(--color-primary-glow)
}

._scoreboardCard_hsl7h_2563._selected_hsl7h_317 {
    border-color: var(--color-success);
    background: #00ff880d;
    box-shadow: 0 0 20px #0f83
}

._scoreboardIconPreview_hsl7h_2607 {
    position: relative;
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-glass-light);
    padding: 16px
}

._scoreboardIconImage_hsl7h_2629 {
    max-width: 80px;
    max-height: 80px;
    object-fit: contain;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .5))
}

._scoreboardIconNone_hsl7h_2643 {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-tertiary);
    border-radius: 50%;
    font-size: 28px;
    color: var(--text-muted)
}

._scoreboardIconSelected_hsl7h_2667 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, var(--color-success) 0%, #00cc6a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--bg-primary);
    box-shadow: 0 2px 8px #0f86
}

._scoreboardIconInfo_hsl7h_2699 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 12px;
    background: var(--bg-tertiary);
    border-top: 1px solid var(--border-color)
}

._scoreboardIconName_hsl7h_2717 {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

@media (max-width: 768px) {
    ._scoreboardContainer_hsl7h_2533 {
        padding: 16px
    }
    ._scoreboardGrid_hsl7h_2551 {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px
    }
    ._scoreboardIconPreview_hsl7h_2607 {
        height: 80px
    }
    ._scoreboardIconImage_hsl7h_2629 {
        max-width: 60px;
        max-height: 60px
    }
}

@media (max-width: 480px) {
    ._scoreboardGrid_hsl7h_2551 {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px
    }
    ._scoreboardIconPreview_hsl7h_2607 {
        height: 70px;
        padding: 12px
    }
    ._scoreboardIconImage_hsl7h_2629 {
        max-width: 50px;
        max-height: 50px
    }
    ._scoreboardIconNone_hsl7h_2643 {
        width: 45px;
        height: 45px;
        font-size: 22px
    }
    ._scoreboardIconInfo_hsl7h_2699 {
        padding: 8px 10px
    }
    ._scoreboardIconName_hsl7h_2717 {
        font-size: 12px
    }
}

._sprayContainer_hsl7h_2843 {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._sprayUploadArea_hsl7h_2861 {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    padding: 16px 20px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._sprayUploadLeft_hsl7h_2885 {
    display: flex;
    gap: 12px;
    align-items: center;
    flex: 1
}

._sprayNameInput_hsl7h_2899 {
    width: 200px;
    background: #0a0f1999 !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important
}

._sprayNameInput_hsl7h_2899::placeholder {
    color: var(--text-muted) !important
}

._sprayUploadLabel_hsl7h_2921 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: linear-gradient(135deg, #00d4ff33, #00a8cc1a);
    border: 1px solid rgba(0, 212, 255, .4);
    border-radius: var(--border-radius-sm);
    color: var(--color-primary);
    cursor: pointer;
    transition: all var(--transition-normal);
    font-size: 14px
}

._sprayUploadLabel_hsl7h_2921:hover {
    background: linear-gradient(135deg, #00d4ff4d, #00a8cc33);
    border-color: var(--color-primary);
    box-shadow: 0 0 15px var(--color-primary-glow)
}

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

._sprayCodeInput_hsl7h_2973 {
    width: 260px;
    background: #0a0f1999 !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    font-family: monospace
}

._sprayCodeInput_hsl7h_2973::placeholder {
    color: var(--text-muted) !important
}

._sprayGrid_hsl7h_2997 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 16px
}

._sprayCard_hsl7h_3009 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative
}

._sprayCard_hsl7h_3009:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #0006, 0 0 20px var(--color-primary-glow)
}

._sprayCard_hsl7h_3009._selected_hsl7h_317 {
    border-color: var(--color-success);
    background: #00ff880d;
    box-shadow: 0 0 20px #0f83
}

._sprayCard_hsl7h_3009._processing_hsl7h_3053 {
    opacity: .7
}

._sprayPreview_hsl7h_3061 {
    position: relative;
    width: 100%;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-glass-light);
    padding: 12px
}

._sprayImage_hsl7h_3083 {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: var(--border-radius-sm)
}

._sprayNone_hsl7h_3097 {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-tertiary);
    border-radius: 50%;
    font-size: 24px;
    color: var(--text-muted)
}

._spraySelectedBadge_hsl7h_3121 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, var(--color-success) 0%, #00cc6a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--bg-primary);
    box-shadow: 0 2px 8px #0f86
}

._sprayProcessing_hsl7h_3153 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0a0e14cc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--text-secondary);
    font-size: 12px
}

._sprayProcessing_hsl7h_3153 svg {
    font-size: 20px;
    color: var(--color-warning)
}

._sprayInfo_hsl7h_3195 {
    padding: 10px 12px;
    background: var(--bg-tertiary);
    border-top: 1px solid var(--border-color)
}

._sprayName_hsl7h_2899 {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    margin-bottom: 4px
}

._sprayMeta_hsl7h_3229 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px
}

._sprayCs2_hsl7h_3243 {
    font-size: 11px;
    color: var(--color-success);
    font-weight: 500
}

._sprayCsgo_hsl7h_3255 {
    font-size: 11px;
    color: var(--text-muted)
}

._sprayCode_hsl7h_2973 {
    font-size: 10px;
    color: var(--text-muted);
    font-family: monospace;
    cursor: pointer;
    transition: color var(--transition-fast)
}

._sprayCode_hsl7h_2973:hover {
    color: var(--color-primary)
}

._sprayDeleteBtn_hsl7h_3289 {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 28px;
    height: 28px;
    background: #ff4d4fe6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    transition: all var(--transition-normal);
    z-index: 10
}

._sprayCard_hsl7h_3009:hover ._sprayDeleteBtn_hsl7h_3289 {
    opacity: 1
}

._sprayDeleteBtn_hsl7h_3289:hover {
    background: var(--color-danger);
    transform: scale(1.1)
}

._sprayEmpty_hsl7h_3345 {
    padding: 40px 0
}

@media (max-width: 768px) {
    ._sprayContainer_hsl7h_2843 {
        padding: 16px
    }
    ._sprayUploadArea_hsl7h_2861 {
        flex-direction: column;
        align-items: stretch
    }
    ._sprayUploadLeft_hsl7h_2885 {
        flex-direction: column
    }
    ._sprayNameInput_hsl7h_2899 {
        width: 100%
    }
    ._sprayGetArea_hsl7h_2961 {
        flex-direction: column
    }
    ._sprayCodeInput_hsl7h_2973 {
        width: 100%
    }
    ._sprayGrid_hsl7h_2997 {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px
    }
    ._sprayPreview_hsl7h_3061 {
        height: 90px
    }
}

@media (max-width: 480px) {
    ._sprayGrid_hsl7h_2997 {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px
    }
    ._sprayPreview_hsl7h_3061 {
        height: 80px
    }
    ._sprayInfo_hsl7h_3195 {
        padding: 8px 10px
    }
    ._sprayName_hsl7h_2899 {
        font-size: 12px
    }
}

._mergedNotice_hsl7h_3469 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 40px 20px
}

._pcardContainer_hsl7h_3491 {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
    overflow-y: auto;
    flex: 1
}

._pcardUploadArea_hsl7h_3509 {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    padding: 16px 20px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius)
}

._pcardUploadLeft_hsl7h_3533 {
    display: flex;
    gap: 12px;
    align-items: center;
    flex: 1
}

._pcardNameInput_hsl7h_3547 {
    width: 200px;
    background: #0a0f1999 !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important
}

._pcardNameInput_hsl7h_3547::placeholder {
    color: var(--text-muted) !important
}

._pcardUploadLabel_hsl7h_3569 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: linear-gradient(135deg, #00d4ff33, #00a8cc1a);
    border: 1px solid rgba(0, 212, 255, .4);
    border-radius: var(--border-radius-sm);
    color: var(--color-primary);
    cursor: pointer;
    transition: all var(--transition-normal);
    font-size: 14px;
    white-space: nowrap
}

._pcardUploadLabel_hsl7h_3569:hover {
    background: linear-gradient(135deg, #00d4ff4d, #00a8cc33);
    border-color: var(--color-primary);
    box-shadow: 0 0 15px var(--color-primary-glow)
}

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

._pcardCodeInput_hsl7h_3623 {
    width: 260px;
    background: #0a0f1999 !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    font-family: monospace
}

._pcardCodeInput_hsl7h_3623::placeholder {
    color: var(--text-muted) !important
}

._pcardGrid_hsl7h_3647 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 16px
}

._pcardCard_hsl7h_3659 {
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    overflow: hidden;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative
}

._pcardCard_hsl7h_3659:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px #0006, 0 0 20px var(--color-primary-glow)
}

._pcardCard_hsl7h_3659._selected_hsl7h_317 {
    border-color: var(--color-success);
    background: #00ff880d;
    box-shadow: 0 0 20px #0f83
}

._pcardPreview_hsl7h_3703 {
    position: relative;
    width: 100%;
    aspect-ratio: 250 / 600;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-glass-light)
}

._pcardImage_hsl7h_3723 {
    width: 100%;
    height: 100%;
    object-fit: cover
}

._pcardNone_hsl7h_3735 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--text-muted)
}

._pcardNone_hsl7h_3735 svg {
    font-size: 28px
}

._pcardNone_hsl7h_3735 span {
    font-size: 12px
}

._pcardSelectedBadge_hsl7h_3769 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, var(--color-success) 0%, #00cc6a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--bg-primary);
    box-shadow: 0 2px 8px #0f86
}

._pcardPublicBadge_hsl7h_3801 {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 2px 8px;
    background: #00d4ffe6;
    border-radius: var(--border-radius-sm);
    font-size: 10px;
    color: var(--bg-primary);
    font-weight: 500
}

._pcardInfo_hsl7h_3825 {
    padding: 10px 12px;
    background: var(--bg-tertiary);
    border-top: 1px solid var(--border-color)
}

._pcardName_hsl7h_3547 {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    margin-bottom: 4px
}

._pcardCode_hsl7h_3623 {
    font-size: 10px;
    color: var(--text-muted);
    font-family: monospace;
    cursor: pointer;
    transition: color var(--transition-fast)
}

._pcardCode_hsl7h_3623:hover {
    color: var(--color-primary)
}

._pcardDeleteBtn_hsl7h_3883 {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 24px;
    height: 24px;
    background: #ff4d4fe6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    transition: all var(--transition-normal);
    z-index: 10
}

._pcardCard_hsl7h_3659:hover ._pcardDeleteBtn_hsl7h_3883 {
    opacity: 1
}

._pcardDeleteBtn_hsl7h_3883:hover {
    background: var(--color-danger);
    transform: scale(1.1)
}

._pcardEmpty_hsl7h_3939 {
    padding: 40px 0
}

@media (max-width: 768px) {
    ._pcardContainer_hsl7h_3491 {
        padding: 16px
    }
    ._pcardUploadArea_hsl7h_3509 {
        flex-direction: column;
        align-items: stretch
    }
    ._pcardUploadLeft_hsl7h_3533 {
        flex-direction: column
    }
    ._pcardNameInput_hsl7h_3547 {
        width: 100%
    }
    ._pcardGetArea_hsl7h_3611 {
        flex-direction: column
    }
    ._pcardCodeInput_hsl7h_3623 {
        width: 100%
    }
    ._pcardGrid_hsl7h_3647 {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px
    }
}

@media (max-width: 480px) {
    ._pcardGrid_hsl7h_3647 {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px
    }
    ._pcardInfo_hsl7h_3825 {
        padding: 8px 10px
    }
    ._pcardName_hsl7h_3547 {
        font-size: 11px
    }
}

._container_rk1sg_1 {
    height: calc(100vh - var(--header-height) - var(--electron-titlebar-height, 0px) - 48px);
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow-y: auto
}

._loadingContainer_rk1sg_21,
._errorContainer_rk1sg_23 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 16px
}

._errorContainer_rk1sg_23 p {
    color: var(--text-secondary);
    font-size: 16px
}

._header_rk1sg_53 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    background: #0f1423cc;
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color)
}

._headerLeft_rk1sg_73 {
    display: flex;
    align-items: center;
    gap: 24px
}

._matchType_rk1sg_85,
._mapInfo_rk1sg_87 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-secondary);
    font-size: 14px
}

._matchType_rk1sg_85 .anticon,
._mapInfo_rk1sg_87 .anticon {
    color: var(--color-primary)
}

._headerCenter_rk1sg_113 {
    flex: 1;
    display: flex;
    justify-content: center
}

._statusTag_rk1sg_125 {
    font-size: 14px;
    padding: 4px 16px;
    border-radius: 20px
}

._headerRight_rk1sg_137 {
    display: flex;
    align-items: center;
    gap: 8px
}

._mainContent_rk1sg_151 {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 400px 1fr;
    gap: 20px;
    min-height: 400px
}

._teamSection_rk1sg_169 {
    background: #0f1423cc;
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    padding: 20px;
    display: flex;
    flex-direction: column
}

._team1_rk1sg_187 {
    border-left: 3px solid #1890ff
}

._team2_rk1sg_195 {
    border-left: 3px solid #f5222d
}

._teamHeader_rk1sg_203 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 600
}

._teamHeader_rk1sg_203 .anticon {
    color: var(--color-primary)
}

._teamAvgRank_rk1sg_235 {
    margin-left: auto;
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 400
}

._playerList_rk1sg_249 {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1
}

._playerCard_rk1sg_265 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: #0a0f1999;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
    border-left: 3px solid transparent;
    transition: all .2s ease
}

._playerCard_rk1sg_265:hover {
    background: #0a0f19e6;
    border-color: #00d4ff4d
}

._playerCard_rk1sg_265._isMe_rk1sg_299 {
    background: #00d4ff1a;
    border-color: var(--color-primary)
}

._playerAvatar_rk1sg_309 {
    position: relative
}

._meTag_rk1sg_317 {
    position: absolute;
    bottom: -4px;
    right: -4px;
    font-size: 10px;
    padding: 1px 4px;
    background: var(--color-primary);
    color: #000;
    border-radius: 4px;
    font-weight: 600
}

._inServerTag_rk1sg_341 {
    position: absolute;
    top: -4px;
    right: -4px;
    font-size: 14px;
    color: #52c41a;
    background: #000c;
    border-radius: 50%;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center
}

._playerCard_rk1sg_265._inServer_rk1sg_341 {
    border-color: #52c41a;
    background: #52c41a14
}

._playerInfo_rk1sg_379 {
    flex: 1;
    min-width: 0
}

._playerName_rk1sg_389 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 4px
}

._playerName_rk1sg_389 span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._partyTag_rk1sg_421 {
    font-size: 10px;
    padding: 0 4px;
    height: 18px;
    line-height: 16px
}

._playerRank_rk1sg_435 {
    display: flex;
    align-items: center;
    gap: 6px
}

._rankIcon_rk1sg_447 {
    height: 18px;
    width: auto
}

._rankScore_rk1sg_457 {
    font-size: 12px;
    color: var(--text-muted)
}

._centerSection_rk1sg_469 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    position: relative
}

._scoreBoard_rk1sg_489 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    font-family: var(--font-display);
    z-index: 2
}

._team1Score_rk1sg_507,
._team2Score_rk1sg_509 {
    font-size: 64px;
    font-weight: 700;
    min-width: 80px;
    text-align: center
}

._team1Score_rk1sg_507 {
    color: #1890ff
}

._team2Score_rk1sg_509 {
    color: #f5222d
}

._scoreSeparator_rk1sg_539 {
    font-size: 48px;
    color: var(--text-muted)
}

._mapBackground_rk1sg_551 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    z-index: 0
}

._mapOverlay_rk1sg_571 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, #0a0e14d9, #0a0e14b3, #0a0e14d9)
}

._serverInfo_rk1sg_595 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: #00000080;
    border-radius: var(--border-radius);
    z-index: 2
}

._serverInfoContent_rk1sg_617 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px
}

._serverMainInfo_rk1sg_631 {
    display: flex;
    align-items: center;
    gap: 8px
}

._serverExtraInfo_rk1sg_643 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 11px;
    color: var(--text-muted)
}

._serverRegion_rk1sg_659 {
    display: flex;
    align-items: center;
    gap: 4px
}

._serverCpu_rk1sg_671 {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._serverPing_rk1sg_685 {
    font-size: 12px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px
}

._serverPing_rk1sg_685._pingGood_rk1sg_699 {
    background: #52c41a33;
    color: #52c41a
}

._serverPing_rk1sg_685._pingMedium_rk1sg_709 {
    background: #faad1433;
    color: #faad14
}

._serverPing_rk1sg_685._pingBad_rk1sg_719 {
    background: #f5222d33;
    color: #f5222d
}

._serverLabel_rk1sg_729 {
    font-size: 12px;
    color: var(--text-muted)
}

._serverAddress_rk1sg_739 {
    font-family: var(--font-mono);
    font-size: 14px;
    color: var(--color-primary)
}

._serverWaiting_rk1sg_751 {
    font-size: 13px;
    color: var(--text-secondary)
}

._joinButton_rk1sg_763 {
    width: 200px;
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 24px;
    z-index: 2;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border: none;
    box-shadow: 0 4px 20px var(--color-primary-glow)
}

._joinButton_rk1sg_763:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px var(--color-primary-glow)
}

._joinButton_rk1sg_763:disabled {
    background: #6482aa33;
    box-shadow: none
}

._roundsSection_rk1sg_809 {
    background: #0f1423cc;
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    padding: 12px 16px;
    margin-bottom: 16px
}

._roundsHeader_rk1sg_825 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 14px;
    color: var(--text-secondary)
}

._roundsList_rk1sg_843 {
    display: flex;
    flex-wrap: wrap;
    gap: 4px
}

._roundItem_rk1sg_855 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 36px;
    border-radius: 4px;
    cursor: pointer;
    transition: all .2s
}

._roundItem_rk1sg_855:hover {
    transform: scale(1.1)
}

._roundItem_rk1sg_855._team1Win_rk1sg_887 {
    background: linear-gradient(135deg, #1890ff, #096dd9);
    color: #fff
}

._roundItem_rk1sg_855._team2Win_rk1sg_897 {
    background: linear-gradient(135deg, #f5222d, #cf1322);
    color: #fff
}

._roundNumber_rk1sg_907 {
    font-size: 11px;
    font-weight: 600
}

._roundSide_rk1sg_917 {
    font-size: 9px;
    opacity: .8
}

._chatSection_rk1sg_929 {
    background: #0f1423cc;
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--border-color);
    padding: 16px;
    display: flex;
    flex-direction: column;
    height: 200px
}

._chatHeader_rk1sg_949 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 500
}

._chatHeader_rk1sg_949 .anticon {
    color: var(--color-primary)
}

._chatHint_rk1sg_981 {
    font-size: 12px;
    color: var(--text-muted);
    margin-left: auto
}

._chatList_rk1sg_993 {
    flex: 1;
    overflow-y: auto;
    margin-bottom: 12px
}

._chatMessage_rk1sg_1005 {
    padding: 6px 0;
    font-size: 13px
}

._chatMessage_rk1sg_1005._myMessage_rk1sg_1015 ._chatUsername_rk1sg_1015 {
    color: var(--color-primary)
}

._chatUsername_rk1sg_1015 {
    color: var(--text-secondary);
    margin-right: 8px
}

._chatContent_rk1sg_1033 {
    color: var(--text-primary)
}

._chatInput_rk1sg_1041 {
    display: flex
}

._chatInput_rk1sg_1041 .ant-input-affix-wrapper {
    background: #0a0f1999;
    border-color: var(--border-color)
}

._chatInput_rk1sg_1041 .ant-input {
    background: transparent;
    color: var(--text-primary)
}

@media (max-width: 1200px) {
    ._mainContent_rk1sg_151 {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto
    }
    ._centerSection_rk1sg_469 {
        order: -1;
        min-height: 250px
    }
    ._team1Score_rk1sg_507,
    ._team2Score_rk1sg_509 {
        font-size: 48px;
        min-width: 60px
    }
    ._scoreSeparator_rk1sg_539 {
        font-size: 36px
    }
}

@media (max-width: 768px) {
    ._container_rk1sg_1 {
        padding: 16px
    }
    ._header_rk1sg_53 {
        flex-direction: column;
        gap: 12px;
        padding: 12px 16px
    }
    ._headerLeft_rk1sg_73 {
        flex-wrap: wrap;
        justify-content: center
    }
    ._playerCard_rk1sg_265 {
        padding: 10px
    }
    ._team1Score_rk1sg_507,
    ._team2Score_rk1sg_509 {
        font-size: 36px
    }
    ._joinButton_rk1sg_763 {
        width: 160px;
        height: 40px;
        font-size: 14px
    }
    ._chatSection_rk1sg_929 {
        height: 160px
    }
}

._page_13xwp_1 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - var(--header-height) - 100px)
}

._content_13xwp_15 {
    text-align: center;
    padding: 60px 40px;
    background: var(--bg-glass);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    max-width: 500px
}

._iconWrapper_13xwp_35 {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    background: linear-gradient(135deg, #00d4ff33, #00a8cc1a);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center
}

._icon_13xwp_35 {
    font-size: 40px;
    color: var(--color-primary)
}

._title_13xwp_67 {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 12px
}

._description_13xwp_83 {
    font-size: 16px;
    color: var(--text-secondary);
    margin: 0 0 32px
}

._backBtn_13xwp_95 {
    height: 44px;
    padding: 0 32px;
    font-size: 15px
}

._overlay_118ww_1 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000000d9;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px
}

._content_118ww_31 {
    max-width: 480px;
    width: 100%;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-lg);
    padding: 40px;
    text-align: center;
    border: 1px solid var(--border-color);
    box-shadow: 0 20px 60px #00000080
}

._iconWrapper_118ww_53 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-primary), #722ed1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px
}

._icon_118ww_53 {
    font-size: 40px;
    color: #fff
}

._icon_118ww_53._denied_118ww_85 {
    color: #ff4d4f
}

._iconWrapper_118ww_53:has(._denied_118ww_85) {
    background: linear-gradient(135deg, #ff4d4f, #cf1322)
}

._title_118ww_101 {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px
}

._description_118ww_115 {
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 20px
}

._features_118ww_129 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
    text-align: left;
    padding: 16px 20px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-md)
}

._feature_118ww_129 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--text-secondary)
}

._feature_118ww_129 .anticon {
    color: #52c41a;
    font-size: 16px
}

._warning_118ww_177 {
    font-size: 14px;
    color: #faad14;
    background: #faad141a;
    border: 1px solid rgba(250, 173, 20, .3);
    border-radius: var(--border-radius-md);
    padding: 12px 16px;
    margin-bottom: 24px
}

._steps_118ww_197 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
    text-align: left
}

._step_118ww_197 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--text-secondary);
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-md)
}

._stepNumber_118ww_235 {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--color-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0
}

._allowBtn_118ww_263,
._refreshBtn_118ww_277 {
    width: 100%;
    height: 48px;
    font-size: 16px;
    font-weight: 500
}

._overlay_198u5_3 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000000d9;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center
}

._container_198u5_33 {
    width: 480px;
    max-width: 90vw;
    background: var(--bg-secondary);
    border-radius: var(--border-radius-xl);
    border: 1px solid var(--border-color);
    overflow: hidden;
    box-shadow: 0 20px 60px #00000080
}

._header_198u5_55 {
    padding: 24px 28px;
    background: linear-gradient(135deg, var(--color-primary) 0%, #1677ff 100%);
    text-align: center
}

._gameIcon_198u5_67 {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: #fff3;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 32px;
    color: #fff
}

._title_198u5_93 {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    margin: 0
}

._subtitle_198u5_107 {
    font-size: 14px;
    color: #fffc;
    margin-top: 4px
}

._content_198u5_121 {
    padding: 28px
}

._statusSection_198u5_131 {
    text-align: center;
    margin-bottom: 24px
}

._statusIcon_198u5_141 {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--bg-tertiary);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 24px;
    color: var(--color-primary)
}

._statusIcon_198u5_141._loading_198u5_167 {
    animation: _pulse_198u5_1 1.5s ease-in-out infinite
}

._statusIcon_198u5_141._success_198u5_175 {
    background: #52c41a1a;
    color: #52c41a
}

._statusIcon_198u5_141._error_198u5_185 {
    background: #ff4d4f1a;
    color: #ff4d4f
}

@keyframes _pulse_198u5_1 {
    0%,
    to {
        transform: scale(1);
        opacity: 1
    }
    50% {
        transform: scale(1.05);
        opacity: .8
    }
}

._statusText_198u5_217 {
    font-size: 16px;
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 8px
}

._statusDesc_198u5_231 {
    font-size: 13px;
    color: var(--text-muted)
}

._downloadSection_198u5_243 {
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-md);
    padding: 16px;
    margin-bottom: 20px
}

._downloadHeader_198u5_257 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px
}

._downloadTitle_198u5_271 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px
}

._downloadTitle_198u5_271 .anticon {
    color: var(--color-primary)
}

._downloadCount_198u5_297 {
    font-size: 13px;
    color: var(--text-muted)
}

._downloadProgress_198u5_307 {
    margin-bottom: 8px
}

._downloadProgress_198u5_307 .ant-progress-inner {
    background: var(--bg-secondary)
}

._downloadFile_198u5_323 {
    font-size: 12px;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

._stepList_198u5_341 {
    display: flex;
    flex-direction: column;
    gap: 12px
}

._stepItem_198u5_353 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-sm);
    transition: all .3s ease
}

._stepItem_198u5_353._active_198u5_373 {
    background: #1677ff1a;
    border-left: 3px solid var(--color-primary)
}

._stepItem_198u5_353._completed_198u5_383 {
    background: #52c41a1a
}

._stepItem_198u5_353._error_198u5_185 {
    background: #ff4d4f1a
}

._stepIcon_198u5_399 {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0
}

._stepItem_198u5_353 ._stepIcon_198u5_399 {
    background: var(--bg-secondary);
    color: var(--text-muted)
}

._stepItem_198u5_353._active_198u5_373 ._stepIcon_198u5_399 {
    background: var(--color-primary);
    color: #fff
}

._stepItem_198u5_353._completed_198u5_383 ._stepIcon_198u5_399 {
    background: #52c41a;
    color: #fff
}

._stepItem_198u5_353._error_198u5_185 ._stepIcon_198u5_399 {
    background: #ff4d4f;
    color: #fff
}

._stepText_198u5_461 {
    flex: 1;
    font-size: 13px;
    color: var(--text-secondary)
}

._stepItem_198u5_353._active_198u5_373 ._stepText_198u5_461 {
    color: var(--text-primary);
    font-weight: 500
}

._stepItem_198u5_353._completed_198u5_383 ._stepText_198u5_461 {
    color: #52c41a
}

._stepItem_198u5_353._error_198u5_185 ._stepText_198u5_461 {
    color: #ff4d4f
}

._footer_198u5_501 {
    padding: 0 28px 24px;
    display: flex;
    justify-content: center;
    gap: 12px
}

._footer_198u5_501 .ant-btn {
    min-width: 100px
}

._errorMessage_198u5_525 {
    background: #ff4d4f1a;
    border: 1px solid rgba(255, 77, 79, .3);
    border-radius: var(--border-radius-sm);
    padding: 12px 16px;
    margin-bottom: 16px;
    font-size: 13px;
    color: #ff4d4f;
    text-align: center
}

._serverInfo_198u5_549 {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--bg-tertiary);
    border-radius: var(--border-radius-md);
    margin-bottom: 20px
}

._serverIcon_198u5_569 {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #fff
}

._serverDetails_198u5_593 {
    flex: 1
}

._serverName_198u5_601 {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 2px
}

._serverAddress_198u5_615 {
    font-size: 12px;
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace
}

._container_1qusu_1 {
    padding: 24px;
    background: #141414;
    min-height: calc(100vh - 64px)
}

._section_1qusu_13 {
    background: #1f1f1f;
    border-radius: 8px;
    padding: 16px
}

._toolbar_1qusu_25 {
    margin-bottom: 16px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap
}

.ant-table {
    background: transparent
}

.ant-table-thead>tr>th {
    background: #262626 !important;
    color: #ffffffd9;
    border-bottom: 1px solid #303030
}

.ant-table-tbody>tr>td {
    background: #1f1f1f;
    border-bottom: 1px solid #303030
}

.ant-table-tbody>tr:hover>td {
    background: #262626 !important
}

.ant-modal-content {
    background: #1f1f1f
}

.ant-modal-header {
    background: #1f1f1f;
    border-bottom: 1px solid #303030
}

.ant-modal-title {
    color: #ffffffd9
}

.ant-descriptions-item-label {
    background: #262626 !important;
    color: #ffffffa6
}

.ant-descriptions-item-content {
    background: #1f1f1f;
    color: #ffffffd9
}

.ant-card {
    background: #1f1f1f;
    border: 1px solid #303030
}

.ant-tabs-tab {
    color: #ffffffa6
}

.ant-tabs-tab-active .ant-tabs-tab-btn {
    color: #1890ff !important
}

.ant-tabs-ink-bar {
    background: #1890ff
}

.ant-input,
.ant-input-number,
.ant-select-selector,
.ant-picker {
    background: #262626 !important;
    border-color: #434343 !important;
    color: #ffffffd9
}

.ant-input-number-input {
    color: #ffffffd9
}

.ant-input::placeholder,
.ant-input-number-input::placeholder {
    color: #ffffff73
}

.ant-form-item-label>label {
    color: #ffffffd9
}

.ant-pagination-item {
    background: #262626;
    border-color: #434343
}

.ant-pagination-item a {
    color: #ffffffa6
}

.ant-pagination-item-active {
    background: #1890ff;
    border-color: #1890ff
}

.ant-pagination-item-active a {
    color: #fff
}

.ant-select-dropdown {
    background: #1f1f1f
}

.ant-select-item {
    color: #ffffffd9
}

.ant-select-item-option-selected {
    background: #262626
}

.ant-select-item-option-active {
    background: #303030
}

.ant-image-preview-mask {
    background: #000c
}

:root {
    --color-primary: #00d4ff;
    --color-primary-light: #4de8ff;
    --color-primary-dark: #00a8cc;
    --color-primary-glow: rgba(0, 212, 255, .4);
    --color-accent: #ff6b35;
    --color-accent-glow: rgba(255, 107, 53, .4);
    --color-success: #00ff88;
    --color-warning: #ffaa00;
    --color-danger: #ff4757;
    --bg-primary: #0a0e14;
    --bg-secondary: #111820;
    --bg-tertiary: #1a2230;
    --bg-card: rgba(20, 28, 40, .85);
    --bg-glass: rgba(15, 20, 30, .75);
    --bg-glass-light: rgba(25, 35, 50, .6);
    --text-primary: #e8edf5;
    --text-secondary: #8b9cb5;
    --text-muted: #5a6a80;
    --border-color: rgba(100, 130, 170, .2);
    --border-glow: rgba(0, 212, 255, .3);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, .4);
    --shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);
    --shadow-glow: 0 0 30px var(--color-primary-glow);
    --font-display: "Orbitron", sans-serif;
    --font-body: "Noto Sans SC", -apple-system, BlinkMacSystemFont, sans-serif;
    --transition-fast: .15s ease;
    --transition-normal: .3s ease;
    --transition-slow: .5s ease;
    --sidebar-width: 260px;
    --header-height: 64px;
    --border-radius: 12px;
    --border-radius-sm: 8px;
    --border-radius-lg: 16px
}

*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

html {
    font-size: 16px;
    scroll-behavior: smooth
}

body {
    font-family: var(--font-body);
    background: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at 20% 20%, rgba(0, 212, 255, .08) 0%, transparent 50%), radial-gradient(ellipse at 80% 80%, rgba(255, 107, 53, .05) 0%, transparent 50%), linear-gradient(180deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    pointer-events: none;
    z-index: -1
}

body:after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(rgba(0, 212, 255, .03) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 212, 255, .03) 1px, transparent 1px);
    background-size: 50px 50px;
    pointer-events: none;
    z-index: -1
}

#root {
    min-height: 100vh
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

::-webkit-scrollbar-track {
    background: var(--bg-secondary)
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 4px;
    transition: background var(--transition-fast)
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-primary)
}

::selection {
    background: var(--color-primary);
    color: var(--bg-primary)
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast)
}

a:hover {
    color: var(--color-primary-light)
}

.glass {
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-color)
}

.glass-light {
    background: var(--bg-glass-light);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid var(--border-color)
}

.glow-primary {
    box-shadow: var(--shadow-glow)
}

.text-glow {
    text-shadow: 0 0 20px var(--color-primary-glow)
}

.ant-btn-primary {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border: none;
    font-weight: 500;
    transition: all var(--transition-normal)
}

.ant-btn-primary:hover {
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-primary) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 25px var(--color-primary-glow)
}

.ant-btn-default {
    background: var(--bg-glass);
    border-color: var(--border-color);
    color: var(--text-primary)
}

.ant-btn-default:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: #00d4ff1a
}

.ant-input,
.ant-input-password {
    background: #0a0f1999 !important;
    border-color: var(--border-color) !important
}

.ant-input:focus,
.ant-input-password:focus,
.ant-input-affix-wrapper-focused {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 2px var(--color-primary-glow) !important
}

.ant-modal-content {
    background: var(--bg-card) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg) !important
}

.ant-modal-header {
    background: transparent !important;
    border-bottom: 1px solid var(--border-color) !important
}

.ant-modal-title {
    color: var(--text-primary) !important;
    font-family: var(--font-display)
}

.ant-message-notice-content {
    background: var(--bg-card) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color)
}

html.electron-client .ant-message {
    top: calc(var(--electron-titlebar-height, 0px) + 8px) !important
}

html.electron-client .ant-notification {
    top: calc(var(--electron-titlebar-height, 0px) + 24px) !important
}

html.electron-client .ant-modal-wrap {
    padding-top: var(--electron-titlebar-height, 0px)
}

.ant-tabs-tab {
    color: var(--text-secondary) !important;
    transition: all var(--transition-normal)
}

.ant-tabs-tab:hover,
.ant-tabs-tab-active .ant-tabs-tab-btn {
    color: var(--color-primary) !important
}

.ant-tabs-ink-bar {
    background: var(--color-primary) !important
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes slideUp {
    0% {
        opacity: 0;
        transform: translateY(20px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes slideIn {
    0% {
        opacity: 0;
        transform: translate(-20px)
    }
    to {
        opacity: 1;
        transform: translate(0)
    }
}

@keyframes pulse {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}

@keyframes glow {
    0%,
    to {
        box-shadow: 0 0 20px var(--color-primary-glow)
    }
    50% {
        box-shadow: 0 0 40px var(--color-primary-glow), 0 0 60px var(--color-primary-glow)
    }
}

.animate-fade-in {
    animation: fadeIn .5s ease forwards
}

.animate-slide-up {
    animation: slideUp .5s ease forwards
}

.animate-slide-in {
    animation: slideIn .5s ease forwards
}

:root {
    --electron-titlebar-height: 0px
}

html.electron-client {
    --electron-titlebar-height: 36px
}