/* 用户中心弹窗 v2 - 仅作用于 #userCenterModal，由 user-center-modal-v2.html 抽取 */
/* ==================== 星空背景层 ==================== */
    #userCenterModal.uc-v2 {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 100vh;
        min-height: 100dvh;
        background: transparent;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
        box-sizing: border-box;
        z-index: 10000;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        pointer-events: none;
    }

    #userCenterModal.uc-v2::before {
        content: none;
        display: none;
    }

    #userCenterModal.uc-v2 .modal {
        pointer-events: auto;
    }


    /* ==================== 弹窗主体 ==================== */
    #userCenterModal .modal {
        position: relative;
        width: 100%;
        max-width: 980px;
        background: linear-gradient(160deg, #131836 0%, #0d1228 50%, #0a0f1f 100%);
        border-radius: 16px;
        padding: 22px 26px 26px;
        box-shadow:
            0 0 0 1px rgba(139, 92, 246, 0.35),
            0 0 50px rgba(139, 92, 246, 0.3),
            0 0 100px rgba(99, 102, 241, 0.18),
            0 25px 50px rgba(0, 0, 0, 0.5);
        border: 1px solid rgba(139, 92, 246, 0.3);
        animation: modalEnter 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    }


    @keyframes modalEnter {
        from {
            opacity: 0;
            transform: scale(0.92) translateY(10px);
        }
        to {
            opacity: 1;
            transform: scale(1) translateY(0);
        }
    }


    /* ==================== 头部区域 ==================== */
    #userCenterModal .modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 22px;
    }


    #userCenterModal .header-title {
        display: flex;
        align-items: center;
        gap: 14px;
    }


    /* ========== 主题图标：用户 + 皇冠（贴合用户中心+VIP主题） ========== */
    #userCenterModal .theme-icon {
        width: 42px;
        height: 42px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        filter: drop-shadow(0 0 8px rgba(139, 92, 246, 0.6));
    }


    /* 外层光环 */
    #userCenterModal .theme-icon::before {
        content: "";
        position: absolute;
        inset: -3px;
        border-radius: 50%;
        background: conic-gradient(
            from 0deg,
            #a78bfa,
            #f472b6,
            #38bdf8,
            #c084fc,
            #a78bfa
        );
        opacity: 0.5;
        filter: blur(6px);
        animation: rotateGlow 6s linear infinite;
    }


    @keyframes rotateGlow {
        to { transform: rotate(360deg); }
    }


    /* 内层用户头像 */
    #userCenterModal .user-avatar {
        position: relative;
        width: 38px;
        height: 38px;
        background: linear-gradient(135deg, #c4b5fd 0%, #818cf8 50%, #6366f1 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow:
            inset 0 2px 4px rgba(255, 255, 255, 0.3),
            inset 0 -2px 4px rgba(0, 0, 0, 0.2);
        z-index: 1;
    }


    /* 头像内的人物剪影 */
    #userCenterModal .user-avatar svg {
        width: 26px;
        height: 26px;
        fill: #ffffff;
        opacity: 0.95;
    }


    /* 标题文字 + 装饰星星 */
    #userCenterModal .title-wrap {
        display: flex;
        align-items: center;
        gap: 8px;
    }


    #userCenterModal .header-title h2 {
        font-size: 22px;
        font-weight: 600;
        color: #ffffff;
        letter-spacing: 1.5px;
    }


    /* 标题旁小装饰星 */
    #userCenterModal .title-sparkle {
        font-size: 14px;
        color: #f472b6;
        animation: sparkle 2s ease-in-out infinite;
    }


    @keyframes sparkle {
        0%, 100% { opacity: 0.5; transform: scale(0.9); }
        50% { opacity: 1; transform: scale(1.1); }
    }


    /* 关闭按钮 */
    #userCenterModal .close-btn {
        width: 36px;
        height: 36px;
        background: transparent;
        border: 1px solid rgba(139, 92, 246, 0.5);
        border-radius: 8px;
        color: #a78bfa;
        font-size: 18px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.25s ease;
        box-shadow: 0 0 12px rgba(139, 92, 246, 0.2);
    }


    #userCenterModal .close-btn:hover {
        background: rgba(139, 92, 246, 0.15);
        border-color: rgba(167, 139, 250, 0.9);
        color: #fff;
        box-shadow: 0 0 18px rgba(139, 92, 246, 0.5);
        transform: rotate(90deg);
    }


    #userCenterModal .close-btn:active {
        transform: rotate(90deg) scale(0.92);
    }


    /* ==================== 主体两栏布局 ==================== */
    #userCenterModal .modal-body {
        display: flex;
        gap: 20px;
    }


    #userCenterModal .left-col {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }


    /* ==================== Tab 导航 ==================== */
    #userCenterModal .tabs {
        display: flex;
        align-items: center;
        gap: 4px;
        background: rgba(15, 23, 42, 0.6);
        border-radius: 10px;
        padding: 5px;
        border: 1px solid rgba(139, 92, 246, 0.15);
    }


    #userCenterModal .tab {
        flex: 1;
        padding: 10px 8px;
        text-align: center;
        font-size: 13.5px;
        color: #94a3b8;
        cursor: pointer;
        border-radius: 7px;
        transition: all 0.3s ease;
        user-select: none;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        white-space: nowrap;
    }


    #userCenterModal .tab svg {
        width: 14px;
        height: 14px;
        fill: currentColor;
        flex-shrink: 0;
    }


    #userCenterModal .tab:hover {
        color: #cbd5e1;
        background: rgba(99, 102, 241, 0.08);
    }


    #userCenterModal .tab.active {
        color: #c4b5fd;
        background: linear-gradient(180deg, rgba(99, 102, 241, 0.25), rgba(139, 92, 246, 0.1));
        box-shadow:
            0 0 16px rgba(139, 92, 246, 0.3),
            inset 0 -2px 0 #a78bfa;
    }


    /* ==================== 信息列表容器 ==================== */
    #userCenterModal .info-list {
        background: rgba(15, 23, 42, 0.55);
        border-radius: 12px;
        padding: 8px;
        border: 1px solid rgba(99, 102, 241, 0.12);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    }


    /* 单个信息行 */
    #userCenterModal .info-item {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 13px 16px;
        border-radius: 10px;
        transition: background 0.25s ease;
        cursor: pointer;
    }


    #userCenterModal .info-item + .info-item {
        margin-top: 4px;
    }


    #userCenterModal .info-item:hover {
        background: rgba(99, 102, 241, 0.08);
    }


    #userCenterModal .info-item.no-arrow {
        cursor: default;
    }


    /* 图标容器 */
    #userCenterModal .icon-box {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }


    #userCenterModal .icon-box svg {
        width: 17px;
        height: 17px;
        fill: #ffffff;
    }


    /* 各行图标配色 */
    #userCenterModal .icon-user {
        background: linear-gradient(135deg, #60a5fa, #2563eb);
        box-shadow: 0 0 12px rgba(59, 130, 246, 0.5);
    }


    #userCenterModal .icon-vip {
        background: linear-gradient(135deg, #c084fc, #7e22ce);
        box-shadow: 0 0 12px rgba(168, 85, 247, 0.5);
        font-size: 10px;
        font-weight: 700;
        color: #fff;
        letter-spacing: 0.5px;
    }


    #userCenterModal .icon-points {
        background: linear-gradient(135deg, #60a5fa, #3b82f6);
        box-shadow: 0 0 12px rgba(59, 130, 246, 0.5);
    }


    #userCenterModal .icon-checkin {
        background: linear-gradient(135deg, #ec4899, #be185d);
        box-shadow: 0 0 12px rgba(236, 72, 153, 0.5);
    }


    #userCenterModal .icon-time {
        background: linear-gradient(135deg, #34d399, #059669);
        box-shadow: 0 0 12px rgba(16, 185, 129, 0.5);
    }


    /* 标签文本区 */
    #userCenterModal .info-label {
        flex: 1;
        min-width: 0;
    }


    #userCenterModal .info-label .label-main {
        color: #e2e8f0;
        font-size: 15px;
        font-weight: 500;
    }


    #userCenterModal .info-label .label-sub {
        color: #64748b;
        font-size: 12px;
        margin-top: 2px;
    }


    /* 右侧值 */
    #userCenterModal .info-value {
        color: #cbd5e1;
        font-size: 15px;
        font-weight: 500;
        display: flex;
        align-items: center;
        gap: 6px;
    }


    #userCenterModal .info-value.points {
        color: #38bdf8;
        font-weight: 600;
        font-size: 22px;
        text-shadow: 0 0 12px rgba(56, 189, 248, 0.5);
    }


    /* 箭头图标 */
    #userCenterModal .chevron {
        color: #64748b;
        font-size: 14px;
        transition: transform 0.2s ease, color 0.2s ease;
    }


    #userCenterModal .info-item:hover .chevron {
        color: #a78bfa;
        transform: translateX(2px);
    }


    /* 签到按钮（粉紫渐变） */
    #userCenterModal .checkin-btn {
        padding: 10px 26px;
        font-size: 14px;
        font-weight: 600;
        color: #ffffff;
        background: linear-gradient(135deg, #ec4899 0%, #a855f7 50%, #6366f1 100%);
        border: none;
        border-radius: 8px;
        cursor: pointer;
        transition: all 0.25s ease;
        box-shadow:
            0 0 18px rgba(236, 72, 153, 0.5),
            0 4px 12px rgba(168, 85, 247, 0.3);
        letter-spacing: 1px;
    }


    #userCenterModal .checkin-btn:hover {
        transform: translateY(-1px);
        box-shadow:
            0 0 24px rgba(236, 72, 153, 0.7),
            0 6px 16px rgba(168, 85, 247, 0.4);
        filter: brightness(1.1);
    }


    #userCenterModal .checkin-btn:active {
        transform: translateY(0);
        filter: brightness(0.95);
    }


    #userCenterModal .checkin-btn:focus-visible {
        outline: 2px solid #f472b6;
        outline-offset: 2px;
    }


    /* ==================== 右侧 VIP 插画区 ==================== */
    #userCenterModal .right-col {
        width: 280px;
        flex-shrink: 0;
        background: rgba(15, 23, 42, 0.4);
        border-radius: 12px;
        border: 1px solid rgba(139, 92, 246, 0.12);
        position: relative;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 0;
        height: auto;
        align-self: stretch;
    }


    /* 背景光晕 */
    #userCenterModal .right-col::before {
        content: "";
        position: absolute;
        top: 30%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 220px;
        height: 220px;
        background: radial-gradient(circle, rgba(139, 92, 246, 0.4), transparent 60%);
        filter: blur(30px);
        animation: pulseGlow 4s ease-in-out infinite;
    }


    @keyframes pulseGlow {
        0%, 100% { opacity: 0.6; transform: translate(-50%, -50%) scale(1); }
        50% { opacity: 0.9; transform: translate(-50%, -50%) scale(1.1); }
    }


    /* VIP 人物插画容器 */
    #userCenterModal .vip-illustration {
        position: relative;
        width: 240px;
        height: 320px;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    /* 人物整体：轻柔漂浮（呼吸感） */
    #userCenterModal .vip-figure {
        position: absolute;
        bottom: 74px;
        left: 50%;
        transform: translateX(-50%);
        width: 150px;
        height: 184px;
        animation: floatFigure 5.5s ease-in-out infinite;
        z-index: 2;
    }


    @keyframes floatFigure {
        0%, 100% { transform: translateX(-50%) translateY(0); }
        50%      { transform: translateX(-50%) translateY(-12px); }
    }


    /* 身体：头身一体的流动鹅卵石造型（柔和不生硬） */
    #userCenterModal .vip-body {
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 132px;
        height: 168px;
        background: linear-gradient(160deg, #c4b5fd 0%, #a5b4fc 32%, #818cf8 64%, #6366f1 100%);
        border-radius: 47% 47% 45% 45% / 55% 55% 45% 45%;
        box-shadow:
            0 22px 46px rgba(79, 70, 229, 0.42),
            inset 9px 11px 24px rgba(255, 255, 255, 0.30),
            inset -11px -13px 28px rgba(49, 46, 129, 0.45);
    }


    /* 顶部柔光，增强体积感 */
    #userCenterModal .vip-body::after {
        content: "";
        position: absolute;
        top: 16px;
        left: 50%;
        transform: translateX(-50%);
        width: 74px;
        height: 64px;
        background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.5), transparent 70%);
        border-radius: 50%;
        filter: blur(5px);
    }


    /* 眼睛：柔光小点（萌系，弱化生硬感） */
    #userCenterModal .vip-eye {
        position: absolute;
        top: 60px;
        width: 14px;
        height: 17px;
        background: radial-gradient(circle at 40% 32%, #ffffff 0%, #ede9fe 62%, #c4b5fd 100%);
        border-radius: 50%;
        box-shadow: 0 0 9px rgba(255, 255, 255, 0.6);
        z-index: 3;
    }


    #userCenterModal .vip-eye-l { left: 42px; }

    #userCenterModal .vip-eye-r { right: 42px; }


    /* 腮红 */
    #userCenterModal .vip-cheek {
        position: absolute;
        top: 82px;
        width: 18px;
        height: 10px;
        background: radial-gradient(ellipse, rgba(244, 114, 182, 0.7), transparent 72%);
        border-radius: 50%;
        z-index: 3;
    }


    #userCenterModal .vip-cheek-l { left: 28px; }

    #userCenterModal .vip-cheek-r { right: 28px; }


    /* 轨道环（纤细、半透明、缓慢旋转，更优雅） */
    #userCenterModal .orbit-ring {
        position: absolute;
        top: 46%;
        left: 50%;
        transform: translate(-50%, -50%) rotateZ(-18deg);
        width: 208px;
        height: 56px;
        border: 1px solid;
        border-color: rgba(167, 139, 250, 0.32) transparent rgba(56, 189, 248, 0.28) transparent;
        border-radius: 50%;
        box-shadow: 0 0 8px rgba(139, 92, 246, 0.22);
        animation: orbitSpin 28s linear infinite;
        z-index: 1;
    }


    @keyframes orbitSpin {
        to { transform: translate(-50%, -50%) rotateZ(342deg); }
    }


    #userCenterModal .orbit-ring-2 {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotateZ(32deg);
        width: 232px;
        height: 66px;
        border: 1px solid;
        border-color: transparent rgba(236, 72, 153, 0.24) transparent rgba(168, 85, 247, 0.22);
        border-radius: 50%;
        box-shadow: 0 0 6px rgba(236, 72, 153, 0.18);
        animation: orbitSpin2 36s linear infinite reverse;
        z-index: 1;
    }


    @keyframes orbitSpin2 {
        to { transform: translate(-50%, -50%) rotateZ(392deg); }
    }


    /* 浮动星徽（柔和发光圆，替代生硬方块） */
    #userCenterModal .vip-badge {
        position: absolute;
        top: 98px;
        right: 4px;
        width: 42px;
        height: 42px;
        background: radial-gradient(circle at 35% 30%, #fbcfe8, #f472b6 46%, #a855f7 100%);
        border-radius: 50%;
        box-shadow:
            0 0 22px rgba(244, 114, 182, 0.6),
            inset 0 0 10px rgba(255, 255, 255, 0.35);
        display: flex;
        align-items: center;
        justify-content: center;
        animation: floatBadge 4.5s ease-in-out infinite;
        z-index: 4;
    }


    @keyframes floatBadge {
        0%, 100% { transform: translateY(0); }
        50%      { transform: translateY(-9px); }
    }


    #userCenterModal .vip-badge svg {
        width: 22px;
        height: 22px;
        fill: #ffffff;
        filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.6));
    }


    /* 底座光环（呼吸） */
    #userCenterModal .vip-platform {
        position: absolute;
        bottom: 46px;
        left: 50%;
        transform: translateX(-50%);
        width: 188px;
        height: 22px;
        background: radial-gradient(ellipse at center,
            rgba(99, 102, 241, 0.55) 0%,
            rgba(139, 92, 246, 0.25) 42%,
            transparent 72%);
        border-radius: 50%;
        box-shadow: 0 0 26px rgba(99, 102, 241, 0.45);
        animation: pulsePlatform 4.5s ease-in-out infinite;
        z-index: 0;
    }


    @keyframes pulsePlatform {
        0%, 100% { opacity: 0.7; transform: translateX(-50%) scaleX(1); }
        50%      { opacity: 1;   transform: translateX(-50%) scaleX(1.08); }
    }


    #userCenterModal .vip-platform::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 130px;
        height: 12px;
        border: 1px solid rgba(167, 139, 250, 0.4);
        border-radius: 50%;
    }


    /* 装饰小星星（柔光闪烁） */
    #userCenterModal .star {
        position: absolute;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 0 6px #fff, 0 0 10px rgba(196, 181, 253, 0.8);
        animation: twinkle 2.8s ease-in-out infinite;
        z-index: 5;
    }


    #userCenterModal .star-1 {
        top: 50px;
        left: 30px;
        width: 4px;
        height: 4px;
        animation-delay: 0s;
    }


    #userCenterModal .star-2 {
        top: 80px;
        right: 40px;
        width: 6px;
        height: 6px;
        animation-delay: 0.8s;
    }


    #userCenterModal .star-3 {
        top: 140px;
        left: 50px;
        width: 3px;
        height: 3px;
        animation-delay: 1.5s;
    }


    #userCenterModal .star-4 {
        bottom: 120px;
        right: 30px;
        width: 5px;
        height: 5px;
        animation-delay: 0.4s;
    }


    #userCenterModal .star-5 {
        top: 110px;
        left: 20px;
        width: 3px;
        height: 3px;
        animation-delay: 1.2s;
    }


    @keyframes twinkle {
        0%, 100% { opacity: 0.25; transform: scale(0.7); }
        50%      { opacity: 1;    transform: scale(1.15); }
    }


    /* ==================== 响应式适配 ==================== */
    @media (max-width: 900px) {

        #userCenterModal .right-col {
            display: none;
        }


        #userCenterModal .modal {
            max-width: 700px;
        }

    }


    @media (max-width: 768px) {

        #userCenterModal.uc-v2 {
            padding: 12px;
        }


        #userCenterModal .modal {
            padding: 18px 16px 20px;
            border-radius: 14px;
            height: 520px;
            max-height: calc(100dvh - 24px);
        }


        #userCenterModal .header-title h2 {
            font-size: 18px;
        }


        #userCenterModal .theme-icon {
            width: 38px;
            height: 38px;
        }


        #userCenterModal .user-avatar {
            width: 34px;
            height: 34px;
        }


        #userCenterModal .user-avatar svg {
            width: 22px;
            height: 22px;
        }


        #userCenterModal .close-btn {
            width: 32px;
            height: 32px;
        }


        #userCenterModal .tab {
            padding: 9px 4px;
            font-size: 12px;
            gap: 3px;
        }


        #userCenterModal .tab svg {
            width: 12px;
            height: 12px;
        }


        #userCenterModal .info-item {
            padding: 11px 12px;
            gap: 12px;
        }


        #userCenterModal .icon-box {
            width: 30px;
            height: 30px;
        }


        #userCenterModal .icon-box svg {
            width: 15px;
            height: 15px;
        }


        #userCenterModal .info-label .label-main {
            font-size: 14px;
        }


        #userCenterModal .info-value {
            font-size: 14px;
        }


        #userCenterModal .info-value.points {
            font-size: 18px;
        }


        #userCenterModal .checkin-btn {
            padding: 8px 18px;
            font-size: 13px;
        }

    }


    @media (max-width: 480px) {

        #userCenterModal .tabs {
            flex-wrap: wrap;
        }


        #userCenterModal .tab {
            flex: 1 0 30%;
            font-size: 11px;
            padding: 7px 3px;
        }

    }

/* ===== 功能面板与表单（v2 皮肤下保留原功能） ===== */
#userCenterModal {
  z-index: 10000 !important;
  box-sizing: border-box;
}
#userCenterModal *, #userCenterModal *::before, #userCenterModal *::after { box-sizing: border-box; }
#userCenterModal .uc-panel { display: none; }
#userCenterModal .uc-panel.active { display: flex; flex-direction: column; }
#userCenterModal #uc-info.uc-panel.active,
#userCenterModal #uc-info:not([style*="display: none"]) { }
#userCenterModal .uc-form { display: grid; gap: 14px; max-width: 480px; }
#userCenterModal .uc-form label {
  display: block; color: #94a3b8; margin-bottom: 6px; font-size: 13px;
}
#userCenterModal .uc-form input {
  width: 100%; padding: 10px 14px; border-radius: 8px;
  background: rgba(15, 23, 42, 0.7); border: 1px solid rgba(139, 92, 246, 0.25);
  color: #e2e8f0; font-size: 14px; outline: none;
}
#userCenterModal .uc-form input:focus {
  border-color: rgba(167, 139, 250, 0.7); box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}
#userCenterModal .uc-primary-btn {
  padding: 10px 20px; border: none; border-radius: 8px; cursor: pointer;
  background: linear-gradient(135deg, #a78bfa, #818cf8); color: #0f172a;
  font-size: 14px; font-weight: 600; transition: filter .2s, transform .2s;
}
#userCenterModal .uc-primary-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
#userCenterModal .uc-msg { font-size: 13px; min-height: 20px; color: #94a3b8; }
#userCenterModal #pointsList {
  display: grid;
  gap: 10px;
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
  padding-right: 2px;
}
#userCenterModal .uc-pt-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(99, 102, 241, 0.14), rgba(15, 23, 42, 0.55)),
    rgba(30, 41, 59, 0.55);
  border: 1px solid rgba(139, 92, 246, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
#userCenterModal .uc-pt-item:hover {
  background:
    linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(15, 23, 42, 0.62)),
    rgba(30, 41, 59, 0.62);
  border-color: rgba(167, 139, 250, 0.32);
}
#userCenterModal .uc-pt-reason {
  color: #e2e8f0;
  font-size: 13px;
  line-height: 1.4;
}
#userCenterModal .uc-pt-time {
  color: #94a3b8;
  font-size: 11px;
  margin-top: 3px;
}
#userCenterModal .uc-pt-change {
  font-weight: 700;
  font-size: 15px;
  flex-shrink: 0;
}
#userCenterModal .uc-pt-change.plus { color: #34d399; text-shadow: 0 0 10px rgba(52, 211, 153, 0.25); }
#userCenterModal .uc-pt-change.minus { color: #fb7185; text-shadow: 0 0 10px rgba(251, 113, 133, 0.2); }
#userCenterModal #pointsPagination { display: flex; justify-content: center; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
#userCenterModal #pointsPagination button,
#userCenterModal .uc-page-btn {
  padding: 6px 12px; border-radius: 8px; cursor: pointer; font-size: 13px;
  border: 1px solid rgba(139, 92, 246, 0.28);
  background: rgba(15, 23, 42, 0.65);
  color: #e2e8f0;
}
#userCenterModal #pointsPagination button.is-active,
#userCenterModal .uc-page-btn.is-active {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.9), rgba(129, 140, 248, 0.9));
  color: #0f172a;
  border-color: transparent;
}
#userCenterModal #uc-recharge-links { display: flex; flex-wrap: wrap; gap: 10px; }
#userCenterModal #uc-recharge-links a {
  display: inline-block; padding: 10px 20px; border-radius: 8px; text-decoration: none;
  background: linear-gradient(135deg, #a78bfa, #818cf8); color: #0f172a; font-size: 14px; font-weight: 600;
}
#userCenterModal .uc-points-value {
  color: #38bdf8; font-weight: 700; font-size: 18px;
}
#userCenterModal .checkin-btn:disabled,
#userCenterModal .checkin-btn.is-signed {
  opacity: .72;
  cursor: not-allowed !important;
  filter: grayscale(.2);
  box-shadow: none;
  transform: none;
}
#userCenterModal .checkin-btn.is-signed:hover {
  transform: none;
  filter: grayscale(.2);
}
#userCenterModal .tab.uc-tab { cursor: pointer; user-select: none; }
#userCenterModal .modal {
  height: min(620px, calc(100dvh - 40px));
  max-height: min(90vh, calc(100dvh - 40px));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: auto;
}
#userCenterModal .modal-body {
  overflow: hidden;
  min-height: 0;
  flex: 1;
  align-items: stretch;
}
#userCenterModal .left-col {
  overflow: hidden;
  max-height: none;
  min-height: 0;
  flex: 1;
  padding-right: 4px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#userCenterModal .left-col > .tabs {
  flex-shrink: 0;
}
#userCenterModal .tab.uc-tab-recharge[style*="display: none"] { display: none !important; }
#userCenterModal .uc-panel {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
#userCenterModal .uc-panel.active {
  display: flex;
  flex-direction: column;
}
#userCenterModal .right-col {
  min-height: 0;
  height: auto;
  align-self: stretch;
}