/**
 * UserHub Pro - 前端样式
 * 
 * 目录索引 (Table of Contents)
 * ============================================================================
 * 
 * 1. BASE - 基础样式
 *    1.1 CSS Variables          - CSS 变量定义
 *    1.2 Button Reset           - 按钮样式重置（覆盖主题）
 * 
 * 2. LAYOUT - 布局组件
 *    2.1 Fullpage Template      - 全屏认证页模板
 *    2.2 Form Container         - 表单容器
 * 
 * 3. COMPONENTS - 通用组件
 *    3.1 Buttons                - 按钮样式
 *    3.2 Forms                  - 表单元素
 *    3.3 Messages               - 消息提示
 *    3.4 Modal                  - 模态框
 *    3.5 Toast                  - Toast 提示
 *    3.6 Pagination             - 分页组件
 *    3.7 Loading                - 加载状态
 *    3.8 Empty State            - 空状态
 *    3.9 Lightbox               - 图片预览
 *    3.10 Confirm Dialog        - 确认对话框
 * 
 * 4. USER CENTER - 用户中心
 *    4.1 Layout                 - 用户中心布局
 *    4.2 Navigation             - 导航菜单（轻量 Tab）
 *    4.3 Header                 - 头部区域
 *    4.4 Content                - 内容区域
 *    4.5 Settings               - 设置页面
 *    4.6 Overview               - 动态页面
 * 
 * 5. FEATURES - 功能模块
 *    5.1 Social Login           - 社交登录
 *    5.2 Login Modal            - 登录模态框
 *    5.3 Avatar Manager         - 头像管理
 *    5.4 Post Actions           - 点赞收藏
 *    5.5 User Comments          - 用户评论
 *    5.6 Login Logs             - 登录日志
 * 
 * 6. MODULES - 业务模块
 *    6.1 Points System          - 积分系统
 *    6.2 Checkin Calendar       - 签到日历
 *    6.3 Badges                 - 徽章系统
 *    6.4 Follow System          - 关注系统
 *    6.5 Poster                 - 分享海报
 *    6.6 Notifications          - 通知中心
 *    6.7 Reports                - 举报系统
 * 
 * 7. CONTENT - 内容模块
 *    7.1 Creations              - 创作中心
 *    7.2 Submissions            - 投稿系统
 *    7.3 Thoughts               - 想法系统
 * 
 * 8. PAGES - 页面特定样式
 *    8.1 User Profile           - 用户公开主页
 *    8.2 404 Page               - 404 页面
 *    8.3 Access Denied          - 无权访问
 * 
 * 9. RESPONSIVE - 响应式样式
 *    9.1 Mobile (max-width: 768px)
 *    9.2 Small Mobile (max-width: 480px)
 * 
 * ============================================================================
 */


/* ==========================================================================
   1. BASE - 基础样式
   ========================================================================== */

/* --------------------------------------------------------------------------
   1.1 CSS Variables - CSS 变量定义
   -------------------------------------------------------------------------- */
:root {
    --uap-primary: #2563eb;
    --uap-primary-hover: #1d4ed8;
    --uap-success: #10b981;
    --uap-error: #ef4444;
    --uap-warning: #f59e0b;
    --uap-border: #e5e7eb;
    --uap-text: #374151;
    --uap-text-light: #6b7280;
    --uap-bg: #f9fafb;
    --uap-radius: 8px;
}

/* --------------------------------------------------------------------------
   1.2 Button Reset - 按钮样式重置（覆盖主题）
   -------------------------------------------------------------------------- */

/* 
 * 按钮样式重置 - 覆盖主题通用样式
 * 针对主题中 [type=button]:focus, button:hover 等选择器
 */
[type=button].uap-btn:focus,
[type=button].uap-btn:hover,
[type=submit].uap-btn:focus,
[type=submit].uap-btn:hover,
button.uap-btn:focus,
button.uap-btn:hover,
[type=button].uap-btn-primary:focus,
[type=button].uap-btn-primary:hover,
button.uap-btn-primary:focus,
button.uap-btn-primary:hover {
    /* color: #fff !important;
    background-color: var(--uap-primary-hover, #1d4ed8) !important;
    text-decoration: none !important; */
}

[type=button].uap-btn-secondary:focus,
[type=button].uap-btn-secondary:hover,
button.uap-btn-secondary:focus,
button.uap-btn-secondary:hover {
    color: var(--uap-primary, #2563eb) !important;
    background-color: #eff6ff !important;
    text-decoration: none !important;
}

[type=button].uap-btn-ghost:focus,
[type=button].uap-btn-ghost:hover,
button.uap-btn-ghost:focus,
button.uap-btn-ghost:hover {
    color: var(--uap-text, #374151) !important;
    background-color: #f3f4f6 !important;
    text-decoration: none !important;
}

[type=button].uap-filter-btn:focus,
[type=button].uap-filter-btn:hover,
button.uap-filter-btn:focus,
button.uap-filter-btn:hover {
    color: var(--uap-primary, #2563eb) !important;
    background-color: #eff6ff !important;
    text-decoration: none !important;
}

[type=button].uap-filter-btn.active:focus,
[type=button].uap-filter-btn.active:hover,
button.uap-filter-btn.active:focus,
button.uap-filter-btn.active:hover {
    color: #fff !important;
    background-color: var(--uap-primary, #2563eb) !important;
}

[type=button].uap-editor-btn-ghost:focus,
[type=button].uap-editor-btn-ghost:hover,
button.uap-editor-btn-ghost:focus,
button.uap-editor-btn-ghost:hover {
    color: #1f2937 !important;
    background-color: #f3f4f6 !important;
    text-decoration: none !important;
}

[type=button].uap-editor-btn-primary:focus,
[type=button].uap-editor-btn-primary:hover,
button.uap-editor-btn-primary:focus,
button.uap-editor-btn-primary:hover {
    color: #fff !important;
    background-color: var(--uap-primary-hover, #1d4ed8) !important;
    text-decoration: none !important;
}

[type=button].uap-add-tag-btn:focus,
[type=button].uap-add-tag-btn:hover,
button.uap-add-tag-btn:focus,
button.uap-add-tag-btn:hover {
    color: var(--uap-primary, #2563eb) !important;
    background-color: transparent !important;
    border-color: var(--uap-primary, #2563eb) !important;
    text-decoration: none !important;
}

[type=button].uap-tag-remove:focus,
[type=button].uap-tag-remove:hover,
button.uap-tag-remove:focus,
button.uap-tag-remove:hover {
    color: #dc2626 !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

[type=button].uap-thought-tool-btn:focus,
[type=button].uap-thought-tool-btn:hover,
button.uap-thought-tool-btn:focus,
button.uap-thought-tool-btn:hover {
    color: var(--uap-primary, #2563eb) !important;
    background-color: #eff6ff !important;
    text-decoration: none !important;
}

[type=button].uap-thought-submit-btn:focus,
[type=button].uap-thought-submit-btn:hover,
button.uap-thought-submit-btn:focus,
button.uap-thought-submit-btn:hover {
    color: #fff !important;
    background-color: var(--uap-primary-hover, #1d4ed8) !important;
    text-decoration: none !important;
}

[type=button].uap-thought-submit-btn:disabled:focus,
[type=button].uap-thought-submit-btn:disabled:hover,
button.uap-thought-submit-btn:disabled:focus,
button.uap-thought-submit-btn:disabled:hover {
    color: #fff !important;
    background-color: #d1d5db !important;
}

[type=button].uap-creation-action-btn:focus,
[type=button].uap-creation-action-btn:hover,
button.uap-creation-action-btn:focus,
button.uap-creation-action-btn:hover {
    color: #374151 !important;
    background-color: #e5e7eb !important;
    text-decoration: none !important;
}

[type=button].uap-creation-action-btn.uap-delete-btn:focus,
[type=button].uap-creation-action-btn.uap-delete-btn:hover,
button.uap-creation-action-btn.uap-delete-btn:focus,
button.uap-creation-action-btn.uap-delete-btn:hover {
    color: #dc2626 !important;
    background-color: #fee2e2 !important;
}

[type=button].uap-cover-change:focus,
[type=button].uap-cover-change:hover,
button.uap-cover-change:focus,
button.uap-cover-change:hover {
    color: #1f2937 !important;
    background-color: #f3f4f6 !important;
    text-decoration: none !important;
}

[type=button].uap-cover-delete:focus,
[type=button].uap-cover-delete:hover,
button.uap-cover-delete:focus,
button.uap-cover-delete:hover {
    color: #fff !important;
    background-color: #ef4444 !important;
    text-decoration: none !important;
}

/* ==========================================================================
   2. LAYOUT - 布局组件
   ========================================================================== */

/* --------------------------------------------------------------------------
   2.1 Fullpage Template - 全屏认证页模板
   -------------------------------------------------------------------------- */

/* 全屏模板 */
.uap-fullpage-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    background: linear-gradient(135deg, #f0f4ff 0%, #e8f0fe 50%, #f5f0ff 100%);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
    box-sizing: border-box;
}

.uap-fullpage-wrapper.has-background {
    background-color: #1a1a2e;
}

.uap-fullpage-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    pointer-events: none;
}

.uap-fullpage-content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 420px;
}

.uap-fullpage-wrapper .uap-form-container {
    margin: 0;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.uap-fullpage-wrapper.has-background .uap-form-container {
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.95);
}

/* --------------------------------------------------------------------------
   2.2 Form Container - 表单容器
   -------------------------------------------------------------------------- */

/* 表单容器 */
.uap-form-container {
    max-width: 400px;
    margin: 40px auto;
    padding: 32px;
    background: #fff;
    border-radius: var(--uap-radius);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.uap-form-title {
    margin: 0 0 24px;
    font-size: 24px;
    font-weight: 600;
    color: var(--uap-text);
    text-align: center;
}

.uap-form-desc {
    margin: 0 0 20px;
    color: var(--uap-text-light);
    font-size: 14px;
    text-align: center;
}

/* ==========================================================================
   3. COMPONENTS - 通用组件
   ========================================================================== */

/* --------------------------------------------------------------------------
   3.1 Forms - 表单元素
   -------------------------------------------------------------------------- */

/* 表单字段 */
.uap-field {
    margin-bottom: 20px;
}

.uap-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--uap-text);
}

.uap-field label .required {
    color: var(--uap-error);
}

.uap-input {
    width: 100%;
    padding: 10px 14px;
    font-size: 14px;
    border: 1px solid var(--uap-border);
    border-radius: var(--uap-radius);
    background: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.uap-input:focus {
    outline: none;
    border-color: var(--uap-primary);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.uap-input.error {
    border-color: var(--uap-error);
}

.uap-input.success {
    border-color: var(--uap-success);
}

textarea.uap-input {
    resize: vertical;
    min-height: 100px;
}

.uap-field-hint {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--uap-text-light);
}

.uap-field-hint.error {
    color: var(--uap-error);
}

.uap-field-hint.success {
    color: var(--uap-success);
}

/* 复选框 */
.uap-checkbox-field label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 400;
}

.uap-checkbox-field input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* --------------------------------------------------------------------------
   3.2 Buttons - 按钮样式
   -------------------------------------------------------------------------- */

/* 按钮 */
.uap-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    border-radius: var(--uap-radius);
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.uap-button-primary {
    background: var(--uap-primary);
    color: #fff;
}

.uap-button-primary:hover {
    background: var(--uap-primary-hover);
}

.uap-button-secondary {
    background: var(--uap-bg);
    color: var(--uap-text);
    border: 1px solid var(--uap-border);
}

.uap-button-secondary:hover {
    background: #f3f4f6;
}

.uap-button-block {
    width: 100%;
}

.uap-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.uap-button .spinner {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 8px;
}

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

/* --------------------------------------------------------------------------
   3.3 Messages - 消息提示
   -------------------------------------------------------------------------- */

/* 消息提示 */
.uap-message {
    padding: 12px 16px;
    margin-bottom: 20px;
    border-radius: var(--uap-radius);
    font-size: 14px;
}

.uap-message.success {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.uap-message.error {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.uap-message.warning {
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.uap-notice {
    padding: 16px;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    border-radius: var(--uap-radius);
    color: #92400e;
    text-align: center;
}

/* 表单链接 */
.uap-form-links {
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
}

.uap-form-links a {
    color: var(--uap-primary);
    text-decoration: none;
    margin: 0 10px;
}

.uap-form-links a:hover {
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   5.1 Social Login - 社交登录
   -------------------------------------------------------------------------- */

/* 社交登录分隔线 */
.uap-social-divider {
    display: flex;
    align-items: center;
    margin: 24px 0;
    color: var(--uap-text-light);
    font-size: 13px;
}

.uap-social-divider::before,
.uap-social-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--uap-border);
}

.uap-social-divider span {
    padding: 0 16px;
}


/* 社交登录按钮 */
.uap-social-login {
    text-align: center;
}

.uap-social-login-title {
    font-size: 14px;
    color: var(--uap-text-light);
    margin-bottom: 16px;
}

.uap-social-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.uap-social-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--uap-bg);
    border: 1px solid var(--uap-border);
    border-radius: 50%;
    transition: all 0.2s;
    text-decoration: none;
}

.uap-social-btn:hover {
    background: #fff;
    border-color: var(--uap-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.uap-social-btn img {
    width: 24px;
    height: 24px;
}

/* 社交账号绑定列表 */
.uap-bindlist {
    width: 100%;
}

.uap-bindlist-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 16px;
    color: #374151;
}

.uap-bindlist-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}

.uap-bind-item {
    display: flex;
    align-items: center;
    padding: 16px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 12px;
    gap: 14px;
    transition: all 0.2s ease;
}

.uap-bind-item:hover {
    border-color: #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.uap-bind-item.is-bound {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%);
    border-color: #d1fae5;
}

.uap-bind-item.is-bound:hover {
    border-color: #a7f3d0;
}

.uap-bind-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    background: #f9fafb;
    border-radius: 10px;
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.uap-bind-item.is-bound .uap-bind-icon {
    background: rgba(255, 255, 255, 0.8);
}

.uap-bind-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.uap-bind-info {
    flex: 1;
    min-width: 0;
}

.uap-bind-name {
    display: block;
    font-weight: 600;
    color: #1f2937;
    font-size: 14px;
    margin-bottom: 2px;
}

.uap-bind-status {
    display: block;
    font-size: 12px;
    color: #9ca3af;
}

.uap-bind-status.bound {
    color: #10b981;
    font-weight: 500;
}

.uap-bind-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.uap-bind-btn {
    padding: 7px 14px;
    font-size: 13px;
    border-radius: 8px;
    text-decoration: none !important;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: 500;
    white-space: nowrap;
}

.uap-bind-btn-primary {
    background: var(--uap-primary);
    color: #fff !important;
}

.uap-bind-btn-primary:hover {
    background: var(--uap-primary-hover);
    color: #fff !important;
}

.uap-bind-btn-secondary {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
}

.uap-bind-btn-secondary:hover,
.uap-bind-btn-secondary:focus,
.uap-bind-btn-secondary:active {
    background: #e5e7eb !important;
    color: #374151 !important;
}

.uap-bind-btn-danger {
    background: #fee2e2 !important;
    color: #dc2626 !important;
    border: 1px solid #fecaca !important;
    padding: 6px 10px;
}

.uap-bind-btn-danger:hover,
.uap-bind-btn-danger:focus,
.uap-bind-btn-danger:active {
    background: #fecaca !important;
    color: #b91c1c !important;
    border-color: #fca5a5 !important;
    outline: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   4. USER CENTER - 用户中心
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.1 Layout - 用户中心布局
   -------------------------------------------------------------------------- */

/* 用户中心 */
.uap-user-center {
    max-width: 800px;
    margin: 0 auto;
}

/* 管理员视角提示条 */
.uap-admin-view-notice {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: linear-gradient(135deg, #fef3cd 0%, #fff8e1 100%);
    border: 1px solid #ffc107;
    border-radius: 8px;
    margin-bottom: 16px;
    color: #856404;
    font-size: 13px;
}

.uap-admin-view-notice svg {
    flex-shrink: 0;
    color: #d39e00;
}

.uap-admin-view-notice strong {
    color: #664d03;
}

.uap-uc-header {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 200px;
    padding: 24px;
    background: linear-gradient(135deg, #f0f4ff 0%, #e8f0fe 50%, #f5f0ff 100%);
    background-size: cover;
    background-position: center;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    margin-bottom: 20px;
    overflow: hidden;
}

.uap-uc-header-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 50%);
    pointer-events: none;
}

.uap-uc-header-content {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 1;
}

.uap-uc-avatar {
    position: relative;
    flex-shrink: 0;
}

.uap-uc-avatar img {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    border: 3px solid #fff;
    object-fit: cover;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    background: #fff;
}

.uap-avatar-edit {
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
    background: var(--uap-primary);
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    opacity: 0;
    transform: scale(0.8);
    padding: 0;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3);
}

.uap-avatar-edit svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.uap-uc-avatar:hover .uap-avatar-edit {
    opacity: 1;
    transform: scale(1);
}

.uap-avatar-edit:hover {
    background: var(--uap-primary-hover);
}

.uap-avatar-edit.uap-uploading {
    opacity: 1;
    pointer-events: none;
}

.uap-avatar-edit.uap-uploading::after {
    content: '';
    width: 14px;
    height: 14px;
    border: 2px solid transparent;
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.uap-avatar-edit.uap-uploading svg {
    display: none;
}

.uap-uc-info h2 {
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.uap-uc-info p {
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 14px;
}

.uap-cover-edit {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: rgba(255, 255, 255, 0.9);
    color: #4b5563;
    border: none;
    border-radius: 20px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
    z-index: 2;
    opacity: 0;
    transform: translateY(-4px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.uap-uc-header:hover .uap-cover-edit {
    opacity: 1;
    transform: translateY(0);
}

.uap-cover-edit:hover {
    background: #fff;
    color: var(--uap-primary);
}

.uap-cover-edit.uap-uploading {
    opacity: 1;
    pointer-events: none;
}

.uap-cover-edit.uap-uploading span {
    display: none;
}

.uap-cover-edit.uap-uploading::after {
    content: '上传中...';
}

.uap-cover-edit svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   4.2 Navigation - 导航菜单（轻量 Tab 设计）
   -------------------------------------------------------------------------- */

/* ==================== 用户中心导航 - 轻量 Tab 设计 ==================== */
.uap-uc-nav {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    padding: 8px 12px;
    border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    margin-bottom: 20px;
}

.uap-uc-tabs {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.uap-uc-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    background: transparent !important;
    border: none !important;
    border-radius: 8px;
    color: #6b7280 !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.uap-uc-tab-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    opacity: 0.6;
}

.uap-uc-tab-icon svg {
    width: 18px;
    height: 18px;
}

.uap-uc-tab-text {
    line-height: 1;
}

.uap-uc-tab:hover,
.uap-uc-tab:focus {
    background: #f3f4f6 !important;
    color: #374151 !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.uap-uc-tab:hover .uap-uc-tab-icon,
.uap-uc-tab:focus .uap-uc-tab-icon {
    opacity: 0.8;
}

.uap-uc-tab.active {
    background: #eff6ff !important;
    color: var(--uap-primary, #2563eb) !important;
}

.uap-uc-tab.active .uap-uc-tab-icon {
    opacity: 1;
    color: var(--uap-primary, #2563eb);
}

/* 更多菜单下拉 */
.uap-uc-tab-more {
    position: relative;
    flex-shrink: 0;
}

.uap-uc-tab-more-btn {
    gap: 4px;
}

.uap-uc-tab-arrow {
    margin-left: 2px;
    opacity: 0.5;
    transition: transform 0.2s;
}

.uap-uc-tab-more:hover .uap-uc-tab-arrow,
.uap-uc-tab-more.open .uap-uc-tab-arrow {
    transform: rotate(180deg);
}

.uap-uc-tab-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 120px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
    padding: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 100;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.uap-uc-tab-more:hover .uap-uc-tab-dropdown,
.uap-uc-tab-more.open .uap-uc-tab-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.uap-uc-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 8px;
    color: #374151 !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    transition: all 0.15s ease;
}

.uap-uc-dropdown-item:hover {
    background: #f3f4f6;
    color: #1f2937 !important;
}

.uap-uc-dropdown-item.active {
    background: #eff6ff;
    color: var(--uap-primary, #2563eb) !important;
}

.uap-uc-dropdown-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.6;
}

.uap-uc-dropdown-item:hover .uap-uc-dropdown-icon,
.uap-uc-dropdown-item.active .uap-uc-dropdown-icon {
    opacity: 1;
}

.uap-uc-dropdown-text {
    flex: 1;
}

/* 手机端专用菜单项（电脑端隐藏） */
.uap-uc-tab-mobile-only {
    display: none;
}

/* 导航右侧操作区 - 图标按钮 */
.uap-uc-nav-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    padding-left: 12px;
    border-left: 1px solid #f0f0f0;
}

.uap-uc-action-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent !important;
    border: none !important;
    border-radius: 10px;
    color: #6b7280 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: all 0.2s ease;
}

.uap-uc-action-icon svg {
    flex-shrink: 0;
}

.uap-uc-action-icon:hover,
.uap-uc-action-icon:focus {
    background: #f3f4f6 !important;
    color: #374151 !important;
    outline: none !important;
    box-shadow: none !important;
}

.uap-uc-action-icon.active {
    background: #eff6ff !important;
    color: var(--uap-primary, #2563eb) !important;
}

/* 消息未读徽章 */
.uap-uc-action-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: #ef4444;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* 分隔线 */
.uap-uc-action-divider {
    width: 1px;
    height: 20px;
    background: #e5e7eb;
    margin: 0 4px;
}

/* 退出按钮特殊样式 */
.uap-uc-action-icon.uap-uc-logout-icon:hover,
.uap-uc-action-icon.uap-uc-logout-icon:focus {
    background: #fef2f2 !important;
    color: #ef4444 !important;
}

/* 登录按钮特殊样式 */
.uap-uc-action-icon.uap-uc-login-icon {
    background: var(--uap-primary, #2563eb) !important;
    color: #fff !important;
}

.uap-uc-action-icon.uap-uc-login-icon:hover,
.uap-uc-action-icon.uap-uc-login-icon:focus {
    background: var(--uap-primary-hover, #1d4ed8) !important;
    color: #fff !important;
}

/* 内容区域 */
.uap-uc-content {
    background: #fff;
    padding: 28px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* 动态页面特殊处理 - 去掉内边距让统计数据全宽 */
.uap-uc-content:has(.uap-overview) {
    padding: 0;
    overflow: hidden;
}

.uap-overview .uap-profile-stats {
    border-radius: 10px 10px 0 0;
}

.uap-overview .uap-profile-section:last-child {
    padding-bottom: 28px;
}

.uap-uc-content .uap-form {
    max-width: 480px;
}

.uap-uc-content .uap-field label {
    font-weight: 500;
}

/* 表单分隔线 */
.uap-field-divider {
    display: flex;
    align-items: center;
    margin: 24px 0 20px;
    color: var(--uap-text-light);
    font-size: 13px;
    font-weight: 500;
}

.uap-field-divider::before,
.uap-field-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--uap-border);
}

.uap-field-divider span {
    padding: 0 12px;
}

/* 密码输入框 */
.uap-password-wrap {
    position: relative;
}

.uap-password-wrap .uap-input {
    padding-right: 44px;
}

.uap-password-toggle {
    position: absolute;
    right: 1px;
    top: 1px;
    bottom: 1px;
    width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 var(--uap-radius) var(--uap-radius) 0;
    color: #9ca3af;
    cursor: pointer;
    transition: color 0.2s;
    padding: 0;
    margin: 0;
    box-shadow: none !important;
}

.uap-password-toggle:hover,
.uap-password-toggle:focus,
.uap-password-toggle:active {
    background: transparent !important;
    background-color: transparent !important;
    color: #6b7280;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

.uap-password-toggle svg {
    flex-shrink: 0;
    pointer-events: none;
}

.uap-uc-content .uap-input {
    border-radius: 8px;
}

.uap-uc-content .uap-button {
    border-radius: 8px;
}

/* --------------------------------------------------------------------------
   5.6 Login Logs - 登录日志
   -------------------------------------------------------------------------- */

/* 登录日志 */
.uap-login-logs {
    width: 100%;
}

.uap-logs-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #374151;
}

/* 新版卡片式登录日志 */
.uap-logs-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.uap-log-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.uap-log-item:hover {
    border-color: #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.uap-log-item.success {
    border-left: 3px solid #10b981;
}

.uap-log-item.failed {
    border-left: 3px solid #ef4444;
}

.uap-log-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f3f4f6;
    color: #6b7280;
}

.uap-log-icon.social {
    background: #eff6ff;
    color: #2563eb;
}

.uap-log-icon.reset {
    background: #fef3c7;
    color: #d97706;
}

.uap-log-icon.key {
    background: #f3f4f6;
    color: #6b7280;
}

.uap-log-info {
    flex: 1;
    min-width: 0;
}

.uap-log-main {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.uap-log-type {
    font-weight: 600;
    font-size: 14px;
    color: #1f2937;
}

.uap-log-status-badge {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

.uap-log-status-badge.success {
    background: #ecfdf5;
    color: #059669;
}

.uap-log-status-badge.failed {
    background: #fef2f2;
    color: #dc2626;
}

.uap-log-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #9ca3af;
}

.uap-log-device {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uap-log-time {
    white-space: nowrap;
}

.uap-log-time::before {
    content: '·';
    margin-right: 12px;
}

/* 无数据状态 */
.uap-no-data {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 20px;
    color: #9ca3af;
    text-align: center;
}

.uap-no-data svg {
    margin-bottom: 12px;
    opacity: 0.5;
}

.uap-no-data p {
    margin: 0;
    font-size: 14px;
}

/* 旧版表格样式（保留兼容） */
.uap-logs-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.uap-logs-table th,
.uap-logs-table td {
    padding: 14px 16px;
    text-align: left;
    font-size: 14px;
}

.uap-logs-table th {
    font-weight: 600;
    color: #6b7280;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.uap-logs-table th:first-child {
    border-radius: 8px 0 0 0;
}

.uap-logs-table th:last-child {
    border-radius: 0 8px 0 0;
}

.uap-logs-table td {
    border-bottom: 1px solid #f3f4f6;
    color: #4b5563;
}

.uap-logs-table tr:last-child td {
    border-bottom: none;
}

.uap-logs-table tr:hover td {
    background: #fafbfc;
}

.uap-log-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 12px;
    font-weight: 500;
}

.uap-log-status.success {
    background: #ecfdf5;
    color: #059669;
}

.uap-log-status.failed {
    background: #fef2f2;
    color: #dc2626;
}

/* 响应式 */
@media (max-width: 640px) {

    /* 全屏模板响应式 */
    .uap-fullpage-wrapper {
        padding: 20px 16px;
        min-height: 100vh;
        align-items: flex-start;
        padding-top: 60px;
    }

    .uap-fullpage-content {
        max-width: 100%;
    }

    .uap-fullpage-wrapper .uap-form-container {
        padding: 24px 20px;
        border-radius: 12px;
    }

    .uap-form-container {
        margin: 20px;
        padding: 24px;
    }

    .uap-uc-header {
        min-height: 160px;
        padding: 20px;
        justify-content: center;
    }

    .uap-uc-header-content {
        flex-direction: column;
        text-align: center;
    }

    .uap-uc-avatar img {
        width: 72px;
        height: 72px;
    }

    /* 手机端隐藏编辑图标，通过点击头像触发 */
    .uap-avatar-edit {
        display: none;
    }

    .uap-uc-avatar {
        cursor: pointer;
    }

    .uap-cover-edit {
        opacity: 1;
        transform: translateY(0);
        padding: 6px 12px;
        font-size: 12px;
    }

    .uap-cover-edit span {
        display: none;
    }

    /* 用户中心导航响应式 - 一行四个带图标 */
    .uap-uc-nav {
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px;
    }

    .uap-uc-tabs {
        flex-wrap: wrap;
        gap: 6px;
        width: 100%;
    }

    .uap-uc-tab {
        flex: 0 0 calc(25% - 5px);
        flex-direction: column;
        gap: 4px;
        padding: 12px 6px;
        text-align: center;
        border-radius: 10px;
        background: #f9fafb !important;
    }

    .uap-uc-tab-icon {
        opacity: 0.7;
    }

    .uap-uc-tab-icon svg {
        width: 20px;
        height: 20px;
    }

    .uap-uc-tab-text {
        font-size: 11px;
    }

    .uap-uc-tab:hover,
    .uap-uc-tab:focus {
        background: #f3f4f6 !important;
    }

    .uap-uc-tab.active {
        background: #eff6ff !important;
    }

    /* 手机端隐藏更多按钮和下拉菜单 */
    .uap-uc-tab-more {
        display: none;
    }

    /* 手机端显示溢出菜单项 */
    .uap-uc-tab-mobile-only {
        display: inline-flex;
    }

    .uap-uc-nav-actions {
        width: 100%;
        padding-left: 0;
        padding-top: 8px;
        border-left: none;
        border-top: 1px solid #f0f0f0;
        justify-content: center;
        gap: 8px;
    }

    .uap-uc-action-icon {
        width: 44px;
        height: 44px;
        background: #f9fafb !important;
    }

    .uap-uc-action-divider {
        height: 24px;
        margin: 0 8px;
    }

    .uap-uc-content {
        padding: 20px;
    }

    /* 社交账号绑定列表响应式 */
    .uap-bindlist-items {
        grid-template-columns: 1fr;
    }

    .uap-bind-item {
        padding: 14px;
        gap: 12px;
    }

    .uap-bind-icon {
        width: 40px;
        height: 40px;
        padding: 5px;
    }

    .uap-bind-actions {
        flex-direction: column;
        gap: 6px;
    }

    .uap-bind-btn {
        padding: 6px 12px;
        font-size: 12px;
        text-align: center;
    }

    .uap-logs-table {
        font-size: 12px;
    }

    .uap-logs-table th,
    .uap-logs-table td {
        padding: 10px 8px;
    }

    /* 登录日志响应式 */
    .uap-logs-list {
        gap: 8px;
    }

    .uap-log-item {
        padding: 12px 14px;
        gap: 12px;
    }

    .uap-log-icon {
        width: 36px;
        height: 36px;
    }

    .uap-log-icon svg {
        width: 18px;
        height: 18px;
    }

    .uap-log-type {
        font-size: 13px;
    }

    .uap-log-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }

    .uap-log-time::before {
        display: none;
    }

    .uap-log-device {
        max-width: 100%;
    }

    .uap-no-data {
        padding: 32px 16px;
    }
}


/* --------------------------------------------------------------------------
   5.4 Post Actions - 点赞收藏
   -------------------------------------------------------------------------- */

/* 点赞收藏按钮 */
.uap-post-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 0;
    margin-top: 20px;
}

.uap-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: rgba(0, 0, 0, 0.04);
    border: none;
    border-radius: 20px;
    cursor: pointer;
    font-size: 14px;
    color: #666;
    transition: all 0.25s ease;
    backdrop-filter: blur(4px);
}

.uap-action-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.uap-action-btn:active {
    transform: translateY(0);
}

/* 点赞按钮 */
.uap-like-btn:hover {
    color: #ff4757;
    background: rgba(255, 71, 87, 0.1);
}

.uap-like-btn.active {
    color: #ff4757;
    background: rgba(255, 71, 87, 0.12);
}

.uap-like-btn.active:hover {
    background: rgba(255, 71, 87, 0.18);
}

/* 收藏按钮 */
.uap-favorite-btn:hover {
    color: #ffa502;
    background: rgba(255, 165, 2, 0.1);
}

.uap-favorite-btn.active {
    color: #ffa502;
    background: rgba(255, 165, 2, 0.12);
}

.uap-favorite-btn.active:hover {
    background: rgba(255, 165, 2, 0.18);
}

.uap-action-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.uap-action-btn:hover .uap-action-icon {
    transform: scale(1.1);
}

.uap-action-btn.active .uap-action-icon {
    animation: uap-pop 0.3s ease;
}

@keyframes uap-pop {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}

.uap-action-count {
    font-weight: 500;
    font-size: 13px;
    min-width: 8px;
}

.uap-action-btn.loading {
    pointer-events: none;
    opacity: 0.6;
}

.uap-action-btn.loading .uap-action-icon {
    animation: uap-spin 0.8s linear infinite;
}

@keyframes uap-spin {
    to {
        transform: rotate(360deg);
    }
}

/* 用户点赞/收藏列表 */
.uap-user-posts-list {
    width: 100%;
}

.uap-posts-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.uap-post-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.uap-post-item:hover {
    border-color: #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.uap-post-thumb {
    flex-shrink: 0;
    width: 80px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
}

.uap-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-post-info {
    flex: 1;
    min-width: 0;
}

.uap-post-title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
}

.uap-post-title a {
    color: #1f2937;
    text-decoration: none;
}

.uap-post-title a:hover {
    color: var(--uap-primary);
}

.uap-post-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #9ca3af;
}

.uap-post-type {
    padding: 2px 8px;
    background: #f3f4f6;
    border-radius: 4px;
}

.uap-remove-action {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #f3f4f6 !important;
    background-color: #f3f4f6 !important;
    border: none !important;
    border-radius: 6px;
    color: #6b7280 !important;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
    box-shadow: none !important;
}

.uap-remove-action svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke: currentColor;
}

.uap-remove-action:hover {
    background: #fef2f2 !important;
    background-color: #fef2f2 !important;
    color: #ef4444 !important;
}

.uap-remove-action:focus {
    outline: none !important;
}

/* 分页 */
.uap-pagination {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

.uap-pagination a,
.uap-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    font-size: 14px;
    color: var(--uap-text-light);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--uap-border);
    border-radius: 6px;
    transition: all 0.2s ease;
}

.uap-pagination a:hover {
    background: var(--uap-primary);
    border-color: var(--uap-primary);
    color: #fff;
}

.uap-pagination .current {
    background: var(--uap-primary);
    border-color: var(--uap-primary);
    color: #fff;
}

.uap-pagination .dots {
    background: transparent;
    border-color: transparent;
    color: var(--uap-text-light);
}

.uap-pagination .dots:hover {
    background: transparent;
    border-color: transparent;
    color: var(--uap-text-light);
}

/* 响应式 - 点赞收藏 */
@media (max-width: 640px) {
    .uap-post-actions {
        gap: 10px;
        padding: 12px 0;
    }

    .uap-action-btn {
        padding: 7px 14px;
        font-size: 13px;
    }

    .uap-action-icon {
        width: 16px;
        height: 16px;
    }

    .uap-post-item {
        padding: 12px;
        gap: 12px;
    }

    .uap-post-thumb {
        width: 64px;
        height: 48px;
    }

    .uap-post-title {
        font-size: 14px;
    }

    .uap-post-meta {
        flex-wrap: wrap;
        gap: 6px;
    }
}


/* --------------------------------------------------------------------------
   3.4 Modal - 模态框
   -------------------------------------------------------------------------- */

/* 退出登录确认模态框 */
.uap-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.uap-modal {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    max-width: 360px;
    width: 100%;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    animation: uapModalIn 0.25s ease-out;
}

@keyframes uapModalIn {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(-10px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.uap-modal-icon {
    width: 72px;
    height: 72px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ef4444;
}

.uap-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px;
}

.uap-modal-text {
    font-size: 14px;
    color: #6b7280;
    margin: 0 0 24px;
    line-height: 1.5;
}

.uap-modal-actions {
    display: flex;
    gap: 12px;
}

.uap-modal-btn {
    flex: 1;
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
}

.uap-modal-btn-cancel {
    background: #f3f4f6;
    color: #4b5563;
}

.uap-modal-btn-cancel:hover {
    background: #e5e7eb;
}

.uap-modal-btn-confirm {
    background: #ef4444;
    color: #fff;
}

.uap-modal-btn-confirm:hover {
    background: #dc2626;
}

body.uap-modal-open {
    overflow: hidden;
}

/* 移动端适配 */
@media (max-width: 480px) {
    .uap-modal {
        padding: 24px;
        border-radius: 12px;
    }

    .uap-modal-icon {
        width: 60px;
        height: 60px;
    }

    .uap-modal-icon svg {
        width: 36px;
        height: 36px;
    }

    .uap-modal-title {
        font-size: 18px;
    }

    .uap-modal-actions {
        flex-direction: column-reverse;
    }
}


/* 未登录提示 */
.uap-login-required {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    max-width: 400px;
    margin: 40px auto;
}

.uap-login-required-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #eff6ff 0%, #e0e7ff 100%);
    border-radius: 50%;
    color: var(--uap-primary);
    margin-bottom: 20px;
}

.uap-login-required-title {
    font-size: 20px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px;
}

.uap-login-required-text {
    font-size: 14px;
    color: #6b7280;
    margin: 0 0 24px;
}

.uap-login-required .uap-button {
    min-width: 120px;
}


/* --------------------------------------------------------------------------
   5.3 Avatar Manager - 头像管理
   -------------------------------------------------------------------------- */

/* 头像选择模态框 */
.uap-avatar-modal {
    max-width: 480px;
    padding: 0;
    overflow: hidden;
}

.uap-avatar-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-avatar-modal-header .uap-modal-title {
    margin: 0;
    font-size: 18px;
}

.uap-avatar-modal-close {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
}

.uap-avatar-modal-close svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.uap-avatar-modal-close:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-avatar-modal-body {
    padding: 24px;
    max-height: 60vh;
    overflow-y: auto;
}

/* 上传区域 */
.uap-avatar-upload-section {
    margin-bottom: 24px;
}

.uap-avatar-upload-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px;
    background: #f9fafb;
    border: 2px dashed #e5e7eb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
}

.uap-avatar-upload-btn:hover {
    background: #f3f4f6;
    border-color: var(--uap-primary);
}

.uap-avatar-upload-btn svg {
    color: var(--uap-primary);
}

.uap-avatar-upload-btn span {
    font-weight: 500;
    color: #1f2937;
}

.uap-avatar-upload-btn small {
    font-size: 12px;
    color: #9ca3af;
}

.uap-avatar-upload-btn.uploading {
    pointer-events: none;
    opacity: 0.7;
}

/* 历史头像区域 */
.uap-avatar-history-section {
    border-top: 1px solid #f0f0f0;
    padding-top: 20px;
}

.uap-avatar-history-title {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin: 0 0 16px;
}

.uap-avatar-history-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.uap-avatar-history-item {
    position: relative;
    aspect-ratio: 1;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.2s;
}

.uap-avatar-history-item:hover {
    border-color: #d1d5db;
    transform: scale(1.02);
}

.uap-avatar-history-item.current {
    border-color: var(--uap-primary);
    cursor: default;
}

.uap-avatar-history-item .uap-avatar-check {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    background: var(--uap-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    box-shadow: 0 2px 4px rgba(37, 99, 235, 0.3);
}

.uap-avatar-history-item .uap-avatar-check svg {
    width: 12px;
    height: 12px;
}

.uap-avatar-history-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-avatar-history-item .uap-avatar-source {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 4px 6px;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    color: #fff;
    font-size: 10px;
    text-align: center;
}

.uap-avatar-delete {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    border: none;
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    transition: all 0.2s;
    padding: 0;
}

.uap-avatar-history-item:hover .uap-avatar-delete {
    opacity: 1;
}

.uap-avatar-delete:hover {
    background: #ef4444;
    transform: scale(1.1);
}

/* 头像切换加载动效 */
.uap-avatar-history-item.loading {
    pointer-events: none;
}

.uap-avatar-history-item.loading img {
    opacity: 0.5;
}

.uap-avatar-loading-spinner {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.3);
}

.uap-avatar-loading-spinner svg {
    width: 32px;
    height: 32px;
    color: var(--uap-primary, #2563eb);
    animation: uap-spin 1s linear infinite;
}

@keyframes uap-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.uap-avatar-loading {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 32px;
    color: #9ca3af;
    font-size: 14px;
}

.uap-avatar-loading .spinner {
    width: 20px;
    height: 20px;
    border: 2px solid #e5e7eb;
    border-top-color: var(--uap-primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.uap-avatar-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 32px;
    color: #9ca3af;
    font-size: 14px;
}

/* 响应式 */
@media (max-width: 480px) {
    .uap-avatar-modal {
        margin: 16px;
        max-width: calc(100% - 32px);
    }

    .uap-avatar-modal-body {
        padding: 16px;
    }

    .uap-avatar-history-list {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .uap-avatar-upload-btn {
        padding: 20px;
    }
}


/* --------------------------------------------------------------------------
   5.5 User Comments - 用户评论
   -------------------------------------------------------------------------- */

/* 用户评论列表 */
.uap-user-comments {
    padding: 0;
}

.uap-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--uap-border);
}

.uap-section-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--uap-text);
}

.uap-comment-count {
    font-size: 13px;
    color: var(--uap-text-light);
}

.uap-comments-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.uap-comment-item {
    padding: 16px;
    background: var(--uap-bg);
    border-radius: var(--uap-radius);
    border: 1px solid var(--uap-border);
}

.uap-user-comments .uap-comment-item {
    flex-direction: column;
}

.uap-comment-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.uap-comment-status {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
}

.uap-comment-status.approved {
    background: #d1fae5;
    color: #059669;
}

.uap-comment-status.pending {
    background: #fef3c7;
    color: #d97706;
}

.uap-comment-date {
    font-size: 12px;
    color: var(--uap-text-light);
}

.uap-comment-view {
    margin-left: auto;
    font-size: 12px;
    color: var(--uap-primary);
    text-decoration: none;
}

.uap-comment-view:hover {
    text-decoration: underline;
}

.uap-comment-content {
    color: var(--uap-text);
    line-height: 1.6;
    margin-bottom: 12px;
}

.uap-comment-content p {
    margin: 0;
}

.uap-comment-post {
    font-size: 13px;
    color: var(--uap-text-light);
    padding-bottom: 12px;
    border-bottom: 1px solid var(--uap-border);
}

.uap-comment-post-label {
    margin-right: 4px;
}

.uap-comment-post a {
    color: var(--uap-primary);
    text-decoration: none;
}

.uap-comment-post a:hover {
    text-decoration: underline;
}

.uap-comment-post-deleted {
    color: var(--uap-text-light);
    font-style: italic;
}

/* 分页 */
.uap-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--uap-border);
}

.uap-page-link {
    padding: 8px 16px;
    background: var(--uap-bg);
    border: 1px solid var(--uap-border);
    border-radius: var(--uap-radius);
    color: var(--uap-text);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
}

.uap-page-link:hover {
    background: var(--uap-primary);
    border-color: var(--uap-primary);
    color: #fff;
}

.uap-page-link.disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

/* WordPress paginate_links 生成的分页样式 */
.uap-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    font-size: 14px;
    color: var(--uap-text);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--uap-border);
    border-radius: 6px;
    transition: all 0.2s ease;
}

.uap-pagination .page-numbers:hover {
    border-color: var(--uap-primary);
    color: var(--uap-primary);
    background: #fff;
}

.uap-pagination .page-numbers.current {
    background: var(--uap-primary);
    border-color: var(--uap-primary);
    color: #fff;
}

.uap-pagination .page-numbers.dots {
    border: none;
    background: transparent;
    color: var(--uap-text-light);
}

.uap-pagination .page-numbers.dots:hover {
    background: transparent;
    color: var(--uap-text-light);
}

.uap-pagination .page-numbers.prev,
.uap-pagination .page-numbers.next {
    padding: 0 14px;
}

.uap-pagination .page-numbers.prev:hover,
.uap-pagination .page-numbers.next:hover {
    background: var(--uap-primary);
    border-color: var(--uap-primary);
    color: #fff;
}

.uap-page-info {
    font-size: 14px;
    color: var(--uap-text-light);
}

/* 空状态 */
.uap-empty-state {
    text-align: center;
    padding: 48px 20px;
    color: var(--uap-text-light);
}

.uap-empty-icon {
    margin-bottom: 16px;
    opacity: 0.5;
}

.uap-empty-icon svg {
    stroke: currentColor;
}

.uap-empty-state p {
    margin: 0;
    font-size: 14px;
}


/* ========================================
   登录模态框样式
   ======================================== */

/* --------------------------------------------------------------------------
   5.2 Login Modal - 登录模态框
   -------------------------------------------------------------------------- */

/* 模态框容器 */
.uap-login-modal {
    position: relative;
    max-width: 400px;
    width: 100%;
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    animation: uapLoginModalIn 0.3s ease-out;
}

@keyframes uapLoginModalIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(-20px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* 关闭按钮 */
.uap-login-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.08);
    border: none;
    border-radius: 50%;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
    z-index: 10;
}

.uap-login-modal-close svg {
    width: 18px;
    height: 18px;
    stroke-width: 2.5;
}

.uap-login-modal-close:hover {
    background: rgba(0, 0, 0, 0.15);
    color: #111827;
}

/* 头部 */
.uap-login-modal-header {
    padding: 40px 32px 24px;
    text-align: center;
    background: linear-gradient(135deg, #f0f4ff 0%, #e8f0fe 50%, #f5f0ff 100%);
}

.uap-login-modal-title {
    margin: 0 0 8px;
    font-size: 26px;
    font-weight: 700;
    color: #1f2937;
}

.uap-login-modal-subtitle {
    margin: 0;
    font-size: 14px;
    color: #6b7280;
}

/* 主体 */
.uap-login-modal-body {
    padding: 28px 32px;
}

.uap-login-modal-body .uap-message {
    margin-bottom: 16px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 14px;
}

/* 表单字段 */
.uap-modal-field {
    margin-bottom: 16px;
}

.uap-modal-input {
    width: 100%;
    padding: 14px 16px;
    font-size: 15px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f9fafb;
    transition: all 0.2s;
    box-sizing: border-box;
}

.uap-modal-input:focus {
    outline: none;
    border-color: var(--uap-primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
}

.uap-modal-input::placeholder {
    color: #9ca3af;
}

/* 密码框适配 */
.uap-login-modal .uap-password-wrap .uap-modal-input {
    padding-right: 48px;
}

/* 选项行 */
.uap-modal-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    font-size: 14px;
}

.uap-modal-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    color: #4b5563;
}

.uap-modal-remember input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--uap-primary);
}

.uap-modal-forgot {
    color: var(--uap-primary);
    text-decoration: none;
}

.uap-modal-forgot:hover {
    text-decoration: underline;
}

/* 提交按钮 */
.uap-modal-submit {
    width: 100%;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, var(--uap-primary) 0%, #1d4ed8 100%);
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-modal-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35);
}

.uap-modal-submit:active {
    transform: translateY(0);
}

.uap-modal-submit:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.uap-modal-submit .spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid transparent;
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 8px;
    vertical-align: middle;
}

/* 分隔线 */
.uap-modal-divider {
    display: flex;
    align-items: center;
    margin: 24px 0;
    color: #9ca3af;
    font-size: 13px;
}

.uap-modal-divider::before,
.uap-modal-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.uap-modal-divider span {
    padding: 0 16px;
}

/* 社交登录按钮 */
.uap-modal-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

.uap-modal-social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    transition: all 0.2s;
    text-decoration: none;
}

.uap-modal-social-btn:hover {
    background: #fff;
    border-color: var(--uap-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.uap-modal-social-btn img {
    width: 26px;
    height: 26px;
}

/* 底部 */
.uap-login-modal-footer {
    padding: 20px 32px;
    text-align: center;
    background: #f9fafb;
    border-top: 1px solid #f0f0f0;
    font-size: 14px;
    color: #6b7280;
}

.uap-login-modal-footer a {
    color: var(--uap-primary);
    text-decoration: none;
    font-weight: 500;
    margin-left: 4px;
}

.uap-login-modal-footer a:hover {
    text-decoration: underline;
}

/* 移动端适配 */
@media (max-width: 480px) {
    .uap-login-modal {
        margin: 16px;
        max-width: calc(100% - 32px);
        border-radius: 16px;
    }

    .uap-login-modal-header {
        padding: 32px 24px 20px;
    }

    .uap-login-modal-title {
        font-size: 22px;
    }

    .uap-login-modal-body {
        padding: 24px;
    }

    .uap-modal-input {
        padding: 12px 14px;
        font-size: 14px;
    }

    .uap-modal-submit {
        padding: 12px 20px;
        font-size: 15px;
    }

    .uap-modal-social-btn {
        width: 38px;
        height: 38px;
    }

    .uap-modal-social-btn img {
        width: 24px;
        height: 24px;
    }

    .uap-login-modal-footer {
        padding: 16px 24px;
    }
}


/* ========================================
   全局 Loading 遮罩
   ======================================== */

.uap-loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(4px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}

.uap-loading-overlay.active {
    opacity: 1;
    visibility: visible;
}

.uap-loading-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--uap-primary, #2563eb);
    border-radius: 50%;
    animation: uapLoadingSpin 0.8s linear infinite;
}

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

.uap-loading-text {
    margin-top: 16px;
    font-size: 14px;
    color: #6b7280;
    font-weight: 500;
}

/* 深色主题 loading */
.uap-loading-overlay.dark {
    background: rgba(0, 0, 0, 0.8);
}

.uap-loading-overlay.dark .uap-loading-spinner {
    border-color: rgba(255, 255, 255, 0.2);
    border-top-color: #fff;
}

.uap-loading-overlay.dark .uap-loading-text {
    color: rgba(255, 255, 255, 0.9);
}


/* 个人简介字数统计 */
.uap-textarea-wrap {
    position: relative;
}

.uap-textarea-wrap textarea {
    padding-bottom: 28px;
}

.uap-char-counter {
    position: absolute;
    right: 10px;
    bottom: 8px;
    font-size: 12px;
    color: #9ca3af;
    pointer-events: none;
}

.uap-char-remaining.over-limit {
    color: #ef4444;
    font-weight: 500;
}


/* --------------------------------------------------------------------------
   6.1 Points System - 积分系统
   -------------------------------------------------------------------------- */

/* ==================== 积分系统样式 ==================== */

/* 积分容器 */
.uap-points-container {
    max-width: 800px;
    margin: 0 auto;
}

/* 积分概览 - 淡雅渐变设计 */
.uap-points-overview {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);
    border-radius: 12px;
    padding: 28px 32px;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.2);
}

/* 装饰性背景图案 */
.uap-points-overview::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.08) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.uap-points-overview::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -10%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.06) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.uap-points-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    position: relative;
    z-index: 1;
}

.uap-points-balance-section {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.uap-points-label {
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.uap-points-value {
    font-size: 48px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    background: linear-gradient(135deg, #1e293b 0%, #475569 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.uap-points-actions {
    display: flex;
    gap: 12px;
}

/* 签到按钮 */
.uap-checkin-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.35);
    position: relative;
    overflow: hidden;
}

.uap-checkin-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
    opacity: 0;
    transition: opacity 0.25s;
}

.uap-checkin-btn:hover:not(:disabled)::before {
    opacity: 1;
}

.uap-checkin-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(79, 70, 229, 0.4);
}

.uap-checkin-btn:active:not(:disabled) {
    transform: translateY(0);
}

.uap-checkin-btn:disabled {
    cursor: default;
}

.uap-checkin-btn.checked {
    background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%);
    color: #64748b;
    box-shadow: none;
    cursor: pointer;
}

.uap-checkin-btn.checked:hover {
    background: linear-gradient(135deg, #cbd5e1 0%, #94a3b8 100%);
    color: #475569;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(100, 116, 139, 0.2);
}

.uap-checkin-btn.loading {
    pointer-events: none;
}

.uap-checkin-btn svg {
    stroke: currentColor;
}

.uap-checkin-icon,
.uap-checkin-text {
    display: inline-flex;
    align-items: center;
}

/* 加载动画 */
@keyframes uap-spin {
    to {
        transform: rotate(360deg);
    }
}

.uap-spin {
    animation: uap-spin 1s linear infinite;
}

/* 今日状态 */
.uap-points-status {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(148, 163, 184, 0.2);
    position: relative;
    z-index: 1;
}

.uap-status-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #64748b;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 20px;
    backdrop-filter: blur(4px);
}

.uap-status-item.earned {
    color: #059669;
    background: rgba(16, 185, 129, 0.1);
}

.uap-status-item svg {
    stroke: currentColor;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-points-overview {
        padding: 20px;
    }

    .uap-points-main {
        gap: 20px;
    }

    .uap-points-value {
        font-size: 40px;
    }

    .uap-checkin-btn {
        width: 100%;
        justify-content: center;
    }
}

/* 积分内容区 */
.uap-points-content {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 24px;
    margin-bottom: 24px;
}

@media (max-width: 768px) {
    .uap-points-content {
        grid-template-columns: 1fr;
    }
}

/* 积分流水区域 */
.uap-points-logs-section,
.uap-points-ranking-section,
.uap-points-rules-section {
    background: #fff;
    border-radius: var(--uap-radius);
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #f0f0f0;
}

.uap-section-title {
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--uap-text);
    padding-bottom: 12px;
    border-bottom: 1px solid #f3f4f6;
}

/* 积分流水列表 - 单行显示 */
.uap-points-log-list {
    display: flex;
    flex-direction: column;
}

.uap-points-log-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f3f4f6;
}

.uap-points-log-item:last-child {
    border-bottom: none;
}

.uap-log-info {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.uap-log-type {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
}

.uap-log-reason {
    font-size: 13px;
    color: #9ca3af;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uap-log-time {
    font-size: 12px;
    color: #d1d5db;
    white-space: nowrap;
    margin-left: auto;
    padding-left: 12px;
}

.uap-log-points {
    font-size: 15px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    margin-left: 16px;
    white-space: nowrap;
}

.uap-log-points.positive {
    color: #059669;
}

.uap-log-points.negative {
    color: #dc2626;
}

@media (max-width: 640px) {
    .uap-log-info {
        flex-wrap: wrap;
        gap: 4px;
    }

    .uap-log-reason {
        width: 100%;
        order: 3;
    }

    .uap-log-time {
        margin-left: 0;
        padding-left: 0;
    }
}

/* 积分分页 */
.uap-points-pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 16px;
}

.uap-page-btn {
    padding: 6px 12px;
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: #6b7280;
    transition: all 0.15s;
}

.uap-page-btn:hover {
    background: #1f2937;
    border-color: #1f2937;
    color: #fff;
}

.uap-page-current {
    padding: 6px 12px;
    background: #1f2937;
    color: #fff;
    border-radius: 6px;
    font-size: 13px;
}

.uap-page-dots {
    padding: 6px 8px;
    color: #d1d5db;
}

/* 积分排行榜 */
.uap-ranking-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.uap-ranking-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: #fafafa;
    border-radius: 8px;
    transition: background 0.15s;
}

.uap-ranking-item:hover {
    background: #f5f5f5;
}

.uap-ranking-item.top-1 {
    background: #fffbeb;
}

.uap-ranking-item.top-1:hover {
    background: #fef3c7;
}

.uap-ranking-item.top-2 {
    background: #f9fafb;
}

.uap-ranking-item.top-3 {
    background: #fff7ed;
}

.uap-ranking-item.top-3:hover {
    background: #ffedd5;
}

.uap-rank-num {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: #9ca3af;
    background: #fff;
    border-radius: 6px;
    flex-shrink: 0;
}

.uap-ranking-item.top-1 .uap-rank-num {
    color: #d97706;
    background: #fef3c7;
}

.uap-ranking-item.top-2 .uap-rank-num {
    color: #6b7280;
    background: #e5e7eb;
}

.uap-ranking-item.top-3 .uap-rank-num {
    color: #ea580c;
    background: #fed7aa;
}

.uap-rank-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-rank-name {
    flex: 1;
    font-size: 14px;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uap-rank-points {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    font-variant-numeric: tabular-nums;
}

/* 积分规则 */
.uap-points-rules {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px;
}

.uap-points-rule-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    background: #fafafa;
    border-radius: 8px;
}

.uap-rule-name {
    font-size: 14px;
    color: #374151;
}

.uap-rule-points {
    font-size: 14px;
    font-weight: 600;
    color: #059669;
}

.uap-rule-limit {
    font-size: 12px;
    color: #9ca3af;
    width: 100%;
}

/* 空状态 */
.uap-empty {
    text-align: center;
    padding: 40px 20px;
    color: #9ca3af;
    font-size: 14px;
}

/* 加载状态 */
.uap-loading {
    text-align: center;
    padding: 20px;
    color: #9ca3af;
    font-size: 14px;
}


/* --------------------------------------------------------------------------
   3.5 Toast - Toast 提示组件
   -------------------------------------------------------------------------- */

/* ==================== Toast 提示组件 ==================== */

.uap-toast-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100000;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    pointer-events: none;
}

.uap-toast {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 24px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.1);
    font-size: 15px;
    font-weight: 500;
    color: #374151;
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    max-width: 400px;
}

.uap-toast.show {
    opacity: 1;
    transform: scale(1);
}

.uap-toast-icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
}

.uap-toast-icon svg {
    width: 100%;
    height: 100%;
}

.uap-toast-message {
    line-height: 1.4;
}

/* Toast 类型样式 */
.uap-toast-success {
    background: #fff;
    border: 1px solid #d1fae5;
    color: #065f46;
}

.uap-toast-success .uap-toast-icon {
    color: #10b981;
}

.uap-toast-error {
    background: #fff;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.uap-toast-error .uap-toast-icon {
    color: #ef4444;
}

.uap-toast-warning {
    background: #fff;
    border: 1px solid #fde68a;
    color: #92400e;
}

.uap-toast-warning .uap-toast-icon {
    color: #f59e0b;
}

.uap-toast-info {
    background: #fff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
}

.uap-toast-info .uap-toast-icon {
    color: #3b82f6;
}

/* Loading 类型 Toast */
.uap-toast-loading {
    background: #fff;
    border: 1px solid #e5e7eb;
    color: #374151;
}

.uap-toast-loading .uap-toast-icon {
    color: var(--uap-primary, #2563eb);
}

.uap-toast-spinner {
    animation: uap-toast-spin 1s linear infinite;
}

@keyframes uap-toast-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* 内联加载旋转动画（用于按钮内图标） */
.uap-loading-spin {
    animation: uap-toast-spin 1s linear infinite;
}

@media (max-width: 480px) {
    .uap-toast {
        max-width: calc(100vw - 40px);
        padding: 14px 20px;
        font-size: 14px;
    }
}


/* 积分系统未启用提示 */
.uap-points-disabled {
    text-align: center;
    padding: 60px 20px;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px dashed #e2e8f0;
}

.uap-points-disabled-icon {
    margin-bottom: 16px;
    color: #94a3b8;
}

.uap-points-disabled h3 {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 600;
    color: #475569;
}

.uap-points-disabled p {
    margin: 0;
    font-size: 14px;
    color: #64748b;
}

/* ==================== AJAX 评论样式 ==================== */

/* 评论提交按钮加载状态 */
.uap-btn-loading {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: uap-spin 0.8s linear infinite;
    vertical-align: middle;
    margin-right: 4px;
}

/* 新评论高亮效果 */
.uap-ajax-comment {
    transition: background-color 0.3s ease;
}

.uap-comment-highlight {
    background-color: rgba(99, 102, 241, 0.08) !important;
}

/* 待审核评论样式 */
.uap-comment-pending {
    opacity: 0.7;
    position: relative;
}

.uap-comment-pending::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #f59e0b;
    border-radius: 3px 0 0 3px;
}

.uap-comment-status {
    display: inline-block;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 500;
    color: #92400e;
    background: #fef3c7;
    border-radius: 4px;
    margin-left: 8px;
}

/* 评论表单禁用状态 */
#commentform textarea:disabled,
.comment-form textarea:disabled {
    background-color: #f8fafc;
    cursor: not-allowed;
}

#commentform input[type="submit"]:disabled,
#commentform button[type="submit"]:disabled,
.comment-form input[type="submit"]:disabled,
.comment-form button[type="submit"]:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}


/* --------------------------------------------------------------------------
   6.2 Checkin Calendar - 签到日历
   -------------------------------------------------------------------------- */

/* ==================== 签到日历样式 ==================== */

/* 签到日历模态框 */
.uap-checkin-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.uap-checkin-modal {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    max-width: 400px;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    animation: uapModalIn 0.25s ease-out;
}

.uap-checkin-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.uap-checkin-modal-title {
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
}

.uap-checkin-modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.15s;
    padding: 0;
}

.uap-checkin-modal-close svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    stroke: currentColor;
}

.uap-checkin-modal-close:hover {
    background: #e5e7eb;
    color: #374151;
}

.uap-checkin-modal-close:focus {
    outline: none;
    background: #e5e7eb;
}

.uap-checkin-modal .uap-checkin-stats {
    display: flex;
    justify-content: space-around;
    padding: 16px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-radius: 12px;
    margin-bottom: 16px;
}

/* 连续签到奖励信息 */
.uap-streak-bonus-info {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 16px;
    border: 1px solid #fde68a;
}

.uap-streak-bonus-title {
    display: block;
    font-size: 12px;
    color: #92400e;
    margin-bottom: 10px;
    font-weight: 500;
    text-align: center;
}

.uap-streak-bonus-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.uap-streak-bonus-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    font-size: 12px;
    border: 1px solid #fcd34d;
    transition: all 0.2s;
}

.uap-streak-bonus-item.achieved {
    background: #10b981;
    border-color: #10b981;
    color: #fff;
}

.uap-streak-bonus-item .uap-bonus-days {
    font-weight: 500;
    color: #78350f;
}

.uap-streak-bonus-item .uap-bonus-points {
    font-weight: 700;
    color: #d97706;
}

.uap-streak-bonus-item.achieved .uap-bonus-days,
.uap-streak-bonus-item.achieved .uap-bonus-points {
    color: #fff;
}

.uap-checkin-section {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
    border: 1px solid #f0f0f0;
}

.uap-checkin-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}

.uap-checkin-header .uap-section-title {
    margin: 0;
}

.uap-checkin-stats {
    display: flex;
    gap: 24px;
}

.uap-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.uap-stat-value {
    font-size: 20px;
    font-weight: 700;
    color: #1f2937;
    line-height: 1;
}

.uap-stat-label {
    font-size: 12px;
    color: #9ca3af;
}

/* 日历容器 */
.uap-calendar-container {
    background: #fafafa;
    border-radius: 10px;
    padding: 16px;
}

/* 日历导航 */
.uap-calendar-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.uap-calendar-prev,
.uap-calendar-next {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.15s;
    padding: 0;
}

.uap-calendar-prev svg,
.uap-calendar-next svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke: currentColor;
}

.uap-calendar-prev:hover:not(:disabled),
.uap-calendar-next:hover:not(:disabled) {
    background: #f3f4f6;
    color: #1f2937;
}

.uap-calendar-prev:focus,
.uap-calendar-next:focus {
    outline: none;
    background: #f3f4f6;
    border-color: #d1d5db;
}

.uap-calendar-prev:disabled,
.uap-calendar-next:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.uap-calendar-title {
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
}

/* 星期标题 */
.uap-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 8px;
}

.uap-calendar-weekdays span {
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: #9ca3af;
    padding: 8px 0;
}

/* 日期网格 */
.uap-calendar-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.uap-calendar-day {
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 8px;
    position: relative;
    transition: all 0.15s;
}

.uap-calendar-day.empty {
    background: transparent;
}

.uap-calendar-day .day-num {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    line-height: 1;
}

/* 今天 */
.uap-calendar-day.today {
    background: #f0f9ff;
    border: 2px solid #3b82f6;
}

.uap-calendar-day.today .day-num {
    color: #3b82f6;
    font-weight: 600;
}

/* 已签到 - 简洁绿色圆点设计 */
.uap-calendar-day.checked {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
}

.uap-calendar-day.checked::after {
    content: '';
    position: absolute;
    bottom: 6px;
    width: 6px;
    height: 6px;
    background: #10b981;
    border-radius: 50%;
}

.uap-calendar-day.checked .day-num {
    color: #059669;
    font-weight: 600;
}

.uap-calendar-day.checked.today {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border-color: #10b981;
}

/* 未来日期 */
.uap-calendar-day.future {
    opacity: 0.4;
}

.uap-calendar-day.future .day-num {
    color: #d1d5db;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-checkin-modal {
        padding: 20px;
        border-radius: 12px;
        max-width: calc(100% - 32px);
    }

    .uap-checkin-modal-title {
        font-size: 16px;
    }

    .uap-checkin-modal .uap-checkin-stats {
        padding: 12px;
        gap: 8px;
    }

    .uap-checkin-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .uap-checkin-stats {
        width: 100%;
        justify-content: space-around;
    }

    .uap-stat-value {
        font-size: 18px;
    }

    .uap-calendar-day .day-num {
        font-size: 13px;
    }

    .uap-calendar-day.checked::after {
        width: 5px;
        height: 5px;
        bottom: 5px;
    }
}


/* --------------------------------------------------------------------------
   6.5 Poster - 分享海报
   -------------------------------------------------------------------------- */

/* ==================== 分享海报样式 ==================== */

/* 海报按钮 */
.uap-poster-btn:hover {
    color: #8b5cf6;
    background: rgba(139, 92, 246, 0.1);
}

.uap-poster-btn.loading {
    pointer-events: none;
    opacity: 0.6;
}

/* 海报模态框 */
.uap-poster-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.uap-poster-modal {
    background: #fff;
    border-radius: 16px;
    max-width: 420px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    animation: uapModalIn 0.25s ease-out;
}

.uap-poster-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-poster-modal-title {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
}

.uap-poster-modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.15s;
    padding: 0;
}

.uap-poster-modal-close svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
}

.uap-poster-modal-close:hover {
    background: #e5e7eb;
    color: #374151;
}

.uap-poster-modal-close:focus {
    outline: none;
    background: #e5e7eb;
}

.uap-poster-modal-body {
    padding: 20px;
    overflow-y: auto;
    flex: 1;
}

/* 模板选择 */
.uap-poster-templates {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    justify-content: center;
}

.uap-poster-template-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 8px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-poster-template-btn:hover {
    border-color: #d1d5db;
}

.uap-poster-template-btn.active {
    border-color: var(--uap-primary);
    background: #eff6ff;
}

.uap-poster-template-btn:focus {
    outline: none;
}

.uap-template-preview {
    width: 48px;
    height: 64px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.uap-template-default {
    background: #fff;
}

.uap-template-dark {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
}

.uap-template-gradient {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.uap-template-name {
    font-size: 12px;
    color: #6b7280;
}

.uap-poster-template-btn.active .uap-template-name {
    color: var(--uap-primary);
    font-weight: 500;
}

/* 海报预览区 */
.uap-poster-preview-wrap {
    position: relative;
    display: flex;
    justify-content: center;
    min-height: 300px;
}

.uap-poster-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    color: #6b7280;
    font-size: 14px;
}

.uap-poster-preview {
    max-width: 100%;
    display: flex;
    justify-content: center;
}

.uap-poster-preview img {
    max-width: 100%;
    max-height: 60vh;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* 模态框底部 */
.uap-poster-modal-footer {
    padding: 16px 20px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.uap-poster-tip {
    font-size: 12px;
    color: #9ca3af;
    margin: 0;
}

.uap-poster-download-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 32px;
    background: var(--uap-primary);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-poster-download-btn:hover {
    background: var(--uap-primary-hover);
}

.uap-poster-download-btn:focus {
    outline: none;
}

.uap-poster-download-btn svg {
    stroke: currentColor;
}

/* ==================== 海报 Canvas 模板样式 ==================== */

.uap-poster-canvas {
    width: 375px;
    padding: 24px;
    font-family: "PingFang SC", "Microsoft YaHei", -apple-system, sans-serif;
    box-sizing: border-box;
}

/* 简约白模板 */
.uap-poster-canvas[data-template="default"] {
    background: #fff;
}

.uap-poster-canvas[data-template="default"] .uap-poster-header {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.uap-poster-canvas[data-template="default"] .uap-poster-logo {
    height: 40px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
}

.uap-poster-canvas[data-template="default"] .uap-poster-site-name {
    display: none;
}

.uap-poster-canvas[data-template="default"] .uap-poster-thumbnail {
    width: 100%;
    height: 200px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    background: #f3f4f6;
}

.uap-poster-canvas[data-template="default"] .uap-poster-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-poster-canvas[data-template="default"] .uap-poster-title {
    font-size: 20px;
    font-weight: 700;
    color: #1f2937;
    line-height: 1.4;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.uap-poster-canvas[data-template="default"] .uap-poster-excerpt {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
    margin: 0 0 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.uap-poster-canvas[data-template="default"] .uap-poster-author {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-poster-canvas[data-template="default"] .uap-poster-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-poster-canvas[data-template="default"] .uap-poster-author-name {
    font-size: 14px;
    color: #374151;
    font-weight: 500;
}

.uap-poster-canvas[data-template="default"] .uap-poster-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

.uap-poster-canvas[data-template="default"] .uap-poster-qrcode {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.uap-poster-canvas[data-template="default"] .uap-poster-qrcode canvas {
    width: 100% !important;
    height: 100% !important;
}

.uap-poster-canvas[data-template="default"] .uap-poster-footer-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-poster-canvas[data-template="default"] .uap-poster-scan-text {
    font-size: 14px;
    color: #374151;
    font-weight: 500;
}

.uap-poster-canvas[data-template="default"] .uap-poster-footer-site {
    font-size: 12px;
    color: #9ca3af;
}

/* 暗黑风模板 */
.uap-poster-canvas[data-template="dark"] {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
}

.uap-poster-canvas[data-template="dark"] .uap-poster-header {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-logo {
    height: 40px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.uap-poster-canvas[data-template="dark"] .uap-poster-site-name {
    display: none;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-thumbnail {
    width: 100%;
    height: 200px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.1);
}

.uap-poster-canvas[data-template="dark"] .uap-poster-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-title {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-excerpt {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.6;
    margin: 0 0 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-author {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.uap-poster-canvas[data-template="dark"] .uap-poster-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-author-name {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.9);
    font-weight: 500;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.uap-poster-canvas[data-template="dark"] .uap-poster-qrcode {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    background: #fff;
    border-radius: 8px;
    padding: 4px;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-qrcode canvas {
    width: 100% !important;
    height: 100% !important;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-footer-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-scan-text {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
}

.uap-poster-canvas[data-template="dark"] .uap-poster-footer-site {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}

/* 渐变彩模板 */
.uap-poster-canvas[data-template="gradient"] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-header {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-logo {
    height: 40px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-site-name {
    display: none;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-thumbnail {
    width: 100%;
    height: 200px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-title {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-excerpt {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0 0 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-author {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, 0.5);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-author-name {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-qrcode {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    background: #fff;
    border-radius: 10px;
    padding: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-qrcode canvas {
    width: 100% !important;
    height: 100% !important;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-footer-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-scan-text {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
}

.uap-poster-canvas[data-template="gradient"] .uap-poster-footer-site {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
}

/* 海报移动端适配 */
@media (max-width: 640px) {
    .uap-poster-modal {
        max-width: calc(100% - 32px);
        max-height: 85vh;
    }

    .uap-poster-modal-header {
        padding: 14px 16px;
    }

    .uap-poster-modal-body {
        padding: 16px;
    }

    .uap-poster-modal-footer {
        padding: 14px 16px;
    }

    .uap-poster-download-btn {
        width: 100%;
    }

    .uap-poster-canvas {
        width: 320px;
        padding: 20px;
    }

    .uap-poster-canvas .uap-poster-logo {
        height: 36px;
    }
}

/* ==================== 海报移动端保存样式 ==================== */
.uap-poster-mobile-save {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    padding: 20px;
}

.uap-poster-mobile-save-tip {
    color: #fff;
    font-size: 14px;
    margin-bottom: 16px;
    padding: 8px 16px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 20px;
}

.uap-poster-mobile-save img {
    max-width: 100%;
    max-height: calc(100vh - 140px);
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.uap-poster-mobile-close {
    margin-top: 20px;
    padding: 12px 40px;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: none;
    border-radius: 24px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-poster-mobile-close:hover,
.uap-poster-mobile-close:focus {
    background: rgba(255, 255, 255, 0.3);
    outline: none;
}

/* 海报错误提示 */
.uap-poster-error {
    padding: 40px 20px;
    text-align: center;
    color: #ef4444;
    font-size: 14px;
}

/* Toast 居中样式 */
.uap-toast-center {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 14px;
    z-index: 999999;
    opacity: 0;
    transition: all 0.3s ease;
    pointer-events: none;
}

.uap-toast-center.show {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}


/* --------------------------------------------------------------------------
   6.3 Badges - 徽章系统
   -------------------------------------------------------------------------- */

/* ==================== 徽章系统样式 ==================== */

.uap-badges-container {
    padding: 0;
}

/* 徽章统计 */
.uap-badges-stats {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-radius: 12px;
    margin-bottom: 24px;
}

.uap-badges-count {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-bottom: 4px;
}

.uap-badges-earned {
    font-size: 36px;
    font-weight: 700;
    color: #3b82f6;
    line-height: 1;
}

.uap-badges-separator {
    font-size: 24px;
    color: #9ca3af;
}

.uap-badges-total {
    font-size: 24px;
    font-weight: 500;
    color: #9ca3af;
}

.uap-badges-label {
    font-size: 14px;
    color: #6b7280;
}

/* 徽章网格 */
.uap-badges-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

/* 徽章卡片 */
.uap-badge-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.uap-badge-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.5), transparent);
    opacity: 0;
    transition: opacity 0.3s;
}

.uap-badge-item:hover {
    border-color: #d1d5db;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
}

.uap-badge-item.earned {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border-color: #fcd34d;
}

.uap-badge-item.earned::before {
    opacity: 1;
    background: linear-gradient(90deg, transparent, #fbbf24, transparent);
}

.uap-badge-item.earned:hover {
    box-shadow: 0 12px 32px rgba(251, 191, 36, 0.25);
}

.uap-badge-item.locked {
    background: #fafafa;
}

/* 精美 SVG 徽章 */
.uap-badge-icon-wrap {
    width: 72px;
    height: 86px;
    flex-shrink: 0;
}

.uap-premium-badge {
    width: 100%;
    height: 100%;
    transition: all 0.3s ease;
}

.uap-premium-badge svg {
    width: 100%;
    height: 100%;
    display: block;
}

.uap-premium-badge.earned {
    animation: uap-badge-float 3s ease-in-out infinite;
}

.uap-premium-badge.locked {
    opacity: 0.45;
    filter: grayscale(100%) brightness(1.1);
}

/* 徽章动画 */
@keyframes uap-badge-float {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }
}

/* 悬停效果 */
.uap-badge-item.earned:hover .uap-premium-badge {
    transform: scale(1.12) rotate(-5deg);
    filter: brightness(1.1) drop-shadow(0 8px 16px rgba(0, 0, 0, 0.2));
    animation: none;
}

.uap-badge-item.locked:hover .uap-premium-badge {
    opacity: 0.6;
    filter: grayscale(70%) brightness(1.15);
}

/* 旧版图标兼容 */
.uap-badge-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-radius: 12px;
    flex-shrink: 0;
}

.uap-badge-item.earned .uap-badge-icon {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.uap-badge-icon svg {
    width: 24px;
    height: 24px;
}

/* 徽章信息 */
.uap-badge-info {
    flex: 1;
    min-width: 0;
}

.uap-badge-name {
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 2px;
}

.uap-badge-item.locked .uap-badge-name {
    color: #6b7280;
}

.uap-badge-desc {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.4;
}

.uap-badge-earned-time {
    font-size: 12px;
    color: #10b981;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.uap-badge-earned-time::before {
    content: '✓';
    font-weight: bold;
}

/* 徽章进度条 */
.uap-badge-progress {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.uap-badge-progress-bar {
    flex: 1;
    height: 4px;
    background: #e5e7eb;
    border-radius: 2px;
    overflow: hidden;
}

.uap-badge-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #3b82f6 0%, #60a5fa 100%);
    border-radius: 2px;
    transition: width 0.3s ease;
}

.uap-badge-progress-text {
    font-size: 11px;
    color: #9ca3af;
    min-width: 32px;
    text-align: right;
}

/* 徽章奖励 */
.uap-badge-reward {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 11px;
    font-weight: 600;
    color: #f59e0b;
    background: #fffbeb;
    padding: 2px 6px;
    border-radius: 4px;
}

.uap-badge-item.earned .uap-badge-reward {
    color: #059669;
    background: #ecfdf5;
}

/* 空状态 */
.uap-badges-empty {
    text-align: center;
    padding: 48px 24px;
    color: #9ca3af;
}

.uap-badges-empty-icon {
    margin-bottom: 12px;
}

.uap-badges-empty-icon svg {
    stroke: #d1d5db;
}

.uap-badges-empty p {
    margin: 0;
    font-size: 14px;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-badges-grid {
        grid-template-columns: 1fr;
    }

    .uap-badges-stats {
        padding: 20px;
    }

    .uap-badges-earned {
        font-size: 32px;
    }

    .uap-badge-item {
        padding: 14px 16px;
    }

    .uap-badge-icon-wrap {
        width: 60px;
        height: 72px;
    }
}


/* ==================== 徽章图标样式切换 ==================== */

/* 仅图标模式 - 前台徽章列表 */
.uap-badges-grid.icon-style-icon-only .uap-badge-icon {
    background: transparent !important;
    box-shadow: none !important;
}

.uap-badges-grid.icon-style-icon-only .uap-badge-icon svg {
    width: 36px;
    height: 36px;
}

.uap-badges-grid.icon-style-icon-only .uap-badge-item.earned .uap-badge-icon svg {
    color: var(--badge-color, #6366f1);
}

.uap-badges-grid.icon-style-icon-only .uap-badge-item.locked .uap-badge-icon svg {
    color: #9ca3af;
}


/* ==================== 徽章展示按钮 ==================== */

.uap-badge-display-btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s;
    color: #9ca3af;
    outline: none;
}

.uap-badge-display-btn svg {
    width: 14px;
    height: 14px;
}

.uap-badge-display-btn .icon-check {
    display: none;
}

.uap-badge-display-btn:hover,
.uap-badge-display-btn:focus {
    color: #2563eb;
    background: #eff6ff;
    border-color: #2563eb;
    transform: scale(1.1);
    outline: none;
    box-shadow: none;
}

.uap-badge-display-btn.displayed {
    color: #fff;
    background: #10b981;
    border-color: #10b981;
}

.uap-badge-display-btn.displayed .icon-display {
    display: none;
}

.uap-badge-display-btn.displayed .icon-check {
    display: block;
}

.uap-badge-display-btn.displayed:hover,
.uap-badge-display-btn.displayed:focus {
    color: #fff;
    background: #ef4444;
    border-color: #ef4444;
    outline: none;
    box-shadow: none;
}

.uap-badge-display-btn.loading {
    pointer-events: none;
    opacity: 0.6;
}

.uap-badge-display-btn.loading svg {
    animation: uapBtnSpin 0.8s linear infinite;
}

@keyframes uapBtnSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* ==================== 用户中心头部展示徽章 ==================== */

.uap-uc-displayed-badges {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 8px;
    vertical-align: middle;
}

.uap-uc-badge {
    display: inline-block;
}

.uap-uc-badge-icon {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    color: #fff;
    transition: transform 0.2s;
    position: relative;
}

.uap-uc-badge-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 5px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.25) 0%, transparent 50%);
    pointer-events: none;
}

.uap-uc-badge:hover .uap-uc-badge-icon {
    transform: scale(1.15);
}

.uap-uc-badge-icon svg {
    width: 14px;
    height: 14px;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.15));
}

/* 仅图标模式 - 头部展示徽章 */
.uap-uc-displayed-badges.icon-style-icon-only .uap-uc-badge-icon {
    background: transparent !important;
    box-shadow: none;
    width: 20px;
    height: 20px;
}

.uap-uc-displayed-badges.icon-style-icon-only .uap-uc-badge-icon::before {
    display: none;
}

.uap-uc-displayed-badges.icon-style-icon-only .uap-uc-badge-icon svg {
    width: 18px;
    height: 18px;
    color: var(--badge-color, #6366f1);
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
}

/* 响应式 */
@media (max-width: 640px) {
    .uap-uc-displayed-badges {
        gap: 4px;
        margin-left: 6px;
    }

    .uap-uc-badge-icon {
        width: 20px;
        height: 20px;
        border-radius: 4px;
    }

    .uap-uc-badge-icon svg {
        width: 12px;
        height: 12px;
    }

    .uap-uc-displayed-badges.icon-style-icon-only .uap-uc-badge-icon {
        width: 18px;
        height: 18px;
    }

    .uap-uc-displayed-badges.icon-style-icon-only .uap-uc-badge-icon svg {
        width: 16px;
        height: 16px;
    }

    .uap-badge-display-btn {
        width: 24px;
        height: 24px;
        bottom: 8px;
        right: 8px;
    }

    .uap-badge-display-btn svg {
        width: 12px;
        height: 12px;
    }
}

/* --------------------------------------------------------------------------
   4.5 Settings - 设置页面
   -------------------------------------------------------------------------- */

/* ==================== 用户中心设置页面 ==================== */

.uap-settings-section {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.uap-settings-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
}

.uap-settings-section-title svg {
    color: #6b7280;
}

.uap-settings-section-desc {
    margin: 0 0 20px;
    font-size: 14px;
    color: #6b7280;
    line-height: 1.5;
}

/* 隐私设置项 */
.uap-privacy-settings {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.uap-privacy-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: #f9fafb;
    border-radius: 10px;
    transition: background 0.2s;
}

.uap-privacy-item:hover {
    background: #f3f4f6;
}

.uap-privacy-item-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-privacy-item-name {
    font-size: 15px;
    font-weight: 500;
    color: #1f2937;
}

.uap-privacy-item-default {
    font-size: 12px;
    color: #9ca3af;
}

/* 隐私开关 */
.uap-privacy-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.uap-privacy-toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.uap-privacy-toggle-slider {
    position: relative;
    width: 52px;
    height: 28px;
    background: #e5e7eb;
    border-radius: 14px;
    transition: all 0.3s;
}

.uap-privacy-toggle-slider::before {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: all 0.3s;
}

.uap-privacy-toggle input:checked+.uap-privacy-toggle-slider {
    background: #10b981;
}

.uap-privacy-toggle input:checked+.uap-privacy-toggle-slider::before {
    transform: translateX(24px);
}

.uap-privacy-toggle-label {
    position: absolute;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    transition: opacity 0.2s;
}

.uap-privacy-toggle-on {
    left: 8px;
    color: #fff;
    opacity: 0;
}

.uap-privacy-toggle-off {
    right: 6px;
    color: #9ca3af;
}

.uap-privacy-toggle input:checked~.uap-privacy-toggle-on {
    opacity: 1;
}

.uap-privacy-toggle input:checked~.uap-privacy-toggle-off {
    opacity: 0;
}

/* 隐私设置操作按钮 */
.uap-privacy-actions {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

/* 公开主页链接区域 */
.uap-profile-url-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.uap-profile-url-input {
    display: flex;
    align-items: stretch;
    background: #f9fafb;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
}

.uap-profile-url-input input {
    flex: 1;
    padding: 12px 16px;
    border: none;
    background: transparent;
    font-size: 14px;
    color: #374151;
    outline: none;
}

.uap-copy-url-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    background: #fff;
    border: none;
    border-left: 1px solid #e5e7eb;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.2s;
}

.uap-copy-url-btn:hover {
    background: #f3f4f6;
    color: var(--uap-primary);
}

.uap-copy-url-btn.copied {
    background: #10b981;
    color: #fff;
}

.uap-view-profile-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: #f3f4f6;
    color: #374151;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    align-self: flex-start;
}

.uap-view-profile-btn:hover {
    background: var(--uap-primary);
    color: #fff;
    text-decoration: none;
}

/* 公开主页模式样式调整 */
.uap-user-center.uap-public-profile .uap-uc-header {
    min-height: 200px;
}

.uap-user-center.uap-public-profile .uap-uc-info h2 {
    font-size: 22px;
}

/* 响应式 */
@media (max-width: 640px) {
    .uap-settings-section {
        padding: 20px;
        border-radius: 0;
        margin-bottom: 12px;
    }

    .uap-settings-section-title {
        font-size: 16px;
    }

    .uap-privacy-item {
        padding: 14px 16px;
    }

    .uap-privacy-item-name {
        font-size: 14px;
    }

    .uap-privacy-toggle-slider {
        width: 46px;
        height: 26px;
    }

    .uap-privacy-toggle-slider::before {
        width: 20px;
        height: 20px;
    }

    .uap-privacy-toggle input:checked+.uap-privacy-toggle-slider::before {
        transform: translateX(20px);
    }

    .uap-profile-url-input input {
        padding: 10px 14px;
        font-size: 13px;
    }

    .uap-copy-url-btn {
        width: 44px;
    }
}


/* ==================== 设置页面子菜单样式 ==================== */

/* 设置容器 */
.uap-settings-container {
    width: 100%;
}

/* 设置子菜单 Tab */
.uap-settings-tabs {
    display: flex;
    gap: 4px;
    background: #f9fafb;
    padding: 4px;
    border-radius: 10px;
    margin-bottom: 24px;
}

.uap-settings-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 500;
    color: #6b7280;
    text-decoration: none !important;
    border-radius: 8px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.uap-settings-tab:hover {
    color: #374151;
    background: rgba(255, 255, 255, 0.8);
}

.uap-settings-tab.active {
    color: var(--uap-primary);
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.uap-settings-tab svg {
    flex-shrink: 0;
    opacity: 0.7;
}

.uap-settings-tab.active svg {
    opacity: 1;
}

/* 设置区块 */
.uap-settings-section {
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
}

.uap-settings-section:last-child {
    margin-bottom: 0;
}

.uap-settings-section-title {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px;
}

.uap-settings-section-desc {
    font-size: 13px;
    color: #9ca3af;
    margin: 0 0 20px;
}

/* 隐私设置头部 */
.uap-privacy-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
}

.uap-privacy-header-text {
    flex: 1;
}

.uap-privacy-header .uap-settings-section-title {
    margin-bottom: 4px;
}

.uap-privacy-header .uap-settings-section-desc {
    margin-bottom: 0;
}

/* 隐私设置列表 */
.uap-privacy-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.uap-privacy-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: #f9fafb;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.uap-privacy-item:hover {
    background: #f3f4f6;
}

.uap-privacy-item-content {
    display: flex;
    align-items: center;
    gap: 12px;
}

.uap-privacy-item-name {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

/* 开关样式 */
.uap-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.uap-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.uap-switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    transition: all 0.3s ease;
    border-radius: 24px;
}

.uap-switch-slider::before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: all 0.3s ease;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.uap-switch input:checked+.uap-switch-slider {
    background-color: var(--uap-primary);
}

.uap-switch input:checked+.uap-switch-slider::before {
    transform: translateX(20px);
}

.uap-switch input:focus+.uap-switch-slider {
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* 隐私设置底部 */
.uap-privacy-footer {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

/* 隐私设置空状态 */
.uap-privacy-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 20px;
    color: #9ca3af;
    text-align: center;
}

.uap-privacy-empty svg {
    margin-bottom: 12px;
    opacity: 0.5;
}

.uap-privacy-empty p {
    margin: 0;
    font-size: 14px;
}

/* 公开主页链接框 */
.uap-profile-url-box {
    display: flex;
    gap: 10px;
    align-items: center;
}

.uap-profile-url-box .uap-input {
    flex: 1;
    background: #f9fafb;
    border-color: #e5e7eb;
    color: #6b7280;
}

.uap-profile-url-box .uap-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.uap-profile-url-box .uap-button svg {
    flex-shrink: 0;
}

/* 私信隐私设置选项 */
.uap-message-privacy-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.uap-message-privacy-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: #f9fafb;
    border: 2px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.uap-message-privacy-option:hover {
    background: #f3f4f6;
}

.uap-message-privacy-option.active {
    background: #eff6ff;
    border-color: var(--uap-primary, #2563eb);
}

.uap-message-privacy-option input[type="radio"] {
    display: none;
}

.uap-privacy-option-radio {
    width: 20px;
    height: 20px;
    border: 2px solid #d1d5db;
    border-radius: 50%;
    flex-shrink: 0;
    position: relative;
    transition: all 0.2s ease;
    margin-top: 1px;
}

.uap-message-privacy-option.active .uap-privacy-option-radio {
    border-color: var(--uap-primary, #2563eb);
}

.uap-message-privacy-option.active .uap-privacy-option-radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: var(--uap-primary, #2563eb);
    border-radius: 50%;
}

.uap-privacy-option-label {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    flex: 1;
}

.uap-privacy-option-hint {
    display: block;
    font-size: 12px;
    color: #9ca3af;
    font-weight: 400;
    margin-top: 2px;
}

/* 响应式 */
@media (max-width: 640px) {
    .uap-settings-tabs {
        flex-wrap: wrap;
        gap: 4px;
    }

    .uap-settings-tab {
        padding: 8px 14px;
        font-size: 13px;
        flex: 1;
        justify-content: center;
        min-width: calc(50% - 4px);
    }

    .uap-settings-tab svg {
        display: none;
    }

    .uap-settings-section {
        padding: 20px 16px;
    }

    .uap-privacy-item {
        padding: 14px 16px;
    }

    .uap-profile-url-box {
        flex-direction: column;
    }

    .uap-profile-url-box .uap-input {
        width: 100%;
    }

    .uap-profile-url-box .uap-button {
        width: 100%;
        justify-content: center;
    }

    /* 私信隐私设置移动端 */
    .uap-message-privacy-option {
        padding: 12px 14px;
    }

    .uap-privacy-option-label {
        font-size: 13px;
    }

    .uap-privacy-option-hint {
        font-size: 11px;
    }
}


/* --------------------------------------------------------------------------
   8.2 404 Page - 用户主页 404 页面
   -------------------------------------------------------------------------- */

/* ==================== 用户主页 404 页面 ==================== */
.uap-profile-404 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    padding: 60px 20px;
    text-align: center;
}

.uap-profile-404-icon {
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
    border-radius: 50%;
    margin-bottom: 24px;
    color: #9ca3af;
}

.uap-profile-404-title {
    font-size: 24px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 12px;
}

.uap-profile-404-text {
    font-size: 15px;
    color: #6b7280;
    margin: 0 0 32px;
    max-width: 300px;
    line-height: 1.6;
}

.uap-profile-404-actions {
    display: flex;
    gap: 12px;
}

.uap-profile-404-actions .uap-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.uap-profile-404-actions .uap-button svg {
    width: 16px;
    height: 16px;
}

@media (max-width: 480px) {
    .uap-profile-404 {
        min-height: 50vh;
        padding: 40px 20px;
    }

    .uap-profile-404-icon {
        width: 100px;
        height: 100px;
    }

    .uap-profile-404-icon svg {
        width: 60px;
        height: 60px;
    }

    .uap-profile-404-title {
        font-size: 20px;
    }

    .uap-profile-404-text {
        font-size: 14px;
    }
}


/* --------------------------------------------------------------------------
   8.3 Access Denied - 无权访问提示
   -------------------------------------------------------------------------- */

/* ==================== 无权访问提示 ==================== */
.uap-access-denied {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 60px 20px;
    text-align: center;
}

.uap-access-denied-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 50%;
    margin-bottom: 20px;
    color: #d97706;
}

.uap-access-denied-icon svg {
    width: 40px;
    height: 40px;
}

.uap-access-denied-title {
    font-size: 20px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px;
}

.uap-access-denied-text {
    font-size: 14px;
    color: #6b7280;
    margin: 0 0 24px;
    max-width: 280px;
    line-height: 1.6;
}

.uap-access-denied .uap-button {
    min-width: 100px;
}

@media (max-width: 480px) {
    .uap-access-denied {
        min-height: 200px;
        padding: 40px 20px;
    }

    .uap-access-denied-icon {
        width: 64px;
        height: 64px;
    }

    .uap-access-denied-icon svg {
        width: 32px;
        height: 32px;
    }

    .uap-access-denied-title {
        font-size: 18px;
    }
}


/* --------------------------------------------------------------------------
   6.4 Follow System - 关注系统
   -------------------------------------------------------------------------- */

/* ==================== 关注系统样式 ==================== */

/* 关注按钮 */
.uap-follow-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    background: var(--uap-primary);
    border: none;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.uap-follow-btn:hover {
    background: var(--uap-primary-hover);
    transform: translateY(-1px);
}

.uap-follow-btn:active {
    transform: translateY(0);
}

/* 已关注状态 */
.uap-follow-btn.following {
    background: #f3f4f6;
    color: #6b7280;
}

.uap-follow-btn.following:hover {
    background: #fef2f2;
    color: #ef4444;
}

.uap-follow-btn.following:hover .uap-follow-btn-text::after {
    content: attr(data-hover-text);
}

/* 互相关注状态 */
.uap-follow-btn.mutual {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.uap-follow-btn.mutual:hover {
    background: #fef2f2;
    color: #ef4444;
    border-color: #fecaca;
}

/* 按钮图标 */
.uap-follow-btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.uap-follow-btn-icon svg {
    width: 14px;
    height: 14px;
}

/* 加载状态 */
.uap-follow-btn.loading {
    pointer-events: none;
    opacity: 0.7;
}

.uap-follow-btn.loading .uap-follow-btn-icon svg {
    animation: uap-spin 0.8s linear infinite;
}

/* 按钮尺寸 */
.uap-follow-btn-small {
    padding: 5px 14px;
    font-size: 12px;
    gap: 4px;
}

.uap-follow-btn-small .uap-follow-btn-icon svg {
    width: 12px;
    height: 12px;
}

.uap-follow-btn-large {
    padding: 10px 28px;
    font-size: 15px;
    gap: 8px;
}

.uap-follow-btn-large .uap-follow-btn-icon svg {
    width: 16px;
    height: 16px;
}

/* 关注/粉丝统计 */
.uap-follow-stats {
    display: flex;
    align-items: center;
    gap: 20px;
}

.uap-follow-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s;
}

.uap-follow-stat:hover {
    opacity: 0.8;
}

.uap-follow-stat-value {
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
}

.uap-follow-stat-label {
    font-size: 12px;
    color: #6b7280;
}

/* 关注/粉丝列表模态框 */
.uap-follow-modal {
    max-width: 420px;
    padding: 0;
}

.uap-follow-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-follow-modal-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.uap-follow-modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
}

.uap-follow-modal-close:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-follow-modal-body {
    max-height: 400px;
    overflow-y: auto;
}

/* 用户列表项 */
.uap-follow-user-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    transition: background 0.2s;
}

.uap-follow-user-item:hover {
    background: #f9fafb;
}

.uap-follow-user-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.uap-follow-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-follow-user-info {
    flex: 1;
    min-width: 0;
}

.uap-follow-user-name {
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
    margin: 0 0 2px;
}

.uap-follow-user-name a {
    color: inherit;
    text-decoration: none;
}

.uap-follow-user-name a:hover {
    color: var(--uap-primary);
}

.uap-follow-user-bio {
    font-size: 12px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-follow-user-action {
    flex-shrink: 0;
}

.uap-follow-user-action .uap-follow-btn {
    padding: 6px 16px;
    font-size: 13px;
}

/* 互粉标识 */
.uap-mutual-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: 11px;
    color: #16a34a;
    background: #f0fdf4;
    border-radius: 10px;
    margin-left: 6px;
}

/* 空状态 */
.uap-follow-empty {
    padding: 48px 20px;
    text-align: center;
    color: #9ca3af;
}

.uap-follow-empty-icon {
    margin-bottom: 12px;
    opacity: 0.5;
}

.uap-follow-empty p {
    margin: 0;
    font-size: 14px;
}

/* 加载更多 */
.uap-follow-load-more {
    padding: 16px 20px;
    text-align: center;
    border-top: 1px solid #f0f0f0;
}

.uap-follow-load-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    font-size: 14px;
    color: var(--uap-primary);
    background: transparent;
    border: 1px solid var(--uap-primary);
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-follow-load-more-btn:hover {
    background: var(--uap-primary);
    color: #fff;
}

/* 响应式 */
@media (max-width: 480px) {
    .uap-follow-stats {
        gap: 16px;
    }

    .uap-follow-stat-value {
        font-size: 16px;
    }

    .uap-follow-modal {
        margin: 16px;
        max-width: calc(100% - 32px);
    }

    .uap-follow-user-item {
        padding: 10px 16px;
    }

    .uap-follow-user-avatar {
        width: 40px;
        height: 40px;
    }
}


/* ==================== 用户中心头部关注区域 ==================== */
.uap-uc-follow-section {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 12px;
}

.uap-uc-follow-section .uap-follow-stats {
    gap: 16px;
}

.uap-uc-follow-section .uap-follow-stat {
    flex-direction: row;
    gap: 6px;
}

.uap-uc-follow-section .uap-follow-stat-value {
    font-size: 16px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.uap-uc-follow-section .uap-follow-stat-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.85);
}

.uap-uc-follow-action {
    margin-left: auto;
}

/* 用户主页头部的关注按钮样式调整 */
.uap-uc-header .uap-follow-btn {
    background: rgba(255, 255, 255, 0.95);
    color: var(--uap-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.uap-uc-header .uap-follow-btn:hover {
    background: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.uap-uc-header .uap-follow-btn.following {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.uap-uc-header .uap-follow-btn.following:hover {
    background: rgba(239, 68, 68, 0.9);
    border-color: transparent;
}

.uap-uc-header .uap-follow-btn.mutual {
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.uap-uc-header .uap-follow-btn.mutual:hover {
    background: rgba(239, 68, 68, 0.9);
    border-color: transparent;
}

@media (max-width: 640px) {
    .uap-uc-follow-section {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 12px;
    }

    .uap-uc-follow-action {
        margin-left: 0;
    }
}

/* ==================== 头像下方关注按钮（抖音风格） ==================== */
.uap-uc-avatar-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.uap-avatar-follow-btn {
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--uap-primary);
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    z-index: 10;
}

.uap-avatar-follow-btn:hover {
    background: var(--uap-primary-hover);
    transform: translateX(-50%) scale(1.1);
}

.uap-avatar-follow-btn.following {
    background: #10b981;
}

.uap-avatar-follow-btn.following:hover {
    background: #ef4444;
}

.uap-avatar-follow-btn.loading {
    pointer-events: none;
    opacity: 0.7;
}

.uap-avatar-follow-btn.loading svg {
    animation: uap-spin 0.8s linear infinite;
}

.uap-avatar-follow-btn svg {
    width: 14px;
    height: 14px;
}

/* 用户中心头部访问量统计样式（不可点击） */
.uap-uc-follow-section .uap-profile-views-stat {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}

.uap-uc-follow-section .uap-profile-views-stat .uap-stat-value {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.uap-uc-follow-section .uap-profile-views-stat .uap-stat-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.85);
}

/* ==================== 关注列表布局修复 ==================== */
.uap-follow-user-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    transition: background 0.2s;
}

.uap-follow-user-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.uap-follow-user-avatar a {
    display: block;
    width: 100%;
    height: 100%;
}

.uap-follow-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-follow-user-info {
    flex: 1;
    min-width: 0;
    margin-right: 12px;
}

.uap-follow-user-name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
    margin: 0 0 4px;
}

.uap-follow-user-name a {
    color: inherit;
    text-decoration: none;
}

.uap-follow-user-name a:hover {
    color: var(--uap-primary);
}

.uap-follow-user-bio {
    font-size: 12px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
    text-align: left;
}

.uap-follow-user-action {
    flex-shrink: 0;
    margin-left: auto;
}

/* 关注列表模态框关闭按钮增强 */
.uap-follow-modal-close {
    position: relative;
    z-index: 100;
}



/* --------------------------------------------------------------------------
   7.1 Creations - 创作中心
   -------------------------------------------------------------------------- */

/* ==================== 创作中心样式 ==================== */

/* 创作中心容器 */
.uap-creations-container {
    padding: 0;
}

/* 创作中心头部 */
.uap-creations-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
}

/* 胶囊筛选按钮组 */
.uap-creations-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.uap-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #f3f4f6;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    color: #4b5563;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-filter-btn:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-filter-btn.active {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 9px;
    font-size: 12px;
    font-weight: 500;
}

.uap-filter-btn:not(.active) .uap-filter-count {
    background: #e5e7eb;
    color: #6b7280;
}

.uap-filter-count-warning {
    background: #fef3c7 !important;
    color: #d97706 !important;
}

.uap-filter-btn.active .uap-filter-count-warning {
    background: rgba(255, 255, 255, 0.3) !important;
    color: #fff !important;
}

/* 创作按钮 */
.uap-creations-actions {
    display: flex;
    gap: 10px;
}

.uap-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.uap-btn-primary {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-btn-primary:hover {
    background: var(--uap-primary-dark, #1d4ed8);
    color: #fff;
}

.uap-btn-secondary {
    background: #f3f4f6;
    color: #374151;
}

.uap-btn-secondary:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-btn svg {
    width: 16px;
    height: 16px;
}

/* 想法发布表单容器 */
.uap-thought-form-wrapper {
    margin-bottom: 24px;
    padding: 0;
    background: transparent;
    border-radius: 0;
    border: none;
}

/* 创作列表 */
.uap-creations-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: visible;
}

/* 创作项卡片 */
.uap-creation-item {
    display: block;
    padding: 16px 20px;
    background: #fff;
    border: none;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 0;
    transition: all 0.2s;
}

.uap-creation-item:last-child {
    border-bottom: none;
}

.uap-creation-item:hover {
    background: #f8fafc;
}

/* 创作类型图标 */
.uap-creation-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-radius: 10px;
    color: #6b7280;
}

.uap-creation-post .uap-creation-icon {
    background: #eff6ff;
    color: #2563eb;
}

.uap-creation-thought .uap-creation-icon {
    background: #f0fdf4;
    color: #16a34a;
}

/* 创作内容 */
.uap-creation-content {
    flex: 1;
    min-width: 0;
}

.uap-creation-title {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.4;
}

.uap-creation-title a {
    color: inherit;
    text-decoration: none;
}

.uap-creation-title a:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-creation-text {
    margin: 0 0 12px;
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 创作元信息 */
.uap-creation-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 13px;
    color: #9ca3af;
}

.uap-creation-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.uap-status-success {
    background: #dcfce7;
    color: #16a34a;
}

.uap-status-warning {
    background: #fef3c7;
    color: #d97706;
}

.uap-status-info {
    background: #e0f2fe;
    color: #0284c7;
}

.uap-status-error {
    background: #fee2e2;
    color: #dc2626;
}

.uap-creation-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* 创作缩略图 */
.uap-creation-thumb {
    flex-shrink: 0;
    width: 80px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
}

.uap-creation-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 创作图片网格 */
.uap-creation-images {
    display: grid;
    gap: 4px;
    margin-top: 12px;
    border-radius: 8px;
    overflow: hidden;
}

.uap-creation-images.uap-images-1 {
    grid-template-columns: 1fr;
    max-width: 300px;
}

.uap-creation-images.uap-images-2 {
    grid-template-columns: repeat(2, 1fr);
    max-width: 300px;
}

.uap-creation-images.uap-images-3,
.uap-creation-images.uap-images-4 {
    grid-template-columns: repeat(2, 1fr);
    max-width: 300px;
}

.uap-creation-images.uap-images-5,
.uap-creation-images.uap-images-6,
.uap-creation-images.uap-images-7,
.uap-creation-images.uap-images-8,
.uap-creation-images.uap-images-9 {
    grid-template-columns: repeat(3, 1fr);
    max-width: 300px;
}

.uap-creation-image {
    aspect-ratio: 1;
    overflow: hidden;
}

.uap-creation-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 创作操作按钮 */
.uap-creation-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.2s;
}

.uap-creation-item:hover .uap-creation-actions {
    opacity: 1;
}

.uap-creation-action-btn {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: 6px;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-creation-action-btn svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.uap-creation-action-btn:hover {
    background: #e5e7eb;
    color: #374151;
}

.uap-creation-action-btn.uap-delete-btn:hover {
    background: #fee2e2;
    color: #dc2626;
}

/* 创作功能未启用提示 */
.uap-creations-disabled {
    text-align: center;
    padding: 60px 20px;
    color: #6b7280;
}

.uap-creations-disabled h3 {
    margin: 16px 0 8px;
    font-size: 18px;
    color: #374151;
}

.uap-creations-disabled p {
    margin: 0;
    font-size: 14px;
}

/* 分页 */
.uap-creations-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

/* 创作中心 - 想法卡片样式 */
.uap-creation-thought-card {
    flex: 1;
    min-width: 0;
}

.uap-creation-thought-content {
    margin-bottom: 12px;
}

.uap-creation-thought-text {
    margin: 0;
    font-size: 15px;
    color: #374151;
    line-height: 1.6;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.uap-creation-thought-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.uap-creation-thought-meta {
    font-size: 13px;
    color: #9ca3af;
}

.uap-creation-thought-stats {
    display: flex;
    gap: 16px;
}

.uap-creation-thought-stats .uap-creation-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #9ca3af;
    font-size: 13px;
}

.uap-creation-thought-stats .uap-creation-stat svg {
    width: 14px;
    height: 14px;
}

/* 想法类型的创作项特殊样式 */
.uap-creation-item.uap-creation-thought {
    align-items: flex-start;
}

.uap-creation-item.uap-creation-thought .uap-creation-actions {
    align-self: flex-start;
    margin-top: 0;
}

.uap-view-btn:hover {
    background: #eff6ff;
    color: var(--uap-primary, #2563eb);
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-creations-header {
        flex-direction: column;
        align-items: stretch;
    }

    .uap-creations-filters {
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .uap-filter-btn {
        flex-shrink: 0;
        padding: 6px 12px;
        font-size: 13px;
    }

    .uap-creations-actions {
        justify-content: stretch;
    }

    .uap-creations-actions .uap-btn {
        flex: 1;
        justify-content: center;
    }

    .uap-creation-item {
        flex-wrap: wrap;
        padding: 16px;
    }

    .uap-creation-thumb {
        order: -1;
        width: 100%;
        height: 160px;
        margin-bottom: 12px;
    }

    .uap-creation-actions {
        opacity: 1;
        width: 100%;
        justify-content: flex-end;
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid #f0f0f0;
    }
}


/* --------------------------------------------------------------------------
   7.3 Thoughts - 想法系统
   -------------------------------------------------------------------------- */

/* ==================== 想法系统样式 ==================== */

/* @提及链接样式 */
.uap-mention {
    color: var(--uap-primary, #2563eb);
    text-decoration: none;
    font-weight: 500;
}

.uap-mention:hover {
    text-decoration: underline;
}

/* @提及自动补全下拉框 */
.uap-mention-dropdown {
    position: absolute;
    z-index: 1000;
    min-width: 240px;
    max-width: 320px;
    max-height: 300px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    display: none;
}

.uap-mention-dropdown.active {
    display: block;
}

.uap-mention-dropdown-header {
    padding: 10px 14px;
    font-size: 12px;
    color: var(--uap-text-light, #6b7280);
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-mention-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: background-color 0.15s;
}

.uap-mention-item:hover,
.uap-mention-item.active {
    background: #f3f4f6;
}

.uap-mention-item-avatar {
    flex-shrink: 0;
}

.uap-mention-item-avatar img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-mention-item-info {
    flex: 1;
    min-width: 0;
}

.uap-mention-item-name {
    font-weight: 500;
    color: var(--uap-text, #374151);
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-mention-item-username {
    font-size: 12px;
    color: var(--uap-text-light, #6b7280);
}

.uap-mention-empty {
    padding: 20px 14px;
    text-align: center;
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
}

.uap-mention-loading {
    padding: 20px 14px;
    text-align: center;
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
}

/* 想法系统全局样式重置 */
.uap-thought-stream a,
.uap-thought-card a,
.uap-thought-stream-page a {
    text-decoration: none;
}

/* 想法按钮样式重置 - 覆盖主题通用样式 */
.uap-thought-action,
.uap-thought-action:focus,
.uap-thought-action:hover,
button.uap-thought-action,
button.uap-thought-action:focus,
button.uap-thought-action:hover,
[type=button].uap-thought-action:focus,
[type=button].uap-thought-action:hover {
    background: transparent !important;
    color: #536471 !important;
    text-decoration: none !important;
}

.uap-thought-action.comment:hover,
button.uap-thought-action.comment:hover {
    color: #1d9bf0 !important;
}

.uap-thought-action.like:hover,
.uap-thought-action.like.active,
button.uap-thought-action.like:hover,
button.uap-thought-action.like.active {
    color: #f91880 !important;
}

.uap-thought-action.favorite:hover,
.uap-thought-action.favorite.active,
button.uap-thought-action.favorite:hover,
button.uap-thought-action.favorite.active {
    color: #ffc107 !important;
}

/* 想法流容器 */
.uap-thought-stream {
    max-width: 680px;
    margin: 0 auto;
}

.uap-thought-stream-form {
    margin-bottom: 20px;
}

/* 想法筛选栏 */
.uap-thought-filters {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border-radius: 12px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid #e5e7eb;
    padding-right: 12px;
}

.uap-thought-filter-tabs {
    flex: 1;
    display: flex;
    gap: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* Firefox */
    position: relative;
    min-width: 0;
    border-radius: 12px 0 0 12px;
    /* 左侧圆角 */
    overflow: hidden;
    /* 只在 tabs 容器内隐藏溢出，不影响排序下拉菜单 */
}

.uap-thought-filter-tabs::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari */
}

/* 横向滚动渐变提示（移动端） */
.uap-thought-filter-tabs::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 20px;
    background: linear-gradient(to left, rgba(255, 255, 255, 0.9), transparent);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s;
}

@media (max-width: 768px) {
    .uap-thought-filter-tabs::after {
        opacity: 1;
        /* 移动端显示滚动提示 */
    }
}

/* 滑动指示器 */
.uap-filter-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    /* 初始位置为 0，由 JS 动态计算 */
    height: 3px;
    background: linear-gradient(90deg, #1d9bf0 0%, #0ea5e9 100%);
    border-radius: 3px 3px 0 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    box-shadow: 0 -1px 4px rgba(29, 155, 240, 0.3);
    z-index: 1;
    /* 确保指示器在 tabs 内部显示 */
}

.uap-filter-tab {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 16px 20px;
    /* 恢复原来的内边距 */
    border: none;
    background: transparent;
    color: #6b7280;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
    white-space: nowrap;
    outline: none;
}

.uap-filter-tab:hover {
    color: #1d9bf0;
    background: rgba(29, 155, 240, 0.05) !important;
}

.uap-filter-tab:focus {
    color: #1d9bf0 !important;
    background: transparent !important;
    outline: none;
}

.uap-filter-tab.active {
    color: #1d9bf0;
    font-weight: 600;
}

.uap-filter-tab.active:hover {
    background: rgba(29, 155, 240, 0.05) !important;
}

.uap-filter-tab.active:focus {
    color: #1d9bf0 !important;
    background: transparent !important;
}

/* 图标动画 */
.uap-filter-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
}

.uap-filter-tab:hover .uap-filter-icon {
    transform: scale(1.1);
}

.uap-filter-tab.active .uap-filter-icon {
    transform: scale(1.05);
}

.uap-filter-icon svg {
    width: 16px;
    height: 16px;
}

.uap-filter-text {
    display: inline;
}

/* 排序选择器 */
.uap-thought-sort {
    position: relative;
    flex-shrink: 0;
}

.uap-sort-trigger {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: transparent !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px;
    color: #6b7280 !important;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    outline: none !important;
    min-height: 36px;
    /* 确保触摸目标足够大 */
}

.uap-sort-trigger:hover,
.uap-sort-trigger:focus {
    background: #f9fafb !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
    box-shadow: none !important;
}

.uap-sort-trigger:active {
    background: #f3f4f6 !important;
    transform: scale(0.98);
}

.uap-sort-trigger svg {
    flex-shrink: 0;
}

.uap-sort-text {
    line-height: 1;
}

.uap-sort-arrow {
    transition: transform 0.2s ease;
    opacity: 0.5;
}

.uap-thought-sort.open .uap-sort-arrow {
    transform: rotate(180deg);
}

.uap-sort-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 140px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
    padding: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 200;
}

.uap-thought-sort.open .uap-sort-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.uap-sort-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 6px;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.uap-sort-option:hover {
    background: #f3f4f6;
    color: #1f2937;
}

.uap-sort-option.active {
    background: #eff6ff;
    color: #1d9bf0;
}

.uap-sort-option svg {
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.uap-sort-option.active svg {
    opacity: 1;
}

.uap-sort-option span {
    flex: 1;
}

/* 想法空状态 */
.uap-thoughts-empty {
    padding: 80px 20px;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    min-height: 400px;
    /* 最小高度，防止跳动 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.uap-empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.uap-empty-text {
    font-size: 18px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.uap-empty-hint {
    font-size: 14px;
    color: #6b7280;
}

.uap-thought-stream-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: var(--uap-border, #e5e7eb);
    border-radius: 12px;
    overflow: hidden;
    min-height: 400px;
    /* 最小高度，防止切换时跳动 */
    position: relative;
    transition: opacity 0.3s ease;
    /* 平滑的透明度过渡 */
}

/* 加载状态 */
.uap-thought-stream-list .uap-loading {
    padding: 40px 20px;
    text-align: center;
    color: var(--uap-text-light, #6b7280);
    background: #fff;
    font-size: 14px;
}

/* 骨架屏加载动画 */
.uap-skeleton-loading {
    background: #fff;
    padding: 0;
    border-radius: 12px;
    min-height: 400px;
    /* 确保骨架屏占满最小高度 */
    display: flex;
    flex-direction: column;
}

.uap-skeleton-item {
    display: flex;
    gap: 12px;
    padding: 20px;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}

.uap-skeleton-item:last-child {
    border-bottom: none;
}

.uap-skeleton-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease-in-out infinite;
    flex-shrink: 0;
}

.uap-skeleton-content {
    flex: 1;
    min-width: 0;
}

.uap-skeleton-line {
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease-in-out infinite;
    border-radius: 4px;
    margin-bottom: 8px;
}

.uap-skeleton-line:last-child {
    margin-bottom: 0;
}

.uap-skeleton-line.short {
    width: 60%;
}

.uap-skeleton-line.medium {
    width: 80%;
}

@keyframes skeleton-shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

@keyframes skeleton-pulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
    }
}

.uap-thought-empty {
    padding: 60px 20px;
    text-align: center;
    color: var(--uap-text-light, #6b7280);
    background: #fff;
}

/* 移动端优化 */
@media (max-width: 768px) {
    .uap-thought-filters {
        border-radius: 12px;
        /* 恢复圆角 */
        margin-left: 0;
        /* 移除负边距 */
        margin-right: 0;
        /* 移除负边距 */
        margin-bottom: 15px;
        padding: 0 10px;
        /* 左右内边距 */
        gap: 10px;
    }

    .uap-thought-filter-tabs {
        gap: 0;
        padding: 0;
        border-radius: 0;
    }

    .uap-filter-tab {
        padding: 14px 12px;
        /* 适中的内边距 */
        font-size: 14px;
        min-width: 48px;
        /* 增加到48px，更舒适 */
        justify-content: center;
        flex-shrink: 0;
    }

    /* 移动端只显示图标 */
    .uap-filter-text {
        display: none;
    }

    .uap-filter-icon svg {
        width: 20px;
        /* 恢复到20px，更清晰 */
        height: 20px;
    }

    /* 滑动指示器移动端优化 */
    .uap-filter-indicator {
        height: 3px;
        /* 保持3px，更明显 */
    }

    /* 排序选择器移动端样式 - 只显示图标 */
    .uap-thought-sort {
        flex-shrink: 0;
    }

    .uap-sort-trigger {
        padding: 10px;
        /* 增加内边距 */
        min-width: 40px;
        min-height: 40px;
        border-radius: 8px;
        gap: 0;
        border: unset !important;
    }

    .uap-sort-trigger svg:first-child {
        width: 20px;
        /* 与筛选图标一致 */
        height: 20px;
    }

    /* 移动端隐藏排序文字和箭头 */
    .uap-sort-text {
        display: none;
    }

    .uap-sort-arrow {
        display: none;
    }

    /* 下拉菜单移动端优化 */
    .uap-sort-dropdown {
        right: 0;
        min-width: 120px;
    }

    .uap-thoughts-empty {
        padding: 60px 20px;
    }

    .uap-empty-icon {
        font-size: 40px;
    }

    .uap-empty-text {
        font-size: 16px;
    }

    .uap-empty-hint {
        font-size: 13px;
    }
}

/* 小屏幕手机优化 (iPhone SE, 小屏安卓) */
@media (max-width: 480px) {
    .uap-thought-filters {
        padding: 0 8px;
        /* 小屏稍微减少内边距 */
        gap: 8px;
    }

    .uap-filter-tab {
        padding: 12px 10px;
        /* 稍微紧凑 */
        min-width: 44px;
    }

    .uap-filter-icon svg {
        width: 18px;
        height: 18px;
    }

    .uap-sort-trigger {
        padding: 8px;
        min-width: 36px;
        min-height: 36px;
    }

    .uap-sort-trigger svg:first-child {
        width: 18px;
        height: 18px;
    }
}

/* 想法卡片 */
.uap-thought-card {
    background: #fff;
    padding: 16px 20px;
    transition: background-color 0.2s;
}

.uap-thought-card:hover {
    background: #f8fafc;
}

/* 想法头部 */
.uap-thought-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 8px;
}

.uap-thought-avatar {
    flex-shrink: 0;
}

.uap-thought-avatar img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-thought-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    flex-direction: column;
    gap: 0;
    line-height: 1.4;
}

.uap-thought-author {
    font-weight: 600;
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-thought-author:hover {
    color: var(--uap-primary, #2563eb);
    text-decoration: underline;
}

.uap-thought-username {
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

.uap-thought-dot {
    color: var(--uap-text-light, #6b7280);
}

.uap-thought-time {
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
    text-decoration: none;
}

.uap-thought-time:hover {
    text-decoration: underline;
}

/* 更多菜单 */
.uap-thought-more {
    position: relative;
    margin-left: auto;
}

/* 在操作栏中的更多按钮 */
.uap-thought-actions .uap-thought-more {
    margin-left: auto;
}

.uap-thought-more-btn {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: var(--uap-text-light, #6b7280);
    cursor: pointer;
    transition: all 0.2s;
}

/* 在操作栏中的更多按钮样式 */
.uap-thought-action.more {
    width: auto;
    height: auto;
    padding: 8px;
    border-radius: 50%;
}

.uap-thought-action.more:hover {
    background: rgba(0, 0, 0, 0.05);
    color: var(--uap-text, #374151);
}

.uap-thought-more-btn:hover {
    background: rgba(29, 155, 240, 0.1);
    color: var(--uap-primary, #2563eb);
}

.uap-thought-dropdown {
    position: absolute;
    bottom: 100%;
    right: 0;
    min-width: 120px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.2s;
    z-index: 100;
    overflow: hidden;
    margin-bottom: 8px;
}

.uap-thought-dropdown.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.uap-thought-edit-btn,
.uap-thought-delete-btn,
.uap-thought-report-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 12px 16px;
    background: transparent !important;
    border: none !important;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s;
    white-space: nowrap;
}

.uap-thought-edit-btn {
    color: var(--uap-text, #374151) !important;
}

.uap-thought-edit-btn svg {
    color: inherit;
}

.uap-thought-edit-btn:hover {
    background: #f3f4f6 !important;
    color: var(--uap-primary, #2563eb) !important;
}

.uap-thought-delete-btn {
    color: #ef4444 !important;
}

.uap-thought-delete-btn svg {
    color: inherit;
    stroke: currentColor;
}

.uap-thought-delete-btn:hover {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}

.uap-thought-report-btn {
    color: #f59e0b !important;
}

.uap-thought-report-btn svg {
    color: inherit;
    stroke: currentColor;
}

.uap-thought-report-btn:hover {
    background: #fffbeb !important;
    color: #d97706 !important;
}

/* 想法内容 */
.uap-thought-content {
    padding-left: 10px;
}

.uap-thought-text {
    display: block;
    color: var(--uap-text, #374151);
    font-size: 15px;
    line-height: 1.6;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* 可点击的想法文本区域 */
.uap-thought-text.linkable {
    cursor: pointer;
    transition: background-color 0.2s;
}

/* 想法中的链接样式 */
.uap-thought-link {
    color: #1d9bf0;
    text-decoration: none;
    word-break: break-all;
    transition: color 0.2s;
    border-bottom: 1px dashed;
}

.uap-thought-link:hover {
    color: #1a8cd8;
    text-decoration: none;
    border-bottom: 1px solid;
}

.uap-thought-tag {
    color: var(--uap-primary, #2563eb);
    text-decoration: none;
}

.uap-thought-tag:hover {
    text-decoration: underline;
}

/* 话题链接样式 */
.uap-topic-link {
    color: var(--uap-primary, #2563eb);
    text-decoration: none;
    font-weight: 500;
}

.uap-topic-link:hover {
    text-decoration: underline;
}

/* 话题自动补全下拉框 */
.uap-topic-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 300px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    z-index: 1000;
    display: none;
}

.uap-topic-dropdown.active {
    display: block;
}

.uap-topic-dropdown-header {
    padding: 10px 14px;
    font-size: 12px;
    color: #6b7280;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.uap-topic-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    cursor: pointer;
    transition: background 0.15s;
}

.uap-topic-item:hover,
.uap-topic-item.active {
    background: #f3f4f6;
}

.uap-topic-item-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    flex-shrink: 0;
    color: #6b7280;
}

.uap-topic-item-icon svg {
    stroke: currentColor;
}

.uap-topic-create-icon {
    background: #fff;
    border-color: #d1fae5;
    color: #059669;
}

.uap-topic-item-info {
    flex: 1;
    min-width: 0;
}

.uap-topic-item-name {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-topic-item-count {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 2px;
}

.uap-topic-loading,
.uap-topic-empty {
    padding: 20px;
    text-align: center;
    color: #9ca3af;
    font-size: 14px;
}

/* 热门话题组件 */
.uap-hot-topics-widget {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.uap-hot-topics-title {
    padding: 16px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #f0f0f0;
}

.uap-hot-topics-list {
    padding: 8px 0;
}

.uap-hot-topic-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    text-decoration: none;
    transition: background 0.15s;
}

.uap-hot-topic-item:hover {
    background: #f9fafb;
}

.uap-hot-topic-rank {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: #9ca3af;
    background: #f3f4f6;
    border-radius: 6px;
    flex-shrink: 0;
}

.uap-hot-topic-item:nth-child(1) .uap-hot-topic-rank,
.uap-hot-topic-item:nth-child(2) .uap-hot-topic-rank,
.uap-hot-topic-item:nth-child(3) .uap-hot-topic-rank {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-hot-topic-name {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-hot-topic-count {
    font-size: 12px;
    color: #9ca3af;
    flex-shrink: 0;
}

/* 想法视频 */
.uap-thought-video {
    margin-top: 12px;
    border-radius: 16px;
    overflow: hidden;
    background: #000;
    max-width: 100%;
}

.uap-thought-video video {
    width: 100%;
    max-height: 400px;
    display: block;
}

.uap-thought-single-video {
    margin-top: 16px;
    border-radius: 16px;
    overflow: hidden;
    background: #000;
}

.uap-thought-single-video video {
    width: 100%;
    max-height: 500px;
    display: block;
}

/* 想法图片 */
.uap-thought-images {
    display: grid;
    gap: 4px;
    margin-top: 12px;
    border-radius: 16px;
    overflow: hidden;
}

.uap-thought-images-1 {
    grid-template-columns: 1fr;
    max-width: 400px;
}

.uap-thought-images-2 {
    grid-template-columns: repeat(2, 1fr);
}

.uap-thought-images-3 {
    grid-template-columns: repeat(3, 1fr);
}

.uap-thought-images-4 {
    grid-template-columns: repeat(2, 1fr);
}

.uap-thought-images-5,
.uap-thought-images-6 {
    grid-template-columns: repeat(3, 1fr);
}

.uap-thought-images-7,
.uap-thought-images-8,
.uap-thought-images-9 {
    grid-template-columns: repeat(3, 1fr);
}

.uap-thought-image {
    display: block;
    aspect-ratio: 1;
    overflow: hidden;
    background: #f3f4f6;
}

.uap-thought-images-1 .uap-thought-image {
    aspect-ratio: 16/9;
}

.uap-thought-images-2 .uap-thought-image {
    aspect-ratio: 1;
}

.uap-thought-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.uap-thought-image:hover img {
    transform: scale(1.05);
}

/* 想法交互按钮 - Twitter 风格 */
.uap-thought-actions {
    display: flex;
    gap: 32px;
    margin-top: 12px;
    padding-left: 10px;
    position: relative;
}

.uap-thought-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    background: transparent;
    border: none;
    color: #536471;
    font-size: 13px;
    cursor: pointer;
    transition: color 0.2s;
    text-decoration: none;
}

.uap-thought-action svg {
    width: 18px;
    height: 18px;
    transition: transform 0.2s;
}

.uap-thought-action:hover svg {
    transform: scale(1.1);
}

/* 评论 - 蓝色 */
.uap-thought-action.comment:hover {
    color: #1d9bf0;
}

/* 评论链接 - 确保链接可点击 */
a.uap-comment-link,
a.uap-thought-action.comment {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

a.uap-comment-link:hover,
a.uap-thought-action.comment:hover {
    color: #1d9bf0 !important;
    text-decoration: none !important;
}

/* 点赞 - 粉红色 */
.uap-thought-action.like:hover {
    color: #f91880;
}

.uap-thought-action.like.active {
    color: #f91880;
}

/* 收藏 - 黄色 */
.uap-thought-action.favorite:hover {
    color: #ffc107;
}

.uap-thought-action.favorite.active {
    color: #ffc107;
}

/* 加载状态 */
.uap-thought-action.loading {
    pointer-events: none;
    opacity: 0.6;
}

.uap-thought-action.loading svg {
    animation: uap-action-spin 0.8s linear infinite;
}

@keyframes uap-action-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* 加载更多 */
.uap-thought-stream-more,
.uap-thought-stream-end {
    text-align: center;
    padding: 20px;
}

.uap-load-more-btn {
    padding: 12px 32px;
    background: #fff;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 20px;
    color: var(--uap-primary, #2563eb);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-load-more-btn:hover {
    background: #eff6ff;
    border-color: var(--uap-primary, #2563eb);
}

.uap-load-more-btn.loading {
    opacity: 0.7;
    cursor: not-allowed;
}

.uap-thought-stream-end span {
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

/* 想法流响应式 */
@media (max-width: 640px) {
    .uap-thought-card {
        padding: 12px 16px;
    }

    .uap-thought-avatar img {
        width: 40px;
        height: 40px;
    }

    .uap-thought-content {
        padding-left: 8px;
    }

    .uap-thought-actions {
        padding-left: 8px;
        gap: 24px;
    }

    .uap-thought-images {
        border-radius: 12px;
    }
}

/* ==================== 想法详情页样式 ==================== */

.uap-thought-single-wrapper {
    max-width: 680px;
    margin: 0 auto;
    padding: 20px;
}

.uap-thought-single {
    background: #fff;
    border-radius: 16px;
    border: 1px solid var(--uap-border, #e5e7eb);
    overflow: hidden;
}

.uap-thought-single a {
    text-decoration: none;
}

.uap-thought-single-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 10;
}

.uap-thought-nav-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    color: var(--uap-text, #374151);
    text-decoration: none !important;
    border-radius: 20px;
    font-size: 14px;
    transition: background-color 0.2s, color 0.2s;
}

.uap-thought-nav-btn:hover {
    background: rgba(0, 0, 0, 0.05);
    color: var(--uap-primary, #2563eb);
}

.uap-thought-nav-btn svg {
    flex-shrink: 0;
}

.uap-thought-back-btn {
    margin-left: -8px;
}

.uap-thought-plaza-btn {
    margin-right: -8px;
}

.uap-thought-plaza-btn svg {
    width: 18px;
    height: 18px;
}

.uap-thought-single-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    flex: 1;
    text-align: center;
}

.uap-thought-single-content {
    padding: 16px 20px;
}

.uap-thought-single-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.uap-thought-single-avatar img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
}

.uap-thought-single-author-info {
    flex: 1;
    min-width: 0;
}

.uap-thought-single-author-name {
    display: block;
    font-weight: 700;
    font-size: 16px;
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-thought-single-author-name:hover {
    text-decoration: underline;
}

.uap-thought-single-author-username {
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

/* 关注按钮 */
.uap-thought-follow-btn {
    padding: 8px 20px;
    background: var(--uap-text, #374151);
    border: none;
    border-radius: 20px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-thought-follow-btn:hover {
    background: var(--uap-text-dark, #1f2937);
}

.uap-thought-follow-btn.following {
    background: transparent;
    border: 1px solid var(--uap-border, #e5e7eb);
    color: var(--uap-text, #374151);
}

.uap-thought-follow-btn.following .unfollow-text {
    display: none;
}

.uap-thought-follow-btn.following:hover {
    border-color: #ef4444;
    color: #ef4444;
    background: #fef2f2;
}

.uap-thought-follow-btn.following:hover .follow-text {
    display: none;
}

.uap-thought-follow-btn.following:hover .unfollow-text {
    display: inline;
}

.uap-thought-follow-btn.loading {
    opacity: 0.7;
    pointer-events: none;
}

.uap-thought-single-body {
    margin-bottom: 16px;
}

.uap-thought-single-text {
    font-size: 17px;
    line-height: 1.6;
    color: var(--uap-text, #374151);
    margin-bottom: 16px;
    word-wrap: break-word;
}

.uap-thought-single-images {
    display: grid;
    gap: 4px;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 16px;
}

.uap-thought-single-images.uap-thought-images-1 {
    grid-template-columns: 1fr;
}

.uap-thought-single-images.uap-thought-images-2,
.uap-thought-single-images.uap-thought-images-4 {
    grid-template-columns: repeat(2, 1fr);
}

.uap-thought-single-images.uap-thought-images-3 {
    grid-template-columns: repeat(3, 1fr);
}

.uap-thought-single-image {
    display: block;
    aspect-ratio: 1;
    overflow: hidden;
    cursor: pointer;
}

.uap-thought-single-images.uap-thought-images-1 .uap-thought-single-image {
    aspect-ratio: 16/9;
}

.uap-thought-single-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.uap-thought-single-image:hover img {
    transform: scale(1.02);
}

.uap-thought-single-time {
    color: var(--uap-text-light, #6b7280);
    font-size: 15px;
}

/* 操作按钮 - 左侧对齐 */
.uap-thought-single-actions {
    display: flex;
    gap: 32px;
    padding: 16px 0;
    border-top: 1px solid var(--uap-border, #e5e7eb);
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-thought-single-actions .uap-thought-action {
    padding: 8px 0;
}

/* 详情页操作栏中的更多按钮 */
.uap-thought-single-actions .uap-thought-more {
    margin-left: auto;
    position: relative;
}

.uap-thought-single-actions .uap-thought-more-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--uap-text-light, #6b7280);
    transition: all 0.2s;
    padding: 0;
}

.uap-thought-single-actions .uap-thought-more-btn:hover {
    background: rgba(29, 155, 240, 0.1);
    color: var(--uap-primary, #2563eb);
}

.uap-thought-single-actions .uap-thought-more-btn svg {
    width: 18px;
    height: 18px;
}

.uap-thought-single-comments {
    padding: 20px;
}

/* ==================== 创作中心想法卡片样式 ==================== */

.uap-creation-item.uap-creation-thought {
    display: block;
    padding: 0;
    border: none;
    overflow: visible;
}

.uap-creation-item.uap-creation-thought .uap-thought-card-wrapper {
    padding: 0;
}

.uap-creation-item.uap-creation-thought .uap-thought-actions {
    overflow: visible;
}

.uap-creation-item.uap-creation-thought:hover {
    background: #f8fafc;
}

/* --------------------------------------------------------------------------
   3.9 Lightbox - 图片预览
   -------------------------------------------------------------------------- */

/* ==================== 图片 Lightbox 样式 ==================== */

body.uap-lightbox-open {
    overflow: hidden;
}

.uap-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.95);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    touch-action: pan-y pinch-zoom;
}

.uap-lightbox-container {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.uap-lightbox-image {
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    user-select: none;
    -webkit-user-drag: none;
}

.uap-lightbox-close {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 52px;
    height: 52px;
    background: rgba(255, 255, 255, 0.15);
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    z-index: 10;
}

.uap-lightbox-close svg {
    width: 28px;
    height: 28px;
    stroke: #fff;
    stroke-width: 2.5;
}

.uap-lightbox-close:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: scale(1.05);
}

.uap-lightbox-prev,
.uap-lightbox-next {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    background: rgba(255, 255, 255, 0.15);
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    z-index: 10;
}

.uap-lightbox-prev svg,
.uap-lightbox-next svg {
    width: 32px;
    height: 32px;
    stroke: #fff;
    stroke-width: 2.5;
}

.uap-lightbox-prev {
    left: 20px;
}

.uap-lightbox-next {
    right: 20px;
}

.uap-lightbox-prev:hover,
.uap-lightbox-next:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: translateY(-50%) scale(1.05);
}

.uap-lightbox-counter {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 14px;
    background: rgba(0, 0, 0, 0.5);
    padding: 8px 16px;
    border-radius: 20px;
}

/* Lightbox 响应式 - 移动端隐藏左右按钮，使用滑动 */
@media (max-width: 768px) {

    .uap-lightbox-prev,
    .uap-lightbox-next {
        display: none;
    }

    .uap-lightbox-close {
        top: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }

    .uap-lightbox-close svg {
        width: 24px;
        height: 24px;
    }

    .uap-lightbox-counter {
        bottom: 16px;
    }

    /* 滑动提示 */
    .uap-lightbox-swipe-hint {
        position: fixed;
        bottom: 60px;
        left: 50%;
        transform: translateX(-50%);
        color: rgba(255, 255, 255, 0.6);
        font-size: 12px;
        display: flex;
        align-items: center;
        gap: 8px;
        animation: uap-hint-fade 3s ease forwards;
    }

    .uap-lightbox-swipe-hint svg {
        width: 20px;
        height: 20px;
    }

    @keyframes uap-hint-fade {

        0%,
        70% {
            opacity: 1;
        }

        100% {
            opacity: 0;
        }
    }
}

/* 想法详情页响应式 */
@media (max-width: 640px) {
    .uap-thought-single-wrapper {
        padding: 0;
    }

    .uap-thought-single {
        border-radius: 0;
        border-left: none;
        border-right: none;
    }

    .uap-thought-single-header {
        flex-wrap: wrap;
    }

    .uap-thought-follow-btn {
        padding: 6px 16px;
        font-size: 13px;
    }
}

/* ==================== 想法卡片分割线 ==================== */

/* 点赞/收藏列表中的想法卡片分割线 */
.uap-posts-grid .uap-thought-card {
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 0;
}

.uap-posts-grid .uap-thought-card:last-child {
    border-bottom: none;
}

/* ==================== 想法卡片用户简介样式 ==================== */

.uap-thought-meta {
    flex: 1;
    min-width: 0;
}

.uap-thought-meta-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    line-height: 1.4;
}

.uap-thought-bio {
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
    line-height: 1.5;
    margin-top: 2px;
    word-wrap: break-word;
    word-break: break-word;
}

/* ==================== 文章类型筛选按钮样式 ==================== */

.uap-post-type-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 0 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-type-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #f3f4f6;
    border: 1px solid transparent;
    border-radius: 20px;
    color: var(--uap-text, #374151);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
}

.uap-type-filter:hover {
    background: #e5e7eb;
    color: var(--uap-text, #374151);
}

.uap-type-filter.active {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-type-filter.active:hover {
    background: var(--uap-primary-dark, #1d4ed8);
    color: #fff;
}

.uap-type-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

.uap-type-filter.active .uap-type-count {
    background: rgba(255, 255, 255, 0.25);
}

/* 文章类型标签 */
.uap-post-type-badge {
    display: inline-block;
    padding: 2px 8px;
    background: #f3f4f6;
    border-radius: 4px;
    font-size: 11px;
    color: var(--uap-text-light, #6b7280);
}

/* ==================== 点赞/收藏列表优化 ==================== */

.uap-likes-list .uap-post-item,
.uap-favorites-list .uap-post-item {
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-likes-list .uap-post-item:last-child,
.uap-favorites-list .uap-post-item:last-child {
    border-bottom: none;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-post-type-filters {
        padding: 12px 0;
        gap: 6px;
    }

    .uap-type-filter {
        padding: 5px 12px;
        font-size: 12px;
    }

    .uap-thought-bio {
        font-size: 12px;
    }
}

/* 想法详情页用户简介 */
.uap-thought-single-author-bio {
    display: block;
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
    line-height: 1.5;
    margin-top: 2px;
    word-wrap: break-word;
    word-break: break-word;
}

/* ==================== 文章卡片样式（点赞/收藏列表） ==================== */

.uap-post-card {
    background: #fff;
    padding: 16px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-post-card:last-child {
    border-bottom: none;
}

.uap-post-card:hover {
    background: #f8fafc;
}

.uap-post-card-main {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.uap-post-card-thumb {
    flex-shrink: 0;
    width: 120px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
}

.uap-post-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.uap-post-card-thumb:hover img {
    transform: scale(1.05);
}

.uap-post-card-info {
    flex: 1;
    min-width: 0;
}

.uap-post-card-title {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

.uap-post-card-title a {
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-post-card-title a:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-post-card-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
}

.uap-post-card-type {
    display: inline-block;
    padding: 2px 8px;
    background: #f3f4f6;
    border-radius: 4px;
    font-size: 11px;
}

.uap-post-card-actions {
    display: flex;
    gap: 24px;
    padding-left: 0;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-post-card {
        padding: 12px 16px;
    }

    .uap-post-card-main {
        gap: 12px;
    }

    .uap-post-card-thumb {
        width: 100px;
        height: 66px;
    }

    .uap-post-card-title {
        font-size: 14px;
    }

    .uap-post-card-actions {
        gap: 16px;
    }
}

/* ==================== 创作中心文章卡片样式 ==================== */

.uap-creations-list {
    background: #fff;
    border-radius: 0;
    border: none;
    overflow: visible;
}

.uap-creation-item.uap-creation-post,
.uap-creation-item.uap-creation-thought {
    display: block;
    padding: 16px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 0;
}

.uap-creation-item.uap-creation-post:last-child,
.uap-creation-item.uap-creation-thought:last-child {
    border-bottom: none;
}

.uap-creation-item.uap-creation-post:hover,
.uap-creation-item.uap-creation-thought:hover {
    background: #f8fafc;
}

.uap-creation-item.uap-creation-post .uap-post-card-main {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.uap-creation-item.uap-creation-post .uap-post-card-thumb {
    flex-shrink: 0;
    width: 120px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
}

.uap-creation-item.uap-creation-post .uap-post-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.uap-creation-item.uap-creation-post .uap-post-card-thumb:hover img {
    transform: scale(1.05);
}

.uap-creation-item.uap-creation-post .uap-post-card-info {
    flex: 1;
    min-width: 0;
}

.uap-creation-item.uap-creation-post .uap-post-card-title {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

.uap-creation-item.uap-creation-post .uap-post-card-title a {
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-creation-item.uap-creation-post .uap-post-card-title a:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-creation-item.uap-creation-post .uap-post-card-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
}

.uap-creation-item.uap-creation-post .uap-post-card-status {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
}

.uap-creation-item.uap-creation-post .uap-post-card-status.uap-status-warning {
    background: #fef3c7;
    color: #d97706;
}

.uap-creation-item.uap-creation-post .uap-post-card-status.uap-status-info {
    background: #dbeafe;
    color: #2563eb;
}

.uap-creation-item.uap-creation-post .uap-post-card-status.uap-status-error {
    background: #fee2e2;
    color: #dc2626;
}

.uap-creation-item.uap-creation-post .uap-post-card-rejection {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fef2f2;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.5;
}

.uap-creation-item.uap-creation-post .uap-post-card-rejection .uap-rejection-label {
    color: #dc2626;
    font-weight: 500;
}

.uap-creation-item.uap-creation-post .uap-post-card-rejection .uap-rejection-text {
    color: #7f1d1d;
}

.uap-creation-item.uap-creation-post .uap-post-card-manage {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-left: auto;
}

.uap-creation-item.uap-creation-post .uap-post-card-actions {
    display: flex;
    gap: 24px;
}

/* 移动端适配 */
@media (max-width: 640px) {

    .uap-creation-item.uap-creation-post,
    .uap-creation-item.uap-creation-thought {
        padding: 12px 16px;
    }

    .uap-creation-item.uap-creation-post .uap-post-card-main {
        gap: 12px;
    }

    .uap-creation-item.uap-creation-post .uap-post-card-thumb {
        width: 100px;
        height: 66px;
    }

    .uap-creation-item.uap-creation-post .uap-post-card-title {
        font-size: 14px;
    }

    .uap-creation-item.uap-creation-post .uap-post-card-actions {
        gap: 16px;
    }
}

/* ==================== 想法编辑弹窗 ==================== */

.uap-thought-edit-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.uap-thought-edit-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.uap-thought-edit-content {
    position: relative;
    width: 100%;
    max-width: 500px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.uap-thought-edit-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-thought-edit-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-thought-edit-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    font-size: 24px;
    color: var(--uap-text-light, #6b7280);
    cursor: pointer;
    transition: all 0.2s;
}

.uap-thought-edit-close:hover {
    background: #f3f4f6;
    color: var(--uap-text, #374151);
}

.uap-thought-edit-body {
    padding: 20px;
}

.uap-thought-edit-textarea {
    width: 100%;
    min-height: 120px;
    padding: 12px;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 8px;
    font-size: 15px;
    line-height: 1.6;
    resize: vertical;
    transition: border-color 0.2s;
}

.uap-thought-edit-textarea:focus {
    outline: none;
    border-color: var(--uap-primary, #2563eb);
}

.uap-thought-edit-counter {
    text-align: right;
    font-size: 12px;
    color: var(--uap-text-light, #6b7280);
    margin-top: 8px;
}

.uap-thought-edit-images {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.uap-thought-edit-image {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
}

.uap-thought-edit-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-thought-edit-image-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.6);
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-thought-edit-image-remove:hover {
    background: rgba(0, 0, 0, 0.8);
}

.uap-thought-edit-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 20px;
    border-top: 1px solid var(--uap-border, #e5e7eb);
    background: #f9fafb;
}

/* 移动端适配 */
@media (max-width: 640px) {
    .uap-thought-edit-modal {
        padding: 0;
        align-items: flex-end;
    }

    .uap-thought-edit-content {
        max-width: 100%;
        border-radius: 16px 16px 0 0;
        max-height: 80vh;
        overflow-y: auto;
    }
}


/* ==================== 通知中心样式 ==================== */

.uap-notifications-container {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.uap-notifications-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-notifications-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-mark-all-read-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: transparent;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 20px;
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-mark-all-read-btn:hover:not(:disabled) {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: var(--uap-text, #374151);
}

.uap-mark-all-read-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.uap-mark-all-read-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* 通知分类 Tab */
.uap-notifications-tabs {
    display: flex;
    gap: 4px;
    padding: 12px 24px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    background: #f9fafb;
}

.uap-notification-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: transparent;
    border: none;
    border-radius: 20px;
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-notification-tab:hover {
    background: #fff;
    color: var(--uap-text, #374151);
}

.uap-notification-tab.active {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: #ef4444;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
}

.uap-notification-tab.active .uap-tab-badge {
    background: rgba(255, 255, 255, 0.3);
}

/* 通知列表 */
.uap-notifications-list {
    min-height: 200px;
}

.uap-notification-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 24px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-notification-item:last-child {
    border-bottom: none;
}

.uap-notification-item:hover {
    background: #f9fafb;
}

.uap-notification-item.unread {
    background: #f0f7ff;
}

.uap-notification-item.unread:hover {
    background: #e8f2ff;
}

/* 未读标记点 */
.uap-notification-dot {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background: var(--uap-primary, #2563eb);
    border-radius: 50%;
}

/* 通知头像 */
.uap-notification-avatar {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
}

.uap-notification-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-notification-avatar-system {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

.uap-notification-avatar-system svg {
    width: 22px;
    height: 22px;
}

/* 通知内容 */
.uap-notification-content {
    flex: 1;
    min-width: 0;
}

.uap-notification-text {
    font-size: 14px;
    line-height: 1.5;
    color: var(--uap-text, #374151);
    word-wrap: break-word;
}

.uap-notification-actor {
    font-weight: 600;
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-notification-actor:hover {
    color: var(--uap-primary, #2563eb);
    text-decoration: underline;
}

.uap-notification-action {
    color: var(--uap-text-light, #6b7280);
}

.uap-notification-object {
    color: var(--uap-text, #374151);
    text-decoration: none;
    font-weight: 500;
}

.uap-notification-object:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-notification-extra {
    display: block;
    margin-top: 4px;
    padding: 8px 12px;
    background: #f3f4f6;
    border-radius: 8px;
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
}

.uap-notification-time {
    margin-top: 4px;
    font-size: 12px;
    color: #9ca3af;
}

/* 空状态 */
.uap-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #9ca3af;
    text-align: center;
}

.uap-empty-icon {
    margin-bottom: 16px;
    opacity: 0.5;
}

.uap-empty-icon svg {
    width: 48px;
    height: 48px;
}

.uap-empty-state p {
    margin: 0;
    font-size: 14px;
}

/* 加载状态 */
.uap-notifications-list .uap-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

/* 分页 */
.uap-notifications-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 24px;
    border-top: 1px solid var(--uap-border, #e5e7eb);
}

.uap-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 10px;
    background: #fff;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 6px;
    color: var(--uap-text, #374151);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-page-btn:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.uap-page-current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 10px;
    background: var(--uap-primary, #2563eb);
    border-radius: 6px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
}

.uap-page-dots {
    color: var(--uap-text-light, #6b7280);
    font-size: 13px;
}

/* 通知中心响应式 */
@media (max-width: 640px) {
    .uap-notifications-header {
        padding: 16px;
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
    }

    .uap-mark-all-read-btn {
        width: 100%;
        justify-content: center;
    }

    .uap-notifications-tabs {
        padding: 10px 16px;
        gap: 2px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .uap-notification-tab {
        padding: 6px 12px;
        font-size: 13px;
        white-space: nowrap;
    }

    .uap-notification-item {
        padding: 14px 16px;
        gap: 10px;
    }

    .uap-notification-dot {
        left: 6px;
    }

    .uap-notification-avatar {
        width: 40px;
        height: 40px;
    }

    .uap-notification-text {
        font-size: 13px;
    }

    .uap-notifications-pagination {
        padding: 12px 16px;
    }

    .uap-empty-state {
        padding: 40px 16px;
    }
}

/* ==================== 顶部导航通知图标 ==================== */

.uap-header-notification {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.uap-header-notification-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: var(--uap-text, #374151);
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.uap-header-notification-btn:hover {
    background: #f3f4f6;
    color: var(--uap-primary, #2563eb);
}

.uap-header-notification-btn svg {
    width: 22px;
    height: 22px;
}

.uap-header-notification-badge {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: #ef4444;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
}

.uap-header-notification-badge:empty {
    display: none;
}


/* ==================== 举报模态框样式 ==================== */

.uap-report-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.uap-report-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.uap-report-content {
    position: relative;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.uap-report-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-report-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-report-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    font-size: 24px;
    color: var(--uap-text-light, #6b7280);
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
    line-height: 1;
}

.uap-report-close:hover {
    background: #f3f4f6;
    color: var(--uap-text, #374151);
}

.uap-report-body {
    padding: 20px;
}

.uap-report-section {
    margin-bottom: 20px;
}

.uap-report-section:last-child {
    margin-bottom: 0;
}

.uap-report-label {
    display: block;
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-report-reasons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.uap-report-reason-item {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.uap-report-reason-item input[type="radio"] {
    display: none;
}

.uap-report-reason-item span {
    display: inline-block;
    padding: 8px 14px;
    background: #f3f4f6;
    border: 2px solid transparent;
    border-radius: 20px;
    font-size: 13px;
    color: var(--uap-text, #374151);
    transition: all 0.2s;
}

.uap-report-reason-item:hover span {
    background: #e5e7eb;
}

.uap-report-reason-item input[type="radio"]:checked+span {
    background: #eff6ff;
    border-color: var(--uap-primary, #2563eb);
    color: var(--uap-primary, #2563eb);
}

.uap-report-body textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.uap-report-body textarea:focus {
    outline: none;
    border-color: var(--uap-primary, #2563eb);
}

.uap-report-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 20px;
    border-top: 1px solid var(--uap-border, #e5e7eb);
    background: #f9fafb;
}

/* 举报模态框响应式 */
@media (max-width: 640px) {
    .uap-report-modal {
        padding: 0;
        align-items: flex-end;
    }

    .uap-report-content {
        max-width: 100%;
        border-radius: 16px 16px 0 0;
        max-height: 80vh;
        overflow-y: auto;
    }

    .uap-report-reasons {
        gap: 6px;
    }

    .uap-report-reason-item span {
        padding: 6px 12px;
        font-size: 12px;
    }
}

/* 模态框打开时禁止滚动 */
body.uap-modal-open {
    overflow: hidden;
}


/* ==========================================================================
   6.8 Messages - 私信系统
   ========================================================================== */

/* ==================== 私信按钮 ==================== */

.uap-message-btn,
.uap-message-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: transparent;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 20px;
    color: var(--uap-text, #374151);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-message-btn {
    padding: 6px 14px;
}

.uap-message-btn-small {
    padding: 4px 10px;
    font-size: 12px;
}

.uap-message-icon-btn {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
}

.uap-message-btn:hover,
.uap-message-icon-btn:hover {
    background: #f3f4f6 !important;
    border-color: #d1d5db !important;
    color: var(--uap-primary, #2563eb) !important;
}

.uap-message-btn:focus,
.uap-message-icon-btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2) !important;
}

.uap-message-btn svg,
.uap-message-icon-btn svg {
    flex-shrink: 0;
}

/* ==================== 聊天模态框 ==================== */

.uap-chat-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.5);
}

.uap-chat-modal.show {
    display: flex;
}

.uap-chat-modal-content {
    position: relative;
    width: 100%;
    max-width: 480px;
    height: 600px;
    max-height: 80vh;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* 聊天头部 */
.uap-chat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    background: #fff;
}

.uap-chat-user-info {
    display: flex;
    align-items: center;
    gap: 10px;
}

.uap-chat-user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-chat-user-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-chat-close {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: var(--uap-text-light, #6b7280);
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
}

.uap-chat-close:hover {
    background: #f3f4f6;
    color: var(--uap-text, #374151);
}

/* 聊天主体 */
.uap-chat-body {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    background: #f9fafb;
}

.uap-chat-loading,
.uap-chat-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

.uap-chat-load-more {
    text-align: center;
    margin-bottom: 16px;
}

.uap-chat-load-more-btn {
    padding: 6px 16px;
    background: #fff;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 16px;
    color: var(--uap-text-light, #6b7280);
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-chat-load-more-btn:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
}

/* 消息列表 */
.uap-chat-messages {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* 单条消息 */
.uap-chat-message {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    max-width: 80%;
}

.uap-chat-message.sent {
    margin-left: auto;
    flex-direction: row-reverse;
}

.uap-chat-message.received {
    margin-right: auto;
}

.uap-chat-msg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-chat-msg-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-chat-message.sent .uap-chat-msg-content {
    align-items: flex-end;
}

.uap-chat-msg-bubble {
    padding: 10px 14px;
    border-radius: 18px;
    font-size: 14px;
    line-height: 1.5;
    word-wrap: break-word;
    word-break: break-word;
}

.uap-chat-message.sent .uap-chat-msg-bubble {
    background: var(--uap-primary, #2563eb);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.uap-chat-message.received .uap-chat-msg-bubble {
    background: #fff;
    color: var(--uap-text, #374151);
    border-bottom-left-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.uap-chat-msg-time {
    font-size: 11px;
    color: #9ca3af;
    padding: 0 4px;
}

.uap-chat-recalled {
    font-style: italic;
    color: #9ca3af;
}

/* 聊天底部输入区 */
.uap-chat-footer {
    padding: 12px 16px;
    border-top: 1px solid var(--uap-border, #e5e7eb);
    background: #fff;
}

.uap-chat-input-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.uap-chat-input {
    width: 100%;
    min-height: 60px;
    max-height: 120px;
    padding: 10px 12px;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.5;
    resize: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.uap-chat-input:focus {
    outline: none;
    border-color: var(--uap-primary, #2563eb);
}

.uap-chat-input-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.uap-chat-char-count {
    font-size: 12px;
    color: #9ca3af;
}

.uap-chat-send-btn {
    padding: 8px 20px;
    background: var(--uap-primary, #2563eb);
    border: none;
    border-radius: 20px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-chat-send-btn:hover:not(:disabled) {
    background: var(--uap-primary-hover, #1d4ed8);
}

.uap-chat-send-btn:disabled {
    background: #d1d5db;
    cursor: not-allowed;
}

/* 消息右键菜单 */
.uap-chat-msg-menu {
    position: fixed;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    padding: 4px;
    z-index: 100001;
}

.uap-chat-recall-btn {
    display: block;
    width: 100%;
    padding: 8px 16px;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: var(--uap-text, #374151);
    font-size: 13px;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-chat-recall-btn:hover {
    background: #f3f4f6;
}

/* ==================== 会话列表（用户中心内） ==================== */

.uap-messages-container {
    display: flex;
    height: 500px;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.uap-conversations-panel {
    width: 280px;
    border-right: 1px solid var(--uap-border, #e5e7eb);
    display: flex;
    flex-direction: column;
}

.uap-conversations-header {
    padding: 16px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
}

.uap-conversations-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-conversations-list {
    flex: 1;
    overflow-y: auto;
}

.uap-conversation-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s;
    position: relative;
}

.uap-conversation-item:hover {
    background: #f9fafb;
}

.uap-conversation-item.active {
    background: #eff6ff;
}

.uap-conv-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-conv-info {
    flex: 1;
    min-width: 0;
}

.uap-conv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}

.uap-conv-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--uap-text, #374151);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-conv-time {
    font-size: 11px;
    color: #9ca3af;
    flex-shrink: 0;
}

.uap-conv-preview {
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-conv-unread {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: #ef4444;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 聊天区域（用户中心内） */
.uap-messages-chat {
    flex: 1;
    display: none;
    flex-direction: column;
}

.uap-messages-chat.active {
    display: flex;
}

.uap-messages-empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--uap-text-light, #6b7280);
    font-size: 14px;
}

/* ==================== 未读徽章 ==================== */

.uap-message-unread-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: #ef4444;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
}

/* ==================== 私信系统响应式 ==================== */

@media (max-width: 768px) {
    .uap-chat-modal {
        padding: 0;
    }

    .uap-chat-modal-content {
        max-width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
    }

    .uap-messages-container {
        flex-direction: column;
        height: auto;
    }

    .uap-conversations-panel {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid var(--uap-border, #e5e7eb);
    }

    .uap-conversations-list {
        max-height: 300px;
    }
}

@media (max-width: 480px) {
    .uap-chat-message {
        max-width: 85%;
    }

    .uap-chat-msg-bubble {
        padding: 8px 12px;
        font-size: 13px;
    }

    .uap-chat-input {
        min-height: 50px;
    }
}


/* ==================== 头像下方按钮组 ==================== */

.uap-uc-avatar-actions {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    justify-content: center;
}

.uap-uc-avatar-actions .uap-avatar-follow-btn,
.uap-uc-avatar-actions .uap-message-icon-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.uap-uc-avatar-actions .uap-avatar-follow-btn {
    background: var(--uap-primary, #2563eb);
    border: 2px solid #fff;
    color: #fff;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.4);
}

.uap-uc-avatar-actions .uap-avatar-follow-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.5);
}

.uap-uc-avatar-actions .uap-avatar-follow-btn.following {
    background: #10b981;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.4);
}

.uap-uc-avatar-actions .uap-message-icon-btn {
    background: #fff;
    border: 2px solid var(--uap-border, #e5e7eb);
    color: var(--uap-text, #374151);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.uap-uc-avatar-actions .uap-message-icon-btn:hover {
    background: var(--uap-primary, #2563eb) !important;
    border-color: var(--uap-primary, #2563eb) !important;
    color: #fff !important;
    transform: scale(1.1);
}

.uap-uc-avatar-actions .uap-message-icon-btn svg {
    width: 14px;
    height: 14px;
}


/* ==========================================================================
   新版用户主页头部样式（Twitter/微博风格）
   ========================================================================== */

/* 头部容器 - 重置旧版样式 */
.uap-user-center .uap-profile-header {
    position: relative;
    display: block;
    min-height: auto;
    padding: 0;
    align-items: initial;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
}

/* 封面图区域 */
.uap-user-center .uap-profile-cover {
    position: relative;
    height: 220px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    background-size: cover;
    background-position: center;
}

/* 更换封面按钮 */
.uap-user-center .uap-cover-edit-btn {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.2s;
    padding: 0;
    z-index: 10;
}

.uap-user-center .uap-profile-cover:hover .uap-cover-edit-btn {
    opacity: 1;
}

.uap-user-center .uap-cover-edit-btn:hover {
    background: rgba(0, 0, 0, 0.7);
    transform: scale(1.05);
}

/* 用户信息区域 - 重置旧版样式 */
.uap-user-center .uap-profile-info {
    position: relative;
    flex: initial;
    min-width: initial;
    padding: 0 24px 24px;
}

/* 头像容器（溢出到封面区）- 重置旧版样式 */
.uap-user-center .uap-profile-avatar-wrapper {
    position: absolute;
    top: -50px;
    left: 24px;
}

.uap-user-center .uap-profile-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 4px solid #fff;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    flex-shrink: initial;
}

.uap-user-center .uap-profile-avatar img,
.uap-user-center .uap-profile-avatar .avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: none;
    box-shadow: none;
}

/* 更换头像按钮 */
.uap-user-center .uap-avatar-edit-btn {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 28px;
    height: 28px;
    background: var(--uap-primary, #2563eb);
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.2s;
    padding: 0;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3);
}

.uap-user-center .uap-profile-avatar-wrapper:hover .uap-avatar-edit-btn {
    opacity: 1;
}

.uap-user-center .uap-avatar-edit-btn:hover {
    background: var(--uap-primary-hover, #1d4ed8);
    transform: scale(1.1);
}

/* 操作按钮区（右侧） */
.uap-user-center .uap-profile-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding-top: 16px;
    min-height: 52px;
}

/* 操作按钮通用样式 */
.uap-user-center .uap-profile-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    border: none;
}

.uap-user-center .uap-profile-action-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* 主要按钮（关注） */
.uap-user-center .uap-profile-action-btn.uap-btn-primary {
    background: var(--uap-primary, #2563eb);
    color: #fff;
    border: 1px solid var(--uap-primary, #2563eb);
}

.uap-user-center .uap-profile-action-btn.uap-btn-primary:hover {
    background: var(--uap-primary-hover, #1d4ed8) !important;
    border-color: var(--uap-primary-hover, #1d4ed8) !important;
}

.uap-user-center .uap-profile-action-btn.uap-btn-primary:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2) !important;
}

/* 已关注状态 */
.uap-user-center .uap-profile-action-btn.uap-follow-btn.following {
    background: #f3f4f6;
    color: var(--uap-text, #374151);
    border-color: var(--uap-border, #e5e7eb);
}

.uap-user-center .uap-profile-action-btn.uap-follow-btn.following:hover {
    background: #fee2e2 !important;
    color: #dc2626 !important;
    border-color: #fecaca !important;
}

.uap-user-center .uap-profile-action-btn.uap-follow-btn.following:hover .uap-follow-btn-text::after {
    content: '取消关注';
}

.uap-user-center .uap-profile-action-btn.uap-follow-btn.following:hover .uap-follow-btn-text {
    font-size: 0;
}

.uap-user-center .uap-profile-action-btn.uap-follow-btn.following:hover .uap-follow-btn-text::after {
    font-size: 14px;
}

/* 互相关注状态 */
.uap-user-center .uap-profile-action-btn.uap-follow-btn.mutual {
    background: #ecfdf5;
    color: #059669;
    border-color: #a7f3d0;
}

.uap-user-center .uap-profile-action-btn.uap-follow-btn.mutual:hover {
    background: #fee2e2 !important;
    color: #dc2626 !important;
    border-color: #fecaca !important;
}

/* 次要按钮（私信、编辑资料） */
.uap-user-center .uap-profile-action-btn.uap-btn-outline {
    background: #fff;
    color: var(--uap-text, #374151);
    border: 1px solid var(--uap-border, #e5e7eb);
}

.uap-user-center .uap-profile-action-btn.uap-btn-outline:hover {
    background: #f9fafb !important;
    border-color: #d1d5db !important;
    color: var(--uap-primary, #2563eb) !important;
}

.uap-user-center .uap-profile-action-btn.uap-btn-outline:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

/* 用户详情区 */
.uap-user-center .uap-profile-details {
    padding-top: 16px;
    padding-left: 0;
    /* 头像宽度 + 间距 */
    min-height: 80px;
}

/* 用户名行 */
.uap-user-center .uap-profile-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

/* 用户名 - 重置旧版样式 */
.uap-user-center .uap-profile-name {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: var(--uap-text, #374151);
    line-height: 1.3;
    text-shadow: none;
    display: inline;
    flex-wrap: initial;
    gap: initial;
    justify-content: initial;
}

/* 徽章 - 重置旧版样式 */
.uap-user-center .uap-profile-badges {
    display: inline-flex;
    gap: 4px;
    align-items: center;
}

.uap-user-center .uap-profile-badge {
    display: inline-flex;
}

.uap-user-center .uap-profile-badge-icon {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

.uap-user-center .uap-profile-badge-icon svg {
    width: 12px;
    height: 12px;
    color: #fff;
}

.uap-user-center .uap-profile-badges.icon-style-icon-only .uap-profile-badge-icon {
    background: transparent !important;
    width: 18px;
    height: 18px;
}

.uap-user-center .uap-profile-badges.icon-style-icon-only .uap-profile-badge-icon svg {
    width: 18px;
    height: 18px;
    color: var(--badge-color);
    filter: none;
}

/* 个人简介 - 重置旧版样式 */
.uap-user-center .uap-profile-bio {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--uap-text, #374151);
    max-width: 600px;
}

.uap-user-center .uap-profile-bio .uap-bio-placeholder {
    color: var(--uap-text-light, #9ca3af);
    font-style: italic;
}

/* 统计数据 - 重置旧版样式 */
.uap-user-center .uap-profile-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 0;
    background: transparent;
    border-bottom: none;
    justify-content: flex-start;
}

.uap-user-center .uap-profile-stat {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 4px;
    text-decoration: none;
    color: var(--uap-text, #374151);
    transition: color 0.2s;
    padding: 0;
    background: transparent;
    border-radius: 0;
    min-width: auto;
}

.uap-user-center .uap-profile-stat.uap-stat-clickable:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-user-center .uap-profile-stat .uap-stat-value {
    font-size: 16px;
    font-weight: 600;
    color: inherit;
}

.uap-user-center .uap-profile-stat .uap-stat-label {
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
}

.uap-user-center .uap-profile-stat.uap-stat-clickable:hover .uap-stat-label {
    color: var(--uap-primary, #2563eb);
}

/* ==================== 新版头部响应式 ==================== */

@media (max-width: 768px) {
    .uap-user-center .uap-profile-cover {
        height: 140px;
    }

    /* 移动端封面编辑按钮始终显示 */
    .uap-user-center .uap-cover-edit-btn {
        opacity: 1;
        width: 32px;
        height: 32px;
        top: 10px;
        right: 10px;
    }

    .uap-user-center .uap-profile-info {
        padding: 0 16px 20px;
    }

    .uap-user-center .uap-profile-avatar-wrapper {
        position: relative;
        top: -40px;
        left: 0;
        margin-bottom: -24px;
        cursor: pointer;
    }

    /* 移动端隐藏编辑按钮，直接点击头像修改 */
    .uap-user-center .uap-avatar-edit-btn {
        display: none !important;
    }

    .uap-user-center .uap-profile-avatar {
        width: 80px;
        height: 80px;
        border-width: 3px;
    }

    .uap-user-center .uap-profile-actions {
        position: absolute;
        top: 16px;
        right: 16px;
        padding-top: 0;
        min-height: auto;
    }

    .uap-user-center .uap-profile-action-btn {
        padding: 6px 14px;
        font-size: 13px;
    }

    .uap-user-center .uap-profile-action-btn span {
        display: none;
    }

    .uap-user-center .uap-profile-action-btn svg {
        margin: 0;
    }

    .uap-user-center .uap-profile-details {
        padding-left: 0;
        padding-top: 8px;
    }

    .uap-user-center .uap-profile-name {
        font-size: 18px;
    }

    .uap-user-center .uap-profile-bio {
        font-size: 13px;
        margin-bottom: 12px;
    }

    .uap-user-center .uap-profile-stats {
        gap: 16px;
    }

    .uap-user-center .uap-profile-stat .uap-stat-value {
        font-size: 15px;
    }

    .uap-user-center .uap-profile-stat .uap-stat-label {
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .uap-user-center .uap-profile-cover {
        height: 120px;
    }

    .uap-user-center .uap-profile-avatar {
        width: 72px;
        height: 72px;
    }

    .uap-user-center .uap-profile-avatar-wrapper {
        top: -36px;
        margin-bottom: -20px;
    }

    .uap-user-center .uap-profile-actions {
        gap: 8px;
    }

    .uap-user-center .uap-profile-action-btn {
        padding: 6px 12px;
    }

    .uap-user-center .uap-profile-stats {
        gap: 12px;
    }
}


/* ==========================================================================
   动态页面（Overview）样式
   ========================================================================== */

/* 动态页面统计数据 */
.uap-overview .uap-profile-stats {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 20px;
    background: #f9fafb;
    border-bottom: 1px solid #f0f0f0;
    flex-wrap: wrap;
}

.uap-overview .uap-profile-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 24px;
    background: #fff;
    border-radius: 10px;
    min-width: 80px;
}

.uap-overview .uap-profile-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #1f2937;
    line-height: 1.2;
}

.uap-overview .uap-profile-stat-label {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
}

/* 内容区块 */
.uap-overview .uap-profile-section {
    padding: 24px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-overview .uap-profile-section:last-child {
    border-bottom: none;
}

.uap-overview .uap-profile-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.uap-overview .uap-profile-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
}

.uap-overview .uap-profile-section-title svg {
    color: #6b7280;
}

.uap-overview .uap-profile-badge-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    background: var(--uap-primary);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    border-radius: 11px;
}

/* 徽章墙 */
.uap-overview .uap-profile-badges-wall {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.uap-overview .uap-profile-badge-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #f9fafb;
    border-radius: 10px;
    transition: all 0.2s ease;
    cursor: default;
}

.uap-overview .uap-profile-badge-item:hover {
    background: #f3f4f6;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.uap-overview .uap-profile-badge-item .uap-profile-badge-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.uap-overview .uap-profile-badge-item .uap-profile-badge-icon svg {
    width: 18px;
    height: 18px;
    color: #fff;
}

.uap-overview .uap-profile-badge-name {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

/* 徽章墙仅图标样式 */
.uap-overview .uap-profile-badges-wall.icon-style-icon-only .uap-profile-badge-item .uap-profile-badge-icon {
    background: transparent !important;
    box-shadow: none;
}

.uap-overview .uap-profile-badges-wall.icon-style-icon-only .uap-profile-badge-item .uap-profile-badge-icon svg {
    width: 28px;
    height: 28px;
    color: var(--badge-color, #6366f1);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15));
}

/* 最近文章 */
.uap-overview .uap-profile-posts {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.uap-overview .uap-profile-post-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    background: #f9fafb;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.uap-overview .uap-profile-post-item:hover {
    background: #f3f4f6;
    text-decoration: none;
}

.uap-overview .uap-profile-post-thumb {
    flex-shrink: 0;
    width: 64px;
    height: 48px;
    border-radius: 6px;
    overflow: hidden;
}

.uap-overview .uap-profile-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-overview .uap-profile-post-info {
    flex: 1;
    min-width: 0;
}

.uap-overview .uap-profile-post-title {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uap-overview .uap-profile-post-item:hover .uap-profile-post-title {
    color: var(--uap-primary);
}

.uap-overview .uap-profile-post-date {
    font-size: 12px;
    color: #9ca3af;
}

/* 最近评论 */
.uap-overview .uap-profile-comments {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.uap-overview .uap-profile-comment-item {
    padding: 14px 16px;
    background: #f9fafb;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.uap-overview .uap-profile-comment-item:hover {
    background: #f3f4f6;
}

.uap-overview .uap-profile-comment-content {
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
    margin-bottom: 10px;
}

.uap-overview .uap-profile-comment-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.uap-overview .uap-profile-comment-post {
    font-size: 13px;
    color: var(--uap-primary);
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.uap-overview .uap-profile-comment-post:hover {
    text-decoration: underline;
}

.uap-overview .uap-profile-comment-date {
    font-size: 12px;
    color: #9ca3af;
    flex-shrink: 0;
}

/* 动态页面响应式 */
@media (max-width: 640px) {
    .uap-overview .uap-profile-stats {
        padding: 16px;
        gap: 6px;
    }

    .uap-overview .uap-profile-stat {
        padding: 10px 16px;
        min-width: 70px;
    }

    .uap-overview .uap-profile-stat-value {
        font-size: 18px;
    }

    .uap-overview .uap-profile-section {
        padding: 16px;
    }

    .uap-overview .uap-profile-badges-wall {
        gap: 8px;
    }

    .uap-overview .uap-profile-badge-item {
        padding: 8px 12px;
    }

    .uap-overview .uap-profile-badge-item .uap-profile-badge-icon {
        width: 28px;
        height: 28px;
    }

    .uap-overview .uap-profile-badge-name {
        font-size: 12px;
    }

    .uap-overview .uap-profile-post-thumb {
        width: 56px;
        height: 42px;
    }
}


/* ==========================================================================
   按钮加载状态
   ========================================================================== */

/* 新版头部关注按钮加载状态 */
.uap-user-center .uap-profile-action-btn.loading {
    pointer-events: none;
    opacity: 0.7;
}

.uap-user-center .uap-profile-action-btn.loading svg {
    animation: uap-spin 0.8s linear infinite;
}


/* ========================================
   私信系统样式
   ======================================== */

/* 私信按钮 */
.uap-message-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-message-btn:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-message-btn svg {
    flex-shrink: 0;
}

.uap-message-btn-small {
    padding: 6px 12px;
    font-size: 13px;
}

.uap-message-btn-small svg {
    width: 14px;
    height: 14px;
}

/* 私信图标按钮 */
.uap-message-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-message-icon-btn:hover {
    background: #e5e7eb;
    color: #374151;
}

/* 私信页面容器 */
.uap-messages-container {
    display: flex;
    height: 600px;
    max-height: calc(100vh - 300px);
    min-height: 400px;
    background: #fff;
    border: 1px solid var(--uap-border, #e5e7eb);
    border-radius: 12px;
    overflow: hidden;
}

/* 左侧会话列表 */
.uap-messages-sidebar {
    width: 320px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--uap-border, #e5e7eb);
    background: #fafafa;
}

.uap-messages-sidebar-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    background: #fff;
}

.uap-messages-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
}

.uap-messages-unread-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: #ef4444;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    border-radius: 10px;
}

/* 会话列表 */
.uap-conversations-list {
    flex: 1;
    overflow-y: auto;
}

.uap-conversation-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    cursor: pointer;
    transition: background 0.15s;
    position: relative;
}

.uap-conversation-item:hover {
    background: #f3f4f6;
}

.uap-conversation-item.active {
    background: #e5e7eb;
}

.uap-conv-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-conv-info {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.uap-conv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}

.uap-conv-name {
    font-size: 15px;
    font-weight: 500;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-conv-time {
    font-size: 12px;
    color: #9ca3af;
    flex-shrink: 0;
}

.uap-conv-preview {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-conv-unread {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: #ef4444;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 右侧聊天区域 */
.uap-messages-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #fff;
}

/* 聊天占位符 */
.uap-chat-placeholder {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

.uap-chat-placeholder-icon {
    margin-bottom: 16px;
    opacity: 0.5;
}

.uap-chat-placeholder p {
    margin: 0;
    font-size: 15px;
}

/* 聊天头部 */
.uap-chat-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--uap-border, #e5e7eb);
    background: #fff;
}

.uap-chat-back-btn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: #6b7280;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s;
}

.uap-chat-back-btn:hover {
    background: #f3f4f6;
    color: #374151;
}

.uap-chat-user-link {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: inherit;
    flex: 1;
    min-width: 0;
}

.uap-chat-user-link:hover .uap-chat-user-name {
    color: var(--uap-primary, #2563eb);
}

.uap-chat-user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-chat-user-name {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    transition: color 0.15s;
}

.uap-chat-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.uap-chat-delete-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s;
}

.uap-chat-delete-btn:hover {
    background: #fef2f2;
    color: #ef4444;
}

/* 聊天内容区 */
.uap-chat-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

.uap-chat-load-more {
    text-align: center;
    margin-bottom: 16px;
}

.uap-chat-load-more-btn {
    padding: 8px 20px;
    background: #f3f4f6;
    color: #6b7280;
    border: none;
    border-radius: 20px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.15s;
}

.uap-chat-load-more-btn:hover {
    background: #e5e7eb;
    color: #374151;
}

.uap-chat-messages {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.uap-chat-loading,
.uap-chat-empty {
    text-align: center;
    color: #9ca3af;
    padding: 40px 20px;
    font-size: 14px;
}

/* 消息气泡 */
.uap-chat-message {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    max-width: 70%;
}

.uap-chat-message.sent {
    align-self: flex-end;
    flex-direction: row-reverse;
}

.uap-chat-message.received {
    align-self: flex-start;
}

.uap-chat-msg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-chat-msg-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.uap-chat-message.sent .uap-chat-msg-content {
    align-items: flex-end;
}

.uap-chat-msg-bubble {
    padding: 10px 14px;
    border-radius: 16px;
    font-size: 14px;
    line-height: 1.5;
    word-break: break-word;
}

.uap-chat-message.sent .uap-chat-msg-bubble {
    background: var(--uap-primary, #2563eb);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.uap-chat-message.received .uap-chat-msg-bubble {
    background: #f3f4f6;
    color: #1f2937;
    border-bottom-left-radius: 4px;
}

.uap-chat-msg-time {
    font-size: 11px;
    color: #9ca3af;
    padding: 0 4px;
}

/* 撤回的消息 */
.uap-chat-recalled {
    font-style: italic;
    color: #9ca3af;
}

.uap-chat-message.recalled .uap-chat-msg-bubble {
    background: #f9fafb !important;
    color: #9ca3af !important;
}

/* 消息右键菜单 */
.uap-chat-msg-menu {
    position: fixed;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    padding: 4px;
    z-index: 10000;
}

.uap-chat-msg-menu button {
    display: block;
    width: 100%;
    padding: 8px 16px;
    background: transparent;
    border: none;
    color: #374151;
    font-size: 14px;
    text-align: left;
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.15s;
}

.uap-chat-msg-menu button:hover {
    background: #f3f4f6;
}

/* 输入区 */
.uap-chat-footer {
    padding: 16px 20px;
    border-top: 1px solid var(--uap-border, #e5e7eb);
    background: #fff;
}

.uap-chat-input-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px;
    transition: border-color 0.15s;
}

.uap-chat-input-wrap:focus-within {
    border-color: var(--uap-primary, #2563eb);
}

.uap-chat-input {
    width: 100%;
    min-height: 60px;
    max-height: 120px;
    padding: 0;
    background: transparent;
    border: none;
    outline: none;
    font-size: 14px;
    line-height: 1.5;
    resize: none;
    color: #1f2937;
}

.uap-chat-input::placeholder {
    color: #9ca3af;
}

.uap-chat-input-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.uap-chat-char-count {
    font-size: 12px;
    color: #9ca3af;
}

.uap-chat-send-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: var(--uap-primary, #2563eb);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}

.uap-chat-send-btn:hover:not(:disabled) {
    background: var(--uap-primary-dark, #1d4ed8);
}

.uap-chat-send-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* 聊天模态框（从用户主页打开） */
.uap-chat-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s;
}

.uap-chat-modal.show {
    opacity: 1;
    visibility: visible;
}

.uap-chat-modal-content {
    width: 100%;
    max-width: 480px;
    max-height: 80vh;
    background: #fff;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(20px);
    transition: transform 0.2s;
}

.uap-chat-modal.show .uap-chat-modal-content {
    transform: translateY(0);
}

.uap-chat-modal .uap-chat-header {
    padding: 16px 20px;
}

.uap-chat-modal .uap-chat-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: #6b7280;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s;
    margin-left: auto;
}

.uap-chat-modal .uap-chat-close:hover {
    background: #f3f4f6;
    color: #374151;
}

.uap-chat-modal .uap-chat-body {
    height: 400px;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .uap-messages-container {
        height: calc(100vh - 200px);
        max-height: none;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }

    .uap-messages-sidebar {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        transition: transform 0.3s;
    }

    .uap-messages-chat {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        transform: translateX(100%);
        transition: transform 0.3s;
    }

    .uap-messages-chat.active {
        transform: translateX(0);
    }

    .uap-chat-back-btn {
        display: flex;
    }

    .uap-chat-message {
        max-width: 85%;
    }

    /* 模态框全屏 */
    .uap-chat-modal-content {
        max-width: none;
        max-height: none;
        height: 100%;
        border-radius: 0;
    }

    .uap-chat-modal .uap-chat-body {
        height: auto;
        flex: 1;
    }
}


/* ==================== 私信弹窗（全局） ==================== */
.uap-messages-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    padding: 20px;
}

.uap-messages-modal.show {
    display: flex;
}

.uap-messages-modal-content {
    width: 100%;
    max-width: 800px;
    max-height: 80vh;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}

.uap-messages-modal .uap-dm-container {
    display: flex;
    height: 636px;
    position: relative;
}

/* 会话列表侧边栏 */
.uap-messages-modal .uap-dm-sidebar {
    width: 280px;
    flex-shrink: 0;
    border-right: 1px solid #f0f0f0;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.uap-messages-modal .uap-dm-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-bottom: 1px solid #f0f0f0;
    background: #fafbfc;
}

.uap-messages-modal .uap-dm-sidebar-title {
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
}

.uap-messages-modal .uap-dm-sidebar-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50%;
    color: #6b7280 !important;
    cursor: pointer;
    transition: all 0.2s;
}

.uap-messages-modal .uap-dm-sidebar-close:hover {
    background: #f3f4f6 !important;
    color: #374151 !important;
}

.uap-messages-modal .uap-dm-conv-list {
    flex: 1;
    overflow-y: auto;
}

/* 会话列表滚动条样式 - 现代简约设计 */
.uap-messages-modal .uap-dm-conv-list::-webkit-scrollbar {
    width: 6px;
}

.uap-messages-modal .uap-dm-conv-list::-webkit-scrollbar-track {
    background: transparent;
}

.uap-messages-modal .uap-dm-conv-list::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.12);
    border-radius: 3px;
    transition: background 0.2s;
}

.uap-messages-modal .uap-dm-conv-list::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.2);
}

/* Firefox 滚动条样式 */
.uap-messages-modal .uap-dm-conv-list {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
}

/* 会话项 */
.uap-messages-modal .uap-dm-conv-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-messages-modal .uap-dm-conv-item:hover {
    background: #f9fafb;
}

.uap-messages-modal .uap-dm-conv-item.active {
    background: #f0f7ff;
}

.uap-messages-modal .uap-dm-conv-avatar-wrap {
    position: relative;
    flex-shrink: 0;
}

.uap-messages-modal .uap-dm-conv-avatar-wrap img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-messages-modal .uap-dm-conv-avatar-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: #ef4444;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
}

.uap-messages-modal .uap-dm-conv-info {
    flex: 1;
    min-width: 0;
}

.uap-messages-modal .uap-dm-conv-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}

.uap-messages-modal .uap-dm-conv-name {
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-messages-modal .uap-dm-conv-time {
    font-size: 11px;
    color: #9ca3af;
    flex-shrink: 0;
}

.uap-messages-modal .uap-dm-conv-preview {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-messages-modal .uap-dm-conv-empty,
.uap-messages-modal .uap-dm-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #9ca3af;
    font-size: 14px;
    text-align: center;
}

/* 顶部加载指示器（加载历史消息时） */
.uap-messages-modal .uap-dm-loading-top {
    padding: 12px 20px;
    font-size: 13px;
    background: rgba(0, 0, 0, 0.02);
    border-radius: 4px;
    margin-bottom: 10px;
}

/* 聊天区域 */
.uap-messages-modal .uap-dm-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.uap-messages-modal .uap-dm-empty {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

.uap-messages-modal .uap-dm-empty svg {
    opacity: 0.4;
    margin-bottom: 12px;
}

.uap-messages-modal .uap-dm-empty p {
    margin: 0;
    font-size: 14px;
}

.uap-messages-modal .uap-dm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    background: #fafbfc;
    min-height: 60px;
}

.uap-messages-modal .uap-dm-back-btn {
    display: none;
    align-items: center;
    gap: 6px;
    padding: 6px 12px !important;
    background: #f3f4f6 !important;
    border: none !important;
    border-radius: 20px;
    color: #6b7280 !important;
    font-size: 13px;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.2s;
}

.uap-messages-modal .uap-dm-back-btn svg {
    width: 16px;
    height: 16px;
}

.uap-messages-modal .uap-dm-back-btn:hover {
    background: #e5e7eb !important;
    color: #374151 !important;
}

.uap-messages-modal .uap-dm-header-center {
    flex: 1;
    display: flex;
    justify-content: center;
    min-width: 0;
}

.uap-messages-modal .uap-dm-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 20px;
    max-width: 200px;
}

.uap-messages-modal .uap-dm-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-messages-modal .uap-dm-name {
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-messages-modal .uap-dm-close-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0 !important;
    background: #f3f4f6 !important;
    border: none !important;
    border-radius: 50%;
    color: #6b7280 !important;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.2s;
}

.uap-messages-modal .uap-dm-close-btn:hover {
    background: #e5e7eb !important;
    color: #374151 !important;
}

/* 消息区域 */
.uap-messages-modal .uap-dm-body {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
}

/* 消息区域滚动条样式 - 现代简约设计 */
.uap-messages-modal .uap-dm-body::-webkit-scrollbar {
    width: 6px;
}

.uap-messages-modal .uap-dm-body::-webkit-scrollbar-track {
    background: transparent;
}

.uap-messages-modal .uap-dm-body::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 3px;
    transition: background 0.2s;
}

.uap-messages-modal .uap-dm-body::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* Firefox 滚动条样式 */
.uap-messages-modal .uap-dm-body {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.15) transparent;
}

.uap-messages-modal .uap-dm-load-more {
    text-align: center;
    margin-bottom: 16px;
}

.uap-messages-modal .uap-dm-load-more button {
    padding: 6px 16px;
    background: #f3f4f6 !important;
    border: none !important;
    border-radius: 16px;
    color: #6b7280 !important;
    font-size: 13px;
    cursor: pointer;
}

.uap-messages-modal .uap-dm-load-more button:hover {
    background: #e5e7eb !important;
}

/* 消息气泡 */
.uap-messages-modal .uap-dm-msg {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    margin-bottom: 12px;
    max-width: 75%;
}

.uap-messages-modal .uap-dm-msg.sent {
    margin-left: auto;
    flex-direction: row-reverse;
}

.uap-messages-modal .uap-dm-msg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.uap-messages-modal .uap-dm-msg-bubble {
    padding: 10px 14px;
    border-radius: 16px;
    font-size: 14px;
    line-height: 1.5;
    word-break: break-word;
}

.uap-messages-modal .uap-dm-msg.received .uap-dm-msg-bubble {
    background: #f3f4f6;
    color: #1f2937;
    border-bottom-left-radius: 4px;
}

.uap-messages-modal .uap-dm-msg.sent .uap-dm-msg-bubble {
    background: var(--uap-primary, #2563eb);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.uap-messages-modal .uap-dm-msg-time {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 4px;
}

.uap-messages-modal .uap-dm-msg.sent .uap-dm-msg-time {
    text-align: right;
}

.uap-messages-modal .uap-dm-recalled {
    font-style: italic;
    opacity: 0.7;
}

/* 输入区 - 优化版 */
.uap-messages-modal .uap-dm-footer {
    padding: 12px 16px 16px;
    border-top: 1px solid #e5e7eb;
    background: #fff;
}

.uap-messages-modal .uap-dm-input-container {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    background: #f7f8fa;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 6px 6px 6px 12px;
    transition: all 0.2s;
}

.uap-messages-modal .uap-dm-input-container:focus-within {
    background: #fff;
    border-color: var(--uap-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.uap-messages-modal .uap-dm-input-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.uap-messages-modal .uap-dm-input {
    width: 100%;
    min-height: 36px;
    max-height: 120px;
    padding: 8px 0;
    background: transparent;
    border: none;
    font-size: 14px;
    line-height: 1.5;
    resize: none;
    outline: none;
    color: #1f2937;
}

.uap-messages-modal .uap-dm-input::placeholder {
    color: #9ca3af;
}

.uap-messages-modal .uap-dm-input::-webkit-scrollbar {
    width: 4px;
}

.uap-messages-modal .uap-dm-input::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 2px;
}

.uap-messages-modal .uap-dm-bottom-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 4px;
    padding-top: 4px;
    opacity: 0;
    transition: opacity 0.2s;
}

.uap-messages-modal .uap-dm-input-container:focus-within .uap-dm-bottom-bar {
    opacity: 1;
}

.uap-messages-modal .uap-dm-tools {
    display: flex;
    align-items: center;
    gap: 2px;
}

.uap-messages-modal .uap-dm-counter {
    font-size: 12px;
    color: #9ca3af;
    white-space: nowrap;
}

.uap-messages-modal .uap-dm-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.uap-messages-modal .uap-dm-send-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0 !important;
    background: var(--uap-primary, #2563eb) !important;
    border: none !important;
    border-radius: 50%;
    color: #fff !important;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}

.uap-messages-modal .uap-dm-send-btn svg {
    width: 18px;
    height: 18px;
}

.uap-messages-modal .uap-dm-send-btn:disabled {
    background: #e5e7eb !important;
    color: #9ca3af !important;
    cursor: not-allowed;
}

.uap-messages-modal .uap-dm-send-btn:not(:disabled):hover {
    background: #1d4ed8 !important;
    transform: scale(1.05);
}

.uap-messages-modal .uap-dm-send-btn:not(:disabled):active {
    transform: scale(0.95);
}

/* 消息操作菜单（撤回/删除） */
.uap-dm-recall-menu,
.uap-dm-msg-menu {
    position: fixed;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 4px 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 100000;
    min-width: 80px;
}

.uap-dm-recall-menu button,
.uap-dm-msg-menu button {
    display: block;
    width: 100%;
    padding: 8px 16px;
    background: none !important;
    border: none !important;
    text-align: left;
    font-size: 13px;
    color: #374151 !important;
    cursor: pointer;
    white-space: nowrap;
}

.uap-dm-recall-menu button:hover,
.uap-dm-msg-menu button:hover {
    background: #f3f4f6 !important;
}

.uap-dm-msg-menu .uap-dm-menu-delete {
    color: #ef4444 !important;
}

.uap-dm-msg-menu .uap-dm-menu-delete:hover {
    background: #fef2f2 !important;
}

/* 发送按钮加载状态 */
.uap-dm-send-btn.sending {
    position: relative;
    pointer-events: none;
}

.uap-dm-send-btn.sending svg {
    opacity: 0;
}

.uap-dm-send-btn.sending::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: uap-spin 0.8s linear infinite;
}

/* 消息加载状态（撤回/删除中） */
.uap-dm-msg.msg-loading {
    opacity: 0.5;
    pointer-events: none;
    position: relative;
}

.uap-dm-msg.msg-loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #e5e7eb;
    border-top-color: var(--uap-primary, #2563eb);
    border-radius: 50%;
    animation: uap-spin 0.8s linear infinite;
}

.uap-dm-msg.sent.msg-loading::after {
    left: auto;
    right: 20px;
    margin-left: 0;
}

@keyframes uap-spin {
    to {
        transform: rotate(360deg);
    }
}

/* 移动端适配 - 优化版 */
@media (max-width: 768px) {
    .uap-messages-modal {
        padding: 0;
    }

    .uap-messages-modal-content {
        max-width: 100%;
        max-height: 100%;
        height: 100%;
        border-radius: 0;
    }

    .uap-messages-modal .uap-dm-container {
        height: 100%;
    }

    .uap-messages-modal .uap-dm-sidebar {
        width: 100%;
        position: absolute;
        inset: 0;
        z-index: 1;
        background: #fff;
    }

    .uap-messages-modal .uap-dm-chat {
        position: absolute;
        inset: 0;
        z-index: 2;
        background: #fff;
        transform: translateX(100%);
        transition: transform 0.3s;
    }

    .uap-messages-modal .uap-dm-chat.active {
        transform: translateX(0);
    }

    .uap-messages-modal .uap-dm-back-btn {
        display: flex !important;
    }

    .uap-messages-modal .uap-dm-msg {
        max-width: 85%;
    }

    .uap-messages-modal .uap-dm-footer {
        padding: 8px 12px 12px;
    }

    .uap-messages-modal .uap-dm-input-container {
        padding: 4px 4px 4px 10px;
    }

    .uap-messages-modal .uap-dm-counter {
        display: none;
    }

    .uap-messages-modal .uap-dm-send-btn {
        width: 32px;
        height: 32px;
    }

    .uap-messages-modal .uap-dm-send-btn svg {
        width: 16px;
        height: 16px;
    }
}

/* 桌面端样式 */
@media (min-width: 769px) {

    /* 侧边栏始终显示 */
    .uap-messages-modal .uap-dm-sidebar {
        display: flex;
    }

    /* 隐藏返回按钮 */
    .uap-messages-modal .uap-dm-back-btn {
        display: none !important;
    }
}


/* 按钮内徽章 */
.uap-btn-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    margin-left: 6px;
    background: #ef4444;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
}

/* 桌面端隐藏侧边栏关闭按钮 */
@media (min-width: 769px) {
    .uap-messages-modal .uap-dm-sidebar-close {
        display: none;
    }
}

/* 私信工具栏 - 优化版 */
.uap-messages-modal .uap-dm-tool-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px;
    color: #6b7280 !important;
    cursor: pointer;
    transition: all 0.15s;
}

.uap-messages-modal .uap-dm-tool-btn:hover {
    background: #e5e7eb !important;
    color: var(--uap-primary, #2563eb) !important;
    transform: scale(1.1);
}

.uap-messages-modal .uap-dm-tool-btn:active {
    transform: scale(0.95);
}

.uap-messages-modal .uap-dm-tool-btn svg {
    width: 18px;
    height: 18px;
}

/* 表情选择器 - 使用统一样式 */
.uap-messages-modal .uap-dm-emoji-wrapper {
    position: relative;
}

/* 私信表情选择器特定样式覆盖（如需要） */

/* 图片消息 */
.uap-messages-modal .uap-dm-msg-image {
    max-width: 200px;
    max-height: 200px;
    border-radius: 8px;
    cursor: pointer;
    transition: opacity 0.2s;
}

.uap-messages-modal .uap-dm-msg-image:hover {
    opacity: 0.9;
}

.uap-messages-modal .uap-dm-msg.sent .uap-dm-msg-bubble:has(.uap-dm-msg-image) {
    padding: 4px;
    background: transparent;
}

.uap-messages-modal .uap-dm-msg.received .uap-dm-msg-bubble:has(.uap-dm-msg-image) {
    padding: 4px;
    background: transparent;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .uap-messages-modal .uap-dm-msg-image {
        max-width: 160px;
        max-height: 160px;
    }
}

/* 图片预览遮罩层 */
.uap-dm-image-preview-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100001;
    cursor: zoom-out;
}

.uap-dm-image-preview-close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    transition: background 0.2s;
}

.uap-dm-image-preview-close:hover {
    background: rgba(255, 255, 255, 0.2);
}

.uap-dm-image-preview-img {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 4px;
    cursor: default;
}

/* ==========================================================================
   10. USER CARD - 用户卡片
   ========================================================================== */

/* 用户卡片容器 */
.uap-user-card {
    position: fixed;
    width: 320px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.15), 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 10000;
    overflow: hidden;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

/* 加载状态 */
.uap-user-card-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.uap-spinner {
    width: 32px;
    height: 32px;
    border: 3px solid #f3f4f6;
    border-top-color: var(--uap-primary, #2563eb);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* 卡片内容 */
.uap-user-card-content {
    padding: 20px;
}

/* 头部区域 */
.uap-user-card-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.uap-user-card-avatar {
    flex-shrink: 0;
    display: block;
    text-decoration: none;
}

.uap-user-card-avatar img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #f3f4f6;
}

.uap-user-card-info {
    flex: 1;
    min-width: 0;
}

.uap-user-card-name-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.uap-user-card-name {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    text-decoration: none;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uap-user-card-name:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-user-card-username {
    font-size: 13px;
    color: #6b7280;
}

/* 徽章区域 - 显示在名字后面，仅图标模式 */
.uap-user-card-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.uap-user-card-badge:hover {
    transform: scale(1.15);
}

/* 徽章 SVG 图标 */
.uap-user-card-badge svg {
    width: 16px;
    height: 16px;
    color: var(--badge-color, #6366f1);
    fill: var(--badge-color, #6366f1);
}

/* 简介 */
.uap-user-card-bio {
    font-size: 13px;
    line-height: 1.5;
    color: #4b5563;
    margin-bottom: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 统计数据 */
.uap-user-card-stats {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 0;
    border-top: 1px solid #f3f4f6;
    border-bottom: 1px solid #f3f4f6;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.uap-user-card-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.uap-user-card-stat-value {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1;
}

.uap-user-card-stat-label {
    font-size: 11px;
    color: #9ca3af;
    line-height: 1;
}

/* 操作按钮 */
.uap-user-card-actions {
    display: flex;
    gap: 8px;
}

.uap-user-card-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 500;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    white-space: nowrap;
}

.uap-user-card-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.uap-user-card-btn.loading {
    pointer-events: none;
}

.uap-user-card-btn-follow {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-user-card-btn-follow:hover {
    background: var(--uap-primary-hover, #1d4ed8);
    transform: translateY(-1px);
}

.uap-user-card-btn-following {
    background: #f3f4f6;
    color: #6b7280;
}

.uap-user-card-btn-following:hover {
    background: #fee2e2;
    color: #dc2626;
}

.uap-user-card-btn-message {
    background: #f3f4f6;
    color: #4b5563;
}

.uap-user-card-btn-message:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.uap-user-card-btn svg {
    flex-shrink: 0;
}

/* 响应式 - 移动端 */
@media (max-width: 768px) {
    .uap-user-card {
        width: calc(100vw - 40px);
        max-width: 320px;
    }
}


/* ==========================================================================
   11. THOUGHT SIDEBAR - 想法页面边栏
   ========================================================================== */

/* ==================== 想法页面双栏布局 ==================== */

/* 想法详情页双栏布局 */
.uap-thought-single-wrapper.has-sidebar {
    max-width: 1000px;
}

.uap-thought-single-layout {
    display: flex;
    gap: 24px;
}

.uap-thought-single-wrapper:not(.has-sidebar) .uap-thought-single-layout {
    display: block;
}

.uap-thought-single-main {
    flex: 1;
    min-width: 0;
    max-width: 680px;
}

.uap-thought-single-aside {
    width: 280px;
    flex-shrink: 0;
}

/* 平板端隐藏边栏 */
@media (max-width: 900px) {
    .uap-thought-single-wrapper.has-sidebar {
        max-width: 680px;
    }

    .uap-thought-single-aside {
        display: none;
    }
}

/* ==================== 边栏通用样式 ==================== */

.uap-thought-sidebar {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.uap-sidebar-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--uap-border, #e5e7eb);
    overflow: hidden;
}

.uap-sidebar-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #f0f0f0;
}

.uap-sidebar-card-title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

/* ==================== 我的统计卡片（精美版） ==================== */

.uap-sidebar-profile {
    position: relative;
    overflow: hidden;
}

.uap-sidebar-profile-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    background-size: cover;
    background-position: center;
    opacity: 0.9;
}

/* 有封面图时的样式 */
.uap-sidebar-profile-bg[style*="background-image"] {
    height: 70px;
    opacity: 1;
}

/* 封面图上的渐变遮罩 */
.uap-sidebar-profile-bg[style*="background-image"]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30px;
    background: linear-gradient(to top, rgba(255, 255, 255, 0.9), transparent);
}

.uap-sidebar-profile-content {
    position: relative;
    padding: 16px;
    padding-top: 36px;
}

.uap-sidebar-profile-avatar {
    display: block;
    width: 64px;
    height: 64px;
    margin: 0 auto 12px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s;
}

.uap-sidebar-profile-avatar:hover {
    transform: scale(1.05);
}

.uap-sidebar-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uap-sidebar-profile-info {
    text-align: center;
    margin-bottom: 16px;
}

.uap-sidebar-profile-name {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 16px;
    font-weight: 600;
    color: var(--uap-text, #374151);
    text-decoration: none;
}

.uap-sidebar-profile-name:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-sidebar-profile-badges {
    display: inline-flex;
    gap: 4px;
    margin-left: 4px;
}

.uap-sidebar-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.uap-sidebar-badge:hover {
    transform: scale(1.15);
}

.uap-sidebar-badge svg {
    width: 16px;
    height: 16px;
    color: var(--badge-color, #6366f1);
    fill: var(--badge-color, #6366f1);
}

.uap-sidebar-profile-username {
    display: block;
    font-size: 13px;
    color: var(--uap-text-light, #6b7280);
    margin-top: 2px;
}

.uap-sidebar-profile-stats {
    display: flex;
    justify-content: center;
    gap: 24px;
    padding: 12px 0;
    margin-bottom: 12px;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
}

.uap-sidebar-profile-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-decoration: none;
    transition: transform 0.15s;
}

.uap-sidebar-profile-stat:hover {
    transform: translateY(-2px);
}

.uap-sidebar-profile-stat-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--uap-text, #374151);
    line-height: 1;
}

.uap-sidebar-profile-stat:hover .uap-sidebar-profile-stat-value {
    color: var(--uap-primary, #2563eb);
}

.uap-sidebar-profile-stat-label {
    font-size: 12px;
    color: var(--uap-text-light, #6b7280);
}

.uap-sidebar-profile-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: #f8fafc;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--uap-text, #374151);
    text-decoration: none;
    transition: all 0.2s;
}

.uap-sidebar-profile-link:hover {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-sidebar-profile-link svg {
    transition: transform 0.2s;
}

.uap-sidebar-profile-link:hover svg {
    transform: translateX(3px);
}

/* ==================== 登录引导卡片 ==================== */

.uap-sidebar-auth {
    padding: 24px 20px;
    text-align: center;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.uap-sidebar-auth-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    color: #fff;
}

.uap-sidebar-auth-title {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 600;
    color: var(--uap-text, #374151);
}

.uap-sidebar-auth-desc {
    margin: 0 0 20px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--uap-text-light, #6b7280);
}

.uap-sidebar-auth-actions {
    display: flex;
    gap: 10px;
}

.uap-sidebar-auth-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
}

.uap-sidebar-auth-btn-primary {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-sidebar-auth-btn-primary:hover {
    background: var(--uap-primary-dark, #1d4ed8);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

.uap-sidebar-auth-btn-secondary {
    background: #f3f4f6;
    color: var(--uap-text, #374151);
}

.uap-sidebar-auth-btn-secondary:hover {
    background: #e5e7eb;
    color: var(--uap-text, #374151);
}

/* ==================== 推荐关注卡片 ==================== */

.uap-sidebar-refresh-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: var(--uap-text-light, #6b7280);
    cursor: pointer;
    transition: all 0.2s;
}

.uap-sidebar-refresh-btn:hover {
    background: #f3f4f6;
    color: var(--uap-primary, #2563eb);
}

.uap-sidebar-refresh-btn:focus {
    outline: none;
    box-shadow: none;
    background: transparent;
    border: none;
    color: var(--uap-text-light, #6b7280);
}

.uap-sidebar-refresh-btn:focus:hover {
    background: #f3f4f6;
    color: var(--uap-primary, #2563eb);
}

.uap-sidebar-refresh-btn:focus-visible {
    outline: 2px solid var(--uap-primary, #2563eb);
    outline-offset: 2px;
}

.uap-sidebar-refresh-btn.loading {
    animation: uap-spin 0.8s linear infinite;
    pointer-events: none;
}

.uap-sidebar-recommended-list {
    padding: 8px 0;
}

.uap-sidebar-user-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    transition: background 0.15s;
}

.uap-sidebar-user-item:hover {
    background: #f9fafb;
}

.uap-sidebar-user-item-avatar {
    flex-shrink: 0;
}

.uap-sidebar-user-item-avatar img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.uap-sidebar-user-item-info {
    flex: 1;
    min-width: 0;
}

.uap-sidebar-user-item-name {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--uap-text, #374151);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-sidebar-user-item-name:hover {
    color: var(--uap-primary, #2563eb);
}

.uap-sidebar-user-item-bio {
    display: block;
    font-size: 12px;
    color: var(--uap-text-light, #6b7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 边栏中的关注按钮使用统一的 small 尺寸 */
.uap-sidebar-user-item .uap-follow-btn-small {
    flex-shrink: 0;
}

/* ==================== 热门话题边栏样式 ==================== */

.uap-sidebar-topics-list {
    padding: 8px 0;
}

.uap-sidebar-topic-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    text-decoration: none;
    transition: background 0.15s;
}

.uap-sidebar-topic-item:hover {
    background: #f9fafb;
}

.uap-sidebar-topic-rank {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    color: var(--uap-text-light, #9ca3af);
    background: #f3f4f6;
    border-radius: 4px;
    flex-shrink: 0;
}

.uap-sidebar-topic-rank.top {
    background: var(--uap-primary, #2563eb);
    color: #fff;
}

.uap-sidebar-topic-name {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: var(--uap-text, #374151);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uap-sidebar-topic-count {
    font-size: 12px;
    color: var(--uap-text-light, #9ca3af);
    flex-shrink: 0;
}

/* ==================== 边栏空状态 ==================== */

.uap-sidebar-empty {
    padding: 24px 16px;
    text-align: center;
    color: var(--uap-text-light, #9ca3af);
    font-size: 13px;
}

/* 热门话题组件在边栏中的样式调整 */
.uap-thought-sidebar .uap-hot-topics-widget {
    border: none;
    border-radius: 0;
}

.uap-thought-sidebar .uap-sidebar-card .uap-hot-topics-widget {
    border-radius: 12px;
}

/* 边栏响应式 - 移动端完全隐藏 */
@media (max-width: 768px) {
    .uap-thought-sidebar {
        display: none;
    }
}

/* ==========================================================================
   Sidebar Premium Auth Widget
   Redesigned for a "Premium, Exquisite, Grand & Simple" look.
   Removes the generic "AI purple gradient" and introduces a clean, solid design.
   ========================================================================== */

/* Card Container - Floating & Elegant */
.uap-sidebar-auth {
    /* Subtle gradient background instead of pure white */
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 24px;
    /* Slightly rounder */
    padding: 32px 24px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.02),
        0 20px 40px -8px rgba(0, 0, 0, 0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
    z-index: 1;
    /* Establish stacking context */
}

.uap-sidebar-auth:hover {
    transform: translateY(-2px);
    box-shadow:
        0 10px 15px -3px rgba(0, 0, 0, 0.03),
        0 25px 50px -12px rgba(0, 0, 0, 0.08);
}

/* Decorative irregular shapes (Blobs) */
.uap-sidebar-auth::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 80% 20%, rgba(220, 230, 255, 0.4) 0%, transparent 20%),
        radial-gradient(circle at 20% 80%, rgba(240, 240, 255, 0.4) 0%, transparent 20%);
    z-index: -1;
    pointer-events: none;
    opacity: 0.6;
}

/* More pronounced organic shape underlay */
.uap-sidebar-auth::after {
    content: '';
    position: absolute;
    top: -60px;
    right: -40px;
    width: 200px;
    height: 200px;
    background: #f0f4ff;
    /* Pale blue */
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    /* Organic blob shape */
    filter: blur(40px);
    z-index: -1;
    opacity: 0.5;
    animation: uap-blob-float 10s infinite alternate ease-in-out;
}

@keyframes uap-blob-float {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }

    100% {
        transform: translate(-10px, 10px) rotate(5deg);
    }
}

/* Icon Container - Clean & Professional (No Gradients) */
.uap-sidebar-auth-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    background: #f3f4f6;
    /* Very subtle grey/light background */
    color: #1f2937;
    /* Dark contrasting icon */
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    /* For the sheen effect */
}

/* Detailed Sheen Effect */
.uap-sidebar-auth-icon::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 0.6) 50%,
            rgba(255, 255, 255, 0) 100%);
    transform: skewX(-25deg);
    transition: none;
    pointer-events: none;
}

/* Trigger the sheen animation on card hover */
.uap-sidebar-auth:hover .uap-sidebar-auth-icon::after {
    transition: left 0.7s ease-in-out;
    left: 200%;
}

.uap-sidebar-auth:hover .uap-sidebar-auth-icon {
    background: #e5e7eb;
    transform: scale(1.02);
    /* Subtle scale up only, no rotation */
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
    /* Slight inner glow */
}

.uap-sidebar-auth-icon svg {
    width: 32px;
    height: 32px;
    stroke-width: 1.5;
    z-index: 1;
    /* Ensure icon stays above sheen */
}

/* Typography - Bold & Readable */
.uap-sidebar-auth-title {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    /* Almost black */
    margin: 0 0 8px;
    letter-spacing: -0.02em;
}

.uap-sidebar-auth-desc {
    font-size: 14px;
    color: #6b7280;
    /* Neutral grey */
    line-height: 1.6;
    margin: 0 0 28px;
    padding: 0 10px;
}

/* Buttons Area - Side by Side */
.uap-sidebar-auth-actions {
    display: flex;
    gap: 12px;
    width: 100%;
}

/* Base Button Style */
.uap-sidebar-auth-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 12px;
    text-decoration: none !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    line-height: 1;
}

/* Primary Button - Login (Solid Dark) */
.uap-sidebar-auth-btn-primary {
    background: #1f2937 !important;
    /* Dark cool grey/black */
    color: #ffffff !important;
    border: 1px solid transparent;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.uap-sidebar-auth-btn-primary:hover {
    background: #000000 !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 12px -2px rgba(0, 0, 0, 0.15);
}

/* Secondary Button - Register (Subtle/Light) */
.uap-sidebar-auth-btn-secondary {
    background: #f9fafb !important;
    color: #4b5563 !important;
    border: 1px solid #e5e7eb;
}

.uap-sidebar-auth-btn-secondary:hover {
    background: #ffffff !important;
    border-color: #d1d5db;
    color: #111827 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}