/* ==================== 帖子详情样式 - CandyCake 设计规范 ==================== */
:root {
  --cc-blue: var(--cc-level-color, #2563eb);
  --cc-blue-600: var(--cc-level-accent, #1d4ed8);
  --cc-white: #ffffff;
  --cc-text: #0f172a;
  --cc-muted: #64748b;
  --cc-border: #e2e8f0;
  --cc-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  --cc-shadow-btn: 0 4px 12px rgba(15,23,42,0.18);
  --cc-shadow-btn-hover: 0 6px 16px rgba(15,23,42,0.24);
}

/* 页面锁定：禁止 body 滚动，仅左右列可滚动 */
html, body {
  height: 100%;
  overflow: hidden;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
}

body,
button,
input,
textarea,
select {
  font-family: "Microsoft YaHei", "微软雅黑", "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
}

.cp-page-wrapper {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.cp-detail-wrap {
  max-width: 100%;
  padding: 4px 0 16px;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

/* 面包屑在左侧卡片内 */
.cp-main-column > .cp-breadcrumb {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f4f9;
}

/* 详情双栏布局 */
.cp-detail-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
  gap: 20px;
  flex: 1;
  min-height: 0;
  align-items: stretch;
}

/* ========== 液态玻璃基础类（详情页局部） ========== */
.cp-lg-card {
  position: relative;
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.52);
  border-radius: 14px;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.80),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 4px 16px rgba(15,23,42,.08),
    0 1px 4px rgba(15,23,42,.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}

.cp-lg-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(148deg, rgba(255,255,255,.44) 0%, rgba(255,255,255,.10) 35%, transparent 62%);
  z-index: 0;
}

/* 内容层放到高光层之上 */
.cp-lg-card > * { position: relative; z-index: 1; }

@supports (backdrop-filter: url('#')) {
  .cp-lg-card {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}

/* ========== 左侧：帖子容器（卡片外壳固定，内容滚动） ========== */
.cp-main-column {
  position: relative;
  min-width: 0;
  min-height: 0;
  background: rgba(255,255,255,.22);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.80),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 4px 16px rgba(15,23,42,.08),
    0 1px 4px rgba(15,23,42,.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  padding: 24px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  transition: scrollbar-color .3s, border-color .3s, box-shadow .3s, background .3s;
}

.cp-main-column::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(148deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.08) 35%, transparent 62%);
  z-index: 0;
}

.cp-main-column > * {
  position: relative;
  z-index: 1;
}

.cp-main-column:hover {
  background: rgba(255,255,255,.30);
  border-color: rgba(255,255,255,.68);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.90),
    inset 0 -1px 0 rgba(255,255,255,.26),
    0 8px 24px rgba(15,23,42,.12),
    0 2px 6px rgba(15,23,42,.08);
  scrollbar-color: rgba(100, 116, 139, 0.25) transparent;
}

/* ========== 右侧：评论容器（卡片外壳固定，列表滚动） ========== */
.cp-comment-column {
  position: relative;
  min-width: 0;
  min-height: 0;
  background: rgba(255,255,255,.22);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.80),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 4px 16px rgba(15,23,42,.08),
    0 1px 4px rgba(15,23,42,.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: border-color .3s, box-shadow .3s, background .3s;
}

.cp-comment-column::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(148deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.08) 35%, transparent 62%);
  z-index: 0;
}

.cp-comment-column > * {
  position: relative;
  z-index: 1;
}

.cp-comment-column:hover {
  background: rgba(255,255,255,.30);
  border-color: rgba(255,255,255,.68);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.90),
    inset 0 -1px 0 rgba(255,255,255,.26),
    0 8px 24px rgba(15,23,42,.12),
    0 2px 6px rgba(15,23,42,.08);
}

@supports (backdrop-filter: url('#')) {
  .cp-main-column,
  .cp-comment-column {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}

/* 评论卡片填满列，flex 布局 */
.cp-comment-column .cp-comments-card {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 14px 16px 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  border: none;
}

/* 评论标题+排序 固定在顶部（紧凑） */
.cp-comment-column .cp-comments-header {
  flex-shrink: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #f0f4f9;
  margin-bottom: 0;
}

.cp-comment-column .cp-comments-title {
  font-size: 14px;
  margin-bottom: 0;
}

.cp-comment-column .cp-comment-sort-btn {
  padding: 3px 8px;
  font-size: 11px;
}

/* 评论列表 可滚动区域 */
.cp-comment-column .cp-comment-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 4px 2px;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  transition: scrollbar-color 0.3s;
}

.cp-comment-column .cp-comment-list:hover {
  scrollbar-color: rgba(100, 116, 139, 0.25) transparent;
}

/* 评论输入框 固定在底部（紧凑） */
.cp-comment-column .cp-comment-input {
  flex-shrink: 0;
  position: static;
  padding: 8px 16px 10px;
  margin: 0;
  border-top: 1px solid #f0f4f9;
}

.cp-comment-column .cp-comment-input-box {
  gap: 6px;
}

.cp-comment-column .cp-comment-input textarea {
  min-height: 42px;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.5;
  border-radius: 8px;
}

.cp-comment-column .cp-comment-input-actions {
  gap: 6px;
}

.cp-comment-column .mention-tip-row {
  margin-bottom: 2px;
}

.cp-comment-column .mention-tip {
  font-size: 9px;
  padding: 1px 6px;
}

.cp-comment-column .cp-comment-toolbar .emoji-btn,
.cp-comment-column .cp-comment-toolbar .cp-comment-upload-btn {
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 6px;
  box-shadow: none;
}

.cp-comment-column .cp-comment-toolbar .emoji-btn i,
.cp-comment-column .cp-comment-toolbar .cp-comment-upload-btn i {
  font-size: 15px;
}

.cp-comment-column .cp-comment-submit {
  padding: 6px 14px;
  font-size: 12px;
  border-radius: 7px;
  box-shadow: 0 4px 10px rgba(15,23,42,.14);
}

.cp-comment-column .cp-comment-login {
  padding: 10px;
  margin-bottom: 16px;
  border-radius: 8px;
  font-size: 13px;
}

/* 加载更多按钮区域 */
.cp-comment-column #commentPagination {
  flex-shrink: 0;
  text-align: center;
  padding: 4px 0;
}

.cp-load-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  padding: 8px 0;
  border: none;
  background: transparent;
  color: #64748b;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
  border-radius: 6px;
}

.cp-load-more-btn:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.05);
  color: var(--cc-blue);
}

.cp-load-more-btn i {
  font-size: 16px;
}

/* ========== 滚动条样式（液态玻璃） ========== */
.cp-main-column,
.cp-comment-column .cp-comment-list,
.cp-reward-list-body,
.mention-dropdown,
.emoji-picker-header,
.emoji-picker-body {
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .36) rgba(255,255,255,.18);
}

.cp-main-column::-webkit-scrollbar,
.cp-comment-column .cp-comment-list::-webkit-scrollbar,
.cp-reward-list-body::-webkit-scrollbar,
.mention-dropdown::-webkit-scrollbar,
.emoji-picker-header::-webkit-scrollbar,
.emoji-picker-body::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.cp-main-column::-webkit-scrollbar-track,
.cp-comment-column .cp-comment-list::-webkit-scrollbar-track,
.cp-reward-list-body::-webkit-scrollbar-track,
.mention-dropdown::-webkit-scrollbar-track,
.emoji-picker-header::-webkit-scrollbar-track,
.emoji-picker-body::-webkit-scrollbar-track {
  background: rgba(255,255,255,.18);
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.28);
}

.cp-main-column::-webkit-scrollbar-thumb,
.cp-comment-column .cp-comment-list::-webkit-scrollbar-thumb,
.cp-reward-list-body::-webkit-scrollbar-thumb,
.mention-dropdown::-webkit-scrollbar-thumb,
.emoji-picker-header::-webkit-scrollbar-thumb,
.emoji-picker-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.44);
  background: linear-gradient(180deg, rgba(148,163,184,.45), rgba(100,116,139,.36));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    0 1px 2px rgba(15,23,42,.12);
  transition: background .2s, border-color .2s, box-shadow .2s;
}

.cp-main-column:hover::-webkit-scrollbar-thumb,
.cp-comment-column .cp-comment-list:hover::-webkit-scrollbar-thumb,
.cp-reward-list-body:hover::-webkit-scrollbar-thumb,
.mention-dropdown:hover::-webkit-scrollbar-thumb,
.emoji-picker-header:hover::-webkit-scrollbar-thumb,
.emoji-picker-body:hover::-webkit-scrollbar-thumb {
  border-color: rgba(255,255,255,.58);
  background: linear-gradient(180deg, rgba(125,211,252,.52), rgba(56,189,248,.34));
}

.cp-main-column::-webkit-scrollbar-thumb:hover,
.cp-comment-column .cp-comment-list::-webkit-scrollbar-thumb:hover,
.cp-reward-list-body::-webkit-scrollbar-thumb:hover,
.mention-dropdown::-webkit-scrollbar-thumb:hover,
.emoji-picker-header::-webkit-scrollbar-thumb:hover,
.emoji-picker-body::-webkit-scrollbar-thumb:hover {
  border-color: rgba(191,219,254,.78);
  background: linear-gradient(180deg, rgba(96,165,250,.62), rgba(59,130,246,.48));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.62),
    0 2px 5px rgba(37,99,235,.22);
}

.cp-main-column::-webkit-scrollbar-thumb:active,
.cp-comment-column .cp-comment-list::-webkit-scrollbar-thumb:active,
.cp-reward-list-body::-webkit-scrollbar-thumb:active,
.mention-dropdown::-webkit-scrollbar-thumb:active,
.emoji-picker-header::-webkit-scrollbar-thumb:active,
.emoji-picker-body::-webkit-scrollbar-thumb:active {
  border-color: rgba(147,197,253,.82);
  background: linear-gradient(180deg, rgba(59,130,246,.72), rgba(29,78,216,.56));
}

/* 表情包选择器弹窗（亮色液态玻璃） */
.emoji-picker {
  background: rgba(255,255,255,.26);
  border: 1px solid rgba(255,255,255,.56);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 18px 42px rgba(15,23,42,.16);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}
.emoji-picker-header {
  background: linear-gradient(135deg, rgba(255,255,255,.44), rgba(255,255,255,.24));
  border-bottom: 1px solid rgba(255,255,255,.46);
}
.emoji-picker-body {
  background: linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.10));
}
.emoji-category-tab {
  background: rgba(255,255,255,.44);
  border-color: rgba(255,255,255,.58);
  color: #64748b;
}
.emoji-category-tab:hover {
  background: rgba(255,255,255,.62);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.28);
}
.emoji-category-tab.active {
  background: rgba(var(--cc-blue-rgb,37,99,235),.84);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.92);
}
.emoji-picker-item:hover {
  background: rgba(255,255,255,.52);
  box-shadow: inset 0 0 0 1px rgba(var(--cc-blue-rgb,37,99,235),.20);
}
.emoji-preview-popup {
  background: rgba(255,255,255,.30);
  border: 1px solid rgba(var(--cc-blue-rgb,37,99,235),.46);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 12px 30px rgba(37,99,235,.24);
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
}
.emoji-picker-locked::after { background: rgba(15,23,42,.18); }
.emoji-picker-locked:hover::before {
  background: rgba(15,23,42,.82);
  border: 1px solid rgba(255,255,255,.16);
}

@supports (backdrop-filter: url('#')) {
  .emoji-picker,
  .emoji-preview-popup {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}

/* 面包屑 */
.cp-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
  font-size: 13px;
  color: var(--cc-muted);
}

.cp-breadcrumb a:not(.cp-back-btn) {
  color: var(--cc-muted);
  text-decoration: none;
  transition: color 0.2s;
}

.cp-breadcrumb a:not(.cp-back-btn):hover {
  color: var(--cc-blue);
}

.cp-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  background: #f1f5f9;
  border-radius: 6px;
  color: var(--cc-muted);
  text-decoration: none;
  font-size: 12px;
  transition: all 0.2s;
}

.cp-back-btn:hover {
  background: var(--cc-blue);
  color: #fff;
  text-decoration: none;
}

/* 帖子主卡片 */
/* 帖子卡片：外壳样式已在 .cp-main-column 上，这里仅保留内间距 */
.cp-detail-card {
  background: transparent;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  margin-bottom: 0;
  border: none;
}

.cp-detail-header {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--cc-border);
}

.cp-detail-badges {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.cp-detail-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
}

.cp-detail-badge-top {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
}

.cp-detail-badge-global-top {
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: #fff;
}

.cp-detail-badge-essence {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff;
}

.cp-detail-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--cc-text);
  line-height: 1.4;
  margin-bottom: 16px;
}

.cp-detail-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* 头像框容器 */
.cp-avatar-frame-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cp-avatar-frame {
  position: absolute;
  width: 140%;
  height: 140%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1;
}

.cp-avatar-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  min-width: 100%;
  min-height: 100%;
}

/* CSS渐变边框 */
.cp-avatar-frame-css {
  border-radius: 50%;
  background: transparent;
}

/* CSS边框动画 */
.frame-anim-rotate {
  animation: frame-rotate-detail 3s linear infinite;
}

.frame-anim-pulse {
  animation: frame-pulse-detail 2s ease-in-out infinite;
}

.frame-anim-glow {
  animation: frame-glow 2s ease-in-out infinite;
}

.frame-anim-ripple {
  animation: frame-ripple 2s ease-out infinite;
}

@keyframes frame-rotate-detail {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes frame-pulse-detail {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.05); }
}

@keyframes frame-glow {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.3); }
}

@keyframes frame-ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7),
                0 0 0 0 rgba(59, 130, 246, 0.5),
                0 0 0 0 rgba(59, 130, 246, 0.3);
  }
  40% {
    box-shadow: 0 0 0 10px rgba(59, 130, 246, 0.5),
                0 0 0 20px rgba(59, 130, 246, 0.3),
                0 0 0 30px rgba(59, 130, 246, 0.1);
  }
  100% {
    box-shadow: 0 0 0 20px rgba(59, 130, 246, 0),
                0 0 0 30px rgba(59, 130, 246, 0),
                0 0 0 40px rgba(59, 130, 246, 0);
  }
}

.cp-detail-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  overflow: hidden;
}

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

.cp-detail-author-info {
  flex: 1;
}

.cp-detail-author-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--cc-text);
}

.cp-detail-author-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* 用户等级徽章 */
.cp-user-level-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
}

.cp-user-level-badge i {
  font-size: 12px;
}

.cp-user-level-sm {
  padding: 1px 6px;
  font-size: 10px;
  border-radius: 8px;
}

/* 管理员徽章 - 全站管理员（金色） */
.cp-admin-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 500;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #92400e;
  border: 1px solid #fcd34d;
}

.cp-admin-badge i {
  font-size: 12px;
}

/* 版主徽章（蓝色） */
.cp-admin-badge.cp-mod-badge {
  background: linear-gradient(135deg, rgba(var(--cc-blue-rgb, 37, 99, 235), 0.16), rgba(var(--cc-blue-rgb, 37, 99, 235), 0.26));
  color: #1e40af;
  border: 1px solid rgba(var(--cc-blue-rgb, 37, 99, 235), 0.32);
}

.cp-admin-badge-sm {
  padding: 1px 6px;
  font-size: 10px;
}

.cp-admin-badge-sm i {
  font-size: 10px;
}

/* 作者关注按钮 */
.cp-author-follow-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  white-space: nowrap;
}

.cp-author-follow-btn-primary {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  color: #fff;
  box-shadow: var(--cc-shadow-btn);
}

.cp-author-follow-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: var(--cc-shadow-btn-hover);
}

.cp-author-follow-btn-secondary {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  color: var(--cc-blue);
}

.cp-author-follow-btn-secondary:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.15);
}

/* 用户链接 */
.cp-user-link {
  display: block;
  text-decoration: none;
  transition: all 0.2s;
}

.cp-user-link:hover {
  text-decoration: none;
}

.cp-user-link .cp-detail-avatar,
.cp-user-link .cp-comment-avatar {
  transition: transform 0.2s, box-shadow 0.2s;
}

.cp-user-link:hover .cp-detail-avatar,
.cp-user-link:hover .cp-comment-avatar {
  transform: scale(1.05);
  box-shadow: 0 4px 12px rgba(15,23,42,0.16);
}

.cp-user-name-link {
  color: var(--cc-text);
  text-decoration: none;
  transition: color 0.2s;
}

.cp-user-name-link:hover {
  color: var(--cc-blue);
  text-decoration: none;
}

.cp-detail-author-time {
  font-size: 12px;
  color: var(--cc-muted);
}

/* 帖子统计信息栏 */
.cp-detail-stats-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.36);
}

.cp-detail-stat-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--cc-muted);
  padding: 6px 12px;
  background: rgba(255,255,255,.38);
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 8px;
  transition: all 0.2s;
}

.cp-detail-stat-item:hover {
  background: rgba(255,255,255,.52);
  border-color: rgba(var(--cc-blue-rgb, 37, 99, 235), .32);
  color: var(--cc-blue);
}

.cp-detail-stat-item i {
  font-size: 16px;
}

.cp-detail-stat-item.cp-stat-update {
  background: rgba(16,185,129,0.08);
  color: #059669;
}

.cp-detail-stat-item.cp-stat-update:hover {
  background: rgba(16,185,129,0.12);
}

.cp-detail-edit-btn {
  padding: 8px 14px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  border-radius: 8px;
  color: var(--cc-blue);
  text-decoration: none;
  font-size: 13px;
  transition: all 0.2s;
}

.cp-detail-edit-btn:hover {
  background: var(--cc-blue);
  color: #fff;
  text-decoration: none;
}

/* 帖子内容 - 富文本样式 */
.cp-detail-content {
  font-size: 15px;
  line-height: 1.8;
  color: var(--cc-text);
  word-wrap: break-word;
}

.cp-detail-content p {
  margin-bottom: 16px;
}

.cp-detail-content h1,
.cp-detail-content h2,
.cp-detail-content h3 {
  margin: 20px 0 12px;
  font-weight: 600;
  color: var(--cc-text);
}

.cp-detail-content h1 { font-size: 20px; }
.cp-detail-content h2 { font-size: 18px; }
.cp-detail-content h3 { font-size: 16px; }

.cp-detail-content ul,
.cp-detail-content ol {
  margin: 12px 0;
  padding-left: 24px;
}

.cp-detail-content li {
  margin-bottom: 6px;
}

.cp-detail-content blockquote {
  margin: 16px 0;
  padding: 12px 16px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.05);
  border-left: 4px solid var(--cc-blue);
  border-radius: 0 8px 8px 0;
  color: var(--cc-muted);
  font-style: italic;
}

.cp-detail-content pre,
.cp-detail-content code {
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
  font-size: 13px;
  line-height: 1.6;
}

.cp-detail-content pre {
  margin: 16px 0;
  padding: 16px 50px 16px 16px;
  background: #1e293b;
  color: #e2e8f0;
  border-radius: 10px;
  overflow-x: auto;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  position: relative;
}

/* 代码块复制按钮 */
.cp-code-copy-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 6px 12px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.8);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  opacity: 0;
  transition: all 0.2s;
  z-index: 10;
  backdrop-filter: blur(4px);
}

.cp-detail-content pre:hover .cp-code-copy-btn,
.cp-comment-content pre:hover .cp-code-copy-btn,
.cp-hidden-body pre:hover .cp-code-copy-btn {
  opacity: 1;
}

.cp-code-copy-btn:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 1);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15,23,42,0.18);
}

.cp-code-copy-btn:active {
  transform: translateY(0);
}

.cp-code-copy-btn i {
  font-size: 14px;
}

.cp-code-copy-btn.copied {
  background: rgba(16, 185, 129, 0.9);
}

.cp-code-copy-btn.copied:hover {
  background: rgba(16, 185, 129, 1);
}

/* 移动端优化 */
@media (max-width: 640px) {
  .cp-code-copy-btn {
    padding: 5px 10px;
    font-size: 11px;
    top: 6px;
    right: 6px;
  }
  
  .cp-code-copy-btn span {
    display: none;
  }
  
  .cp-code-copy-btn i {
    font-size: 16px;
  }
  
  .cp-code-copy-btn.copied span {
    display: inline;
  }
}

.cp-detail-content code {
  padding: 2px 6px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  color: var(--cc-blue);
  border-radius: 4px;
  font-size: 0.9em;
}

/* 代码块内的代码样式 - 确保文字可见 */
.cp-detail-content pre code {
  padding: 0;
  background: transparent !important;
  color: #e2e8f0 !important;
  border-radius: 0;
  font-size: 13px;
}

/* 确保代码块内所有元素都有正确的颜色 */
.cp-detail-content pre * {
  color: #e2e8f0 !important;
}

/* 代码块内的关键字、字符串等语法高亮（如果有） */
.cp-detail-content pre code .keyword {
  color: #c792ea !important;
}

.cp-detail-content pre code .string {
  color: #c3e88d !important;
}

.cp-detail-content pre code .comment {
  color: #546e7a !important;
  font-style: italic;
}

.cp-detail-content pre code .number {
  color: #f78c6c !important;
}

/* 评论区域的代码块样式 */
.cp-comment-content pre,
.cp-comment-content code {
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
  font-size: 12px;
  line-height: 1.6;
}

.cp-comment-content pre {
  margin: 12px 0;
  padding: 12px 45px 12px 12px;
  background: #1e293b;
  color: #e2e8f0;
  border-radius: 8px;
  overflow-x: auto;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  position: relative;
}

.cp-comment-content code {
  padding: 2px 5px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  color: var(--cc-blue);
  border-radius: 4px;
  font-size: 0.9em;
}

.cp-comment-content pre code {
  padding: 0;
  background: transparent !important;
  color: #e2e8f0 !important;
  border-radius: 0;
  font-size: 12px;
}

.cp-comment-content pre * {
  color: #e2e8f0 !important;
}

/* 隐藏内容区域的代码块样式 */
.cp-hidden-body pre,
.cp-hidden-body code {
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
  font-size: 13px;
  line-height: 1.6;
}

.cp-hidden-body pre {
  margin: 16px 0;
  padding: 16px 50px 16px 16px;
  background: #1e293b;
  color: #e2e8f0;
  border-radius: 10px;
  overflow-x: auto;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  position: relative;
}

.cp-hidden-body code {
  padding: 2px 6px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  color: var(--cc-blue);
  border-radius: 4px;
  font-size: 0.9em;
}

.cp-hidden-body pre code {
  padding: 0;
  background: transparent !important;
  color: #e2e8f0 !important;
  border-radius: 0;
  font-size: 13px;
}

.cp-hidden-body pre * {
  color: #e2e8f0 !important;
}

.cp-detail-content a {
  color: var(--cc-blue);
  text-decoration: none;
}

.cp-detail-content a:hover {
  text-decoration: underline;
}

.cp-detail-content a .cp-link-icon,
.cp-comment-content a .cp-link-icon {
  display: inline-flex;
  font-size: 0.85em;
  margin-left: 2px;
  vertical-align: baseline;
  opacity: 0.6;
  transition: opacity 0.2s;
}

.cp-detail-content a:hover .cp-link-icon,
.cp-comment-content a:hover .cp-link-icon {
  opacity: 1;
}

/* 外部链接安全提示弹窗 */
.cp-external-link-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15,23,42,.48);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.2s ease;
}

.cp-external-link-modal.show {
  display: flex;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.cp-external-link-dialog {
  background: rgba(255,255,255,.26);
  border: 1px solid rgba(255,255,255,.56);
  border-radius: 16px;
  padding: 0;
  max-width: 420px;
  width: 90%;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 20px 44px rgba(15,23,42,.18);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  animation: slideUp 0.3s ease;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.cp-external-link-header {
  padding: 24px 24px 16px;
  border-bottom: 1px solid var(--cc-border);
  display: flex;
  align-items: center;
  gap: 12px;
}

.cp-external-link-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
  flex-shrink: 0;
}

.cp-external-link-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--cc-text);
}

.cp-external-link-body {
  padding: 20px 24px;
}

.cp-external-link-warning {
  background: rgba(245, 158, 11, 0.1);
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 16px;
  font-size: 14px;
  color: #92400e;
  line-height: 1.6;
}

.cp-external-link-url {
  background: #f8fafc;
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 16px;
  font-size: 13px;
  color: var(--cc-text);
  word-break: break-all;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-external-link-url i {
  color: var(--cc-blue);
  font-size: 16px;
  flex-shrink: 0;
}

.cp-external-link-footer {
  padding: 16px 24px 24px;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.cp-external-link-btn {
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}

.cp-external-link-btn-cancel {
  background: #f1f5f9;
  color: var(--cc-text);
}

.cp-external-link-btn-cancel:hover {
  background: #e2e8f0;
}

.cp-external-link-btn-confirm {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  color: #fff;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
}

.cp-external-link-btn-confirm:hover {
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.35);
  transform: translateY(-1px);
}

/* 帖子和评论图片优化 - 支持多图并排，防闪烁 */
.cp-detail-content img,
.cp-comment-content img {
  max-width: 48%;
  height: auto;
  border-radius: 8px;
  cursor: zoom-in;
  display: inline-block;
  vertical-align: top;
  margin: 6px 4px 6px 0;
  /* 平滑过渡，避免布局闪烁 */
  transition: opacity 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease, max-width 0.3s ease;
  object-fit: contain;
  /* 初始半透明，分类完成后变为不透明 */
  opacity: 0.6;
}

/* 图片分类完成后显示 */
.cp-detail-content img.classified,
.cp-comment-content img.classified {
  opacity: 1;
}

/* 竖向图片限制宽度 */
.cp-detail-content img.vertical-image {
  max-width: min(32%, 200px);
}

/* 横向图片可以稍大 */
.cp-detail-content img.horizontal-image {
  max-width: min(65%, 500px);
}

/* 单独一张大图（横向且宽度大于容器50%）*/
.cp-detail-content img.single-image {
  max-width: 100%;
  display: block;
  margin: 12px 0;
}

.cp-detail-content img:hover,
.cp-comment-content img:hover {
  transform: scale(1.02);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

/* 评论区图片尺寸稍小 */
.cp-comment-content img {
  max-width: min(45%, 200px);
}

.cp-comment-content img.vertical-image {
  max-width: min(30%, 150px);
}

/* 评论区表情图片：比正文更小更紧凑 */
.cp-comment-content img.emoji-inline {
  width: 28px;
  height: 28px;
  max-width: 28px !important;
  vertical-align: middle;
  margin: 0 2px;
  border-radius: 4px;
  cursor: pointer;
  transform: none !important;
  box-shadow: none !important;
}

.cp-comment-content img.emoji-inline:hover {
  transform: scale(1.15) !important;
  box-shadow: none !important;
}

/* 帖子正文表情：保持稍大 */
.cp-detail-content img.emoji-inline {
  width: 48px;
  height: 48px;
  max-width: 48px !important;
  vertical-align: middle;
  margin: 0 3px;
  border-radius: 5px;
  cursor: pointer;
  transform: none !important;
  box-shadow: none !important;
}

.cp-detail-content img.emoji-inline:hover {
  transform: scale(1.12) !important;
  box-shadow: none !important;
}

/* 图片容器 - 用于包裹连续图片，带过渡动画 */
.cp-image-group {
  display: flex;
  animation: fadeIn 0.3s ease;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
  align-items: flex-start;
}

.cp-image-group img {
  margin: 0;
  flex: 0 0 auto;
  opacity: 1 !important;
}

/* 图片淡入动画 */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* 图片预览遮罩层 */
.cp-image-preview-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  cursor: zoom-out;
}

.cp-image-preview-overlay.show {
  opacity: 1;
  visibility: visible;
}

.cp-image-preview-overlay img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  transform: scale(0.9);
  transition: transform 0.3s ease;
}

.cp-image-preview-overlay.show img {
  transform: scale(1);
}

.cp-image-preview-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.cp-image-preview-close:hover {
  background: rgba(255, 255, 255, 0.2);
}

.cp-image-preview-tip {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.6);
  font-size: 13px;
}

.cp-detail-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 16px 0;
}

.cp-detail-content th,
.cp-detail-content td {
  padding: 10px 12px;
  border: 1px solid var(--cc-border);
  text-align: left;
}

.cp-detail-content th {
  background: #f8fafc;
  font-weight: 600;
}

/* 隐藏内容区域 */
.cp-hidden-content-wrap {
  margin-top: 24px;
  border-radius: 12px;
  overflow: hidden;
}

/* 已解锁的隐藏内容 */
.cp-hidden-unlocked {
  background: linear-gradient(135deg, rgba(16,185,129,.14) 0%, rgba(16,185,129,.08) 100%);
  border: 1px solid rgba(16,185,129,.38);
  backdrop-filter: blur(14px) saturate(165%);
  -webkit-backdrop-filter: blur(14px) saturate(165%);
  border-radius: 12px;
  overflow: hidden;
}

.cp-hidden-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: rgba(255,255,255,.30);
  border-bottom: 1px solid rgba(16,185,129,0.22);
  font-size: 14px;
  font-weight: 600;
  color: #047857;
}

.cp-hidden-header i {
  font-size: 18px;
}

.cp-hidden-author-tip {
  font-weight: 400;
  font-size: 12px;
  color: #059669;
}

.cp-hidden-body {
  padding: 16px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--cc-text);
}

.cp-hidden-body p {
  margin-bottom: 12px;
}

.cp-hidden-body p:last-child {
  margin-bottom: 0;
}

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

/* 未解锁的隐藏内容提示 */
.cp-hidden-locked {
  background: linear-gradient(135deg, rgba(245,158,11,.14) 0%, rgba(245,158,11,.08) 100%);
  border: 1px dashed rgba(245,158,11,.42);
  backdrop-filter: blur(14px) saturate(165%);
  -webkit-backdrop-filter: blur(14px) saturate(165%);
  border-radius: 10px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.cp-hidden-lock-icon {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cp-hidden-lock-icon i {
  font-size: 20px;
  color: #fff;
}

.cp-hidden-lock-info {
  flex: 1;
  text-align: left;
}

.cp-hidden-lock-title {
  font-size: 14px;
  font-weight: 600;
  color: #92400e;
  margin-bottom: 4px;
}

.cp-hidden-lock-desc {
  font-size: 13px;
  color: #a16207;
  margin-bottom: 0;
}

.cp-hidden-lock-desc strong {
  color: #b45309;
  font-size: 15px;
  font-weight: 600;
}

.cp-hidden-lock-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  margin-top: 10px;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s;
  box-shadow: 0 4px 12px rgba(245,158,11,0.3);
}

.cp-hidden-lock-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(245,158,11,0.3);
  color: #fff;
  text-decoration: none;
}

.cp-hidden-lock-btn i {
  font-size: 14px;
}

/* 帖子底部操作 */
.cp-detail-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--cc-border);
}

.cp-detail-action {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border-radius: 10px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  border: 1px solid rgba(255,255,255,.52);
  background: rgba(255,255,255,.38);
  color: var(--cc-muted);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 2px 8px rgba(15,23,42,.06);
}

.cp-detail-action:hover {
  background: rgba(255,255,255,.54);
  border-color: rgba(var(--cc-blue-rgb, 37, 99, 235), .38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 6px 14px rgba(15,23,42,.10);
  color: var(--cc-blue);
}

.cp-detail-action.active {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  border-color: transparent;
  color: #fff;
}

.cp-detail-action i {
  font-size: 16px;
}


/* 分享按钮 */
.cp-share-btn:hover {
  color: #10b981 !important;
  border-color: #10b981 !important;
  background: rgba(16,185,129,0.05) !important;
}

/* 举报按钮 */
.cp-report-btn:hover {
  color: #ef4444 !important;
  border-color: #ef4444 !important;
  background: rgba(239,68,68,0.05) !important;
}

/* 高级分享弹窗 */
.cp-share-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    radial-gradient(1200px 600px at 18% 12%, rgba(var(--cc-blue-rgb, 37, 99, 235), .18), transparent 62%),
    radial-gradient(900px 520px at 88% 84%, rgba(16,185,129,.16), transparent 58%),
    rgba(15,23,42,.52);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  transition: opacity 0.3s;
}

.cp-share-modal.show {
  display: flex;
  opacity: 1;
}

.cp-share-dialog {
  position: relative;
  isolation: isolate;
  background: rgba(255,255,255,.26);
  border: 1px solid rgba(255,255,255,.56);
  border-radius: 22px;
  width: 100%;
  max-width: 420px;
  overflow: hidden;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 25px 80px rgba(15,23,42,.24);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  transform: scale(0.9) translateY(20px);
  transition: transform 0.3s;
}
.cp-share-dialog::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background: linear-gradient(148deg, rgba(255,255,255,.46) 0%, rgba(255,255,255,.10) 38%, transparent 68%);
}
.cp-share-dialog > * {
  position: relative;
  z-index: 1;
}

.cp-share-modal.show .cp-share-dialog {
  transform: scale(1) translateY(0);
}

.cp-share-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  background: linear-gradient(135deg, rgba(16,185,129,.92) 0%, rgba(5,150,105,.84) 100%);
  border-bottom: 1px solid rgba(255,255,255,.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28);
  color: #fff;
}

.cp-share-title {
  font-size: 18px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}

.cp-share-title i {
  font-size: 22px;
}

.cp-share-close {
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255,255,255,.32);
  background: rgba(255,255,255,0.16);
  border-radius: 50%;
  font-size: 18px;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.cp-share-close:hover {
  background: rgba(255,255,255,0.28);
  transform: rotate(90deg);
}

.cp-share-body {
  padding: 24px;
}

/* 社交分享按钮 */
.cp-share-platforms {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}

.cp-share-platform {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px 8px;
  border: 1px solid rgba(255,255,255,.58);
  background: rgba(255,255,255,.32);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 6px 18px rgba(15,23,42,.10);
  backdrop-filter: blur(12px) saturate(165%);
  -webkit-backdrop-filter: blur(12px) saturate(165%);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-share-platform:hover {
  transform: translateY(-3px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    0 10px 24px rgba(15,23,42,.16);
}

.cp-share-platform svg,
.cp-share-platform img.cp-share-platform-icon {
  width: 32px;
  height: 32px;
}
.cp-share-platform img.cp-share-platform-icon {
  object-fit: contain;
  display: block;
}

.cp-share-platform span {
  font-size: 12px;
  color: #64748b;
  font-weight: 500;
}

.cp-share-platform.wechat { background: linear-gradient(135deg, #f0fdf4, #dcfce7); }
.cp-share-platform.weibo { background: linear-gradient(135deg, #fef2f2, #fee2e2); }
.cp-share-platform.qq { background: linear-gradient(135deg, rgba(var(--cc-blue-rgb, 37, 99, 235),0.10), rgba(var(--cc-blue-rgb, 37, 99, 235),0.18)); }
.cp-share-platform.qrcode { background: linear-gradient(135deg, #f5f3ff, #ede9fe); }
.cp-share-platform.wechat { border-color: rgba(34,197,94,.28); }
.cp-share-platform.weibo { border-color: rgba(239,68,68,.24); }
.cp-share-platform.qq { border-color: rgba(var(--cc-blue-rgb, 37, 99, 235),.26); }
.cp-share-platform.qrcode { border-color: rgba(139,92,246,.24); }

/* 分割线 */
.cp-share-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  color: #94a3b8;
  font-size: 12px;
}

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

/* 链接复制区 */
.cp-share-link-section {
  background: rgba(255,255,255,.28);
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.66),
    0 6px 18px rgba(15,23,42,.07);
  backdrop-filter: blur(14px) saturate(170%);
  -webkit-backdrop-filter: blur(14px) saturate(170%);
  border-radius: 12px;
  padding: 16px;
}

.cp-share-link-label {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-share-link-label i {
  color: #10b981;
}

.cp-share-url-box {
  display: flex;
  gap: 10px;
}

.cp-share-url-input {
  flex: 1;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  font-size: 13px;
  color: #334155;
  background: rgba(255,255,255,.56);
  transition: all 0.2s;
  resize: none;
  height: 60px;
  line-height: 1.5;
  font-family: inherit;
}

.cp-share-url-input:focus {
  border-color: #10b981;
  box-shadow: 0 0 0 3px rgba(16,185,129,0.1);
  outline: none;
}

.cp-share-copy-btn {
  padding: 0 20px;
  border: none;
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
  white-space: nowrap;
  height: 60px;
}

.cp-share-copy-btn:hover {
  box-shadow: 0 6px 20px rgba(16,185,129,0.4);
  transform: translateY(-2px);
}

.cp-share-copy-btn.copied {
  background: linear-gradient(135deg, var(--cc-blue-600), var(--cc-blue));
}

/* 二维码弹窗 */
.cp-qrcode-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255,255,255,.52);
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
}

.cp-qrcode-overlay.show {
  opacity: 1;
  visibility: visible;
}

.cp-qrcode-box {
  padding: 16px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(255,255,255,.70);
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 10px 26px rgba(15,23,42,.14);
}

.cp-qrcode-box canvas {
  display: block;
}

.cp-qrcode-tip {
  font-size: 14px;
  color: #64748b;
  text-align: center;
}

.cp-qrcode-close {
  padding: 10px 24px;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  font-size: 13px;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-qrcode-close:hover {
  background: #f1f5f9;
}

/* 分享成功提示 */
.cp-share-tip {
  margin-top: 16px;
  padding: 12px;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  border-radius: 8px;
  font-size: 12px;
  color: #166534;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.cp-share-tip i {
  font-size: 14px;
}

/* 编辑按钮 */
.cp-edit-btn {
  color: var(--cc-blue) !important;
  border-color: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.32) !important;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.05) !important;
  text-decoration: none;
}

.cp-edit-btn:hover {
  color: var(--cc-blue-600) !important;
  border-color: var(--cc-blue) !important;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1) !important;
  text-decoration: none;
}

/* 删除按钮 */
.cp-delete-btn {
  color: #ef4444 !important;
  border-color: #fca5a5 !important;
  background: rgba(239,68,68,0.05) !important;
}

.cp-delete-btn:hover {
  color: #dc2626 !important;
  border-color: #ef4444 !important;
  background: rgba(239,68,68,0.1) !important;
}

/* 打赏按钮 */
.cp-reward-btn {
  color: #f59e0b !important;
  border-color: #fcd34d !important;
  background: rgba(245,158,11,0.08) !important;
}

.cp-reward-btn:hover {
  color: #d97706 !important;
  border-color: #f59e0b !important;
  background: rgba(245,158,11,0.15) !important;
}

/* 打赏统计 */
.cp-reward-stats {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  border-radius: 20px;
  font-size: 13px;
  color: #92400e;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-reward-stats-right {
  margin-left: auto;
}

.cp-reward-stats:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(245,158,11,0.25);
}

.cp-reward-stats i:first-child {
  font-size: 16px;
  color: #f59e0b;
}

.cp-reward-stats strong {
  color: #d97706;
}

/* 打赏弹窗 */
.cp-reward-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  align-items: center;
  justify-content: center;
  background: rgba(15,23,42,.50);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
}

.cp-reward-modal.show {
  display: flex;
}

.cp-reward-modal-content {
  background: rgba(255,255,255,.26);
  border: 1px solid rgba(255,255,255,.56);
  border-radius: 20px;
  width: 90%;
  max-width: 420px;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 20px 60px rgba(15,23,42,.22);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  animation: rewardModalIn 0.3s ease-out;
}

@keyframes rewardModalIn {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.cp-reward-modal-header {
  padding: 24px 24px 16px;
  text-align: center;
  border-bottom: 1px solid #f1f5f9;
}

.cp-reward-modal-header h3 {
  font-size: 18px;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.cp-reward-modal-header h3 i {
  font-size: 24px;
  color: #f59e0b;
}

.cp-reward-modal-body {
  padding: 24px;
}

.cp-reward-points-label {
  font-size: 14px;
  color: #64748b;
  margin-bottom: 12px;
}

.cp-reward-points-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}

.cp-reward-point-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 14px 8px;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-reward-point-item:hover {
  border-color: #fcd34d;
  background: #fffbeb;
}

.cp-reward-point-item.selected {
  border-color: #f59e0b;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  box-shadow: 0 4px 12px rgba(245,158,11,0.25);
}

.cp-reward-point-item .points-value {
  font-size: 18px;
  font-weight: 700;
  color: #d97706;
}

.cp-reward-point-item .points-label {
  font-size: 11px;
  color: #94a3b8;
  margin-top: 2px;
}

.cp-reward-point-item.selected .points-label {
  color: #92400e;
}

.cp-reward-message {
  margin-bottom: 16px;
}

.cp-reward-message label {
  display: block;
  font-size: 14px;
  color: #64748b;
  margin-bottom: 8px;
}

.cp-reward-message textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 14px;
  resize: none;
  height: 70px;
  transition: border-color 0.2s;
}

.cp-reward-message textarea:focus {
  outline: none;
  border-color: #f59e0b;
}

.cp-reward-balance {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #f8fafc;
  border-radius: 10px;
  margin-bottom: 20px;
}

.cp-reward-balance-label {
  font-size: 14px;
  color: #64748b;
}

.cp-reward-balance-value {
  font-size: 16px;
  font-weight: 600;
  color: #f59e0b;
}

.cp-reward-modal-footer {
  display: flex;
  gap: 12px;
  padding: 0 24px 24px;
}

.cp-reward-cancel-btn {
  flex: 1;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  color: #64748b;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-reward-cancel-btn:hover {
  background: #f8fafc;
}

.cp-reward-submit-btn {
  flex: 2;
  padding: 12px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-reward-submit-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(245,158,11,0.35);
}

.cp-reward-submit-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* 打赏记录弹窗 */
.cp-reward-list-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
}

.cp-reward-list-modal.show {
  display: flex;
}

.cp-reward-list-content {
  background: #fff;
  border-radius: 20px;
  width: 90%;
  max-width: 480px;
  max-height: 80vh;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

.cp-reward-list-header {
  padding: 20px 24px;
  border-bottom: 1px solid #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cp-reward-list-header h3 {
  font-size: 16px;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.cp-reward-list-close {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #f1f5f9;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-reward-list-close:hover {
  background: #e2e8f0;
}

.cp-reward-list-body {
  padding: 16px 24px;
  max-height: 400px;
  overflow-y: auto;
}

.cp-reward-list-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #f1f5f9;
}

.cp-reward-list-item:last-child {
  border-bottom: none;
}

.cp-reward-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fcd34d, #f59e0b);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  overflow: hidden;
}

.cp-reward-list-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cp-reward-list-info {
  flex: 1;
}

.cp-reward-list-name {
  font-size: 14px;
  font-weight: 500;
  color: #1e293b;
}

.cp-reward-list-msg {
  font-size: 12px;
  color: #94a3b8;
  margin-top: 2px;
}

.cp-reward-list-right {
  text-align: right;
}

.cp-reward-list-points {
  font-size: 15px;
  font-weight: 600;
  color: #f59e0b;
}

.cp-reward-list-time {
  font-size: 11px;
  color: #94a3b8;
  margin-top: 2px;
}

.cp-reward-list-empty {
  text-align: center;
  padding: 40px 20px;
  color: #94a3b8;
}

.cp-reward-list-empty i {
  font-size: 48px;
  color: #e2e8f0;
  margin-bottom: 12px;
}

/* 管理员工具栏 */
.cp-admin-toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  margin: 16px 0;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border: 1px solid #fcd34d;
  border-radius: 10px;
}

.cp-admin-toolbar-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #92400e;
  white-space: nowrap;
}

.cp-admin-toolbar-label i {
  font-size: 18px;
}

.cp-admin-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.cp-admin-tool {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border: none;
  border-radius: 8px;
  background: #fff;
  color: #78350f;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.cp-admin-tool:hover {
  background: #78350f;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(120,53,15,0.2);
}

/* 置顶下拉菜单 */
.cp-admin-tool-dropdown {
  position: relative;
  display: inline-block;
}

.cp-dropdown-arrow {
  font-size: 14px;
  margin-left: 2px;
  transition: transform 0.2s;
}

.cp-admin-tool-dropdown.open .cp-dropdown-arrow {
  transform: rotate(180deg);
}

.cp-admin-dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 140px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: all 0.2s;
  z-index: 100;
  overflow: hidden;
}

.cp-admin-tool-dropdown.open .cp-admin-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.cp-admin-dropdown-menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  color: #4b5563;
  text-decoration: none;
  font-size: 13px;
  transition: all 0.15s;
}

.cp-admin-dropdown-menu a:hover {
  background: #f3f4f6;
  color: #1f2937;
}

.cp-admin-dropdown-menu a.active {
  background: #fef3c7;
  color: #92400e;
  font-weight: 500;
}

.cp-admin-dropdown-menu a i {
  font-size: 16px;
}

.cp-admin-tool.active {
  background: var(--cc-blue);
  color: #fff;
}

.cp-admin-tool.active:hover {
  background: var(--cc-blue-600);
}

.cp-admin-tool i {
  font-size: 16px;
}

.cp-admin-tool-danger {
  background: #fef2f2;
  color: #dc2626;
}

.cp-admin-tool-danger:hover {
  background: #dc2626 !important;
  color: #fff !important;
  box-shadow: 0 4px 8px rgba(220,38,38,0.25);
}

/* 评论管理员删除按钮 */
.cp-comment-admin-delete {
  color: #ef4444 !important;
}

.cp-comment-admin-delete:hover {
  background: #fef2f2 !important;
}

/* 删除评论确认弹窗 */
.cp-delete-confirm-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  animation: fadeIn 0.2s ease;
  padding: 20px;
}

.cp-delete-confirm-dialog {
  background: var(--cc-white);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.3);
  width: 100%;
  max-width: 460px;
  animation: slideUp 0.3s ease;
  overflow: hidden;
}

.cp-delete-confirm-header {
  padding: 24px 28px 20px;
  border-bottom: 1px solid var(--cc-border);
  display: flex;
  align-items: center;
  gap: 12px;
}

.cp-delete-confirm-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
  color: #dc2626;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}

.cp-delete-confirm-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--cc-text);
  line-height: 1.4;
}

.cp-delete-confirm-body {
  padding: 24px 28px;
}

.cp-delete-confirm-message {
  font-size: 15px;
  color: var(--cc-text);
  line-height: 1.6;
  margin-bottom: 16px;
}

.cp-delete-confirm-warning {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border-left: 4px solid #f59e0b;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 14px;
  color: #92400e;
  line-height: 1.5;
  margin-bottom: 16px;
}

.cp-delete-confirm-warning i {
  margin-right: 6px;
  font-size: 16px;
  vertical-align: middle;
}

.cp-delete-confirm-points {
  background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
  border-left: 4px solid #dc2626;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 14px;
  color: #7f1d1d;
  line-height: 1.5;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-delete-confirm-points i {
  font-size: 20px;
  flex-shrink: 0;
}

.cp-delete-confirm-points-text {
  flex: 1;
}

.cp-delete-confirm-points strong {
  color: #dc2626;
  font-weight: 700;
  font-size: 16px;
}

.cp-delete-confirm-footer {
  padding: 20px 28px 24px;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.cp-delete-confirm-btn {
  padding: 12px 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.cp-delete-confirm-btn-cancel {
  background: #f1f5f9;
  color: var(--cc-text);
}

.cp-delete-confirm-btn-cancel:hover {
  background: #e2e8f0;
  transform: translateY(-1px);
}

.cp-delete-confirm-btn-delete {
  background: linear-gradient(135deg, #dc2626, #b91c1c);
  color: #fff;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
}

.cp-delete-confirm-btn-delete:hover {
  background: linear-gradient(135deg, #b91c1c, #991b1b);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(220, 38, 38, 0.4);
}

.cp-delete-confirm-btn-delete:active {
  transform: translateY(0);
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 举报弹窗 */
.cp-report-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15,23,42,.50);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}

.cp-report-modal.show {
  display: flex;
}

.cp-report-box {
  background: rgba(255,255,255,.26);
  border: 1px solid rgba(255,255,255,.56);
  border-radius: 16px;
  width: 90%;
  max-width: 460px;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 20px 60px rgba(15,23,42,.22);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  animation: modalSlideIn 0.3s ease;
}

@supports (backdrop-filter: url('#')) {
  .cp-external-link-dialog,
  .cp-share-dialog,
  .cp-reward-modal-content,
  .cp-report-box {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}

@keyframes modalSlideIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

.cp-report-header {
  padding: 20px 24px;
  border-bottom: 1px solid var(--cc-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cp-report-header h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--cc-text);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-report-header h3 i {
  color: #ef4444;
}

.cp-report-close {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: none;
  background: #f1f5f9;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.cp-report-close:hover {
  background: #e2e8f0;
}

.cp-report-body {
  padding: 24px;
}

.cp-report-reasons {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
}

.cp-report-reason {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border: 1px solid var(--cc-border);
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-report-reason:hover {
  border-color: var(--cc-blue);
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.03);
}

.cp-report-reason.selected {
  border-color: var(--cc-blue);
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.05);
}

.cp-report-reason input {
  margin-right: 12px;
  accent-color: var(--cc-blue);
}

.cp-report-reason span {
  font-size: 14px;
  color: var(--cc-text);
}

.cp-report-desc {
  width: 100%;
  min-height: 80px;
  padding: 12px 16px;
  border: 1px solid var(--cc-border);
  border-radius: 10px;
  font-size: 14px;
  resize: vertical;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.cp-report-desc:focus {
  outline: none;
  border-color: var(--cc-blue);
}

.cp-report-footer {
  padding: 16px 24px 24px;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.cp-report-btn-cancel {
  padding: 10px 20px;
  border: 1px solid var(--cc-border);
  border-radius: 10px;
  background: var(--cc-white);
  color: var(--cc-muted);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-report-btn-cancel:hover {
  background: #f8fafc;
}

.cp-report-btn-submit {
  padding: 10px 24px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-report-btn-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(239,68,68,0.3);
}

.cp-report-btn-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* 评论区：外壳样式已在 .cp-comment-column 上，这里清除 */
.cp-comments-card {
  background: transparent;
  border-radius: 0;
  padding: 20px 20px 0;
  box-shadow: none;
  border: none;
}

/* 右侧评论栏：标题区 / 列表 / 输入区由 flex 布局控制，无需 sticky */
#comments-section .cp-comment-list {
  padding-top: 2px;
}

.cp-comments-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--cc-text);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-comments-title i {
  color: var(--cc-blue);
}

.cp-comments-title span {
  font-size: 13px;
  color: var(--cc-muted);
  font-weight: 400;
}

/* @提及选择器 */
.mention-dropdown {
  position: fixed;
  background: rgba(255,255,255,.28);
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 12px;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.84),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 12px 36px rgba(15, 23, 42, 0.14);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  max-height: 260px;
  overflow-y: auto;
  z-index: 10002;
  display: none;
  min-width: 260px;
  width: auto;
}

.mention-dropdown.show {
  display: block;
  animation: mentionDropIn 0.16s ease-out;
}

@keyframes mentionDropIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.mention-dropdown-header {
  padding: 10px 12px;
  font-size: 12px;
  color: #475569;
  border-bottom: 1px solid rgba(255,255,255,.44);
  background: linear-gradient(180deg, rgba(255,255,255,.54) 0%, rgba(255,255,255,.24) 100%);
  border-radius: 12px 12px 0 0;
  letter-spacing: .2px;
}

.mention-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
  transition: background-color .15s ease, transform .15s ease;
  border-bottom: 1px solid rgba(255,255,255,.34);
}

.mention-item:last-child {
  border-bottom: none;
}

.mention-item:hover,
.mention-item.selected {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.52), rgba(59, 130, 246, 0.10));
  box-shadow: inset 0 0 0 1px rgba(var(--cc-blue-rgb, 37, 99, 235), .18);
  transform: translateX(1px);
}

.mention-item-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

.mention-item-name {
  flex: 1;
  font-size: 12px;
  font-weight: 600;
  color: var(--cc-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mention-item-badge {
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.16);
  color: var(--cc-blue-600);
  border: 1px solid rgba(37, 99, 235, 0.24);
  white-space: nowrap;
}

.mention-item-badge.mutual {
  background: rgba(16, 185, 129, 0.16);
  color: #059669;
  border-color: rgba(16, 185, 129, 0.28);
}

@supports (backdrop-filter: url('#')) {
  .mention-dropdown {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}

.mention-loading {
  padding: 22px 16px;
  text-align: center;
  color: var(--cc-muted);
  font-size: 13px;
}

.mention-empty {
  padding: 22px 16px;
  text-align: center;
  color: var(--cc-muted);
  font-size: 13px;
}

.mention-tip {
  font-size: 10px;
  color: #64748b;
  margin-top: 0;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: #f8fbff;
  border: 1px dashed #d8e5fb;
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 170px;
  line-height: 1.2;
  flex-shrink: 1;
}

.mention-tip-row {
  width: 100%;
  margin-bottom: 6px;
}

/* 评论中的@提及高亮 */
.mention-link {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: var(--cc-blue-600);
  font-weight: 600;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.1);
  border: 1px solid rgba(59, 130, 246, 0.22);
  padding: 1px 6px;
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
  word-break: keep-all;
  line-height: 1.2;
  font-size: 12px;
  transition: all .2s ease;
}

.mention-link:hover {
  background: rgba(37, 99, 235, 0.16);
  border-color: rgba(37, 99, 235, 0.35);
  color: #1e40af;
  transform: translateY(-1px);
  text-decoration: none;
}

/* 评论输入框 */
.cp-comment-input {
  display: block;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--cc-border);
}

/* 评论区头像框 */
.cp-comment-avatar-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cp-comment-avatar-frame {
  position: absolute;
  width: 140%;
  height: 140%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1;
}
.cp-comment-avatar-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  min-width: 100%;
  min-height: 100%;
}
.cp-comment-avatar-frame.small {
  width: 140%;
  height: 140%;
}

.cp-comment-input-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  flex-shrink: 0;
  overflow: hidden;
}

.cp-comment-input-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  flex-shrink: 0;
}

.cp-comment-input-box {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  max-width: 100%;
}

.cp-comment-input textarea {
  width: 100%;
  min-height: 80px;
  padding: 12px 14px;
  box-sizing: border-box;
  border: 1px solid var(--cc-border);
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.6;
  resize: vertical;
  outline: none;
  transition: all 0.2s;
}

.cp-comment-input textarea:focus {
  border-color: var(--cc-blue);
  box-shadow: 0 0 0 3px rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
}

.cp-comment-input-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.cp-comment-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  flex-wrap: wrap;
}

.cp-comment-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  cursor: pointer;
  transition: all 0.2s ease;
  vertical-align: middle;
  line-height: 1;
  margin: 0;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.cp-comment-upload-btn:hover {
  background: linear-gradient(135deg, rgba(var(--cc-blue-rgb, 37, 99, 235),0.10) 0%, rgba(var(--cc-blue-rgb, 37, 99, 235),0.18) 100%);
  border-color: rgba(var(--cc-blue-rgb, 37, 99, 235),0.34);
  color: var(--cc-blue);
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(15,23,42,0.14);
}

.cp-comment-upload-btn:active {
  transform: translateY(0);
  box-shadow: 0 1px 3px rgba(15,23,42,0.12);
}

.cp-comment-upload-btn i {
  font-size: 18px;
  line-height: 1;
}

.cp-comment-upload-btn input[type="file"] {
  display: none;
}

.cp-comment-images {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.cp-comment-image-item {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--cc-border);
}

.cp-comment-image-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cp-comment-image-item .cp-image-remove {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 20px;
  height: 20px;
  background: rgba(0,0,0,0.6);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cp-comment-image-item .cp-image-uploading {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 12px;
}

.cp-comment-submit {
  padding: 10px 20px;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  box-shadow: var(--cc-shadow-btn);
  flex-shrink: 0;
}

.cp-comment-submit:hover {
  transform: translateY(-1px);
  box-shadow: var(--cc-shadow-btn-hover);
}

.cp-comment-login {
  justify-content: center;
  padding: 20px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.05);
  border-radius: 10px;
  margin-bottom: 24px;
}

.cp-comment-login a {
  color: var(--cc-blue);
  text-decoration: none;
  font-weight: 500;
}

/* 评论列表 */
.cp-comment-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* 首条评论和标题区拉开一点距离 */
.cp-comment-list > .cp-comment-item:first-child {
  margin-top: 6px;
}

.cp-comment-item {
  display: flex;
  gap: 10px;
  transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s;
  padding: 12px 10px;
  margin: 0;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.48);
  background: rgba(255,255,255,.42);
  backdrop-filter: blur(12px) saturate(155%);
  -webkit-backdrop-filter: blur(12px) saturate(155%);
}

.cp-comment-item:hover {
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.28);
  background: rgba(255,255,255,.56);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
}

.cp-comment-pin-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 6px;
  color: #ea580c;
  background: rgba(251, 146, 60, 0.15);
}

/* AI 机器人评论样式 */
.cp-comment-item.cp-ai-bot-comment {
  background: linear-gradient(135deg, rgba(59,130,246,.03), rgba(139,92,246,.03));
  border: 1px solid rgba(59,130,246,.1);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 16px;
}
.cp-ai-bot-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #fff;
}
.cp-ai-bot-avatar svg {
  width: 22px;
  height: 22px;
}
.cp-ai-bot-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  padding: 1px 7px;
  border-radius: 4px;
  color: #fff;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  font-weight: 500;
  letter-spacing: .3px;
}
.cp-ai-bot-name {
  font-weight: 600;
  color: var(--cc-blue-600);
  font-size: 13px;
}

.cp-comment-highlight {
  background-color: #fef9c3 !important;
  box-shadow: 0 0 0 3px #fcd34d;
  animation: commentHighlight 0.5s ease-out;
}

@keyframes commentHighlight {
  0% { transform: scale(1.02); }
  100% { transform: scale(1); }
}

.cp-comment-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #94a3b8, #64748b);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  font-size: 12px;
  flex-shrink: 0;
  overflow: hidden;
}

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

.cp-comment-body {
  flex: 1;
  min-width: 0;
}

.cp-comment-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 4px;
  column-gap: 8px;
  margin-bottom: 8px;
}

.cp-comment-author {
  font-size: 13px;
  font-weight: 600;
  color: var(--cc-text);
}

.cp-comment-time {
  font-size: 11px;
  color: var(--cc-muted);
}

.cp-comment-content {
  font-size: 13px;
  line-height: 1.65;
  color: var(--cc-text);
  margin: 2px 0 8px;
  word-break: break-word;
}

.cp-comment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cp-comment-action {
  font-size: 11px;
  color: var(--cc-muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: all 0.2s;
  background: none;
  border: none;
  padding: 0;
}

.cp-comment-action:hover {
  color: var(--cc-blue);
}

.cp-comment-action.liked {
  color: #ef4444;
}

/* 子评论 */
.cp-comment-replies {
  margin-top: 12px;
  margin-left: 6px;
  padding-left: 12px;
  border-left: 2px solid rgba(255,255,255,.46);
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
  max-width: 100%;
  box-sizing: border-box;
}

.cp-comment-reply-item {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,.36);
  border: 1px solid rgba(255,255,255,.52);
  border-radius: 10px;
  backdrop-filter: blur(12px) saturate(155%);
  -webkit-backdrop-filter: blur(12px) saturate(155%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 4px 12px rgba(15,23,42,.06);
  transition: background .2s, border-color .2s, box-shadow .2s;
  overflow: hidden;
  max-width: 100%;
  box-sizing: border-box;
}

.cp-comment-reply-item:hover {
  background: rgba(255,255,255,.52);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.84),
    0 8px 16px rgba(15,23,42,.10);
}

.cp-comment-reply-item .cp-comment-body {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.cp-comment-reply-item .cp-comment-content img {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box;
}

.cp-comment-reply-item.hidden {
  display: none;
}

.cp-comment-reply-item .cp-comment-avatar {
  width: 24px;
  height: 24px;
  font-size: 10px;
}

.cp-comment-reply-to {
  display: inline-flex;
  align-items: center;
  max-width: 180px;
  color: var(--cc-blue-600);
  font-weight: 600;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.1);
  border: 1px solid rgba(59, 130, 246, 0.22);
  border-radius: 999px;
  padding: 1px 7px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  font-size: 12px;
  line-height: 1.2;
}

.cp-comment-reply-to:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.16);
  border-color: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.35);
  color: var(--cc-blue-600);
  text-decoration: none;
}

/* 查看更多/收起按钮 */
.cp-replies-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 16px;
  margin-top: 8px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.05);
  border: none;
  border-radius: 8px;
  color: var(--cc-blue);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-replies-toggle:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
}

/* 分页 */
.cp-replies-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--cc-border);
}

.cp-replies-page {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
  background: #f1f5f9;
  color: var(--cc-muted);
}

.cp-replies-page:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  color: var(--cc-blue);
}

.cp-replies-page.active {
  background: var(--cc-blue);
  color: #fff;
}

.cp-replies-page:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* 回复输入框 */
.cp-reply-input {
  margin-top: 12px;
  padding: 12px;
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.03);
  border-radius: 10px;
  display: none;
}

.cp-reply-input.show {
  display: block;
}

.cp-reply-input textarea {
  width: 100%;
  min-height: 60px;
  padding: 10px 12px;
  box-sizing: border-box;
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.5;
  resize: none;
  outline: none;
  margin-bottom: 10px;
}

.cp-reply-input textarea:focus {
  border-color: var(--cc-blue);
}

.cp-reply-input-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.cp-reply-btn {
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
}

.cp-reply-btn-cancel {
  background: #f1f5f9;
  color: var(--cc-muted);
}

.cp-reply-btn-submit {
  background: var(--cc-blue);
  color: #fff;
}

/* 空评论 */
.cp-comments-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--cc-muted);
}

.cp-comments-empty i {
  font-size: 36px;
  margin-bottom: 12px;
  display: block;
  color: #cbd5e1;
}

/* 骨架屏 */
.cp-skeleton {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(255,255,255,.52), rgba(255,255,255,.30));
  border: 1px solid rgba(255,255,255,.52);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
  backdrop-filter: blur(12px) saturate(160%);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  border-radius: 8px;
}
.cp-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.62) 45%, rgba(255,255,255,0) 100%);
  animation: cpSkeletonShimmer 1.35s infinite;
}
@keyframes cpSkeletonShimmer {
  100% { transform: translateX(100%); }
}
.cp-detail-skeleton-card {
  background: rgba(255,255,255,.20);
  border: 1px solid rgba(255,255,255,.50);
  border-radius: 14px;
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.82),
    inset 0 -1px 0 rgba(255,255,255,.18),
    0 6px 18px rgba(15,23,42,.08);
  padding: 14px;
  backdrop-filter: blur(18px) saturate(170%);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
}
.cp-detail-skeleton-badges { display: flex; gap: 8px; margin-bottom: 14px; }
.cp-detail-skeleton-badge { width: 82px; height: 24px; border-radius: 999px; }
.cp-detail-skeleton-title { height: 34px; border-radius: 10px; margin-bottom: 12px; width: 100%; }
.cp-detail-skeleton-title.s2 { width: 94%; height: 30px; margin-bottom: 18px; }
.cp-detail-skeleton-author { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.cp-detail-skeleton-avatar { width: 44px; height: 44px; border-radius: 50%; }
.cp-detail-skeleton-author-lines { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.cp-detail-skeleton-author-lines .l1 { height: 14px; width: 180px; }
.cp-detail-skeleton-author-lines .l2 { height: 12px; width: 280px; }
.cp-detail-skeleton-stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 18px; }
.cp-detail-skeleton-stats .item { height: 36px; border-radius: 10px; }
.cp-detail-skeleton-content { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.cp-detail-skeleton-content .line { height: 14px; border-radius: 8px; }
.cp-detail-skeleton-content .line.short { width: 92%; }
.cp-detail-skeleton-content .line.mid { width: 98%; }
.cp-detail-skeleton-resource {
  margin-bottom: 18px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 12px;
  padding: 12px;
  background: rgba(255,255,255,.24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68);
}
.cp-detail-skeleton-resource-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.cp-detail-skeleton-resource-tabs .tab {
  width: 96px;
  height: 30px;
  border-radius: 8px;
}
.cp-detail-skeleton-resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin-bottom: 10px;
}
.cp-detail-skeleton-resource-grid .item {
  height: 52px;
  border-radius: 10px;
}
.cp-detail-skeleton-resource-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cp-detail-skeleton-resource-links .row {
  height: 42px;
  border-radius: 10px;
}
.cp-detail-skeleton-hidden {
  margin-bottom: 18px;
  border: 1px dashed rgba(255,255,255,.52);
  border-radius: 12px;
  padding: 14px;
  background: rgba(255,255,255,.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cp-detail-skeleton-hidden .title { width: 160px; height: 16px; border-radius: 8px; }
.cp-detail-skeleton-hidden .desc { width: 82%; height: 14px; border-radius: 8px; }
.cp-detail-skeleton-hidden .btn { width: 140px; height: 36px; border-radius: 10px; }
.cp-detail-skeleton-actions { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.cp-detail-skeleton-actions .btn { height: 40px; border-radius: 10px; }

.cp-comment-skeleton-list { display: flex; flex-direction: column; gap: 12px; }
.cp-comment-skeleton-item {
  background: rgba(255,255,255,.20);
  border: 1px solid rgba(255,255,255,.50);
  border-radius: 12px;
  padding: 12px;
  display: flex;
  gap: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 4px 12px rgba(15,23,42,.06);
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
}

@supports (backdrop-filter: url('#')) {
  .cp-detail-skeleton-card,
  .cp-comment-skeleton-item,
  .cp-skeleton {
    backdrop-filter: url(#lg-card-filter);
    -webkit-backdrop-filter: url(#lg-card-filter);
  }
}
.cp-comment-skeleton-avatar { width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0; }
.cp-comment-skeleton-body { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.cp-comment-skeleton-body .l1 { height: 12px; width: 140px; }
.cp-comment-skeleton-body .l2 { height: 12px; width: 95%; }
.cp-comment-skeleton-body .l3 { height: 12px; width: 78%; }
@media (max-width: 768px) {
  .cp-detail-skeleton-stats,
  .cp-detail-skeleton-actions { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .cp-detail-skeleton-resource-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .cp-detail-skeleton-author-lines .l1 { width: 120px; }
  .cp-detail-skeleton-author-lines .l2 { width: 180px; }
}

/* 响应式 */
@media (max-width: 640px) {
  html, body {
    height: auto;
    overflow: auto;
  }

  body { display: block; }

  .cp-page-wrapper {
    display: block;
    overflow: visible;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .cp-detail-wrap {
    display: block;
    flex: none;
    padding: 10px 0 20px;
  }

  .cp-detail-two-col {
    display: block;
  }

  .cp-main-column,
  .cp-comment-column {
    overflow: visible;
    padding: 0;
    scrollbar-width: auto;
    scrollbar-color: auto;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: none;
    display: block;
  }

  .cp-comment-column {
    margin-top: 16px;
  }

  .cp-detail-card {
    background: var(--cc-white);
    border-radius: 12px;
    padding: 16px;
    box-shadow: var(--cc-shadow);
    margin-bottom: 16px;
    border: 1px solid #e9eff8;
  }

  .cp-comments-card,
  .cp-comment-column .cp-comments-card {
    display: block;
    background: var(--cc-white);
    border-radius: 12px;
    padding: 16px;
    box-shadow: var(--cc-shadow);
    border: 1px solid #e9eff8;
  }

  .cp-comment-column .cp-comment-list {
    overflow: visible;
  }

  .cp-comment-column .cp-comment-input {
    position: static;
    margin-top: 16px;
    padding: 16px 0 0;
    border-top: 1px solid var(--cc-border);
  }
  
  .cp-detail-header {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }
  
  .cp-detail-badges {
    gap: 6px;
    margin-bottom: 10px;
    flex-wrap: wrap;
  }
  
  .cp-detail-badge {
    padding: 3px 8px;
    font-size: 11px;
  }
  
  .cp-detail-title {
    font-size: 17px;
    margin-bottom: 14px;
    line-height: 1.4;
  }
  
  .cp-detail-author {
    flex-wrap: wrap;
    gap: 10px;
  }
  
  .cp-detail-avatar {
    width: 40px;
    height: 40px;
    font-size: 14px;
  }
  
  .cp-detail-author-info {
    flex: 1;
    min-width: 0;
  }
  
  .cp-detail-author-row {
    flex-wrap: wrap;
    gap: 6px;
  }
  
  .cp-detail-author-name {
    font-size: 13px;
  }
  
  .cp-user-level-badge {
    padding: 2px 6px !important;
    font-size: 10px !important;
  }
  
  .cp-admin-badge {
    padding: 2px 6px;
    font-size: 10px;
  }
  
  .cp-admin-badge i {
    font-size: 10px;
  }
  
  .cp-author-follow-btn {
    padding: 3px 10px;
    font-size: 11px;
  }
  
  .cp-detail-meta {
    font-size: 11px;
    margin-top: 4px;
  }
  
  /* 统计信息栏 */
  .cp-detail-stats-bar {
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
  }
  
  .cp-detail-stat-item {
    padding: 5px 10px;
    font-size: 12px;
    gap: 4px;
  }
  
  .cp-detail-stat-item i {
    font-size: 14px;
  }
  
  /* 帖子内容 */
  .cp-detail-content {
    font-size: 14px;
    line-height: 1.7;
  }
  
  .cp-detail-content img {
    max-width: 48%;
    height: auto;
    border-radius: 6px;
  }
  
  /* 移动端图片组 - 一行显示2-3张 */
  .cp-image-group {
    gap: 6px;
  }
  
  .cp-image-group img {
    max-width: calc(50% - 3px) !important;
    max-height: 240px !important;
  }
  
  .cp-image-group img.vertical-image {
    max-width: calc(33.33% - 4px) !important;
  }
  
  /* 竖向图片在移动端 */
  .cp-detail-content img.vertical-image {
    max-width: min(45%, 160px);
  }
  
  /* 单独大图在移动端保持全宽 */
  .cp-detail-content img.single-image {
    max-width: 100%;
    display: block;
  }
  
  /* 底部操作按钮 */
  .cp-detail-actions {
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
  }
  
  .cp-detail-action {
    padding: 8px 12px;
    font-size: 12px;
    gap: 4px;
    border-radius: 8px;
  }
  
  .cp-detail-action i {
    font-size: 14px;
  }
  
  /* 打赏按钮样式优化 */
  .cp-reward-btn {
    flex: none;
  }
  
  /* 打赏统计 */
  .cp-reward-stats {
    width: 100%;
    margin-top: 8px;
    padding: 10px 12px;
    font-size: 12px;
    justify-content: center;
  }
  
  .cp-comment-input {
    flex-direction: column;
  }

  .cp-comment-input-actions {
    align-items: stretch;
    gap: 8px;
  }

  .cp-comment-toolbar {
    width: 100%;
    justify-content: flex-start;
    gap: 6px;
  }

  .mention-tip {
    max-width: 120px;
    font-size: 9px;
    padding: 2px 6px;
  }

  .cp-comment-submit {
    margin-left: auto;
    padding: 9px 16px;
    font-size: 12px;
  }
  
  .cp-comment-avatar-wrap {
    display: none;
  }
  
  .cp-comment-input-avatar {
    display: none;
  }
  
  .cp-comment-replies {
    padding-left: 16px;
  }
  
  /* 评论区优化 */
  .cp-comments-title {
    font-size: 16px;
  }
  
  /* 评论区移动端优化 */
  .cp-comment-item {
    padding: 10px;
    gap: 10px;
    border-radius: 10px;
    border: 1px solid #edf2f8;
    background: #fff;
  }
  
  .cp-comment-avatar {
    width: 32px;
    height: 32px;
    font-size: 12px;
    flex-shrink: 0;
  }
  
  .cp-comment-body {
    min-width: 0;
    flex: 1;
  }
  
  .cp-comment-header {
    flex-wrap: wrap;
    gap: 4px 6px;
    margin-bottom: 6px;
    align-items: center;
  }
  
  .cp-comment-author {
    font-size: 13px;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  
  .cp-user-level-sm {
    padding: 1px 5px !important;
    font-size: 9px !important;
    border-radius: 6px !important;
  }
  
  .cp-user-level-sm i {
    font-size: 9px !important;
  }
  
  .cp-admin-badge-sm {
    padding: 1px 5px !important;
    font-size: 9px !important;
  }
  
  .cp-admin-badge-sm i {
    font-size: 9px !important;
  }
  
  .cp-comment-reply-to {
    font-size: 11px;
    max-width: 140px;
  }
  
  .cp-comment-time {
    font-size: 10px;
    color: #94a3b8;
    flex-basis: 100%;
    margin-top: 2px;
  }
  
  .cp-comment-content {
    font-size: 13px;
    line-height: 1.65;
  }
  
  .cp-comment-actions {
    gap: 12px;
    margin-top: 6px;
  }
  
  .cp-comment-action {
    font-size: 11px;
    padding: 4px 0;
  }
  
  /* 楼中楼回复优化 */
  .cp-comment-replies {
    padding-left: 12px;
    margin-top: 10px;
    border-left: 2px solid #e2e8f0;
  }
  
  .cp-comment-replies .cp-comment-item {
    padding: 10px 0;
  }
  
  .cp-comment-replies .cp-comment-avatar {
    width: 28px;
    height: 28px;
    font-size: 11px;
  }
  
  .cp-comment-replies .cp-comment-author {
    font-size: 12px;
    max-width: 60px;
  }
  
  .cp-comment-replies .cp-comment-content {
    font-size: 12px;
  }
  
  /* 管理员工具栏 */
  .cp-admin-toolbar {
    flex-wrap: wrap;
    gap: 6px;
  }
  
  .cp-admin-tool-btn {
    padding: 4px 8px;
    font-size: 11px;
  }
}

@media (max-width: 1200px) {
  html, body {
    height: auto;
    overflow: auto;
  }

  body {
    display: block;
  }

  .cp-page-wrapper {
    display: block;
    overflow: visible;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .cp-detail-wrap {
    display: block;
    flex: none;
    padding: 10px 0 20px;
  }

  .cp-detail-two-col {
    display: block;
  }

  .cp-main-column,
  .cp-comment-column {
    overflow: visible;
    padding: 0;
    scrollbar-width: auto;
    scrollbar-color: auto;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: none;
    display: block;
  }

  .cp-comment-column {
    margin-top: 20px;
  }

  /* 小屏下卡片恢复自身样式 */
  .cp-detail-card {
    background: var(--cc-white);
    border-radius: 14px;
    padding: 28px;
    box-shadow: var(--cc-shadow);
    margin-bottom: 24px;
    border: 1px solid #e9eff8;
  }

  .cp-comments-card {
    background: var(--cc-white);
    border-radius: 14px;
    padding: 20px 24px;
    box-shadow: var(--cc-shadow);
    border: 1px solid #e9eff8;
  }

  /* 小屏下评论列表恢复正常 */
  .cp-comment-column .cp-comments-card {
    display: block;
    padding: 20px 24px;
    background: var(--cc-white);
    border-radius: 14px;
    box-shadow: var(--cc-shadow);
    border: 1px solid #e9eff8;
  }

  .cp-comment-column .cp-comment-list {
    overflow: visible;
  }

  .cp-comment-column .cp-comment-input {
    position: static;
    margin-top: 16px;
    padding: 16px 0 0;
    border-top: 1px solid var(--cc-border);
  }
}

/* 超小屏幕优化 */
@media (max-width: 400px) {
  .cp-detail-card,
  .cp-comments-card {
    padding: 14px;
  }
  
  .cp-detail-title {
    font-size: 16px;
  }
  
  .cp-detail-avatar {
    width: 36px;
    height: 36px;
    font-size: 13px;
  }
  
  .cp-detail-actions {
    gap: 6px;
  }
  
  .cp-detail-action {
    padding: 6px 10px;
    font-size: 11px;
  }
  
  .cp-detail-action span:not(:first-child) {
    display: none;
  }
  
  /* 评论区超小屏优化 */
  .cp-comment-item {
    gap: 8px;
  }
  
  .cp-comment-avatar {
    width: 28px;
    height: 28px;
    font-size: 11px;
  }
  
  .cp-comment-author {
    max-width: 60px;
    font-size: 12px;
  }
  
  .cp-user-level-sm {
    display: none !important;
  }
  
  .cp-comment-header > span[style*="回复"] {
    font-size: 11px;
  }
  
  .cp-comment-reply-to {
    font-size: 11px;
    max-width: 120px;
  }
  
  .cp-comment-replies {
    padding-left: 8px;
  }
  
  .cp-comment-replies .cp-comment-avatar {
    width: 24px;
    height: 24px;
    font-size: 10px;
  }
  
  .cp-comment-replies .cp-comment-author {
    max-width: 50px;
    font-size: 11px;
  }
  
  .cp-comment-replies .cp-comment-content {
    font-size: 11px;
  }

  .mention-tip {
    display: none;
  }

  .cp-comment-toolbar {
    gap: 6px;
  }

  .cp-comment-submit {
    padding: 8px 14px;
    font-size: 12px;
  }
}

/* 图片预览模态框 */
.cp-image-preview-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0,0,0,0.9);
  align-items: center;
  justify-content: center;
  padding: 20px;
  cursor: zoom-out;
}

.cp-image-preview-modal.show {
  display: flex;
}

.cp-image-preview-modal img {
  max-width: 95%;
  max-height: 95vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  animation: imageZoomIn 0.2s ease;
}

@keyframes imageZoomIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.cp-image-preview-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  border: none;
  background: rgba(255,255,255,0.1);
  border-radius: 50%;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.cp-image-preview-close:hover {
  background: rgba(255,255,255,0.2);
  transform: rotate(90deg);
}

.cp-image-preview-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  border: none;
  background: rgba(255,255,255,0.1);
  border-radius: 50%;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.cp-image-preview-nav:hover {
  background: rgba(255,255,255,0.2);
}

.cp-image-preview-nav.prev {
  left: 20px;
}

.cp-image-preview-nav.next {
  right: 20px;
}

.cp-image-preview-counter {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 14px;
  background: rgba(0,0,0,0.5);
  padding: 6px 16px;
  border-radius: 20px;
}

/* 帖子和评论中的图片可点击 - 多图并排，防闪烁 */
.cp-detail-content img,
.cp-comment-content img,
.comment-images img {
  cursor: zoom-in;
  transition: opacity 0.3s ease, transform 0.2s, box-shadow 0.2s, max-width 0.3s ease;
  max-width: 48%;
  height: auto;
  border-radius: 8px;
  object-fit: contain;
  display: inline-block;
  vertical-align: top;
  opacity: 0.6;
}
/* 多图场景限制单张最大高度，避免第4张竖图过高 */
.cp-detail-content img:not(.single-image):not(.emoji-inline),
.cp-comment-content img:not(.emoji-inline),
.comment-images img {
  max-height: 360px;
}

/* 图片分类完成后完全显示 */
.cp-detail-content img.classified,
.cp-comment-content img.classified,
.comment-images img.classified {
  opacity: 1;
}

/* 图片组容器样式 */
.cp-image-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
  align-items: flex-start;
  animation: fadeIn 0.3s ease;
}

.cp-image-group img {
  margin: 0 !important;
  flex: 0 0 auto;
  max-width: calc(33.33% - 6px);
  max-height: 320px;
  width: auto;
  opacity: 1 !important;
}

.cp-image-group img.vertical-image {
  max-width: min(30%, 220px);
}

.cp-image-group img.horizontal-image {
  max-width: min(50%, 350px);
}

/* 单独大图样式 */
.cp-detail-content img.single-image {
  max-width: 100%;
  display: block;
  margin: 12px 0;
}

/* 竖向图片样式优化 */
.cp-detail-content img.vertical-image,
.comment-images img.vertical-image {
  max-width: min(32%, 200px);
}

/* 评论区竖向图片尺寸更小 */
.cp-comment-content img.vertical-image {
  max-width: min(30%, 150px);
}

.cp-detail-content img:hover,
.cp-comment-content img:hover,
.comment-images img:hover {
  transform: scale(1.02);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

/* 论坛版权说明 */
.cp-copyright-notice {
  background: var(--cc-white);
  border-radius: 10px;
  padding: 14px 18px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid var(--cc-border);
}

.cp-copyright-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--cc-text);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-copyright-title i {
  color: var(--cc-blue);
  font-size: 14px;
}

.cp-copyright-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}

.cp-copyright-item {
  font-size: 11px;
  line-height: 1.5;
  color: var(--cc-muted);
  padding: 0;
  padding-left: 18px;
  position: relative;
  flex: 0 0 auto;
}

.cp-copyright-item::before {
  content: counter(copyright-counter);
  counter-increment: copyright-counter;
  position: absolute;
  left: 0;
  color: var(--cc-blue);
  font-weight: 600;
  font-size: 11px;
}

.cp-copyright-list {
  counter-reset: copyright-counter;
}

@media (max-width: 768px) {
  .cp-copyright-notice {
    padding: 12px 14px;
    margin-bottom: 16px;
  }
  
  .cp-copyright-title {
    font-size: 12px;
    margin-bottom: 8px;
  }
  
  .cp-copyright-list {
    gap: 8px 12px;
  }
  
  .cp-copyright-item {
    font-size: 10px;
    line-height: 1.4;
    padding-left: 16px;
  }
  
  .cp-copyright-item::before {
    font-size: 10px;
  }
}

/* ==================== 资源帖子详情样式 ==================== */
.cp-resource-info {
  background: rgba(255,255,255,.22);
  border-radius: 16px;
  padding: 0;
  margin-bottom: 24px;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.78),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 6px 20px rgba(15,23,42,.08);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  overflow: hidden;
}

/* Tab 导航 */
.cp-resource-tabs {
  display: flex;
  border-bottom: 1px solid rgba(255,255,255,.44);
  background: linear-gradient(135deg, rgba(255,255,255,.36), rgba(255,255,255,.20));
}

.cp-resource-tab {
  flex: 1;
  padding: 14px 20px;
  border: none;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.2s;
  position: relative;
}

.cp-resource-tab:hover {
  color: var(--cc-blue);
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), 0.05);
}

.cp-resource-tab.active {
  color: var(--cc-blue-600);
  font-weight: 600;
  background: rgba(255,255,255,.54);
}

.cp-resource-tab.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--cc-blue);
}

.cp-resource-tab i {
  font-size: 18px;
}

/* Tab 内容区 */
.cp-resource-tab-content {
  padding: 0;
}

/* 资源基本信息区 */
.cp-resource-basic {
  padding: 20px 24px;
  background: linear-gradient(135deg, rgba(var(--cc-blue-rgb, 37, 99, 235),0.14), rgba(var(--cc-blue-rgb, 37, 99, 235),0.08));
  border-bottom: 1px solid rgba(var(--cc-blue-rgb, 37, 99, 235),0.22);
}

/* 更新内容区域 */
.cp-resource-changelog {
  padding: 16px 24px;
  background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.06));
  border-bottom: 1px solid rgba(245,158,11,.28);
}

.cp-resource-changelog-title {
  font-size: 13px;
  font-weight: 600;
  color: #92400e;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-resource-changelog-title i {
  font-size: 16px;
}

.cp-resource-changelog-content {
  font-size: 14px;
  color: #78350f;
  line-height: 1.7;
  white-space: pre-wrap;
}

.cp-resource-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
}

.cp-resource-info-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cp-resource-info-label {
  font-size: 11px;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.cp-resource-info-value {
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-resource-info-value i {
  color: var(--cc-blue);
}

.cp-resource-info-value.version {
  color: var(--cc-blue);
  background: rgba(255,255,255,.56);
  border: 1px solid rgba(255,255,255,.52);
  padding: 4px 10px;
  border-radius: 6px;
  display: inline-flex;
  width: fit-content;
}

.cp-resource-info-value.game-version {
  color: #059669;
  background: rgba(16,185,129,.18);
  border: 1px solid rgba(16,185,129,.30);
  padding: 4px 10px;
  border-radius: 6px;
  display: inline-flex;
  width: fit-content;
}

/* 资源标签区 */
.cp-resource-tags-section {
  padding: 16px 24px;
  border-bottom: 1px solid #e2e8f0;
}

.cp-resource-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cp-resource-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  background: #fff;
  border: 1px solid #e2e8f0;
}

/* 资源统计区 */
.cp-resource-stats-section {
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  border-bottom: 1px solid #e2e8f0;
}

.cp-resource-stats {
  display: flex;
  gap: 20px;
}

.cp-resource-stat {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #64748b;
}

.cp-resource-stat i {
  font-size: 18px;
  color: #94a3b8;
}

.cp-resource-stat strong {
  color: #1e293b;
  font-weight: 600;
}

/* 版权信息 */
.cp-resource-copyright {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: #fefce8;
  font-size: 13px;
  color: #a16207;
}

.cp-resource-copyright i {
  font-size: 16px;
}

.cp-resource-copyright a {
  color: #ca8a04;
  text-decoration: none;
  font-weight: 500;
  word-break: break-all;
}

.cp-resource-copyright a:hover {
  text-decoration: underline;
}

/* ==================== 视频帖子样式 ==================== */
.cp-video-info {
  margin: 14px 0;
  padding: 14px;
  border: 1px solid var(--cc-border);
  border-radius: 12px;
  background: #f8fbff;
}
/* ========== 视频帖子：上下布局（视频+内容 / 评论区） ========== */
html:has(.cp-video-detail),
html.cp-has-video-detail,
html:has(.cp-video-detail) body,
html.cp-has-video-detail body {
  height: auto !important;
  overflow: auto !important;
}
html:has(.cp-video-detail) body,
html.cp-has-video-detail body {
  display: block !important;
}
html:has(.cp-video-detail) .cp-page-wrapper,
html.cp-has-video-detail .cp-page-wrapper {
  display: block !important;
  overflow: visible !important;
}
html:has(.cp-video-detail) .cp-detail-wrap,
html.cp-has-video-detail .cp-detail-wrap {
  display: block !important;
  flex: none !important;
}
html:has(.cp-video-detail) .cp-detail-two-col,
html.cp-has-video-detail .cp-detail-two-col {
  display: block !important;
  min-height: auto !important;
}
html:has(.cp-video-detail) .cp-main-column,
html.cp-has-video-detail .cp-main-column {
  overflow: visible !important;
  height: auto !important;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html:has(.cp-video-detail) .cp-main-column::before,
html.cp-has-video-detail .cp-main-column::before {
  display: none !important;
}
html:has(.cp-video-detail) .cp-main-column > .cp-breadcrumb,
html.cp-has-video-detail .cp-main-column > .cp-breadcrumb {
  margin-bottom: 12px;
  padding: 0;
  border-bottom: none;
}
html:has(.cp-video-detail) .cp-comment-column,
html.cp-has-video-detail .cp-comment-column {
  overflow: visible !important;
  height: auto !important;
  margin-top: 20px;
  background: rgba(255,255,255,.22);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.80),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 4px 16px rgba(15,23,42,.08),
    0 1px 4px rgba(15,23,42,.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}
html:has(.cp-video-detail) .cp-comment-column .cp-comments-card,
html.cp-has-video-detail .cp-comment-column .cp-comments-card {
  flex: none;
  min-height: auto;
}
html:has(.cp-video-detail) .cp-comment-column .cp-comment-list,
html.cp-has-video-detail .cp-comment-column .cp-comment-list {
  overflow: visible !important;
  max-height: none !important;
  flex: none;
  min-height: auto;
}
html:has(.cp-video-detail) .cp-comment-column .cp-comment-input,
html.cp-has-video-detail .cp-comment-column .cp-comment-input {
  position: static;
}

/* ========== B站风格 · 视频帖子布局 ========== */
.cp-detail-card.cp-video-detail {
  background: rgba(255,255,255,.22);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.80),
    inset 0 -1px 0 rgba(255,255,255,.20),
    0 4px 16px rgba(15,23,42,.08),
    0 1px 4px rgba(15,23,42,.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  padding: 24px;
  position: relative;
}
.cp-detail-card.cp-video-detail::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(148deg, rgba(255,255,255,.44) 0%, rgba(255,255,255,.10) 35%, transparent 62%);
  z-index: 0;
}
.cp-detail-card.cp-video-detail > * {
  position: relative;
  z-index: 1;
}
.cp-detail-card.cp-video-detail .cp-video-hero {
  margin: 0 -24px;
  overflow: clip;
  background: #000;
  position: relative;
  touch-action: pan-y !important;
}
.cp-detail-card.cp-video-detail .cp-video-hero .cp-video-player-wrap {
  border-radius: 0;
}
.cp-video-top-header {
  margin-bottom: 12px;
  margin-left: -12px;
}
.cp-video-top-header .cp-detail-title {
  font-size: 20px;
  margin-bottom: 8px;
}
.cp-video-top-header .cp-detail-badges {
  margin-bottom: 0;
}
.cp-video-meta-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
}
.cp-video-meta-row .cp-detail-badges {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.cp-video-stats-inline {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: var(--cc-muted);
  flex-wrap: wrap;
}
.cp-video-stats-inline span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
}
.cp-video-stats-inline i {
  font-size: 14px;
}
.cp-detail-card.cp-video-detail .cp-detail-header {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.cp-detail-card.cp-video-detail .cp-detail-actions {
  margin-top: 14px;
  padding-top: 0;
  border-top: none;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--cc-border);
}
.cp-detail-card.cp-video-detail .cp-detail-stats-bar {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
.cp-video-action-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 0;
  border-bottom: 1px solid var(--cc-border);
  flex-wrap: wrap;
}
.cp-video-action-bar .cp-detail-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: var(--cc-text);
  background: #f1f5f9;
  border: none;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
}
.cp-video-action-bar .cp-detail-action:hover {
  background: #e2e8f0;
}
.cp-video-action-bar .cp-detail-action.active {
  color: var(--cc-blue);
  background: rgba(var(--cc-blue-rgb, 37, 99, 235), .1);
}
.cp-video-action-bar .cp-detail-action i { font-size: 16px; }
.cp-video-action-bar .cp-action-spacer { flex: 1; }
.cp-video-author-section {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--cc-border);
}
.cp-video-author-section .cp-detail-author-info { flex: 1; min-width: 0; }
.cp-video-desc-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  color: var(--cc-blue);
  cursor: pointer;
  padding: 4px 0;
  margin-top: 4px;
  user-select: none;
}
.cp-video-desc-toggle:hover { text-decoration: underline; }
.cp-video-desc-section {
  padding: 0;
}
.cp-video-desc-section .cp-detail-content {
  max-height: 80px;
  overflow: hidden;
  transition: max-height .3s ease;
  position: relative;
}
.cp-video-desc-section .cp-detail-content.expanded {
  max-height: none;
}
.cp-video-player-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  overflow: clip;
  background: #000;
  touch-action: pan-y !important;
  position: relative;
}
.cp-video-player {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.cp-video-player-fallback {
  width: 100%;
  height: 100%;
  display: block;
  background: #000;
  object-fit: contain;
}
.cp-video-player-shell {
  width: 100%;
  height: 100%;
}
.cp-video-player-shell .yzmplayer {
  width: 100% !important;
  height: 100% !important;
}
.cp-video-player-shell #loading-box {
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s;
}
.cp-video-player-shell .yzmplayer-danmu {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 40px;
  height: auto;
  width: 260px;
  max-width: 55%;
  z-index: 10;
  border-radius: 0;
  float: none;
}
.cp-video-player-shell .yzmplayer-danmu .list-show {
  max-height: calc(100% - 70px);
  overflow-y: auto;
}
.cp-video-player-shell .yzmplayer-danmaku .yzmplayer-danmaku-item {
  pointer-events: auto !important;
  cursor: pointer;
}
.cp-video-player-shell .cp-dm-action-pop {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border-radius: 18px;
  background: rgba(10, 10, 12, .85);
  border: 1px solid rgba(255, 255, 255, .22);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .36);
  backdrop-filter: blur(8px);
  z-index: 1200;
  opacity: 0;
  transform: translateY(6px) scale(.96);
  transform-origin: center top;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.cp-video-player-shell .cp-dm-action-pop.show {
  opacity: 1;
  transform: translateY(0) scale(1);
  visibility: visible;
  pointer-events: auto;
}
.cp-video-player-shell .cp-dm-action-pop-btn {
  height: 30px;
  min-width: 56px;
  padding: 0 10px;
  border: 0;
  outline: none;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  background: transparent;
  cursor: pointer;
}
.cp-video-player-shell .cp-dm-action-pop-btn:hover {
  background: rgba(255, 255, 255, .12);
}
.cp-video-player-shell .cp-dm-action-pop-btn i {
  font-size: 14px;
}
.cp-video-player-shell .yzmplayer-logo {
  width: 140px !important;
}
.cp-video-player-shell .yzmplayer-menu {
  display: none !important;
}
.cp-video-player-shell .yzmplayer-setting-box {
  width: 190px !important;
}
.cp-video-player-shell .yzmplayer-setting-jlast,
.cp-video-player-shell .yzmplayer-setting-jfrist {
  height: auto !important;
  min-height: 30px;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
.cp-video-player-shell .yzmplayer-setting-jlast .yzmplayer-label,
.cp-video-player-shell .yzmplayer-setting-jfrist .yzmplayer-label {
  display: flex !important;
  align-items: center;
  max-width: calc(100% - 50px);
  line-height: 20px;
}
.cp-video-player-shell .yzmplayer-setting-jlast .yzmplayer-toggle,
.cp-video-player-shell .yzmplayer-setting-jfrist .yzmplayer-toggle {
  top: 50% !important;
  transform: translateY(-50%);
}
.cp-video-player-shell .yzmplayer-setting-box input#jumptime,
.cp-video-player-shell .yzmplayer-setting-box input#fristtime {
  width: 52px;
  height: 20px;
  padding: 0 4px;
  margin-left: 6px;
  font-size: 11px;
  color: #fff;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 3px;
  outline: none;
  flex-shrink: 0;
}
.cp-video-player-shell .yzmplayer-setting-box input#jumptime:focus,
.cp-video-player-shell .yzmplayer-setting-box input#fristtime:focus {
  border-color: rgba(255, 255, 255, .45);
  background: rgba(255, 255, 255, .18);
}
.cp-video-player-shell .yzmplayer-setting-box input#jumptime::placeholder,
.cp-video-player-shell .yzmplayer-setting-box input#fristtime::placeholder {
  color: rgba(255, 255, 255, .4);
}
.cp-video-player-shell .yzmplayer-toggle input+label {
  background: rgba(255, 255, 255, .3) !important;
}
.cp-video-player-shell .yzmplayer-toggle input:checked+label {
  background: var(--cp-player-theme, #00a1d6) !important;
}
.cp-video-player-shell .yzmplayer-comment-setting-box .yzmplayer-setting-danunlimit {
  display: none !important;
}
.cp-video-player-shell .yzmplayer-comment-setting-box .yzmplayer-comment-setting-font input:checked+span {
  background: var(--cp-player-theme, #00a1d6) !important;
  color: #fff !important;
}
.cp-video-player-shell .speed-stting .yzmplayer-setting-speed-item.is-active {
  background: rgba(0, 161, 214, .18);
  box-shadow: inset 2px 0 0 var(--cp-player-theme, #00a1d6);
}
.cp-video-player-shell .speed-stting .yzmplayer-setting-speed-item.is-active .yzmplayer-label {
  color: var(--cp-player-theme, #00a1d6) !important;
  font-weight: 600;
}
.cp-video-player-shell .cp-dm-author-badge {
  display: inline-block;
  margin-right: 8px;
  padding: 0 8px;
  border-radius: 12px;
  line-height: 20px;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  background: var(--cp-player-theme, #00a1d6);
  vertical-align: middle;
}
.cp-video-player-shell .cp-dm-author-text {
  vertical-align: middle;
}
.cp-video-player-shell .danmuku-list .cp-dm-author-badge {
  margin-right: 6px;
  line-height: 18px;
  font-size: 12px;
}
.cp-video-player-shell .yzm-yzmplayer-send-icon.is-disabled,
.cp-video-player-shell .yzmplayer-send-icon.is-disabled {
  opacity: .55;
  cursor: not-allowed !important;
}
.cp-video-player-shell .yzmplayer-info-panel {
  display: none !important;
}
.cp-video-player-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e2e8f0;
  font-size: 13px;
  background: rgba(2, 6, 23, .42);
  z-index: 2;
}
@media (max-width: 640px) {
  .cp-detail-card.cp-video-detail .cp-video-hero {
    margin: 0 -16px;
  }
  .cp-video-top-header .cp-detail-title { font-size: 17px; }
  .cp-video-top-header { margin-bottom: 8px; }
  .cp-video-player-wrap { border-radius: 0; }
  .cp-video-action-bar { gap: 4px; padding: 10px 0; }
  .cp-video-action-bar .cp-detail-action { padding: 5px 10px; font-size: 12px; }
  .cp-video-author-section { padding: 10px 0; }
}
@media (max-width: 1200px) {
  .cp-detail-card.cp-video-detail .cp-video-hero {
    margin: 0 -28px;
  }
}
@media (max-width: 400px) {
  .cp-detail-card.cp-video-detail .cp-video-hero {
    margin: 0 -14px;
  }
}

/* 下载链接区域 */
.cp-download-section {
  padding: 20px 24px;
}

.cp-download-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.cp-download-section-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--cc-text);
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-download-section-title i {
  color: var(--cc-blue);
  font-size: 18px;
}

.cp-download-section-tip {
  font-size: 12px;
  color: #94a3b8;
}

.cp-download-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cp-download-link {
  display: flex;
  align-items: stretch;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.2s;
}

.cp-download-link:hover {
  border-color: var(--cc-blue);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.14);
}

.cp-download-link-icon {
  width: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}

.cp-download-link-icon.platform-direct { background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.10); color: var(--cc-blue); }
.cp-download-link-icon.platform-baidu { background: #fef3c7; color: #d97706; }
.cp-download-link-icon.platform-lanzou { background: #d1fae5; color: #059669; }
.cp-download-link-icon.platform-aliyun { background: #fce7f3; color: #db2777; }
.cp-download-link-icon.platform-quark { background: #e0e7ff; color: #4f46e5; }
.cp-download-link-icon.platform-modrinth { background: #d1fae5; color: #059669; }
.cp-download-link-icon.platform-curseforge { background: #fee2e2; color: #dc2626; }
.cp-download-link-icon.platform-github { background: #f3f4f6; color: #1f2937; }
.cp-download-link-icon.platform-other { background: #f1f5f9; color: #64748b; }

.cp-download-link-body {
  flex: 1;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.cp-download-link-info {
  flex: 1;
}

.cp-download-link-name {
  font-size: 15px;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 4px;
}

.cp-download-link-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  color: #64748b;
}

.cp-download-link-meta-item {
  display: flex;
  align-items: center;
  gap: 4px;
}

.cp-download-link-meta-item i {
  font-size: 14px;
}

/* 下载条件标签 */
.cp-download-link-requirement {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  flex-shrink: 0;
}

.cp-download-link-requirement.free {
  background: #d1fae5;
  color: #059669;
}

.cp-download-link-requirement.points {
  background: #fef3c7;
  color: #d97706;
}

.cp-download-link-requirement.level {
  background: #e0e7ff;
  color: #4f46e5;
}

.cp-download-link-requirement i {
  font-size: 16px;
}

.cp-download-link-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.cp-download-link-price {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 500;
}

.cp-download-link-price.free {
  background: #d1fae5;
  color: #059669;
}

.cp-download-link-price.points {
  background: #fef3c7;
  color: #d97706;
}

.cp-download-link-price.level {
  background: #e0e7ff;
  color: #4f46e5;
}

.cp-download-btn {
  padding: 10px 20px;
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
}

.cp-download-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--cc-shadow-btn-hover);
}

.cp-download-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* 版本历史样式 */
.cp-version-history-loading {
  text-align: center;
  padding: 40px 20px;
  color: #64748b;
  font-size: 14px;
}

.cp-version-history-loading i {
  margin-right: 6px;
}

.cp-version-empty {
  text-align: center;
  padding: 60px 24px;
  color: #94a3b8;
  font-size: 14px;
}

.cp-version-empty i {
  font-size: 48px;
  display: block;
  margin-bottom: 12px;
  color: #cbd5e1;
}

.cp-version-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cp-version-item {
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
  padding: 20px 24px;
  transition: all 0.2s;
}

.cp-version-item:last-child {
  border-bottom: none;
}

.cp-version-item:hover {
  background: rgba(37, 99, 235, 0.02);
}

.cp-version-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  border-radius: 6px;
  padding: 4px 0;
  transition: background 0.15s;
}

.cp-version-item-header:hover {
  background: rgba(37, 99, 235, 0.04);
}

.cp-version-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: #94a3b8;
  font-size: 18px;
  transition: transform 0.25s ease, color 0.2s;
  flex-shrink: 0;
}

.cp-version-item.expanded .cp-version-toggle {
  transform: rotate(90deg);
  color: var(--cc-blue);
}

/* 折叠体 */
.cp-version-item-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, margin 0.3s ease, opacity 0.25s ease;
  opacity: 0;
  margin-top: 0;
}

.cp-version-item.expanded .cp-version-item-body {
  max-height: 600px;
  opacity: 1;
  margin-top: 12px;
}

.cp-version-item-version {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cp-version-badge {
  font-size: 14px;
  font-weight: 600;
  color: var(--cc-blue-600);
  background: linear-gradient(135deg, rgba(var(--cc-blue-rgb, 37, 99, 235),0.16), rgba(var(--cc-blue-rgb, 37, 99, 235),0.26));
  padding: 5px 14px;
  border-radius: 20px;
}

.cp-version-game-badge {
  font-size: 12px;
  font-weight: 500;
  color: #059669;
  background: #d1fae5;
  padding: 4px 10px;
  border-radius: 12px;
}

.cp-version-item-date {
  font-size: 12px;
  color: #94a3b8;
}

.cp-version-item-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-version-action-btn {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.cp-version-edit-btn {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.10);
  color: var(--cc-blue);
}

.cp-version-edit-btn:hover {
  background: rgba(var(--cc-blue-rgb, 37, 99, 235),0.18);
}

.cp-version-delete-btn {
  background: #fef2f2;
  color: #ef4444;
}

.cp-version-delete-btn:hover {
  background: #fee2e2;
}

/* 版本编辑弹窗 */
.cp-version-edit-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.cp-version-edit-modal.show {
  display: flex;
  opacity: 1;
  pointer-events: auto;
}

.cp-version-edit-modal-content {
  background: #fff;
  border-radius: 16px;
  width: 90%;
  max-width: 480px;
  max-height: 90vh;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  transform: scale(0.9);
  transition: transform 0.3s;
}

.cp-version-edit-modal.show .cp-version-edit-modal-content {
  transform: scale(1);
}

.cp-version-edit-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid #e5e7eb;
}

.cp-version-edit-modal-header h3 {
  margin: 0;
  font-size: 16px;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-version-edit-modal-header h3 i {
  color: var(--cc-blue);
}

.cp-version-edit-modal-close {
  width: 32px;
  height: 32px;
  border: none;
  background: #f1f5f9;
  border-radius: 8px;
  font-size: 20px;
  color: #64748b;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cp-version-edit-modal-close:hover {
  background: #e2e8f0;
  color: #334155;
}

.cp-version-edit-modal-body {
  padding: 20px;
}

.cp-version-edit-field {
  margin-bottom: 16px;
}

.cp-version-edit-field:last-child {
  margin-bottom: 0;
}

.cp-version-edit-field label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.cp-version-edit-field input,
.cp-version-edit-field textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  transition: all 0.2s;
  box-sizing: border-box;
}

.cp-version-edit-field input:focus,
.cp-version-edit-field textarea:focus {
  border-color: var(--cc-blue);
  box-shadow: 0 0 0 3px rgba(var(--cc-blue-rgb, 37, 99, 235),0.1);
  outline: none;
}

.cp-version-edit-field textarea {
  resize: vertical;
  min-height: 100px;
}

.cp-version-edit-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 20px;
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
}

.cp-version-edit-cancel-btn {
  padding: 8px 20px;
  border: 1px solid #d1d5db;
  background: #fff;
  border-radius: 10px;
  font-size: 14px;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-version-edit-cancel-btn:hover {
  background: #f1f5f9;
  border-color: #9ca3af;
}

.cp-version-edit-save-btn {
  padding: 8px 20px;
  border: none;
  background: linear-gradient(135deg, var(--cc-blue-600), var(--cc-blue));
  border-radius: 10px;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
}

.cp-version-edit-save-btn:hover {
  box-shadow: var(--cc-shadow-btn-hover);
  transform: translateY(-1px);
}

.cp-version-edit-save-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
}

.cp-version-item-changelog {
  margin-bottom: 14px;
}

.cp-version-changelog-label {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.cp-version-changelog-label i {
  font-size: 14px;
}

.cp-version-changelog-text {
  font-size: 13px;
  color: #475569;
  line-height: 1.7;
  padding: 12px 14px;
  background: #fffbeb;
  border-radius: 8px;
  border-left: 3px solid #fbbf24;
  white-space: pre-wrap;
}

.cp-version-item-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.cp-version-links-label {
  font-size: 12px;
  color: #94a3b8;
}

.cp-version-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  cursor: pointer;
  transition: all 0.2s;
}

.cp-version-link-btn:hover {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  border-color: var(--cc-blue);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--cc-shadow-btn-hover);
}

.cp-version-link-btn i {
  font-size: 15px;
}

/* 资源模块响应式 */
@media (max-width: 768px) {
  .cp-resource-info {
    border-radius: 12px;
  }
  
  .cp-resource-basic,
  .cp-resource-tags-section,
  .cp-resource-copyright,
  .cp-download-section {
    padding: 16px;
  }
  
  .cp-resource-info-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  
  .cp-resource-stats-section {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .cp-download-link {
    flex-direction: column;
  }
  
  .cp-download-link-icon {
    width: 100%;
    height: 48px;
  }
  
  .cp-download-link-body {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  
  .cp-download-link-actions {
    flex-direction: column;
    align-items: stretch;
  }
  
  .cp-download-link-requirement {
    justify-content: center;
  }
  
  .cp-download-btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .cp-resource-info-grid {
    grid-template-columns: 1fr;
  }
  
  .cp-resource-copyright {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
}

/* 下载确认弹窗 */
.cp-download-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.cp-download-modal.show {
  display: flex;
}

.cp-download-dialog {
  background: #fff;
  border-radius: 14px;
  padding: 24px;
  max-width: 420px;
  width: 90%;
  box-shadow: 0 20px 50px rgba(0,0,0,0.2);
  position: relative;
}

.cp-download-dialog-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 30px;
  height: 30px;
  border: none;
  background: #f1f5f9;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #64748b;
  transition: all 0.15s;
  z-index: 1;
}

.cp-download-dialog-close:hover {
  background: #e2e8f0;
  color: #1e293b;
}

.cp-download-dialog-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--cc-text);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cp-download-dialog-title i {
  color: var(--cc-blue);
}

.cp-download-dialog-info {
  background: #f8fafc;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 16px;
}

.cp-download-dialog-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  margin-bottom: 8px;
}

.cp-download-dialog-row:last-child {
  margin-bottom: 0;
}

.cp-download-dialog-label {
  color: var(--cc-muted);
}

.cp-download-dialog-value {
  font-weight: 500;
  color: var(--cc-text);
}

.cp-download-dialog-value.highlight {
  color: #f59e0b;
}

.cp-download-dialog-actions {
  display: flex;
  gap: 10px;
}

.cp-download-dialog-btn {
  flex: 1;
  padding: 12px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}

.cp-download-dialog-btn-cancel {
  background: #f1f5f9;
  color: var(--cc-text);
}

.cp-download-dialog-btn-cancel:hover {
  background: #e2e8f0;
}

.cp-download-dialog-btn-confirm {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  color: #fff;
}

.cp-download-dialog-btn-confirm:hover {
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
}

/* 下载结果显示 */
.cp-download-result {
  border-radius: 10px;
  padding: 0;
  margin-top: 16px;
  display: none;
}

.cp-download-result.show {
  display: block;
}

.cp-download-result-title {
  font-size: 14px;
  font-weight: 500;
  color: #059669;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-download-result-url {
  background: #f8fafc;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  font-size: 13px;
  word-break: break-all;
  color: #334155;
  line-height: 1.6;
  margin-bottom: 10px;
  color: var(--cc-text);
  margin-bottom: 10px;
}

.cp-download-result-code {
  font-size: 13px;
  color: #d97706;
  background: #fffbeb;
  border: 1px solid #fef3c7;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cp-download-result-code i {
  font-size: 16px;
}

.cp-download-result-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.cp-download-result-btn {
  flex: 1;
  padding: 10px 14px;
  background: #f1f5f9;
  color: #334155;
  border: none;
  border-radius: 8px;
  justify-content: center;
  font-size: 13px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: all 0.2s;
}

.cp-download-result-btn:hover {
  background: #e2e8f0;
}

@media (max-width: 768px) {
  .cp-resource-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  
  .cp-resource-tags,
  .cp-resource-stats {
    justify-content: center;
  }
  
  .cp-download-link {
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }
  
  .cp-download-btn {
    width: 100%;
    justify-content: center;
  }
}

/* 整合包卡片 [square:id] */
.cp-square-card {
  display: flex;
  align-items: stretch;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin: 16px 0;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: all 0.25s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  width: 100%;
}
.cp-square-card:hover {
  border-color: #5ab552;
  box-shadow: 0 6px 20px rgba(90, 181, 82, 0.15);
  transform: translateY(-2px);
}
.cp-square-card-cover {
  width: 120px;
  min-height: 100px;
  background: linear-gradient(135deg, #252b20 0%, #1a1f16 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.cp-square-card-cover img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  transform: none !important;
  box-shadow: none !important;
  display: block !important;
}
.cp-square-card-cover .placeholder-icon {
  font-size: 36px;
  color: #5ab552;
}
.cp-square-card-body {
  flex: 1;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.cp-square-card-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #5ab552;
  background: rgba(90, 181, 82, 0.1);
  padding: 2px 8px;
  border-radius: 4px;
  margin-bottom: 6px;
  width: fit-content;
}
.cp-square-card-name {
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cp-square-card-desc {
  font-size: 12px;
  color: #64748b;
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cp-square-card-meta {
  display: flex;
  gap: 12px;
  margin-top: 6px;
  font-size: 11px;
  color: #94a3b8;
}
.cp-square-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.cp-square-card-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  font-size: 13px;
  color: #94a3b8;
}
.cp-square-card-loading .dot-loading span {
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #94a3b8;
  animation: dotBounce 1.2s infinite ease-in-out;
}
.cp-square-card-loading .dot-loading span:nth-child(2) { animation-delay: 0.2s; }
.cp-square-card-loading .dot-loading span:nth-child(3) { animation-delay: 0.4s; }
@keyframes dotBounce {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}
.cp-square-card-error {
  font-size: 13px;
  color: #94a3b8;
  padding: 14px 18px;
}
@media (max-width: 640px) {
  .cp-square-card-cover { width: 90px; }
  .cp-square-card-name { font-size: 14px; }
}

/* [quote:id] 帖子引用卡片 */
.cp-quote-card {
  display: flex;
  text-decoration: none !important;
  color: inherit !important;
  background: var(--cc-bg, #f8fafc);
  border: 1px solid var(--cc-border, #e2e8f0);
  border-radius: 10px;
  overflow: hidden;
  margin: 12px 0;
  width: 100%;
  transition: box-shadow .2s, border-color .2s;
  cursor: pointer;
}
.cp-quote-card:hover {
  border-color: var(--cc-blue, #2563eb);
  box-shadow: 0 2px 12px rgba(59,130,246,.12);
}
.cp-quote-card-cover {
  width: 120px;
  min-height: 90px;
  flex-shrink: 0;
  background: #e2e8f0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cp-quote-card-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  transform: none !important;
  box-shadow: none !important;
  display: block !important;
  max-width: 100% !important;
}
.cp-quote-card-cover .cp-quote-nocover {
  font-size: 28px;
  color: #94a3b8;
}
.cp-quote-card-body {
  flex: 1;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.cp-quote-card-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--cc-blue, #2563eb);
  background: rgba(59,130,246,.08);
  padding: 2px 8px;
  border-radius: 4px;
  margin-bottom: 6px;
  width: fit-content;
}
.cp-quote-card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--cc-text, #1e293b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}
.cp-quote-card-desc {
  font-size: 12px;
  color: #64748b;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.5;
  margin-bottom: 6px;
}
.cp-quote-card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: #94a3b8;
}
.cp-quote-card-meta .cp-quote-avatar {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 !important;
  display: inline-block !important;
  transform: none !important;
  box-shadow: none !important;
  cursor: default !important;
}
.cp-quote-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.cp-quote-card-badges {
  display: flex;
  gap: 4px;
  margin-left: auto;
}
.cp-quote-card-badges .cp-quote-badge {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  color: #fff;
}
.cp-quote-badge-top { background: #ef4444; }
.cp-quote-badge-essence { background: #f59e0b; }
.cp-quote-card-category {
  font-size: 11px;
  padding: 1px 6px;
  border-radius: 3px;
  color: #fff;
}

.cp-quote-card-loading {
  padding: 14px 18px;
  font-size: 13px;
  color: #94a3b8;
  display: flex;
  align-items: center;
  gap: 6px;
}
.cp-quote-card-error {
  font-size: 13px;
  color: #94a3b8;
  padding: 14px 18px;
}

@media (max-width: 640px) {
  .cp-quote-card-cover { width: 90px; }
  .cp-quote-card-title { font-size: 14px; }
}

/* ==================== 夜间模式：详情页 ==================== */
html[data-theme-mode="dark"] { --cc-text:#e5e7eb; --cc-muted:#94a3b8; }
html[data-theme-mode="dark"] body { color:#e5e7eb; }

/* 卡片容器 */
html[data-theme-mode="dark"] .cp-main-column,
html[data-theme-mode="dark"] .cp-comment-column {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 4px 18px rgba(0,0,0,.32),
    0 1px 4px rgba(0,0,0,.18);
  backdrop-filter: blur(22px) saturate(200%) brightness(.84);
  -webkit-backdrop-filter: blur(22px) saturate(200%) brightness(.84);
}
html[data-theme-mode="dark"] .cp-main-column::before,
html[data-theme-mode="dark"] .cp-comment-column::before {
  background: linear-gradient(148deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.04) 35%, transparent 62%);
}
html[data-theme-mode="dark"] .cp-main-column:hover,
html[data-theme-mode="dark"] .cp-comment-column:hover {
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.22);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 12px 28px rgba(0,0,0,.38),
    0 3px 8px rgba(0,0,0,.20);
}
html[data-theme-mode="dark"] .cp-comment-column .cp-comments-card { background:transparent; }

/* 分割线 & 面包屑 */
html[data-theme-mode="dark"] .cp-main-column > .cp-breadcrumb,
html[data-theme-mode="dark"] .cp-comment-column .cp-comments-header,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-input,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-list,
html[data-theme-mode="dark"] .cp-detail-stats-bar { border-color:rgba(255,255,255,.16); }
html[data-theme-mode="dark"] .cp-breadcrumb,
html[data-theme-mode="dark"] .cp-breadcrumb a { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-back-btn {
  color:#cbd5e1;
  background:#0f172a;
  border:1px solid #2b3b53;
}
html[data-theme-mode="dark"] .cp-back-btn:hover {
  color:#dbeafe;
  background:rgba(var(--cc-blue-rgb,37,99,235),.18);
  border-color:rgba(var(--cc-blue-rgb,37,99,235),.38);
  box-shadow:0 4px 12px rgba(0,0,0,.28);
}
html[data-theme-mode="dark"] .cp-back-btn:active {
  transform:translateY(0);
  background:rgba(var(--cc-blue-rgb,37,99,235),.24);
}

/* 标题 & 作者 */
html[data-theme-mode="dark"] .cp-title,
html[data-theme-mode="dark"] .cp-post-title,
html[data-theme-mode="dark"] .cp-comments-title,
html[data-theme-mode="dark"] .cp-resource-title,
html[data-theme-mode="dark"] .cp-author-name { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-post-meta,
html[data-theme-mode="dark"] .cp-post-desc,
html[data-theme-mode="dark"] .cp-comment-meta,
html[data-theme-mode="dark"] .cp-comment-time,
html[data-theme-mode="dark"] .cp-author-sig { color:#94a3b8; }

/* 统计栏 */
html[data-theme-mode="dark"] .cp-detail-stat-item { background:rgba(255,255,255,.04); color:#94a3b8; }
html[data-theme-mode="dark"] .cp-detail-stat-item { border:1px solid rgba(255,255,255,.14); }
html[data-theme-mode="dark"] .cp-detail-stat-item:hover { background:rgba(255,255,255,.07); border-color:rgba(var(--cc-blue-rgb,37,99,235),.32); color:#93c5fd; }
html[data-theme-mode="dark"] .cp-detail-stat-item.cp-stat-update { background:rgba(16,185,129,.12); color:#34d399; }
html[data-theme-mode="dark"] .cp-detail-stat-item.cp-stat-update:hover { background:rgba(16,185,129,.14); }
html[data-theme-mode="dark"] .cp-detail-edit-btn { background:rgba(var(--cc-blue-rgb,37,99,235),.14); }
html[data-theme-mode="dark"] .cp-detail-action {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  color: #cbd5e1;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 2px 8px rgba(0,0,0,.20);
}
html[data-theme-mode="dark"] .cp-detail-action:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.42);
  color: #dbeafe;
}

/* ── 管理工具栏（暗色适配） ── */
html[data-theme-mode="dark"] .cp-admin-toolbar { background:linear-gradient(135deg,#1a1610,#1f1c14); border-color:#3d3520; }
html[data-theme-mode="dark"] .cp-admin-toolbar-label { color:#fbbf24; }
html[data-theme-mode="dark"] .cp-admin-tool { background:#0f172a; color:#cbd5e1; border:1px solid #2b3b53; box-shadow:none; }
html[data-theme-mode="dark"] .cp-admin-tool:hover { background:var(--cc-blue); color:#fff; border-color:var(--cc-blue); }
html[data-theme-mode="dark"] .cp-admin-tool.active { background:rgba(var(--cc-blue-rgb,37,99,235),.18); color:var(--cc-blue); border-color:rgba(var(--cc-blue-rgb,37,99,235),.4); }
html[data-theme-mode="dark"] .cp-admin-dropdown-menu { background:#0f172a; box-shadow:0 8px 24px rgba(0,0,0,.5); }
html[data-theme-mode="dark"] .cp-admin-dropdown-menu a { color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-admin-dropdown-menu a:hover { background:#152136; color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-admin-dropdown-menu a.active { background:rgba(var(--cc-blue-rgb,37,99,235),.18); color:var(--cc-blue); }

/* 正文内容区 */
html[data-theme-mode="dark"] .cp-content,
html[data-theme-mode="dark"] .cp-detail-content { color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-detail-content h1,
html[data-theme-mode="dark"] .cp-detail-content h2,
html[data-theme-mode="dark"] .cp-detail-content h3 { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-content h1,
html[data-theme-mode="dark"] .cp-content h2,
html[data-theme-mode="dark"] .cp-content h3,
html[data-theme-mode="dark"] .cp-content h4,
html[data-theme-mode="dark"] .cp-content h5,
html[data-theme-mode="dark"] .cp-content h6,
html[data-theme-mode="dark"] .cp-detail-content h4,
html[data-theme-mode="dark"] .cp-detail-content h5,
html[data-theme-mode="dark"] .cp-detail-content h6,
html[data-theme-mode="dark"] .cp-detail-content h1 *,
html[data-theme-mode="dark"] .cp-detail-content h2 *,
html[data-theme-mode="dark"] .cp-detail-content h3 *,
html[data-theme-mode="dark"] .cp-detail-content h4 *,
html[data-theme-mode="dark"] .cp-detail-content h5 *,
html[data-theme-mode="dark"] .cp-detail-content h6 * { color:#e5e7eb !important; }
html[data-theme-mode="dark"] .cp-content strong,
html[data-theme-mode="dark"] .cp-content b,
html[data-theme-mode="dark"] .cp-detail-content strong,
html[data-theme-mode="dark"] .cp-detail-content b {
  color:#f8fafc !important;
  font-weight:700;
}
/* 富文本里常见的黑色内联色，夜间模式下统一抬亮 */
html[data-theme-mode="dark"] .cp-content [style*="color:#000"],
html[data-theme-mode="dark"] .cp-content [style*="color: #000"],
html[data-theme-mode="dark"] .cp-content [style*="color:#000000"],
html[data-theme-mode="dark"] .cp-content [style*="color: #000000"],
html[data-theme-mode="dark"] .cp-content [style*="color:rgb(0,0,0)"],
html[data-theme-mode="dark"] .cp-content [style*="color: rgb(0, 0, 0)"],
html[data-theme-mode="dark"] .cp-content [style*="color:black"],
html[data-theme-mode="dark"] .cp-content [style*="color: black"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color:#000"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color: #000"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color:#000000"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color: #000000"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color:rgb(0,0,0)"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color: rgb(0, 0, 0)"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color:black"],
html[data-theme-mode="dark"] .cp-detail-content [style*="color: black"] {
  color:#e5e7eb !important;
}
html[data-theme-mode="dark"] .cp-content blockquote,
html[data-theme-mode="dark"] .cp-detail-content blockquote { background:#0f172a; border-left-color:#2b3b53; color:#94a3b8; }
html[data-theme-mode="dark"] .cp-content pre,
html[data-theme-mode="dark"] .cp-content code { background:#0a0f1c; color:#a5f3fc; border-color:#2b3b53; }
html[data-theme-mode="dark"] .cp-detail-content code { background:rgba(var(--cc-blue-rgb,37,99,235),.14); }
html[data-theme-mode="dark"] .cp-content img { opacity:.92; }
html[data-theme-mode="dark"] .cp-content hr,
html[data-theme-mode="dark"] .cp-detail-content hr { border-color:#243244; }
html[data-theme-mode="dark"] .cp-content a,
html[data-theme-mode="dark"] .cp-detail-content a,
html[data-theme-mode="dark"] .cp-comment-content a {
  color:#93c5fd;
  text-decoration-color: rgba(147,197,253,.45);
}
html[data-theme-mode="dark"] .cp-content a:visited,
html[data-theme-mode="dark"] .cp-detail-content a:visited,
html[data-theme-mode="dark"] .cp-comment-content a:visited {
  color:#c4b5fd;
  text-decoration-color: rgba(196,181,253,.42);
}
html[data-theme-mode="dark"] .cp-content a:hover,
html[data-theme-mode="dark"] .cp-detail-content a:hover,
html[data-theme-mode="dark"] .cp-comment-content a:hover {
  color:#bfdbfe;
  text-decoration: underline;
  text-underline-offset: 2px;
}
html[data-theme-mode="dark"] .cp-content a:active,
html[data-theme-mode="dark"] .cp-detail-content a:active,
html[data-theme-mode="dark"] .cp-comment-content a:active {
  color:#60a5fa;
}
html[data-theme-mode="dark"] .cp-detail-content a .cp-link-icon,
html[data-theme-mode="dark"] .cp-comment-content a .cp-link-icon {
  opacity:.78;
}
html[data-theme-mode="dark"] .cp-detail-content a:hover .cp-link-icon,
html[data-theme-mode="dark"] .cp-comment-content a:hover .cp-link-icon {
  opacity:1;
}
html[data-theme-mode="dark"] .cp-content table,
html[data-theme-mode="dark"] .cp-content th,
html[data-theme-mode="dark"] .cp-content td,
html[data-theme-mode="dark"] .cp-detail-content table,
html[data-theme-mode="dark"] .cp-detail-content th,
html[data-theme-mode="dark"] .cp-detail-content td { border-color:#243244; }
html[data-theme-mode="dark"] .cp-content th,
html[data-theme-mode="dark"] .cp-detail-content th { background:#0f172a; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-detail-content li::marker { color:#64748b; }

/* 隐藏内容区 */
html[data-theme-mode="dark"] .cp-hidden-content { background:#0f172a; border-color:#2b3b53; }
html[data-theme-mode="dark"] .cp-hidden-title { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-hidden-body { color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-hidden-unlocked {
  background: linear-gradient(135deg, rgba(16,185,129,.16), rgba(16,185,129,.08));
  border-color: rgba(16,185,129,.40);
}
html[data-theme-mode="dark"] .cp-hidden-header {
  background: rgba(255,255,255,.06);
  border-bottom-color: rgba(16,185,129,.26);
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .cp-hidden-author-tip { color:#34d399; }
html[data-theme-mode="dark"] .cp-hidden-locked {
  background: linear-gradient(135deg, rgba(245,158,11,.16), rgba(245,158,11,.08));
  border-color: rgba(245,158,11,.44);
}
html[data-theme-mode="dark"] .cp-hidden-lock-title { color:#fbbf24; }
html[data-theme-mode="dark"] .cp-hidden-lock-desc { color:#fcd34d; }
html[data-theme-mode="dark"] .cp-hidden-lock-desc strong { color:#f59e0b; }

/* ── 评论区（全面适配） ── */
html[data-theme-mode="dark"] .cp-comment-item {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
}
html[data-theme-mode="dark"] .cp-comment-item:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.26);
  box-shadow: 0 7px 16px rgba(0,0,0,.24);
}
html[data-theme-mode="dark"] .cp-comment-author { color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-comment-body { color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-comment-content { color:#cbd5e1; }
html[data-theme-mode="dark"] .mention-link {
  background: rgba(var(--cc-blue-rgb,37,99,235),.16);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.34);
  color:#93c5fd;
}
html[data-theme-mode="dark"] .mention-link:hover {
  background: rgba(var(--cc-blue-rgb,37,99,235),.24);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.46);
  color:#dbeafe;
}
html[data-theme-mode="dark"] .cp-comment-reply-to {
  background: rgba(var(--cc-blue-rgb,37,99,235),.14);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.34);
  color:#93c5fd;
}
html[data-theme-mode="dark"] .cp-comment-reply-to:hover {
  background: rgba(var(--cc-blue-rgb,37,99,235),.22);
  color:#dbeafe;
}
html[data-theme-mode="dark"] .cp-comment-actions { border-color:#1e293b; }
html[data-theme-mode="dark"] .cp-comment-replies { border-left-color:rgba(255,255,255,.14); }
/* 二级回复卡片 */
html[data-theme-mode="dark"] .cp-comment-reply-item {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 4px 14px rgba(0,0,0,.24);
}
html[data-theme-mode="dark"] .cp-comment-reply-item:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 7px 16px rgba(0,0,0,.26);
}
html[data-theme-mode="dark"] .cp-replies-toggle { color:var(--cc-blue); background:rgba(var(--cc-blue-rgb,37,99,235),.08); }
html[data-theme-mode="dark"] .cp-replies-toggle:hover { background:rgba(var(--cc-blue-rgb,37,99,235),.14); }
html[data-theme-mode="dark"] .cp-comment-pin-badge { background:rgba(251,146,60,.14); color:#fb923c; }
/* AI 评论 */
html[data-theme-mode="dark"] .cp-comment-item.cp-ai-bot-comment { background:linear-gradient(135deg,rgba(59,130,246,.06),rgba(139,92,246,.06)); border-color:rgba(59,130,246,.18); }
html[data-theme-mode="dark"] .cp-ai-bot-name { color:#93c5fd; }
/* 评论排序 */
html[data-theme-mode="dark"] .cp-comment-sort-btn { background:#0f172a; border-color:#2b3b53; color:#94a3b8; }
html[data-theme-mode="dark"] .cp-comment-sort-btn:hover { border-color:var(--cc-blue); color:var(--cc-blue); }
html[data-theme-mode="dark"] .cp-comment-sort-btn.active { background:var(--cc-blue); color:#fff; border-color:var(--cc-blue); }
/* 评论输入 */
html[data-theme-mode="dark"] .cp-comment-input textarea,
html[data-theme-mode="dark"] .cp-comment-input-box textarea { background:#0a0f1c; border-color:#2b3b53; color:#e2e8f0; }
html[data-theme-mode="dark"] .cp-comment-input textarea::placeholder { color:#64748b; }
html[data-theme-mode="dark"] .cp-comment-login { background:rgba(var(--cc-blue-rgb,37,99,235),.14); border-color:rgba(var(--cc-blue-rgb,37,99,235),.28); color:#dbeafe; }
html[data-theme-mode="dark"] .cp-comment-column .mention-tip,
html[data-theme-mode="dark"] .mention-tip { background:#1e293b; border-color:#334155; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-comment-column .mention-tip i,
html[data-theme-mode="dark"] .mention-tip i { color:#93c5fd; }
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .emoji-btn,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .cp-comment-upload-btn { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; box-shadow:none; }
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .emoji-btn:hover,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .cp-comment-upload-btn:hover { background:#152136; border-color:rgba(var(--cc-blue-rgb,37,99,235),.38); color:#dbeafe; }
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .emoji-btn i,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-toolbar .cp-comment-upload-btn i { color:#93c5fd; }
html[data-theme-mode="dark"] .cp-comment-submit { box-shadow:0 6px 16px rgba(0,0,0,.34); }
html[data-theme-mode="dark"] .cp-comment-submit:hover { box-shadow:0 8px 20px rgba(0,0,0,.42); }

/* 资源面板 */
html[data-theme-mode="dark"] .cp-resource-info {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 4px 18px rgba(0,0,0,.32),
    0 1px 4px rgba(0,0,0,.18);
}
html[data-theme-mode="dark"] .cp-resource-tabs {
  border-bottom-color: rgba(255,255,255,.14);
  background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
}
html[data-theme-mode="dark"] .cp-resource-tab.active { background: rgba(255,255,255,.10); }
html[data-theme-mode="dark"] .cp-resource-basic {
  background: linear-gradient(135deg, rgba(var(--cc-blue-rgb,37,99,235),.18), rgba(var(--cc-blue-rgb,37,99,235),.10));
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.26);
}
html[data-theme-mode="dark"] .cp-resource-changelog {
  background: linear-gradient(135deg, rgba(217,119,6,.22), rgba(217,119,6,.10));
  border-color: rgba(217,119,6,.30);
}
html[data-theme-mode="dark"] .cp-resource-info-value.version {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.16);
}
html[data-theme-mode="dark"] .cp-resource-info-value.game-version {
  background: rgba(16,185,129,.22);
  border-color: rgba(16,185,129,.32);
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .cp-resource-panel { background:#111827; border-color:#243244; box-shadow:0 10px 24px rgba(0,0,0,.3); }
html[data-theme-mode="dark"] .cp-resource-basic { background:#0f172a; border-color:#243244; }
html[data-theme-mode="dark"] .cp-resource-basic-item-label { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-resource-basic-item-value { color:#e2e8f0; }
html[data-theme-mode="dark"] .cp-resource-tab { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-resource-tab:hover { background:rgba(var(--cc-blue-rgb,37,99,235),.12); }
html[data-theme-mode="dark"] .cp-resource-tab.active { background:rgba(var(--cc-blue-rgb,37,99,235),.22); color:#dbeafe; }
html[data-theme-mode="dark"] .cp-version-item { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-version-item:hover { background:#152136; }
html[data-theme-mode="dark"] .cp-version-badge { background:rgba(var(--cc-blue-rgb,37,99,235),.14); color:var(--cc-blue); }
html[data-theme-mode="dark"] .cp-download-section { background:#111827; border-color:#243244; }
html[data-theme-mode="dark"] .cp-download-btn { box-shadow:0 6px 16px rgba(0,0,0,.34); }
html[data-theme-mode="dark"] .cp-version-changelog { background:#1a1f14; border-left-color:#d97706; color:#fde68a; }
html[data-theme-mode="dark"] .cp-video-info { background:#0f172a; border-color:#2b3b53; }
html[data-theme-mode="dark"] .cp-video-player-wrap { border: 1px solid rgba(255,255,255,.08); }
html[data-theme-mode="dark"] .cp-video-player-loading { background: rgba(15, 23, 42, .55); color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-video-action-bar { border-color: rgba(255,255,255,.12); }
html[data-theme-mode="dark"] .cp-video-action-bar .cp-detail-action { background: rgba(255,255,255,.08); color: #cbd5e1; }
html[data-theme-mode="dark"] .cp-video-action-bar .cp-detail-action:hover { background: rgba(255,255,255,.14); }
html[data-theme-mode="dark"] .cp-video-action-bar .cp-detail-action.active { color: var(--cc-blue); background: rgba(var(--cc-blue-rgb,37,99,235),.18); }
html[data-theme-mode="dark"] .cp-video-author-section { border-color: rgba(255,255,255,.12); }
html[data-theme-mode="dark"] .cp-video-desc-toggle { color: #60a5fa; }
html[data-theme-mode="dark"] .cp-video-stats-inline { color: #94a3b8; }

/* 资源帖子夜间模式细化（提升对比度与层次） */
html[data-theme-mode="dark"] .cp-resource-info-label,
html[data-theme-mode="dark"] .cp-resource-stat,
html[data-theme-mode="dark"] .cp-resource-copyright {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-resource-info-value,
html[data-theme-mode="dark"] .cp-resource-stat strong,
html[data-theme-mode="dark"] .cp-version-item-version,
html[data-theme-mode="dark"] .cp-version-item-date,
html[data-theme-mode="dark"] .cp-download-link-name {
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-resource-tags-section,
html[data-theme-mode="dark"] .cp-resource-copyright,
html[data-theme-mode="dark"] .cp-resource-tabs {
  border-color: rgba(255,255,255,.10);
}
html[data-theme-mode="dark"] .cp-resource-tag {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
html[data-theme-mode="dark"] .cp-resource-info-value.version {
  color: #93c5fd;
}
html[data-theme-mode="dark"] .cp-resource-info-value.version i {
  color: #93c5fd;
}
html[data-theme-mode="dark"] .cp-resource-info-value.game-version i {
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .cp-resource-changelog-title {
  color: #fbbf24;
}
html[data-theme-mode="dark"] .cp-resource-changelog-content {
  color: #fde68a;
}
html[data-theme-mode="dark"] .cp-download-link {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 20px rgba(0,0,0,.26);
}
html[data-theme-mode="dark"] .cp-download-link:hover {
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.48);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 10px 24px rgba(0,0,0,.34);
}
html[data-theme-mode="dark"] .cp-download-link-meta,
html[data-theme-mode="dark"] .cp-download-link-meta-item {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-download-link-icon.platform-direct { background: rgba(var(--cc-blue-rgb,37,99,235),.20); color:#93c5fd; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-baidu { background: rgba(217,119,6,.24); color:#fdba74; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-lanzou { background: rgba(16,185,129,.22); color:#6ee7b7; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-aliyun { background: rgba(219,39,119,.20); color:#f9a8d4; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-quark { background: rgba(99,102,241,.22); color:#a5b4fc; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-modrinth { background: rgba(16,185,129,.22); color:#6ee7b7; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-curseforge { background: rgba(239,68,68,.22); color:#fca5a5; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-github { background: rgba(148,163,184,.22); color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-download-link-icon.platform-other { background: rgba(100,116,139,.24); color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-download-link-price.free,
html[data-theme-mode="dark"] .cp-download-link-requirement.free {
  background: rgba(16,185,129,.20);
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .cp-download-link-price.points,
html[data-theme-mode="dark"] .cp-download-link-requirement.points {
  background: rgba(217,119,6,.22);
  color: #fdba74;
}
html[data-theme-mode="dark"] .cp-download-link-price.level,
html[data-theme-mode="dark"] .cp-download-link-requirement.level {
  background: rgba(99,102,241,.22);
  color: #a5b4fc;
}
html[data-theme-mode="dark"] .cp-version-changelog-label {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-version-changelog-text {
  background: rgba(217,119,6,.18);
  border-left-color: #f59e0b;
  color: #fde68a;
}
html[data-theme-mode="dark"] .cp-version-action-btn {
  border: 1px solid rgba(255,255,255,.14);
}
html[data-theme-mode="dark"] .cp-version-edit-btn {
  background: rgba(var(--cc-blue-rgb,37,99,235),.18);
  color: #93c5fd;
}
html[data-theme-mode="dark"] .cp-version-edit-btn:hover {
  background: rgba(var(--cc-blue-rgb,37,99,235),.30);
  color: #dbeafe;
}
html[data-theme-mode="dark"] .cp-version-delete-btn {
  background: rgba(239,68,68,.18);
  color: #fca5a5;
}
html[data-theme-mode="dark"] .cp-version-delete-btn:hover {
  background: rgba(239,68,68,.30);
  color: #fecaca;
}
html[data-theme-mode="dark"] .cp-version-links-label {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-version-link-btn {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  color: #cbd5e1;
}
html[data-theme-mode="dark"] .cp-version-link-btn:hover {
  background: linear-gradient(135deg, var(--cc-blue), var(--cc-blue-600));
  border-color: transparent;
  color: #fff;
}

/* 下载链接弹窗（夜间模式） */
html[data-theme-mode="dark"] .cp-download-modal {
  background: rgba(2, 6, 23, 0.62);
}
html[data-theme-mode="dark"] .cp-download-dialog {
  background: rgba(15, 23, 42, 0.92);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 18px 42px rgba(0,0,0,.45);
}
html[data-theme-mode="dark"] .cp-download-dialog-title {
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-download-dialog-close {
  background: rgba(255,255,255,.10);
  color: #cbd5e1;
}
html[data-theme-mode="dark"] .cp-download-dialog-close:hover {
  background: rgba(255,255,255,.18);
  color: #f8fafc;
}
html[data-theme-mode="dark"] .cp-download-dialog-info {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
}
html[data-theme-mode="dark"] .cp-download-dialog-label {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-download-dialog-value {
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-download-dialog-value.highlight {
  color: #fbbf24;
}
html[data-theme-mode="dark"] .cp-download-dialog-btn-cancel {
  background: rgba(255,255,255,.10);
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-download-dialog-btn-cancel:hover {
  background: rgba(255,255,255,.18);
}
html[data-theme-mode="dark"] .cp-download-result-title {
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .cp-download-result-url {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.16);
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-download-result-code {
  background: rgba(217,119,6,.20);
  border-color: rgba(217,119,6,.38);
  color: #fde68a;
}
html[data-theme-mode="dark"] .cp-download-result-btn {
  background: rgba(255,255,255,.10);
  color: #e2e8f0;
}
html[data-theme-mode="dark"] .cp-download-result-btn:hover {
  background: rgba(255,255,255,.18);
}

/* 打赏弹窗 */
html[data-theme-mode="dark"] .cp-reward-modal-content,
html[data-theme-mode="dark"] .cp-reward-list-content {
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.30),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 20px 50px rgba(0,0,0,.50);
  backdrop-filter: blur(22px) saturate(200%) brightness(.84);
  -webkit-backdrop-filter: blur(22px) saturate(200%) brightness(.84);
}
html[data-theme-mode="dark"] .cp-reward-modal-header,
html[data-theme-mode="dark"] .cp-reward-list-header { border-bottom-color:#243244; }
html[data-theme-mode="dark"] .cp-reward-modal-header h3,
html[data-theme-mode="dark"] .cp-reward-list-header h3,
html[data-theme-mode="dark"] .cp-reward-list-name { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-reward-points-label,
html[data-theme-mode="dark"] .cp-reward-message label,
html[data-theme-mode="dark"] .cp-reward-balance-label,
html[data-theme-mode="dark"] .cp-reward-list-msg,
html[data-theme-mode="dark"] .cp-reward-list-time,
html[data-theme-mode="dark"] .cp-reward-list-empty { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-reward-message textarea {
  background:#0f172a;
  border-color:#2b3b53;
  color:#e2e8f0;
}
html[data-theme-mode="dark"] .cp-reward-message textarea::placeholder { color:#64748b; }
html[data-theme-mode="dark"] .cp-reward-balance {
  background:#0f172a;
  border:1px solid #2b3b53;
}
html[data-theme-mode="dark"] .cp-reward-point-item {
  background:#0f172a;
  border-color:#2b3b53;
}
html[data-theme-mode="dark"] .cp-reward-point-item:hover {
  border-color:#5a4f28;
  background:#1f1b12;
}
html[data-theme-mode="dark"] .cp-reward-point-item.selected {
  border-color:#d97706;
  background:linear-gradient(135deg,#2a2310,#1f1b0e);
  box-shadow:0 4px 12px rgba(217,119,6,.28);
}
html[data-theme-mode="dark"] .cp-reward-point-item .points-value { color:#fbbf24; }
html[data-theme-mode="dark"] .cp-reward-point-item .points-label,
html[data-theme-mode="dark"] .cp-reward-point-item.selected .points-label { color:#fcd34d; }
html[data-theme-mode="dark"] .cp-reward-cancel-btn {
  background:#1e293b;
  border-color:#334155;
  color:#cbd5e1;
}
html[data-theme-mode="dark"] .cp-reward-cancel-btn:hover { background:#273449; }
html[data-theme-mode="dark"] .cp-reward-list-close {
  background:#1e293b;
  color:#94a3b8;
}
html[data-theme-mode="dark"] .cp-reward-list-close:hover {
  background:#273449;
  color:#e2e8f0;
}
html[data-theme-mode="dark"] .cp-reward-list-item { border-bottom-color:#1e293b; }
html[data-theme-mode="dark"] .cp-reward-list-points,
html[data-theme-mode="dark"] .cp-reward-balance-value { color:#fbbf24; }
html[data-theme-mode="dark"] .cp-reward-list-empty i { color:#334155; }

/* 引用帖子卡片 */
html[data-theme-mode="dark"] .cp-quote-card { background:#0f172a; border-color:#243244; }
html[data-theme-mode="dark"] .cp-quote-card-title { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-quote-card-meta { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-quote-card-cover { background:#1e293b; }

/* 举报弹窗 */
html[data-theme-mode="dark"] .cp-report-reason-item { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-report-reason-item:hover { background:#152136; }
html[data-theme-mode="dark"] .cp-report-reason-item.selected { border-color:var(--cc-blue); background:rgba(var(--cc-blue-rgb,37,99,235),.14); }
/* 回复弹窗 */
html[data-theme-mode="dark"] .cp-replies-modal-content { background:#111827; border-color:#243244; box-shadow:0 20px 50px rgba(0,0,0,.5); }
html[data-theme-mode="dark"] .cp-replies-modal-header { border-color:#243244; color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-replies-modal-close { color:#94a3b8; }

/* 外部链接弹窗 */
html[data-theme-mode="dark"] .cp-share-dialog,
html[data-theme-mode="dark"] .cp-report-box,
html[data-theme-mode="dark"] .cp-external-link-dialog {
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.30),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 20px 50px rgba(0,0,0,.50);
  backdrop-filter: blur(22px) saturate(200%) brightness(.84);
  -webkit-backdrop-filter: blur(22px) saturate(200%) brightness(.84);
}
html[data-theme-mode="dark"] .cp-share-header {
  background: linear-gradient(135deg, rgba(16,185,129,.62) 0%, rgba(5,150,105,.56) 100%);
  border-bottom-color: rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
html[data-theme-mode="dark"] .cp-share-close {
  border-color: rgba(255,255,255,.20);
  background: rgba(255,255,255,.10);
}
html[data-theme-mode="dark"] .cp-share-close:hover {
  background: rgba(255,255,255,.18);
}
html[data-theme-mode="dark"] .cp-share-platform,
html[data-theme-mode="dark"] .cp-share-link-section {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 8px 22px rgba(0,0,0,.24);
}
html[data-theme-mode="dark"] .cp-share-platform span,
html[data-theme-mode="dark"] .cp-share-link-label,
html[data-theme-mode="dark"] .cp-share-divider {
  color: #94a3b8;
}
html[data-theme-mode="dark"] .cp-share-divider::before,
html[data-theme-mode="dark"] .cp-share-divider::after {
  background: rgba(255,255,255,.16);
}
html[data-theme-mode="dark"] .cp-share-url-input {
  background: rgba(15,23,42,.46);
  border-color: rgba(255,255,255,.20);
  color: #cbd5e1;
}
html[data-theme-mode="dark"] .cp-qrcode-overlay {
  background: rgba(15,23,42,.52);
}
html[data-theme-mode="dark"] .cp-qrcode-box {
  background: rgba(15,23,42,.72);
  border-color: rgba(255,255,255,.18);
}
html[data-theme-mode="dark"] .cp-external-link-header { border-color:#243244; }
html[data-theme-mode="dark"] .cp-external-link-title { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-external-link-desc { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-external-link-url { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-external-link-cancel { background:#1e293b; color:#cbd5e1; }
html[data-theme-mode="dark"] .cp-external-link-cancel:hover { background:#273449; }

/* 表情包选择器弹窗（emoji_picker.css 覆盖） */
html[data-theme-mode="dark"] .emoji-picker {
  background:#111827;
  border-color:#243244;
  box-shadow:0 18px 42px rgba(0,0,0,.46);
}
html[data-theme-mode="dark"] .emoji-picker-header {
  background:#0f172a;
  border-bottom-color:#243244;
}
html[data-theme-mode="dark"] .cp-main-column,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-list,
html[data-theme-mode="dark"] .cp-reward-list-body,
html[data-theme-mode="dark"] .mention-dropdown,
html[data-theme-mode="dark"] .emoji-picker-header,
html[data-theme-mode="dark"] .emoji-picker-body {
  scrollbar-color: rgba(100,116,139,.55) rgba(255,255,255,.06);
}
html[data-theme-mode="dark"] .cp-main-column::-webkit-scrollbar-track,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-list::-webkit-scrollbar-track,
html[data-theme-mode="dark"] .cp-reward-list-body::-webkit-scrollbar-track,
html[data-theme-mode="dark"] .mention-dropdown::-webkit-scrollbar-track,
html[data-theme-mode="dark"] .emoji-picker-header::-webkit-scrollbar-track,
html[data-theme-mode="dark"] .emoji-picker-body::-webkit-scrollbar-track {
  background: rgba(255,255,255,.06);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
}
html[data-theme-mode="dark"] .cp-main-column::-webkit-scrollbar-thumb,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-list::-webkit-scrollbar-thumb,
html[data-theme-mode="dark"] .cp-reward-list-body::-webkit-scrollbar-thumb,
html[data-theme-mode="dark"] .mention-dropdown::-webkit-scrollbar-thumb,
html[data-theme-mode="dark"] .emoji-picker-header::-webkit-scrollbar-thumb,
html[data-theme-mode="dark"] .emoji-picker-body::-webkit-scrollbar-thumb {
  border-color: rgba(255,255,255,.16);
  background: linear-gradient(180deg, rgba(148,163,184,.44), rgba(71,85,105,.48));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 1px 2px rgba(0,0,0,.30);
}
html[data-theme-mode="dark"] .cp-main-column::-webkit-scrollbar-thumb:hover,
html[data-theme-mode="dark"] .cp-comment-column .cp-comment-list::-webkit-scrollbar-thumb:hover,
html[data-theme-mode="dark"] .cp-reward-list-body::-webkit-scrollbar-thumb:hover,
html[data-theme-mode="dark"] .mention-dropdown::-webkit-scrollbar-thumb:hover,
html[data-theme-mode="dark"] .emoji-picker-header::-webkit-scrollbar-thumb:hover,
html[data-theme-mode="dark"] .emoji-picker-body::-webkit-scrollbar-thumb:hover {
  border-color: rgba(125,211,252,.45);
  background: linear-gradient(180deg, rgba(96,165,250,.60), rgba(37,99,235,.54));
}
html[data-theme-mode="dark"] .mention-dropdown {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 16px 38px rgba(0,0,0,.42);
  backdrop-filter: blur(22px) saturate(200%) brightness(.84);
  -webkit-backdrop-filter: blur(22px) saturate(200%) brightness(.84);
}
html[data-theme-mode="dark"] .mention-dropdown-header {
  color: #cbd5e1;
  border-bottom-color: rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.03) 100%);
}
html[data-theme-mode="dark"] .mention-item {
  border-bottom-color: rgba(255,255,255,.10);
}
html[data-theme-mode="dark"] .mention-item-name { color: #e5e7eb; }
html[data-theme-mode="dark"] .mention-item:hover,
html[data-theme-mode="dark"] .mention-item.selected {
  background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(var(--cc-blue-rgb,37,99,235),.20));
  box-shadow: inset 0 0 0 1px rgba(var(--cc-blue-rgb,37,99,235),.28);
}
html[data-theme-mode="dark"] .mention-item-badge {
  background: rgba(var(--cc-blue-rgb,37,99,235),.22);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.34);
  color: #bfdbfe;
}
html[data-theme-mode="dark"] .mention-item-badge.mutual {
  background: rgba(16,185,129,.22);
  border-color: rgba(16,185,129,.36);
  color: #6ee7b7;
}
html[data-theme-mode="dark"] .emoji-category-tab {
  background:#0f172a;
  border-color:#2b3b53;
  color:#94a3b8;
}
html[data-theme-mode="dark"] .emoji-category-tab:hover {
  background:#152136;
  border-color:rgba(var(--cc-blue-rgb,37,99,235),.36);
  color:#dbeafe;
}
html[data-theme-mode="dark"] .emoji-category-tab.active {
  background:var(--cc-blue);
  border-color:var(--cc-blue);
  color:#fff;
}
html[data-theme-mode="dark"] .emoji-picker {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 18px 42px rgba(0,0,0,.46);
  backdrop-filter: blur(22px) saturate(200%) brightness(.84);
  -webkit-backdrop-filter: blur(22px) saturate(200%) brightness(.84);
}
html[data-theme-mode="dark"] .emoji-picker-header {
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border-bottom-color: rgba(255,255,255,.14);
}
html[data-theme-mode="dark"] .emoji-picker-body { background: rgba(255,255,255,.02); }
html[data-theme-mode="dark"] .emoji-picker-item:hover { background:rgba(var(--cc-blue-rgb,37,99,235),.16); }
html[data-theme-mode="dark"] .emoji-picker-empty { color:#64748b; }
html[data-theme-mode="dark"] .emoji-preview-popup {
  background: rgba(255,255,255,.12);
  border-color: rgba(var(--cc-blue-rgb,37,99,235),.46);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 12px 30px rgba(0,0,0,.45);
}
html[data-theme-mode="dark"] .emoji-picker-locked::after { background:rgba(0,0,0,.45); }

/* 浮动操作栏 */
html[data-theme-mode="dark"] .cp-floating-action { background:#111827; border-color:#243244; color:#94a3b8; box-shadow:0 4px 12px rgba(0,0,0,.28); }
html[data-theme-mode="dark"] .cp-floating-action:hover { border-color:var(--cc-blue); color:var(--cc-blue); box-shadow:0 6px 18px rgba(0,0,0,.36); }
html[data-theme-mode="dark"] .cp-floating-action.active { background:var(--cc-blue); color:#fff; }

/* emoji 按钮 */
html[data-theme-mode="dark"] .emoji-btn { background:#0f172a; border-color:#2b3b53; color:#cbd5e1; box-shadow:none; }
html[data-theme-mode="dark"] .emoji-btn:hover { background:#1a1f14; border-color:#5a4f28; color:#fbbf24; }

/* 版本编辑弹窗 */
html[data-theme-mode="dark"] .cp-version-edit-modal-content { background:#111827; border-color:#243244; }
html[data-theme-mode="dark"] .cp-version-edit-field input,
html[data-theme-mode="dark"] .cp-version-edit-field textarea,
html[data-theme-mode="dark"] .cp-version-edit-field select { background:#0f172a; border-color:#2b3b53; color:#e2e8f0; }
html[data-theme-mode="dark"] .cp-version-edit-cancel-btn { background:#1e293b; color:#cbd5e1; }

/* [square:id] 卡片与标签 */
html[data-theme-mode="dark"] .cp-square-card {
  background:#111827;
  border-color:#243244;
  box-shadow:0 8px 22px rgba(0,0,0,.30);
}
html[data-theme-mode="dark"] .cp-square-card:hover {
  border-color:rgba(90,181,82,.55);
  box-shadow:0 12px 26px rgba(0,0,0,.42);
}
html[data-theme-mode="dark"] .cp-square-card-name { color:#e5e7eb; }
html[data-theme-mode="dark"] .cp-square-card-desc,
html[data-theme-mode="dark"] .cp-square-card-meta,
html[data-theme-mode="dark"] .cp-square-card-loading,
html[data-theme-mode="dark"] .cp-square-card-error { color:#94a3b8; }
html[data-theme-mode="dark"] .cp-square-card-tag {
  color:#86efac;
  background:rgba(34,197,94,.16);
  border:1px solid rgba(34,197,94,.34);
}
html[data-theme-mode="dark"] .cp-square-card-loading .dot-loading span { background:#64748b; }

/* 骨架屏 */
html[data-theme-mode="dark"] .cp-skeleton {
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.05)) !important;
  border-color: rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
html[data-theme-mode="dark"] .cp-skeleton::after { background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent); }
html[data-theme-mode="dark"] .cp-detail-skeleton-card {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.24),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 10px 24px rgba(0,0,0,.34);
}
html[data-theme-mode="dark"] .cp-detail-skeleton-resource {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
html[data-theme-mode="dark"] .cp-detail-skeleton-hidden {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.18);
}
html[data-theme-mode="dark"] .cp-comment-skeleton-item {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 8px 18px rgba(0,0,0,.30);
}