* ====== 多端流式响应式适配（移动优先 + clamp()） ======
     * 核心策略：
     *   - 移动优先：默认样式适配手机
     *   - 用 clamp(min, preferred, max) 实现字号/尺寸的连续流式缩放
     *   - 仅在需要切换布局/抽屉化/隐藏元素时使用断点
     * 断点：
     *   ≤640px : 抽屉化弹窗/隐藏次要元素
     *   ≥768px : 平板，恢复一些桌面元素
     * =================================================================*/

    /* ===== 顶栏：流式尺寸 ===== */
    .header-inner {
      height: clamp(52px, 8vw, 64px);
      padding: 0 clamp(10px, 2vw + 4px, 16px);
    }
    .logo-text {
      gap: clamp(3px, 0.6vw, 5px);
    }
    .lt-main {
      font-size: clamp(17px, 3vw, 24px);
    }
    .lt-cn {
      font-size: clamp(14px, 2.6vw, 21px);
    }
    .lt-comm {
      font-size: clamp(10px, 1.6vw, 13px);
      letter-spacing: clamp(1px, 0.4vw, 3px);
    }
    .menu-btn {
      width: clamp(36px, 5vw + 18px, 40px);
      height: clamp(36px, 5vw + 18px, 40px);
    }
    .user-name {
      display: none;
    }
    @media (min-width: 768px) {
      .user-name { display: inline; }
    }

    /* ===== 主内容区：流式 padding ===== */
    .main-content {
      padding: clamp(12px, 2vw, 20px) clamp(12px, 2vw + 4px, 16px) clamp(90px, 14vw, 120px);
    }

    /* ===== Tabs 标签栏 ===== */
    .tabs {
      margin: 0 0 clamp(14px, 2vw, 24px);
      padding-bottom: clamp(10px, 1.5vw, 16px);
    }
    .tab {
      padding: clamp(6px, 1vw, 7px) clamp(12px, 2.2vw, 16px);
      font-size: clamp(13px, 1.5vw, 14px);
    }

    /* ===== 帖子卡片 ===== */
    .post-card {
      gap: clamp(10px, 1.8vw, 16px);
      padding: clamp(12px, 2vw, 18px) 0;
    }
    .post-avatar {
      width: clamp(36px, 6.5vw, 40px);
      height: clamp(36px, 6.5vw, 40px);
      font-size: clamp(14px, 2vw, 16px);
    }
    .post-title {
      font-size: clamp(15px, 1.8vw, 16px);
      line-height: 1.4;
      -webkit-line-clamp: 2;
    }
    .post-excerpt {
      font-size: clamp(12px, 1.5vw, 13px);
      -webkit-line-clamp: 1;
      margin-bottom: clamp(5px, 1vw, 8px);
    }
    .post-thumb {
      position: relative;
      align-self: stretch;
      width: clamp(96px, 16vw, 132px);
      min-height: 80px;
      border-radius: 10px;
      flex-shrink: 0;
    }
    .post-meta {
      font-size: clamp(11px, 1.4vw, 12px);
      gap: 6px;
      flex-wrap: wrap;
    }
    .post-meta .dot {
      display: none;
    }
    .post-actions {
      width: 100%;
      margin-top: 4px;
      gap: clamp(5px, 1vw, 6px);
    }
    .post-action-btn {
      font-size: clamp(11px, 1.4vw, 12px);
      padding: clamp(3px, 0.7vw, 5px) clamp(7px, 1.2vw, 10px);
      gap: 3px;
    }
    .post-action-btn svg {
      width: clamp(10px, 1.6vw, 12px);
      height: clamp(10px, 1.6vw, 12px);
    }
    .post-stats {
      gap: 5px;
    }
    .vote-btns {
      gap: clamp(5px, 1vw, 8px);
    }
    .vote-btn {
      font-size: clamp(11px, 1.4vw, 13px);
      padding: clamp(3px, 0.7vw, 5px) clamp(6px, 1.2vw, 10px);
      gap: 3px;
    }
    .vote-btn svg {
      width: clamp(12px, 1.8vw, 14px);
      height: clamp(12px, 1.8vw, 14px);
    }
    .post-stats .count {
      font-size: clamp(12px, 1.6vw, 14px);
    }
    .post-stats .label {
      font-size: clamp(11px, 1.4vw, 12px);
    }

    /* ===== 移动端禁用 hover 效果（用 hover:none 精准识别触屏） ===== */
    @media (hover: none) {
      .post-card:hover {
        background: transparent;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-radius: 0;
        border-bottom-color: #f3f4f6;
      }
      .post-card:hover .post-title {
        color: #111827;
      }
      /* 移动端禁用负 margin hover */
      .post-card {
        margin: 0 !important;
      }
    }

    /* ===== 移动端（≤640px）帖子卡片布局优化 ===== */
    @media (max-width: 640px) {
      .main-content {
        overflow-x: hidden;
        width: 100%;
        max-width: 100vw;
        padding: 10px 10px 110px;
      }
      .post-card {
        flex-wrap: wrap;
        gap: 8px;
        padding: 14px 0;
        max-width: 100%;
        overflow: hidden;
        position: relative;
        -webkit-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
      }
      .post-card:active {
        opacity: 0.6;
      }
      .post-avatar {
        width: 40px;
        height: 40px;
        font-size: 15px;
        flex-shrink: 0;
      }
      .post-body {
        width: calc(100% - 48px);
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
      }
      .post-title {
        font-size: 15px;
        -webkit-line-clamp: 2;
        line-height: 1.4;
      }
      .post-excerpt {
        font-size: 13px;
        margin-bottom: 4px;
      }
      .post-meta {
        font-size: 12px;
        gap: 6px;
        flex-wrap: wrap;
        min-width: 0;
        overflow: hidden;
        row-gap: 4px;
      }
      .post-meta .dot {
        display: none;
      }
      .post-meta .channel-badge {
        font-size: 10px;
        padding: 1px 6px;
        flex-shrink: 0;
      }
      /* 手机端元信息不溢出（只限制文本元素，不限制按钮容器） */
      .post-meta > span:not(.dot) {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 35%;
        flex-shrink: 1;
      }
      /* 操作按钮单独换行，不溢出 */
      .post-actions {
        margin-left: 0;
        width: 100%;
        margin-top: 4px;
        justify-content: flex-start;
        gap: 4px;
        flex-wrap: wrap;
      }
      .post-thumb {
        width: 64px;
        height: 64px;
        border-radius: 10px;
        margin-left: auto;
        flex-shrink: 0;
      }
      .post-stats {
        flex-direction: row;
        gap: 8px;
        width: 100%;
        margin-top: 6px;
        padding-left: 48px;
        flex-wrap: wrap;
      }
      .post-stats .vote-btns {
        flex-direction: row;
        gap: 8px;
      }
      .post-stats .vote-btn {
        padding: 5px 10px;
        font-size: 12px;
        min-height: 34px;
        touch-action: manipulation;
        border-radius: 8px;
      }
      .post-stats .vote-btn svg {
        width: 14px;
        height: 14px;
      }
      .post-stats .count {
        font-size: 13px;
      }
      .post-stats .label {
        font-size: 11px;
      }
      /* 内容不溢出 */
      .post-title, .post-excerpt, .post-content-area, .post-list {
        max-width: 100%;
        word-break: break-word;
        overflow-wrap: break-word;
      }
      .channel-badge {
        font-size: 11px;
        padding: 3px 8px;
      }
      .post-list {
        max-width: 100vw;
        overflow-x: hidden;
      }
      /* Tab 标签栏优化 */
      .tabs {
        gap: 3px;
        padding-bottom: 12px;
        margin-bottom: 14px;
      }
      .tab {
        padding: 7px 14px;
        font-size: 14px;
        border-radius: 18px;
      }
      /* 移动端分区标签紧凑排列，避免重叠 */
      #channelTabsPublic,
      #channelTabsPrivate {
        gap: 2px;
      }
      .tab-channel {
        padding: 6px 10px;
        font-size: 12px;
      }
      .tab-join {
        padding: 6px 10px;
        font-size: 12px;
        margin-left: 12px;
        padding-left: 14px;
        border-left: 1px solid #e5e7eb;
        border-radius: 0 18px 18px 0;
        flex-shrink: 0;
        white-space: nowrap;
      }
      /* 操作按钮移动端：紧凑排列，允许换行 */
      .post-action-btn {
        font-size: 11px;
        padding: 4px 8px;
        min-height: 30px;
        touch-action: manipulation;
        flex-shrink: 0;
        border-radius: 14px;
      }
      .post-action-btn svg {
        width: 11px;
        height: 11px;
      }
      /* 下拉菜单 */
      .dropdown-item {
        padding: 14px 16px;
        font-size: 15px;
      }
      /* 分页 */
      .page-btn {
        width: 34px;
        height: 34px;
        font-size: 13px;
      }
    }

    /* ===== 平板端（641px - 1024px）优化 ===== */
    @media (min-width: 641px) and (max-width: 1024px) {
      .main-content {
        padding: 16px clamp(16px, 4vw, 32px) 100px;
      }
      .post-card {
        gap: 12px;
        padding: 14px 0;
      }
      .post-thumb {
        width: 60px;
        height: 60px;
      }
      .post-actions {
        gap: 4px;
      }
      .post-action-btn {
        font-size: 11px;
        padding: 3px 8px;
      }
    }

    /* ===== 极小屏（≤380px）保持适中比例 ===== */
    @media (max-width: 380px) {
      .page {
        padding-top: 48px;
      }
      .header-inner {
        height: 48px;
        padding: 0 8px;
      }
      .logo-text {
        gap: 2px;
      }
      .lt-main {
        font-size: 15px;
      }
      .lt-sep {
        font-size: 12px;
      }
      .lt-cn {
        font-size: 13px;
      }
      .lt-comm {
        font-size: 9px;
        letter-spacing: 1px;
      }
      .main-content {
        padding: 8px 8px 100px;
        max-width: 100vw;
        overflow-x: hidden;
      }
      .post-card {
        padding: 12px 0;
        gap: 8px;
        max-width: 100%;
        overflow: hidden;
      }
      .post-avatar {
        width: 36px;
        height: 36px;
        font-size: 14px;
      }
      .post-body {
        width: calc(100% - 44px);
      }
      .post-title {
        font-size: 14px;
      }
      .post-excerpt {
        font-size: 12px;
      }
      .post-meta {
        font-size: 11px;
      }
      .post-thumb {
        width: 54px;
        height: 54px;
      }
      .post-stats {
        padding-left: 44px;
        gap: 6px;
      }
      .post-stats .vote-btn {
        padding: 4px 10px;
        font-size: 12px;
        min-height: 32px;
      }
      .post-stats .vote-btn svg {
        width: 13px;
        height: 13px;
      }
      .tab {
        padding: 5px 10px;
        font-size: 12px;
      }
      .page-btn {
        width: 30px;
        height: 30px;
        font-size: 12px;
      }
      .fab {
        width: 44px;
        height: 44px;
        bottom: 16px;
        right: 16px;
      }
      .fab svg {
        width: 20px;
        height: 20px;
      }
      .post-list {
        max-width: 100vw;
        overflow-x: hidden;
      }
      .channel-group-title {
        font-size: 13px;
      }
      .post-action-btn {
        font-size: 11px;
        padding: 4px 10px;
        min-height: 30px;
      }
    }

    /* ===== 分区分组标题 ===== */
    .channel-group-header {
      padding: clamp(12px, 2vw, 16px) 0 clamp(8px, 1vw, 10px);
    }
    .channel-group-title {
      font-size: clamp(14px, 2vw, 16px);
      gap: 6px;
      min-width: 0;
    }
    .channel-group-title .group-name {
      max-width: clamp(100px, 25vw, 200px);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .channel-group-title .group-count {
      font-size: clamp(11px, 1.4vw, 12px);
    }
    .channel-group-more {
      font-size: clamp(11px, 1.4vw, 12px);
      padding: clamp(4px, 0.8vw, 5px) clamp(8px, 1.4vw, 10px);
      flex-shrink: 0;
    }
    .channel-group-divider {
      margin: clamp(5px, 1vw, 8px) 0 clamp(3px, 0.5vw, 4px);
    }

    /* ===== 分页 ===== */
    .pagination {
      flex-wrap: nowrap;
      overflow-x: auto;
      padding: clamp(4px, 0.6vw, 4px) 0 clamp(10px, 1.5vw, 12px);
      scrollbar-width: none;
      justify-content: center;
    }
    .pagination::-webkit-scrollbar {
      display: none;
    }
    .page-btn {
      width: clamp(32px, 5.5vw, 36px);
      height: clamp(32px, 5.5vw, 36px);
      font-size: clamp(12px, 1.5vw, 14px);
      flex-shrink: 0;
    }
    .page-btn.arrow {
      font-size: clamp(14px, 1.7vw, 16px);
    }

    /* ===== FAB 浮动按钮：流式 + 安全区适配 ===== */
    .fab {
      bottom: max(clamp(16px, 3vw, 20px), env(safe-area-inset-bottom));
      right: max(clamp(16px, 3vw, 20px), env(safe-area-inset-right));
      width: clamp(48px, 10vw, 56px);
      height: clamp(48px, 10vw, 56px);
      box-shadow: 0 4px 16px rgba(14, 165, 233, 0.35);
    }
    .fab svg {
      width: clamp(20px, 4.5vw, 24px);
      height: clamp(20px, 4.5vw, 24px);
    }

    /* ===== 下拉菜单：流式宽度 ===== */
    .dropdown {
      top: clamp(52px, 8vw, 64px);
      right: clamp(6px, 1.5vw, 8px);
      left: auto;
      width: clamp(220px, 60vw, 280px);
      max-width: calc(100vw - 12px);
    }
    .dropdown-item {
      padding: 14px 16px;
      font-size: 15px;
    }

    /* ===== 弹窗：≤640px 抽屉化 ===== */
    @media (max-width: 640px) {
      .modal {
        max-width: none;
        max-height: 90vh;
        border-radius: 20px 20px 0 0;
      }
      .modal-overlay {
        align-items: flex-end;
      }
      .modal-header {
        padding: clamp(12px, 3vw, 16px) clamp(12px, 4vw, 16px) 6px;
      }
      .modal-header h2 {
        font-size: clamp(15px, 4vw, 17px);
      }
      .modal-body {
        padding: 4px clamp(12px, 4vw, 16px) 20px;
      }
      .modal-footer {
        padding: 0 0 max(12px, env(safe-area-inset-bottom));
        gap: 8px;
      }
      .modal-close {
        width: clamp(28px, 7vw, 32px);
        height: clamp(28px, 7vw, 32px);
        font-size: clamp(14px, 4vw, 16px);
      }
      .form-group {
        margin-bottom: 14px;
      }
      .form-group input,
      .form-group textarea {
        font-size: 16px; /* 防止 iOS 自动放大 */
        touch-action: manipulation; /* 防止双击缩放 */
      }
    }

    /* ===== 移动端键盘弹起时的输入框适配 ===== */
    @media (max-width: 640px) {
      /* 键盘弹起时给 body 留出空间，防止页面跳动 */
      body.keyboard-open {
        /* paddingBottom 由 JS 动态设置 */
        transition: padding-bottom 0.3s ease;
      }
      /* 弹窗内的滚动容器键盘适配 */
      .modal.keyboard-active {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
      }
    }

    /* ===== 登录/注册弹窗：≤640px 抽屉化 ===== */
    @media (max-width: 640px) {
      .auth-modal {
        max-width: none;
        width: 100%;
        max-height: 92vh;
        border-radius: 20px 20px 0 0;
      }
      .auth-modal-overlay {
        align-items: flex-end;
      }
      .auth-close {
        width: clamp(28px, 7vw, 32px);
        height: clamp(28px, 7vw, 32px);
        font-size: clamp(14px, 4vw, 16px);
      }
      .auth-tabs {
        padding: 0 clamp(12px, 4vw, 16px);
        gap: 0;
      }
      .auth-tab {
        padding: 10px 0;
        font-size: 14px;
      }
      .auth-header {
        padding: 20px clamp(12px, 4vw, 16px) 12px;
      }
      .auth-header h1 {
        font-size: clamp(20px, 6vw, 22px);
      }
      .auth-body {
        padding: 8px clamp(12px, 4vw, 16px) 20px;
      }
      .auth-input-group {
        margin-bottom: 12px;
      }
      .auth-input-group input {
        font-size: 16px;
        padding: 12px 14px;
      }
      .auth-btn {
        padding: 12px;
        font-size: 15px;
      }
    }

    .image-preview-close {
      top: max(16px, env(safe-area-inset-top));
      right: max(16px, env(safe-area-inset-right));
    }

    .avatar-preview:hover {
      border-color: #0ea5e9;
      transform: scale(1.05);
    }

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

    .avatar-preview .avatar-placeholder {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      color: #9ca3af;
    }

    .avatar-preview .avatar-placeholder svg {
      width: 24px;
      height: 24px;
      transition: all 0.3s ease;
    }

    .avatar-preview:hover .avatar-placeholder svg {
      color: #0ea5e9;
    }

    .avatar-hint {
      font-size: 11px;
      color: #9ca3af;
      margin-top: 8px;
    }

    /* 用户头像圆形 */
    .user-avatar-img {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      object-fit: cover;
    }

    /* ===== 个人中心页面 ===== */
    .profile-page {
      visibility: hidden;
      opacity: 0;
      height: 0;
      overflow: hidden;
      transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .profile-page.show {
      visibility: visible;
      opacity: 1;
      height: auto;
      overflow: visible;
    }

    .profile-card {
      background: #fff;
      border-radius: 20px;
      padding: 32px 24px;
      text-align: center;
      box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.04);
      opacity: 0;
      transform: translateY(24px);
      transition: all 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    .profile-page.show .profile-card {
      opacity: 1;
      transform: translateY(0);
    }

    .profile-avatar,
    .profile-name,
    .profile-email,
    .profile-info-item {
      opacity: 0;
      transform: translateY(12px);
      transition: all 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    .profile-page.show .profile-avatar { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
    .profile-page.show .profile-name { transition-delay: 0.15s; opacity: 1; transform: translateY(0); }
    .profile-page.show .profile-email { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
    .profile-page.show .profile-info-item:nth-child(5) { transition-delay: 0.25s; opacity: 1; transform: translateY(0); }
    .profile-page.show .profile-info-item:nth-child(6) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }
    .profile-page.show .profile-logout { transition-delay: 0.35s; opacity: 1; transform: translateY(0); }

    .profile-logout {
      opacity: 0;
      transform: translateY(12px);
      transition: all 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    .profile-avatar {
      width: 80px;
      height: 80px;
      border-radius: 50%;
      margin: 0 auto 16px;
      background: linear-gradient(135deg, #e0f2fe, #bae6fd);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 32px;
      font-weight: 700;
      color: #0ea5e9;
      overflow: hidden;
    }

    .profile-avatar-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      flex-direction: column;
    }

    .profile-change-avatar {
      font-size: 12px;
      color: #0ea5e9;
      cursor: pointer;
      font-weight: 600;
      background: rgba(14,165,233,0.06);
      border: none;
      padding: 5px 14px;
      border-radius: 12px;
      transition: all 0.2s ease;
      margin-top: -8px;
      margin-bottom: 4px;
    }

    .profile-change-avatar:hover {
      background: rgba(14,165,233,0.12);
    }

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

    .profile-name {
      font-size: 20px;
      font-weight: 700;
      color: #111827;
      margin-bottom: 4px;
    }

    .profile-email {
      font-size: 14px;
      color: #9ca3af;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }

    .profile-add-email {
      font-size: 13px;
      color: #0ea5e9;
      cursor: pointer;
      font-weight: 600;
      background: none;
      border: 1px dashed #0ea5e9;
      padding: 4px 12px;
      border-radius: 8px;
      transition: all 0.2s ease;
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }

    .profile-add-email:hover {
      background: rgba(14,165,233,0.06);
    }

    .profile-divider {
      height: 1px;
      background: #f3f4f6;
      margin: 20px 0;
    }

    .profile-info-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 12px 0;
    }

    .profile-info-label {
      font-size: 14px;
      color: #9ca3af;
    }

    .profile-info-value {
      font-size: 14px;
      font-weight: 600;
      color: #374151;
    }

    .profile-logout {
      width: 100%;
      padding: 12px;
      border-radius: 12px;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      border: none;
      background: #fef2f2;
      color: #dc2626;
      margin-top: 20px;
      transition: all 0.2s ease;
    }

    .profile-logout:hover {
      background: #fee2e2;
    }

    /* ===== TMP ID 绑定区域 ===== */
    .profile-tmp-section {
      opacity: 0;
      transform: translateY(12px);
      transition: all 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
    }
    .profile-page.show .profile-tmp-section { transition-delay: 0.32s; opacity: 1; transform: translateY(0); }

    .profile-tmp-header {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      font-weight: 700;
      color: #475569;
      margin-bottom: 12px;
    }
    .profile-tmp-header svg {
      color: #7c3aed;
    }

    .profile-tmp-status {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 14px 16px;
      background: linear-gradient(135deg, #f5f3ff, #ede9fe);
      border: 1px solid rgba(124,58,237,0.12);
      border-radius: 14px;
      gap: 12px;
      transition: all 0.3s ease;
    }
    .profile-tmp-status:hover {
      border-color: rgba(124,58,237,0.25);
      box-shadow: 0 2px 12px rgba(124,58,237,0.08);
    }

    .profile-tmp-id {
      display: flex;
      align-items: center;
      gap: 10px;
      flex: 1;
      min-width: 0;
    }
    .profile-tmp-id-icon {
      width: 40px; height: 40px;
      border-radius: 12px;
      background: linear-gradient(135deg, #7c3aed, #a78bfa);
      display: flex; align-items: center; justify-content: center;
      color: #fff; font-size: 16px; font-weight: 800;
      flex-shrink: 0;
    }
    .profile-tmp-id-info {
      flex: 1; min-width: 0;
    }
    .profile-tmp-id-value {
      font-size: 16px; font-weight: 700; color: #5b21b6;
    }
    .profile-tmp-id-label {
      font-size: 11px; color: #8b5cf6; margin-top: 2px;
    }

    .profile-tmp-btn {
      padding: 8px 16px;
      border-radius: 10px;
      font-size: 12px; font-weight: 700;
      cursor: pointer; border: none;
      white-space: nowrap;
      transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .profile-tmp-btn:active { transform: scale(0.94); }

    .profile-tmp-btn-bind {
      background: linear-gradient(135deg, #7c3aed, #8b5cf6);
      color: #fff;
      box-shadow: 0 2px 8px rgba(124,58,237,0.2);
    }
    .profile-tmp-btn-bind:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 16px rgba(124,58,237,0.35);
    }

    .profile-tmp-btn-unbind {
      background: rgba(124,58,237,0.08);
      color: #7c3aed;
      border: 1.5px solid rgba(124,58,237,0.2);
    }
    .profile-tmp-btn-unbind:hover {
      background: rgba(124,58,237,0.15);
      border-color: #7c3aed;
    }

    .profile-tmp-loading {
      text-align: center;
      padding: 16px 0;
    }
    .profile-tmp-loading .loader-text { font-size: 12px; }

    .profile-tmp-empty {
      text-align: center;
      padding: 16px;
    }
    .profile-tmp-empty-icon {
      font-size: 32px; margin-bottom: 8px; opacity: 0.5;
    }
    .profile-tmp-empty-text {
      font-size: 13px; color: #8b5cf6; margin-bottom: 12px;
      font-weight: 500;
    }

    /* TMP 绑定弹窗 */
    .tmp-bind-overlay {
      position: fixed; inset: 0; background: rgba(0,0,0,0.5);
      z-index: 200; display: flex; align-items: center; justify-content: center;
      padding: 20px;
      animation: tmpBindFadeIn 0.25s ease both;
    }
    @keyframes tmpBindFadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }
    .tmp-bind-box {
      background: #fff; border-radius: 20px;
      padding: 28px 24px;
      max-width: 380px; width: 100%;
      box-shadow: 0 16px 48px rgba(0,0,0,0.15);
      animation: tmpBindSlideUp 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    }
    @keyframes tmpBindSlideUp {
      from { opacity: 0; transform: translateY(24px) scale(0.96); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .tmp-bind-box h3 {
      font-size: 18px; font-weight: 800; color: #111827;
      margin-bottom: 6px;
    }
    .tmp-bind-box .sub {
      font-size: 13px; color: #6b7280; margin-bottom: 20px;
      line-height: 1.5;
    }
    .tmp-bind-input {
      width: 100%; padding: 12px 16px;
      border: 2px solid #e5e7eb; border-radius: 12px;
      font-size: 15px; font-family: inherit; outline: none;
      transition: all 0.3s;
    }
    .tmp-bind-input:focus {
      border-color: #7c3aed;
      box-shadow: 0 0 0 4px rgba(124,58,237,0.08);
    }
    .tmp-bind-actions {
      display: flex; gap: 10px; margin-top: 16px;
    }
    .tmp-bind-actions button {
      flex: 1; padding: 11px 16px; border-radius: 12px;
      font-size: 14px; font-weight: 700; cursor: pointer;
      border: none; transition: all 0.25s;
    }
    .tmp-bind-confirm {
      background: linear-gradient(135deg, #7c3aed, #8b5cf6);
      color: #fff;
      box-shadow: 0 2px 12px rgba(124,58,237,0.25);
    }
    .tmp-bind-confirm:hover { transform: translateY(-2px); box-shadow: 0 4px 20px rgba(124,58,237,0.4); }
    .tmp-bind-confirm:disabled { opacity: 0.5; cursor: default; transform: none; box-shadow: none; }
    .tmp-bind-cancel {
      background: #f3f4f6; color: #6b7280;
    }
    .tmp-bind-cancel:hover { background: #e5e7eb; }

    /* 邮箱编辑弹窗 */
    .email-edit-overlay {
      position: fixed;
      top: 0; right: 0; bottom: 0; left: 0;
      background: rgba(15,23,42,0.45);
      z-index: 120;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 16px;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.3s ease;
    }

    .email-edit-overlay.show {
      opacity: 1;
      pointer-events: auto;
    }

    .email-edit-card {
      background: #fff;
      border-radius: 20px;
      padding: 24px;
      width: 100%;
      max-width: 360px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.12);
      transform: translateY(20px);
      transition: transform 0.35s ease;
    }

    .email-edit-overlay.show .email-edit-card {
      transform: translateY(0);
    }

    .email-edit-card h3 {
      font-size: 18px;
      font-weight: 700;
      color: #111827;
      margin-bottom: 16px;
    }

    .email-edit-card input {
      width: 100%;
      padding: 12px 14px;
      border: 2px solid #f3f4f6;
      border-radius: 12px;
      font-size: 15px;
      font-family: inherit;
      outline: none;
      margin-bottom: 12px;
    }

    .email-edit-card input:focus {
      border-color: #0ea5e9;
      box-shadow: 0 0 0 4px rgba(14,165,233,0.06);
    }

    .email-edit-actions {
      display: flex;
      gap: 8px;
      justify-content: flex-end;
    }

    .email-edit-actions button {
      padding: 8px 20px;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      border: none;
    }

    .email-edit-actions .btn-save {
      background: #0ea5e9;
      color: #fff;
    }

    /* ===== 帖子卡片操作按钮 ===== */
    .post-meta {
      display: flex;
      align-items: center;
      gap: 16px;
      font-size: 12px;
      color: #9ca3af;
      flex-wrap: wrap;
    }
    .post-actions {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-left: auto;
    }
    .post-action-btn {
      height: 26px;
      padding: 0 9px;
      border-radius: 13px;
      border: 1.5px solid transparent;
      cursor: pointer;
      font-size: 11px;
      font-weight: 600;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
      flex-shrink: 0;
      white-space: nowrap;
      letter-spacing: 0.2px;
    }
    .post-action-btn:active {
      transform: scale(0.92);
    }
    .post-action-del {
      background: #fef2f2;
      border-color: #fecaca;
      color: #dc2626;
    }
    .post-action-del:hover {
      background: #dc2626;
      border-color: #dc2626;
      color: #fff;
      box-shadow: 0 2px 8px rgba(220, 38, 38, 0.25);
      transform: translateY(-1px);
    }
    .post-action-mute {
      background: #fef3c7;
      border-color: #fde68a;
      color: #d97706;
    }
    .post-action-mute:hover {
      background: #d97706;
      border-color: #d97706;
      color: #fff;
      box-shadow: 0 2px 8px rgba(217, 119, 6, 0.25);
      transform: translateY(-1px);
    }
    .post-action-essence {
      background: #fef3c7;
      border-color: #fde68a;
      color: #d97706;
    }
    .post-action-essence:hover {
      background: #d97706;
      border-color: #d97706;
      color: #fff;
      box-shadow: 0 2px 8px rgba(217, 119, 6, 0.25);
      transform: translateY(-1px);
    }
    .post-action-essence.active {
      background: #f59e0b;
      border-color: #f59e0b;
      color: #fff;
      box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
    }
    .post-action-essence.active:hover {
      background: #d97706;
      border-color: #d97706;
      box-shadow: 0 4px 12px rgba(217, 119, 6, 0.35);
    }
    .post-action-pin {
      background: #f0fdf4;
      border-color: #bbf7d0;
      color: #16a34a;
    }
    .post-action-pin:hover {
      background: #16a34a;
      border-color: #16a34a;
      color: #fff;
      box-shadow: 0 2px 8px rgba(22, 163, 74, 0.25);
      transform: translateY(-1px);
    }
    .post-action-pin.active {
      background: #16a34a;
      border-color: #16a34a;
      color: #fff;
      box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3);
    }
    .post-action-pin.active:hover {
      background: #15803d;
      border-color: #15803d;
      box-shadow: 0 4px 12px rgba(22, 163, 74, 0.35);
    }

    /* ===== 禁言弹窗 ===== */
    .mute-overlay {
      position: fixed; top:0;right:0;bottom:0;left:0;
      background: rgba(15,23,42,.4);
      z-index: 200;
      display: flex; align-items: center; justify-content: center;
      padding: 16px;
      opacity: 0; pointer-events: none;
      transition: opacity .3s;
    }
    .mute-overlay.show { opacity: 1; pointer-events: auto; }
    .mute-panel {
      background: #fff;
      border-radius: 24px;
      padding: 28px;
      width: 100%; max-width: 360px;
      box-shadow: 0 20px 60px rgba(0,0,0,.15);
      transform: translateY(20px) scale(.95);
      transition: transform .35s cubic-bezier(.32,.72,0,1);
      text-align: center;
    }
    .mute-overlay.show .mute-panel { transform: translateY(0) scale(1); }
    .mute-panel-title { font-size: 18px; font-weight: 800; color: #111827; margin-bottom: 4px; }
    .mute-panel-sub { font-size: 13px; color: #9ca3af; margin-bottom: 20px; }
    .mute-options {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
      margin-bottom: 16px;
    }
    .mute-opt {
      padding: 12px 8px; border-radius: 14px;
      font-size: 14px; font-weight: 700; cursor: pointer; border: none;
      background: #f3f4f6; color: #374151;
      transition: all .2s;
    }
    .mute-opt:hover { background: #fef3c7; color: #d97706; transform: translateY(-1px); }
    .mute-opt:active { transform: scale(.95); }
    .mute-opt-forever { background: #fef2f2; color: #dc2626; }
    .mute-opt-forever:hover { background: #fee2e2; color: #dc2626; }
    .mute-cancel {
      width: 100%; padding: 10px;
      border-radius: 12px; font-size: 14px; font-weight: 600;
      cursor: pointer; border: none;
      background: #f3f4f6; color: #6b7280;
      transition: all .2s;
    }
    .mute-cancel:hover { background: #e5e7eb; }

    /* ===== 移动端点击反馈加速 ===== */
    @media (max-width: 768px) {
      .btn, .btn-sm, .btn-primary, .btn-danger-full,
      .tab, .channel-tab, .tag-option,
      .sidebar-item, .dropdown-item, .manage-item,
      .fab, .send-btn, .vote-btn, .post-action-btn,
      .page-btn, .channel-manage-btn,
      .action-sheet .sheet-btn, .action-sheet .sheet-cancel,
      .mute-opt, .mute-cancel,
      .disclaimer-confirm-btn, .popup-notice-close,
      .upload-btn, .modal-close, .auth-close {
        transition: all 0.1s ease !important;
      }

      .btn:active, .btn-sm:active, .btn-primary:active, .btn-danger-full:active,
      .tab:active, .channel-tab:active, .tag-option:active,
      .sidebar-item:active, .dropdown-item:active, .manage-item:active,
      .fab:active, .send-btn:active, .vote-btn:active, .post-action-btn:active,
      .page-btn:active, .channel-manage-btn:active,
      .sheet-btn:active, .sheet-cancel:active,
      .mute-opt:active, .mute-cancel:active,
      .disclaimer-confirm-btn:active, .popup-notice-close:active,
      .upload-btn:active, .modal-close:active, .auth-close:active {
        transform: scale(0.94) !important;
      }

      .post-card:active { opacity: 0.6 !important; }
      .channel-group-more:active { background: #e2e8f0 !important; }
    }