/* ============================================================
   Queen社区 设计系统 v3 - 简约灵动 · 圆角 · 玻璃态
   双主题：日间（6:00-18:00 白色）/ 夜间（18:00-6:00 深色）
   PC 专用：1920×1080 基准，1280px 最小宽度
   ============================================================ */

/* contenteditable 富文本编辑器 placeholder */
[contenteditable][data-placeholder]:empty::before {
    content: attr(data-placeholder);
    color: var(--text-dimmer);
    pointer-events: none;
}

/* 富文本工具栏按钮 */
.rt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
    color: var(--text-dim);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
    user-select: none;
}
.rt-btn:hover {
    background: var(--bg-hover);
    color: var(--gold);
    border-color: var(--border-gold);
}
.rt-btn:active {
    transform: scale(0.95);
}
.rt-divider {
    display: inline-block;
    width: 1px;
    height: 18px;
    background: var(--border);
    margin: 0 4px;
    vertical-align: middle;
}
/* contenteditable 聚焦时高亮 */
#post-editor:focus {
    box-shadow: inset 0 0 0 2px var(--border-gold);
    outline: none;
}
#post-editor a {
    color: var(--gold);
    text-decoration: underline;
}
#post-editor:focus-visible {
    outline: none;
}
#post-editor {
    -webkit-user-select: text;
    user-select: text;
    cursor: text;
    word-break: break-word;
    overflow-wrap: break-word;
}

/* ============================================================
   帖子富文本内容排版系统 v2
   完美支持：标题、段落、列表、引用、代码块、图片、表格、链接
   适配：PC + 移动端，防止内容溢出和重叠
   ============================================================ */
.post-content {
    -webkit-user-select: text;
    user-select: text;
    cursor: text;
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
    /* 使用 BFC 防止浮动元素导致的重叠 */
    overflow: visible;
}
.post-card {
    -webkit-user-select: none;
    user-select: none;
}
/* 纯文本内容保留空白符 */
.post-content-plain {
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: break-word;
}
/* 折叠状态下的内容（列表页长帖子截断） */
.post-content-collapsed {
    /* 使用 max-height 限制高度，但允许内容完整渲染（不裁剪标签） */
    max-height: 180px;
    overflow: hidden;
    position: relative;
    /* 底部渐变遮罩，提示用户有更多内容 */
    -webkit-mask-image: linear-gradient(to bottom, #000 80%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 80%, transparent 100%);
}
/* 标题样式 */
.post-content h1 {
    font-size: 1.5em;
    font-weight: 700;
    margin: 0.8em 0 0.5em;
    line-height: 1.4;
    color: var(--text);
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content h2 {
    font-size: 1.3em;
    font-weight: 700;
    margin: 0.7em 0 0.4em;
    line-height: 1.4;
    color: var(--text);
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content h3 {
    font-size: 1.15em;
    font-weight: 600;
    margin: 0.6em 0 0.3em;
    line-height: 1.4;
    color: var(--text);
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content h4, .post-content h5, .post-content h6 {
    font-size: 1em;
    font-weight: 600;
    margin: 0.5em 0 0.3em;
    line-height: 1.4;
    color: var(--text);
}
/* 段落 */
.post-content p {
    margin: 0.5em 0;
    line-height: 1.7;
    word-break: break-word;
    overflow-wrap: break-word;
}
/* 引用块 */
.post-content blockquote {
    border-left: 3px solid var(--gold);
    padding: 8px 14px;
    margin: 0.8em 0;
    background: rgba(224,201,122,0.06);
    border-radius: 0 8px 8px 0;
    color: var(--text-dim);
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content blockquote p {
    margin: 0.3em 0;
}
/* 列表 */
.post-content ul, .post-content ol {
    margin: 0.6em 0;
    padding-left: 28px;
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content li {
    margin: 0.3em 0;
    line-height: 1.7;
}
/* 链接 */
.post-content a {
    color: var(--gold);
    text-decoration: none;
    word-break: break-all;
    overflow-wrap: break-word;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.post-content a:hover {
    text-decoration: none;
    border-bottom-color: var(--gold);
}
/* 图片 */
.post-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 0.5em 0;
    display: block;
}
/* 行内代码 */
.post-content code {
    background: var(--bg-card-2);
    padding: 2px 6px;
    border-radius: 4px;
    font-family: 'SF Mono', Monaco, Consolas, 'Courier New', monospace;
    font-size: 0.88em;
    color: var(--gold-bright);
    word-break: break-all;
    overflow-wrap: break-word;
}
/* 代码块 */
.post-content pre {
    background: var(--bg-card-2);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px 14px;
    margin: 0.8em 0;
    overflow-x: auto;
    overflow-y: hidden;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}
.post-content pre::-webkit-scrollbar {
    height: 6px;
}
.post-content pre::-webkit-scrollbar-thumb {
    background: var(--border-light);
    border-radius: 3px;
}
.post-content pre code {
    background: transparent;
    padding: 0;
    border-radius: 0;
    color: var(--text);
    font-size: 0.9em;
    line-height: 1.6;
    word-break: normal;
    overflow-wrap: normal;
    white-space: pre;
}
/* 表格 */
.post-content table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    margin: 0.8em 0;
    overflow-x: auto;
    display: block;
    -webkit-overflow-scrolling: touch;
}
.post-content thead {
    background: var(--bg-card-2);
}
.post-content th, .post-content td {
    border: 1px solid var(--border);
    padding: 8px 12px;
    text-align: left;
    word-break: break-word;
    overflow-wrap: break-word;
}
.post-content th {
    font-weight: 600;
    color: var(--text);
}
.post-content td {
    color: var(--text-dim);
}
/* 分割线 */
.post-content hr {
    border: none;
    border-top: 1px solid var(--border);
    margin: 1.2em 0;
}
/* 视频和嵌入内容 */
.post-content video,
.post-content iframe {
    max-width: 100%;
    border-radius: 8px;
    margin: 0.5em 0;
}
/* 强调 */
.post-content strong, .post-content b {
    font-weight: 700;
    color: var(--text);
}
.post-content em, .post-content i {
    font-style: italic;
}
.post-content del, .post-content s {
    text-decoration: line-through;
    color: var(--text-dimmer);
}
/* 行内引用 */
.post-content q {
    color: var(--text-dim);
    font-style: italic;
}
/* 缩写词 */
.post-content abbr {
    border-bottom: 1px dotted var(--text-dimmer);
    cursor: help;
}
/* 键盘输入 */
.post-content kbd {
    background: var(--bg-card-2);
    border: 1px solid var(--border-light);
    border-radius: 4px;
    padding: 1px 6px;
    font-family: 'SF Mono', Monaco, Consolas, monospace;
    font-size: 0.85em;
    box-shadow: 0 1px 0 var(--border);
}
/* 标记 */
.post-content mark {
    background: rgba(224,201,122,0.25);
    color: var(--text);
    padding: 1px 4px;
    border-radius: 3px;
}
/* 展开全文链接 */
.post-expand-link {
    display: inline-block;
    font-size: 13px;
    color: var(--gold);
    margin-bottom: 14px;
    text-decoration: none;
    font-weight: 500;
    padding: 4px 10px;
    border-radius: 6px;
    background: rgba(224,201,122,0.08);
    border: 1px solid rgba(224,201,122,0.2);
    transition: all 0.2s;
}
.post-expand-link:hover {
    background: rgba(224,201,122,0.15);
    border-color: var(--gold);
    transform: translateY(-1px);
}

/* ========== 夜间主题（默认，深色） ========== */
:root,
[data-theme="dark"] {
  --bg-base: #07070c;
  --bg-deep: #07070c;
  --bg-card: #11111a;
  --bg-card-2: #181824;
  --bg-card-3: #1e1e2e;
  --bg-elevated: #1e1e2e;
  --bg-input: #181824;
  --bg-hover: rgba(255, 255, 255, 0.03);

  --border: #26263a;
  --border-light: #2f2f48;
  --border-gold: rgba(224, 201, 122, 0.3);

  --text: #e8e8f0;
  --text-dim: #9ca3af;
  --text-dimmer: #6b7280;

  --gold: #e0c97a;
  --gold-bright: #f5e08a;
  --gold-dim: #b8a05a;
  --gold-dark: #8b7a3f;
  --gold-gradient: linear-gradient(135deg, #f5e08a 0%, #e0c97a 50%, #b8a05a 100%);

  --purple: #8b5cf6;
  --purple-bright: #a78bfa;
  --purple-dim: #6d28d9;
  --purple-gradient: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 50%, #6d28d9 100%);

  --success: #10b981;
  --success-dim: #047857;
  --danger: #ef4444;
  --danger-dim: #b91c1c;
  --warning: #f59e0b;
  --info: #3b82f6;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
  --shadow-gold: 0 8px 32px rgba(224, 201, 122, 0.15);
  --shadow-purple: 0 8px 32px rgba(139, 92, 246, 0.15);

  --glass-bg: rgba(17, 17, 26, 0.7);
  --glass-border: rgba(255, 255, 255, 0.05);

  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 14px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

  --topbar-bg: rgba(17, 17, 26, 0.8);
  --sidebar-bg: rgba(17, 17, 26, 0.5);
  --body-gradient-1: radial-gradient(ellipse at top left, rgba(139, 92, 246, 0.08) 0%, transparent 50%);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(224, 201, 122, 0.06) 0%, transparent 50%);
}

/* ========== 日间主题（白色简约） ========== */
[data-theme="light"] {
  --bg-base: #f5f5f7;
  --bg-deep: #f5f5f7;
  --bg-card: #ffffff;
  --bg-card-2: #f7f7f9;
  --bg-card-3: #f0f0f3;
  --bg-elevated: #ffffff;
  --bg-input: #f7f7f9;
  --bg-hover: rgba(0, 0, 0, 0.02);

  --border: #e5e5ea;
  --border-light: #d1d1d6;
  --border-gold: rgba(184, 160, 90, 0.4);

  --text: #1d1d1f;
  --text-dim: #6e6e73;
  --text-dimmer: #a1a1a6;

  --gold: #b8a05a;
  --gold-bright: #c9b06a;
  --gold-dim: #a08840;
  --gold-dark: #8b7a3f;
  --gold-gradient: linear-gradient(135deg, #d4b86a 0%, #b8a05a 50%, #a08840 100%);

  --purple: #7c3aed;
  --purple-bright: #8b5cf6;
  --purple-dim: #6d28d9;
  --purple-gradient: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 50%, #6d28d9 100%);

  --success: #059669;
  --success-dim: #047857;
  --danger: #dc2626;
  --danger-dim: #b91c1c;
  --warning: #d97706;
  --info: #2563eb;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08);
  --shadow-gold: 0 8px 32px rgba(184, 160, 90, 0.15);
  --shadow-purple: 0 8px 32px rgba(124, 58, 237, 0.12);

  --glass-bg: rgba(255, 255, 255, 0.75);
  --glass-border: rgba(0, 0, 0, 0.04);

  --topbar-bg: rgba(255, 255, 255, 0.85);
  --sidebar-bg: rgba(255, 255, 255, 0.6);
  --body-gradient-1: radial-gradient(ellipse at top left, rgba(124, 58, 237, 0.04) 0%, transparent 50%);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(184, 160, 90, 0.05) 0%, transparent 50%);
}

/* ============================================================
   配色方案系统 v2（通过 data-color 属性切换）
   6 套配色：金、紫、蓝、绿、红、玫瑰
   每套配色覆盖 --gold / --gold-bright / --gold-dim / --gold-dark /
   --gold-gradient / --border-gold / --shadow-gold / --body-gradient-2
   ============================================================ */

/* 默认：尊贵金（与原主题一致） */
[data-color="gold"],
:root {
  --gold: #e0c97a;
  --gold-bright: #f5e08a;
  --gold-dim: #b8a05a;
  --gold-dark: #8b7a3f;
  --gold-gradient: linear-gradient(135deg, #f5e08a 0%, #e0c97a 50%, #b8a05a 100%);
  --border-gold: rgba(224, 201, 122, 0.3);
  --shadow-gold: 0 8px 32px rgba(224, 201, 122, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(224, 201, 122, 0.06) 0%, transparent 50%);
}
[data-theme="light"][data-color="gold"] {
  --gold: #b8a05a;
  --gold-bright: #c9b06a;
  --gold-dim: #a08840;
  --gold-dark: #8b7a3f;
  --gold-gradient: linear-gradient(135deg, #d4b86a 0%, #b8a05a 50%, #a08840 100%);
  --border-gold: rgba(184, 160, 90, 0.4);
  --shadow-gold: 0 8px 32px rgba(184, 160, 90, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(184, 160, 90, 0.05) 0%, transparent 50%);
}

/* 神秘紫 */
[data-color="purple"] {
  --gold: #a78bfa;
  --gold-bright: #c4b5fd;
  --gold-dim: #8b5cf6;
  --gold-dark: #6d28d9;
  --gold-gradient: linear-gradient(135deg, #c4b5fd 0%, #a78bfa 50%, #8b5cf6 100%);
  --border-gold: rgba(167, 139, 250, 0.3);
  --shadow-gold: 0 8px 32px rgba(167, 139, 250, 0.18);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(139, 92, 246, 0.08) 0%, transparent 50%);
}
[data-theme="light"][data-color="purple"] {
  --gold: #7c3aed;
  --gold-bright: #8b5cf6;
  --gold-dim: #6d28d9;
  --gold-dark: #5b21b6;
  --gold-gradient: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 50%, #6d28d9 100%);
  --border-gold: rgba(124, 58, 237, 0.4);
  --shadow-gold: 0 8px 32px rgba(124, 58, 237, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(124, 58, 237, 0.04) 0%, transparent 50%);
}

/* 深邃蓝 */
[data-color="blue"] {
  --gold: #60a5fa;
  --gold-bright: #93c5fd;
  --gold-dim: #3b82f6;
  --gold-dark: #2563eb;
  --gold-gradient: linear-gradient(135deg, #93c5fd 0%, #60a5fa 50%, #3b82f6 100%);
  --border-gold: rgba(96, 165, 250, 0.3);
  --shadow-gold: 0 8px 32px rgba(96, 165, 250, 0.18);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(59, 130, 246, 0.08) 0%, transparent 50%);
}
[data-theme="light"][data-color="blue"] {
  --gold: #2563eb;
  --gold-bright: #3b82f6;
  --gold-dim: #1d4ed8;
  --gold-dark: #1e40af;
  --gold-gradient: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
  --border-gold: rgba(37, 99, 235, 0.4);
  --shadow-gold: 0 8px 32px rgba(37, 99, 235, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(37, 99, 235, 0.04) 0%, transparent 50%);
}

/* 自然绿 */
[data-color="green"] {
  --gold: #34d399;
  --gold-bright: #6ee7b7;
  --gold-dim: #10b981;
  --gold-dark: #059669;
  --gold-gradient: linear-gradient(135deg, #6ee7b7 0%, #34d399 50%, #10b981 100%);
  --border-gold: rgba(52, 211, 153, 0.3);
  --shadow-gold: 0 8px 32px rgba(52, 211, 153, 0.18);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(16, 185, 129, 0.08) 0%, transparent 50%);
}
[data-theme="light"][data-color="green"] {
  --gold: #059669;
  --gold-bright: #10b981;
  --gold-dim: #047857;
  --gold-dark: #065f46;
  --gold-gradient: linear-gradient(135deg, #10b981 0%, #059669 50%, #047857 100%);
  --border-gold: rgba(5, 150, 105, 0.4);
  --shadow-gold: 0 8px 32px rgba(5, 150, 105, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(5, 150, 105, 0.04) 0%, transparent 50%);
}

/* 热烈红 */
[data-color="red"] {
  --gold: #f87171;
  --gold-bright: #fca5a5;
  --gold-dim: #ef4444;
  --gold-dark: #dc2626;
  --gold-gradient: linear-gradient(135deg, #fca5a5 0%, #f87171 50%, #ef4444 100%);
  --border-gold: rgba(248, 113, 113, 0.3);
  --shadow-gold: 0 8px 32px rgba(248, 113, 113, 0.18);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(239, 68, 68, 0.08) 0%, transparent 50%);
}
[data-theme="light"][data-color="red"] {
  --gold: #dc2626;
  --gold-bright: #ef4444;
  --gold-dim: #b91c1c;
  --gold-dark: #991b1b;
  --gold-gradient: linear-gradient(135deg, #ef4444 0%, #dc2626 50%, #b91c1c 100%);
  --border-gold: rgba(220, 38, 38, 0.4);
  --shadow-gold: 0 8px 32px rgba(220, 38, 38, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(220, 38, 38, 0.04) 0%, transparent 50%);
}

/* 浪漫玫瑰 */
[data-color="rose"] {
  --gold: #fb7185;
  --gold-bright: #fda4af;
  --gold-dim: #f43f5e;
  --gold-dark: #e11d48;
  --gold-gradient: linear-gradient(135deg, #fda4af 0%, #fb7185 50%, #f43f5e 100%);
  --border-gold: rgba(251, 113, 133, 0.3);
  --shadow-gold: 0 8px 32px rgba(251, 113, 133, 0.18);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(244, 63, 94, 0.08) 0%, transparent 50%);
}
[data-theme="light"][data-color="rose"] {
  --gold: #e11d48;
  --gold-bright: #f43f5e;
  --gold-dim: #be123c;
  --gold-dark: #9f1239;
  --gold-gradient: linear-gradient(135deg, #f43f5e 0%, #e11d48 50%, #be123c 100%);
  --border-gold: rgba(225, 29, 72, 0.4);
  --shadow-gold: 0 8px 32px rgba(225, 29, 72, 0.15);
  --body-gradient-2: radial-gradient(ellipse at bottom right, rgba(225, 29, 72, 0.04) 0%, transparent 50%);
}

/* 配色预览圆点 */
.color-preview-gold { background: linear-gradient(135deg, #f5e08a, #b8a05a); }
.color-preview-purple { background: linear-gradient(135deg, #c4b5fd, #8b5cf6); }
.color-preview-blue { background: linear-gradient(135deg, #93c5fd, #3b82f6); }
.color-preview-green { background: linear-gradient(135deg, #6ee7b7, #10b981); }
.color-preview-red { background: linear-gradient(135deg, #fca5a5, #ef4444); }
.color-preview-rose { background: linear-gradient(135deg, #fda4af, #f43f5e); }

/* 配色面板动画 */
@keyframes colorPickerIn {
  from { opacity: 0; transform: translateY(-8px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.color-scheme-item:hover {
  background: var(--bg-hover) !important;
  transform: translateY(-2px);
}

/* 主题切换平滑过渡 */
*, *::before, *::after {
  transition-property: background-color, border-color, color, box-shadow;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { min-width: 100%; }

html, body {
  font-family: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: var(--bg-deep);
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background 0.4s ease, color 0.3s ease;
}

body {
  min-height: 100vh;
  background-image: var(--body-gradient-1), var(--body-gradient-2);
  background-attachment: fixed;
}

.brand-font { font-family: 'Cinzel', serif; letter-spacing: 0.5px; }
.gold-text { color: var(--gold); }
.gold-gradient-text {
  background: var(--gold-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.purple-text { color: var(--purple-bright); }

/* ========== 滚动条：简约圆角 ========== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 4px; transition: var(--transition); }
::-webkit-scrollbar-thumb:hover { background: var(--gold-dim); }

/* ========== 通用卡片：圆角玻璃态 ========== */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: var(--transition);
  box-shadow: var(--shadow-sm);
}
.card-hover:hover {
  border-color: var(--border-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.card-glass, .glass {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
}

/* ========== 按钮：圆角灵动 ========== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 22px;
  border-radius: var(--radius-xs);
  font-weight: 500;
  font-size: 14px;
  cursor: pointer;
  border: none;
  transition: var(--transition);
  white-space: nowrap;
  user-select: none;
  font-family: inherit;
}
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-primary {
  background: var(--gold-gradient);
  color: #0a0a0f;
  font-weight: 600;
}
.btn-primary:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: var(--shadow-gold);
  filter: brightness(1.05);
}
.btn-ghost {
  background: transparent;
  color: var(--text-dim);
  border: 1px solid var(--border);
}
.btn-ghost:hover {
  color: var(--text);
  border-color: var(--gold-dim);
  background: var(--bg-hover);
}
.btn-purple {
  background: var(--purple-gradient);
  color: #fff;
}
.btn-purple:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: var(--shadow-purple);
  filter: brightness(1.05);
}
.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover:not(:disabled) { background: var(--danger-dim); }
.btn-sm { padding: 7px 14px; font-size: 13px; border-radius: var(--radius-xs); }
.btn-lg { padding: 14px 28px; font-size: 15px; border-radius: var(--radius-sm); }
.btn-block { width: 100%; }

.btn-group { display: flex; gap: 10px; }
.btn-group.between { justify-content: space-between; }
.btn-group.right { justify-content: flex-end; }

/* ========== 输入框：圆角聚焦 ========== */
input, textarea, select {
  background: var(--bg-input);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: var(--radius-xs);
  padding: 12px 14px;
  width: 100%;
  font-size: 14px;
  font-family: inherit;
  transition: var(--transition);
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(224, 201, 122, 0.12);
  background: var(--bg-elevated);
}
input::placeholder, textarea::placeholder { color: var(--text-dimmer); }
label {
  font-size: 12px;
  color: var(--text-dim);
  margin-bottom: 8px;
  display: block;
  font-weight: 500;
  letter-spacing: 0.3px;
}

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; }
.form-group.full { grid-column: 1 / -1; }

.section-block {
  border-left: 2px solid var(--border);
  padding-left: 16px;
  margin-bottom: 20px;
}
.section-block.gold { border-color: var(--gold); }
.section-block.purple { border-color: var(--purple); }
.section-title {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 12px;
  letter-spacing: 0.3px;
}
.section-block.gold .section-title { color: var(--gold); }
.section-block.purple .section-title { color: var(--purple); }

.avatar {
  border-radius: 50%;
  background: var(--bg-card-2);
  object-fit: cover;
  flex-shrink: 0;
}
.avatar-gold { border: 2px solid var(--gold); }

.badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: var(--radius-full);
  font-size: 11px;
  font-weight: 500;
}
.badge-gold { background: rgba(224, 201, 122, 0.15); color: var(--gold); }
.badge-purple { background: rgba(139, 92, 246, 0.15); color: var(--purple-bright); }
.badge-success { background: rgba(16, 185, 129, 0.15); color: var(--success); }
.badge-danger { background: rgba(239, 68, 68, 0.15); color: var(--danger); }
.badge-warning { background: rgba(245, 158, 11, 0.15); color: var(--warning); }

/* ============================================================
   自定义圆角复选框（金色渐变勾选动画 + 悬停金色边框）
   用法：<label class="queen-checkbox-label">
          <input type="checkbox" id="xxx">
          <span class="queen-checkbox-box"></span>
          <span>标签文字</span>
        </label>
   ============================================================ */
.queen-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  position: relative;
  padding: 6px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-card-2);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.queen-checkbox-label:hover {
  border-color: var(--gold);
  background: rgba(224, 201, 122, 0.06);
}
.queen-checkbox-label > input[type="checkbox"] {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}
.queen-checkbox-box {
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  background: var(--bg-card);
  flex-shrink: 0;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-sizing: border-box;
}
.queen-checkbox-label:hover .queen-checkbox-box {
  border-color: var(--gold);
  box-shadow: inset 0 0 0 1px rgba(224, 201, 122, 0.2);
}
/* 勾选标记：用 CSS 绘制（两条线拼成 √） */
.queen-checkbox-box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg) scale(0);
  transform-origin: bottom right;
  opacity: 0;
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.15s ease;
}
.queen-checkbox-label > input[type="checkbox"]:checked + .queen-checkbox-box {
  border-color: var(--gold);
  background: var(--gold-gradient);
  box-shadow: 0 0 8px rgba(224, 201, 122, 0.3);
}
.queen-checkbox-label > input[type="checkbox"]:checked + .queen-checkbox-box::after {
  transform: rotate(45deg) scale(1);
  opacity: 1;
}
.queen-checkbox-label > input[type="checkbox"]:focus-visible + .queen-checkbox-box {
  box-shadow: 0 0 0 2px rgba(224, 201, 122, 0.3);
}

/* ============================================================
   Queen 皇冠 CSS 图标（金色渐变 + 圆角，用于登录预览提示）
   用法：<div class="queen-crown-icon"></div>
   ============================================================ */
.queen-crown-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: var(--gold-gradient);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 0 auto 12px;
  box-shadow: 0 8px 24px rgba(224, 201, 122, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.queen-crown-icon::before {
  content: "";
  width: 30px;
  height: 22px;
  background:
    radial-gradient(circle at 15% 100%, #fff 0 3px, transparent 3.5px),
    radial-gradient(circle at 50% 100%, #fff 0 4px, transparent 4.5px),
    radial-gradient(circle at 85% 100%, #fff 0 3px, transparent 3.5px),
    linear-gradient(to bottom, #fff 0%, #fff 100%);
  clip-path: polygon(
    0% 100%, 100% 100%, 100% 40%,
    82% 70%, 65% 15%, 50% 55%,
    35% 15%, 18% 70%, 0% 40%
  );
  -webkit-clip-path: polygon(
    0% 100%, 100% 100%, 100% 40%,
    82% 70%, 65% 15%, 50% 55%,
    35% 15%, 18% 70%, 0% 40%
  );
}
.queen-crown-icon::after {
  content: "";
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 32px;
  height: 3px;
  border-radius: 2px;
  background: #fff;
  opacity: 0.85;
}

.online-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 2px var(--bg-card);
}
.offline-dot { background: var(--text-dimmer); }

.progress {
  width: 100%;
  height: 6px;
  background: var(--bg-card-2);
  border-radius: 3px;
  overflow: hidden;
}
.progress-bar {
  height: 100%;
  background: var(--gold-gradient);
  transition: width 0.3s ease;
  border-radius: 3px;
}

.spinner {
  width: 18px; height: 18px;
  border: 2px solid var(--border-light);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
.spinner-sm { width: 14px; height: 14px; border-width: 2px; }
.spinner-lg { width: 32px; height: 32px; border-width: 3px; }
@keyframes spin { to { transform: rotate(360deg); } }

.fade-in { animation: fadeIn 0.4s ease-out; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.fade-in-slow { animation: fadeIn 0.6s ease-out; }
.slide-in-right { animation: slideInRight 0.3s ease-out; }
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}
.slide-in-up { animation: slideInUp 0.4s ease-out; }
@keyframes slideInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.scale-in { animation: scaleIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes slideUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

a { color: var(--gold); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--gold-bright); }

.nav-link {
  color: var(--text-dim);
  font-size: 14px;
  font-weight: 500;
  transition: var(--transition);
  padding: 8px 14px;
  border-radius: var(--radius-xs);
  cursor: pointer;
}
.nav-link:hover { color: var(--text); background: var(--bg-hover); }
.nav-link.active { color: var(--gold); background: rgba(224,201,122,0.08); }

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--radius-xs);
  color: var(--text-dim);
  text-decoration: none;
  transition: var(--transition);
  font-size: 14px;
  cursor: pointer;
}
.sidebar-link:hover { color: var(--text); background: var(--bg-hover); }
.sidebar-link.active { color: var(--gold); background: rgba(224,201,122,0.08); }

.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.text-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hidden { display: none !important; }

table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border); }
th { color: var(--text-dim); font-weight: 500; font-size: 12px; }
thead th { background: var(--bg-card-2); border-bottom: 2px solid var(--border); }
tbody tr { transition: background 0.15s ease; }
tbody tr:hover { background: var(--bg-hover); }
tbody tr:last-child td { border-bottom: none; }
tbody tr.row-high-risk { background: rgba(239, 68, 68, 0.05); }
tbody tr.row-high-risk:hover { background: rgba(239, 68, 68, 0.1); }

.modal-mask {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
  z-index: 100;
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn 0.2s ease-out;
}
[data-theme="light"] .modal-mask { background: rgba(0, 0, 0, 0.3); }

.toast-container {
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.post-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px;
  transition: var(--transition);
  margin-bottom: 16px;
}
.post-card:hover {
  border-color: var(--border-light);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.comment-item {
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}
.comment-item:last-child { border-bottom: none; }

.message-bubble {
  max-width: 70%;
  padding: 10px 14px;
  border-radius: var(--radius-md);
  font-size: 14px;
  word-break: break-word;
}
.message-bubble.self {
  background: var(--gold-gradient);
  color: #0a0a0f;
  border-bottom-right-radius: 4px;
  align-self: flex-end;
}
.message-bubble.other {
  background: var(--bg-card-2);
  color: var(--text);
  border-bottom-left-radius: 4px;
  align-self: flex-start;
}

.divider { height: 1px; background: var(--border); margin: 16px 0; }

.empty-state {
  text-align: center;
  padding: 48px 24px;
  color: var(--text-dimmer);
}

.tabs {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--bg-card-2);
  border-radius: var(--radius-sm);
}
.tab {
  flex: 1;
  padding: 8px 16px;
  text-align: center;
  border-radius: var(--radius-xs);
  cursor: pointer;
  transition: var(--transition);
  color: var(--text-dim);
  font-size: 13px;
}
.tab:hover { color: var(--text); }
.tab.active { background: var(--bg-elevated); color: var(--gold); font-weight: 500; }

/* ========== 自定义复选框（记住我） ========== */
.checkbox-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
.checkbox-wrapper input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.checkbox-custom {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 2px solid var(--border-light);
  background: var(--bg-input);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
  flex-shrink: 0;
  position: relative;
}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom {
  background: var(--gold-gradient);
  border-color: var(--gold);
}
.checkbox-custom::after {
  content: '';
  width: 6px;
  height: 10px;
  border: solid #0a0a0f;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) scale(0);
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
  margin-top: -2px;
}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom::after {
  transform: rotate(45deg) scale(1);
}
.checkbox-wrapper:hover .checkbox-custom {
  border-color: var(--gold-dim);
}
.checkbox-label {
  font-size: 13px;
  color: var(--text-dim);
  transition: var(--transition);
}
.checkbox-wrapper:hover .checkbox-label { color: var(--text); }

/* ========== 主题切换按钮 ========== */
.theme-toggle-btn {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-xs);
  background: var(--bg-hover);
  border: 1px solid var(--border);
  color: var(--text-dim);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
}
.theme-toggle-btn:hover {
  color: var(--gold);
  border-color: var(--gold-dim);
  background: rgba(224, 201, 122, 0.06);
}

/* ========== 工具类 ========== */
.flex { display: flex; }
.flex-1 { flex: 1; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.gap-2 { gap: 8px; }
.gap-3 { gap: 12px; }
.gap-4 { gap: 16px; }
.gap-6 { gap: 24px; }
.w-full { width: 100%; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-sm { font-size: 13px; }
.text-xs { font-size: 12px; }
.text-lg { font-size: 16px; }
.text-xl { font-size: 18px; }
.text-2xl { font-size: 20px; }
.text-dim { color: var(--text-dim); }
.text-dimmer { color: var(--text-dimmer); }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.mt-2 { margin-top: 8px; }
.mt-4 { margin-top: 16px; }
.mt-6 { margin-top: 24px; }
.mb-2 { margin-bottom: 8px; }
.mb-4 { margin-bottom: 16px; }
.mb-6 { margin-bottom: 24px; }
.p-4 { padding: 16px; }
.p-6 { padding: 24px; }
.py-2 { padding-top: 8px; padding-bottom: 8px; }
.py-4 { padding-top: 16px; padding-bottom: 16px; }
.px-4 { padding-left: 16px; padding-right: 16px; }
.px-6 { padding-left: 24px; padding-right: 24px; }

/* ============================================================
   点赞/收藏按钮：秒级响应 + 心跳动画
   ============================================================ */
.like-btn, .fav-btn {
  transition: color 0.2s ease, transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1);
  will-change: transform;
}
.like-btn:hover, .fav-btn:hover {
  transform: scale(1.1);
}
.like-btn:active, .fav-btn:active {
  transform: scale(0.9);
}
.like-btn.is-active, .fav-btn.is-active {
  animation: heartBeat 0.4s ease;
}
@keyframes heartBeat {
  0% { transform: scale(1); }
  25% { transform: scale(1.3); }
  50% { transform: scale(0.95); }
  75% { transform: scale(1.15); }
  100% { transform: scale(1); }
}

/* ============================================================
   响应式适配：iPad / 手机 / 触摸设备
   断点：≤1024px iPad / ≤768px 手机 / ≤480px 小屏手机
   ============================================================ */

/* 触摸设备：禁用 hover 效果，提升性能 */
@media (hover: none) and (pointer: coarse) {
  .card-hover:hover { transform: none; box-shadow: var(--shadow-sm); }
  .btn:hover { transform: none; }
  * { -webkit-tap-highlight-color: transparent; }
}

/* ─── iPad (≤1024px) ─── */
@media (max-width: 1024px) {
  /* 顶部导航栏缩小内边距 */
  .glass > div { padding: 0 16px !important; }
  /* 侧边栏变窄为图标条 */
  aside[style*="width:220px"] { width: 64px !important; padding: 16px 8px !important; }
  aside[style*="width:220px"] .sidebar-link { justify-content: center; padding: 12px 0 !important; font-size: 0 !important; }
  aside[style*="width:220px"] .sidebar-link svg { width: 22px !important; height: 22px !important; }
  aside[style*="width:220px"] nav + div { display: none !important; }
  /* 主体内容缩小内边距 */
  #main-content { padding: 16px 20px !important; }
  /* 首页双栏布局：iPad上右侧栏变窄到300px */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] { grid-template-columns: 1fr 300px !important; }
  /* 管理后台4列变2列 */
  #main-content [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  /* 私信页面：iPad上侧栏变窄 */
  #main-content > .fade-in[style*="height: calc(100vh - 100px)"] > .card[style*="width: 280px"] { width: 240px !important; }
}

/* ─── iPad Mini / 竖屏 (≤820px) ─── */
@media (max-width: 820px) and (min-width: 769px) {
  /* 侧边栏保持图标条 */
  aside[style*="width:220px"] { width: 56px !important; }
  /* 首页双栏变单列 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] { grid-template-columns: 1fr !important; }
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] > div:last-child { display: none !important; }
  /* 私信侧栏变窄 */
  #main-content > .fade-in[style*="height: calc(100vh - 100px)"] > .card[style*="width: 280px"] { width: 220px !important; }
}

/* ─── 手机 (≤768px) ─── */
@media (max-width: 768px) {
  /* 隐藏侧边栏，使用底部TabBar */
  aside[style*="width:220px"],
  aside[style*="width:64px"] { display: none !important; }

  /* 主体内容全宽，增加底部留白给TabBar */
  #main-content { padding: 8px 10px 80px !important; max-width: 100% !important; overflow-x: hidden !important; }

  /* 顶部导航栏：隐藏文字导航，保留Logo+用户区 */
  .glass { position: sticky !important; top: 0 !important; z-index: 50 !important; }
  .glass > div {
    padding: 0 8px !important;
    height: 48px !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  .glass > div > div:first-child > nav { display: none !important; }
  .glass > div > div:first-child { gap: 8px !important; flex-shrink: 1 !important; min-width: 0 !important; }
  .glass .brand-font { font-size: 15px !important; white-space: nowrap !important; }
  .glass > div > div:first-child > a { flex-shrink: 0 !important; }
  /* 右侧按钮组：缩小间距，防止溢出 */
  .glass > div > div:last-child {
    gap: 4px !important;
    flex-shrink: 0 !important;
    flex-wrap: nowrap !important;
  }
  .glass .theme-toggle-btn {
    padding: 6px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  /* 用户区：缩小头像和间距 */
  .glass > div > div:last-child > a[href="#/profile"] {
    padding: 2px 8px 2px 2px !important;
    gap: 6px !important;
    max-width: 120px !important;
  }
  .glass > div > div:last-child > a[href="#/profile"] > span {
    font-size: 12px !important;
    max-width: 72px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  /* 退出按钮在移动端隐藏，通过个人中心退出 */
  .glass > div > div:last-child > .btn-ghost { display: none !important; }
  /* 未登录时登录/注册按钮缩小 */
  .glass > div > div:last-child > .btn { padding: 4px 10px !important; font-size: 12px !important; min-height: 32px !important; }

  /* 帖子卡片单列 */
  .post-grid { grid-template-columns: 1fr !important; }
  /* 首页双栏布局变单列 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] { grid-template-columns: 1fr !important; }
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] > div:last-child { display: none !important; }
  /* 通用双列网格变单列 */
  #main-content [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr !important; }
  #main-content [style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  /* 管理后台4列变1列 */
  #main-content [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr !important; }
  /* 帖子详情双栏变单列 */
  #main-content [style*="grid-template-columns: 160px 1fr"] { grid-template-columns: 1fr !important; }

  /* 按钮增大触摸区域 */
  .btn { padding: 10px 18px; font-size: 14px; min-height: 40px; }
  .btn-sm { padding: 7px 12px; min-height: 32px; font-size: 13px; }

  /* 输入框增大触摸区域（但排除消息输入框，它有自己的样式） */
  input:not(#msg-input), textarea, select { font-size: 16px !important; min-height: 40px; }

  /* 表单卡片全宽 */
  .card[style*="width:420px"],
  .card[style*="width:480px"],
  .card[style*="width:500px"] { width: 100% !important; max-width: 100% !important; padding: 20px 16px !important; }

  /* 模态框全屏化 */
  .modal-overlay { padding: 0 !important; }
  .modal-content { width: 100% !important; max-width: 100% !important; max-height: 100vh !important; border-radius: 0 !important; min-height: 100vh; }

  /* 帖子详情：图片自适应 */
  .post-content img { max-width: 100%; height: auto; }

  /* 评论区优化 */
  .comment-item { padding: 10px 0 !important; }
  .comment-avatar { width: 32px !important; height: 32px !important; }

  /* ─── 私信页面移动端专用布局 ─── */
  /* 聊天容器：占满除TabBar外的全部空间 */
  #main-content > .fade-in[style*="height: calc(100vh - 100px)"] {
    height: calc(100vh - 48px - 80px - env(safe-area-inset-bottom, 0px)) !important;
    max-width: 100% !important;
    margin: 0 !important;
    flex-direction: column !important;
  }
  /* 会话列表卡片：移动端默认全屏，选中聊天后隐藏 */
  #main-content > .fade-in > .card[style*="width: 280px"] {
    width: 100% !important;
    margin-right: 0 !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* 聊天区域卡片：默认隐藏，选中会话后显示全屏 */
  #main-content > .fade-in > .card[style*="flex: 1"] {
    display: none !important;
    position: fixed !important;
    top: 48px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 250 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    height: calc(100vh - 48px) !important;
  }
  /* 当聊天激活时：显示聊天区，隐藏会话列表 */
  #main-content > .fade-in.mobile-chat-active > .card[style*="width: 280px"] { display: none !important; }
  #main-content > .fade-in.mobile-chat-active > .card[style*="flex: 1"] { display: flex !important; flex-direction: column !important; }
  /* 聊天激活时隐藏TabBar和FAB，避免遮挡输入框 */
  body:has(.mobile-chat-active) #mobile-tabbar,
  body:has(.mobile-chat-active) #mobile-fab { display: none !important; }

  /* 聊天消息区域：自适应高度 */
  #chat-messages {
    flex: 1 !important;
    overflow-y: auto !important;
    padding: 12px 10px !important;
    -webkit-overflow-scrolling: touch;
  }
  /* 聊天输入区域：不被TabBar遮挡 */
  #chat-input-area {
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    background: var(--bg-card) !important;
  }
  /* 消息输入框：移动端优化 */
  #msg-input {
    font-size: 15px !important;
    min-height: 36px !important;
    padding: 8px 12px !important;
  }
  /* 聊天头部返回按钮（移动端） */
  #chat-header { padding: 10px 12px !important; }
  #chat-header .back-btn-mobile {
    display: inline-flex !important;
    margin-right: 8px;
  }

  /* 底部TabBar（JS动态注入） */
  #mobile-tabbar {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 200;
    display: flex; justify-content: space-around; align-items: center;
    height: calc(52px + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: var(--glass-bg);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid var(--glass-border);
    box-shadow: 0 -4px 24px rgba(0,0,0,0.2);
  }
  #mobile-tabbar .tab-item {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; padding: 6px 0; color: var(--text-dimmer);
    text-decoration: none; font-size: 10px; transition: color 0.2s;
    -webkit-tap-highlight-color: transparent;
  }
  #mobile-tabbar .tab-item.active { color: var(--gold); }
  #mobile-tabbar .tab-item svg { width: 20px; height: 20px; }
  #mobile-tabbar .tab-badge {
    position: absolute; top: 4px; right: 50%; transform: translateX(14px);
    background: #e5484d; color: #fff; font-size: 9px; padding: 1px 5px;
    border-radius: 8px; min-width: 16px; text-align: center; line-height: 14px;
  }

  /* 弹出菜单（JS动态注入）：从底部滑出 */
  #mobile-action-sheet {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 300;
    background: var(--bg-card); border-radius: 16px 16px 0 0;
    padding: 8px 0 calc(8px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -8px 32px rgba(0,0,0,0.3);
    transform: translateY(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  #mobile-action-sheet.show { transform: translateY(0); }
  #mobile-action-sheet .sheet-handle {
    width: 36px; height: 4px; background: var(--border-light); border-radius: 2px;
    margin: 4px auto 12px;
  }
  #mobile-action-sheet .sheet-item {
    display: flex; align-items: center; gap: 12px; padding: 14px 24px;
    color: var(--text); font-size: 15px; cursor: pointer;
    -webkit-tap-highlight-color: transparent; transition: background 0.15s;
  }
  #mobile-action-sheet .sheet-item:active { background: var(--bg-hover); }
  #mobile-action-sheet .sheet-item svg { width: 20px; height: 20px; color: var(--text-dim); }
  #mobile-action-sheet .sheet-item.danger { color: #e5484d; }
  #mobile-action-sheet .sheet-item.danger svg { color: #e5484d; }
  #mobile-action-sheet .sheet-cancel { margin-top: 8px; border-top: 8px solid var(--bg-deep); text-align: center; }

  /* 浮动发帖按钮（手机端） */
  #mobile-fab {
    position: fixed; right: 14px; bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    z-index: 150; width: 48px; height: 48px; border-radius: 50%;
    background: var(--gold-gradient); color: #0a0a0f;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 6px 20px rgba(224, 201, 122, 0.4);
    cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: transform 0.2s;
  }
  #mobile-fab:active { transform: scale(0.9); }
  #mobile-fab svg { width: 22px; height: 22px; }

  /* 用户资料页：卡片堆叠 */
  .profile-header { flex-direction: column !important; text-align: center !important; }
  .profile-header > * { width: 100% !important; }

  /* 个人资料页：封面与头像移动端优化 */
  #main-content .card[style*="overflow:hidden"] > div:first-child { height: 120px !important; }
  #main-content .card[style*="overflow:hidden"] > div:first-child button { font-size: 11px !important; padding: 4px 10px !important; right: 10px !important; bottom: 10px !important; }
  #main-content .card[style*="overflow:hidden"] > div:first-child > div[style*="left:16px"] { left: 10px !important; bottom: 10px !important; font-size: 10px !important; padding: 3px 8px !important; }
  /* 头像缩小、上移减少 */
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:first-child { margin-top: -32px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:first-child .avatar { width: 72px !important; height: 72px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:first-child > button { width: 22px !important; height: 22px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:first-child > button svg { width: 11px !important; height: 11px !important; }
  /* 昵称/UID行：移动端紧凑 */
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:nth-child(2) { padding-bottom: 4px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:nth-child(2) h2 { font-size: 17px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:nth-child(2) p { font-size: 12px !important; line-height: 1.5 !important; word-break: break-all !important; }
  /* 统计数字行：移动端紧凑 */
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:last-child { gap: 20px !important; margin-top: 14px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:last-child > div > span:first-child { font-size: 16px !important; }
  #main-content .card[style*="overflow:hidden"] > div:nth-child(2) > div:last-child > div > span:last-child { font-size: 11px !important; }
  /* 编辑资料表单：移动端单列 */
  #profile-form .form-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  #profile-form .section-block { padding-left: 12px !important; margin-bottom: 12px !important; }
  #profile-form .form-group label { font-size: 12px !important; margin-bottom: 4px !important; }
  #profile-form .form-group input, #profile-form .form-group select, #profile-form .form-group textarea { font-size: 14px !important; }

  /* 消息列表：全宽 */
  .message-item { padding: 10px 12px !important; }

  /* 帖子卡片紧凑化 */
  .post-card { padding: 12px 10px !important; margin-bottom: 8px !important; }
  .post-card .post-header { gap: 8px !important; }
  .post-card .avatar { width: 36px !important; height: 36px !important; }
  .post-card .post-title { font-size: 15px !important; }
  .post-card .post-excerpt { font-size: 13px !important; line-height: 1.5 !important; }
  .post-card .post-meta { font-size: 11px !important; gap: 8px !important; }
  /* 帖子底部操作栏：减小间距，允许换行 */
  .post-card > div:last-child { gap: 12px !important; flex-wrap: wrap !important; padding-top: 10px !important; }
  /* 帖子内容：确保完整显示 */
  .post-content { word-break: break-word !important; overflow-wrap: break-word !important; max-width: 100% !important; }
  .post-content img { max-width: 100% !important; height: auto !important; }
  .post-content video { max-width: 100% !important; }
  .post-content pre { overflow-x: auto !important; max-width: 100% !important; }
  .post-content code { word-break: break-all !important; }

  /* 评论区：移动端优化 */
  .comment-item { padding: 10px 0 !important; }
  .comment-item .comment-avatar { width: 32px !important; height: 32px !important; }
  .comment-item > div { gap: 6px !important; }
  /* 评论输入框 */
  textarea { font-size: 15px !important; }

  /* 帖子详情页标题栏 */
  #post-detail > div:first-child { flex-wrap: wrap !important; gap: 8px !important; }

  /* 附件网格：移动端2列 */
  .post-card [style*="grid-template-columns:repeat(auto-fill,minmax(120px,1fr))"] { grid-template-columns: repeat(2, 1fr) !important; gap: 6px !important; }

  /* 附件文件项：移动端紧凑 */
  .post-card a[download] { padding: 8px 10px !important; gap: 8px !important; }
  .post-card a[download] svg:first-child { width: 16px !important; height: 16px !important; }

  /* 富文本编辑器工具栏：移动端横向滚动 */
  .rich-toolbar { overflow-x: auto !important; flex-wrap: nowrap !important; -webkit-overflow-scrolling: touch; }
  .rich-toolbar::-webkit-scrollbar { display: none; }
  .rt-btn { padding: 6px 8px !important; font-size: 12px !important; flex-shrink: 0; }
  .rt-divider { display: none !important; }
  /* contenteditable 编辑器 */
  .post-editor { min-height: 200px !important; padding: 12px 14px !important; font-size: 15px !important; }
  /* 发帖页底部按钮栏：允许换行 */
  .fade-in > div:last-child[style*="justify-content:space-between"] { flex-wrap: wrap !important; gap: 8px !important; }
  /* 发帖页分区选择行 */
  .fade-in .card > div:first-child[style*="display:flex"] { padding: 10px 12px !important; }

  /* 用户主页：移动端优化 */
  #main-content [style*="max-width:820px"] { max-width: 100% !important; }
  /* 好友页/搜索结果卡片全宽 */
  #main-content .card[style*="width:100%"] { width: 100% !important; }

  /* 搜索栏全宽 */
  .search-bar { width: 100% !important; margin-bottom: 8px !important; }
  .search-bar input { font-size: 15px !important; }

  /* 通用卡片内边距减小 */
  .card { padding: 14px 12px !important; border-radius: 12px !important; }

  /* 标题字体缩小 */
  h1 { font-size: 22px !important; }
  h2 { font-size: 18px !important; }
  h3 { font-size: 16px !important; }

  /* 隐藏水印（移动端性能优化） */
  .watermark-layer { display: none !important; }
}

/* ─── 小屏手机 (≤480px) ─── */
@media (max-width: 480px) {
  /* 顶部Logo缩小 */
  .glass .brand-font { font-size: 14px !important; }
  .glass > div { padding: 0 8px !important; height: 44px !important; }
  /* 主体内容极小内边距 */
  #main-content { padding: 6px 8px 76px !important; }
  /* 帖子卡片更紧凑 */
  .post-card { padding: 10px 8px !important; margin-bottom: 6px !important; }
  .post-card .post-header { gap: 6px !important; }
  .post-card .avatar { width: 32px !important; height: 32px !important; }
  .post-card .post-title { font-size: 14px !important; }
  .post-card .post-excerpt { font-size: 12px !important; }
  .post-card .post-meta { font-size: 10px !important; gap: 6px !important; }
  /* 表单标题缩小 */
  .card h1 { font-size: 20px !important; }
  .card h2 { font-size: 16px !important; }
  .card h3 { font-size: 14px !important; }
  /* 按钮再缩小 */
  .btn { padding: 8px 14px; font-size: 13px; min-height: 36px; }
  .btn-sm { padding: 6px 10px; min-height: 28px; font-size: 12px; }
  /* 输入框 */
  input:not(#msg-input), textarea, select { font-size: 14px !important; min-height: 36px; }
  /* 消息气泡 */
  .msg-bubble { max-width: 80% !important; font-size: 14px !important; padding: 8px 12px !important; }
  /* 模态框内容紧凑 */
  .modal-content { padding: 16px 14px !important; }
  /* 隐藏部分次要内容 */
  .hide-on-small { display: none !important; }
}

/* ─── 横屏手机 (高度≤500px) ─── */
@media (max-width: 900px) and (max-height: 500px) and (orientation: landscape) {
  #mobile-tabbar { height: 48px; }
  #mobile-tabbar .tab-item { font-size: 9px; }
  #mobile-tabbar .tab-item svg { width: 18px; height: 18px; }
  #main-content { padding: 10px 14px 60px !important; }
  #mobile-fab { bottom: 56px; width: 44px; height: 44px; }
}

/* ============================================================
   响应式增强 v2：iPad Pro / 大屏 / 触摸优化
   ============================================================ */

/* ─── iPad Pro 12.9 (1024-1366px) 优化 ─── */
@media (min-width: 1025px) and (max-width: 1366px) {
  /* 双栏布局适度紧凑 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] {
    grid-template-columns: 1fr 320px !important;
  }
  /* 管理后台：4列变3列 */
  #main-content [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* ─── iPad Pro 竖屏 (≤1024px, ≥768px) 触摸优化 ─── */
@media (max-width: 1024px) and (min-width: 769px) and (pointer: coarse) {
  /* iPad 触摸：增大触摸区域 */
  .btn { min-height: 44px; padding: 12px 20px; }
  .sidebar-link { padding: 14px 12px !important; }
  /* 隐藏 hover 效果 */
  .card-hover:hover { transform: none; }
  /* 帖子卡片增加触摸间距 */
  .post-card { margin-bottom: 14px !important; }
}

/* ─── iPad 横屏分屏模式 (≤768px) ─── */
@media (max-width: 768px) and (min-width: 694px) {
  /* 分屏模式：保持双栏但紧凑 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] {
    grid-template-columns: 1fr 280px !important;
  }
}

/* ─── 折叠屏 / Galaxy Fold (≤344px) ─── */
@media (max-width: 344px) {
  .glass .brand-font { font-size: 12px !important; }
  #main-content { padding: 4px 6px 72px !important; }
  .post-card { padding: 8px 6px !important; }
  .btn { padding: 7px 12px; font-size: 12px; min-height: 34px; }
  .msg-bubble { max-width: 88% !important; font-size: 13px !important; }
  /* 底部 TabBar 紧凑 */
  #mobile-tabbar .tab-item { font-size: 9px !important; gap: 2px; }
  #mobile-tabbar .tab-item svg { width: 20px; height: 20px; }
}

/* ─── 大屏优化 (≥1440px) ─── */
@media (min-width: 1440px) {
  /* 帖子列表适度放大 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] {
    grid-template-columns: 1fr 400px !important;
  }
  /* 主内容区适度增宽 */
  .max-width-1400 { max-width: 1500px !important; }
}

/* ─── 超宽屏 (≥1920px) ─── */
@media (min-width: 1920px) {
  body { font-size: 15px; }
  .post-card .post-excerpt { font-size: 15px; }
}

/* ─── 触摸设备通用优化 ─── */
@media (hover: none) and (pointer: coarse) {
  /* 防止双击缩放 */
  * { touch-action: manipulation; }
  /* 增加按钮触摸反馈 */
  .btn:active { transform: scale(0.97); }
  .tab-item:active { transform: scale(0.95); }
  /* 滚动惯性 */
  body { -webkit-overflow-scrolling: touch; }
  /* 移除点击高亮 */
  * { -webkit-tap-highlight-color: transparent; }
}

/* ─── 安全区域适配（刘海屏/底部安全区） ─── */
@supports (padding: env(safe-area-inset-top)) {
  .glass > div {
    padding-top: max(env(safe-area-inset-top, 0px), 0px) !important;
  }
  #mobile-tabbar {
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
  #mobile-fab {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ─── 评论系统 v2 样式 ─── */
.comment-reply-to {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: var(--bg-hover);
  border-radius: 10px;
  font-size: 12px;
  color: var(--text-dim);
  margin-right: 6px;
}
.comment-reply-to::before {
  content: '@';
  color: var(--gold);
  font-weight: 600;
}
.comment-mention {
  color: var(--gold);
  background: rgba(224, 201, 122, 0.1);
  padding: 1px 4px;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 500;
}
.comment-mention:hover {
  background: rgba(224, 201, 122, 0.2);
  text-decoration: underline;
}
.comment-like-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  background: transparent;
  border: none;
  color: var(--text-dimmer);
  font-size: 12px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
}
.comment-like-btn:hover { color: var(--gold); background: var(--bg-hover); }
.comment-like-btn.liked { color: var(--gold); }
.comment-like-btn.liked svg { fill: var(--gold); }

/* 评论加载更多按钮 */
.comment-load-more {
  display: block;
  width: 100%;
  padding: 10px;
  background: transparent;
  border: 1px dashed var(--border);
  border-radius: 8px;
  color: var(--text-dim);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  text-align: center;
}
.comment-load-more:hover {
  color: var(--gold);
  border-color: var(--border-gold);
  background: var(--bg-hover);
}

/* 评论操作按钮（回复/编辑） */
.comment-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  background: transparent;
  border: none;
  color: var(--text-dimmer);
  font-size: 12px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
}
.comment-action-btn:hover {
  color: var(--gold);
  background: var(--bg-hover);
}

/* 楼中楼回复容器 */
.comment-replies {
  margin-top: 8px;
  border-left: 2px solid var(--border);
  padding-left: 8px;
}
.comment-replies .comment-item {
  padding-left: 4px;
}

/* 评论项动画 */
.comment-item {
  animation: commentFadeIn 0.3s ease;
}
@keyframes commentFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 评论点赞按钮动画 */
.comment-like-btn:active {
  transform: scale(0.92);
}
.comment-like-btn.liked svg {
  animation: likePop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes likePop {
  0% { transform: scale(1); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

/* 配色预览圆点 */
.color-preview {
  border: 2px solid var(--glass-border);
  box-shadow: var(--shadow-sm);
}

/* ─── Toast 提示增强 v2 ─── */
.toast {
  animation: toastIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.toast.toast-success {
  border-left: 3px solid var(--success);
}
.toast.toast-error {
  border-left: 3px solid var(--danger);
}
.toast.toast-info {
  border-left: 3px solid var(--info);
}
.toast.toast-warning {
  border-left: 3px solid var(--warning);
}
@keyframes toastIn {
  from { opacity: 0; transform: translateX(40px) scale(0.9); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes toastOut {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(40px); }
}

/* ─── 通知红点动画 ─── */
.notification-dot {
  animation: dotPulse 2s ease-in-out infinite;
}
@keyframes dotPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.15); opacity: 0.85; }
}

/* ─── 帖子卡片悬停增强 ─── */
.post-card {
  position: relative;
  /* 移除 overflow:hidden，改为 BFC 防止浮动重叠，避免裁剪合法内容 */
  overflow: visible;
}
.post-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: var(--gold-gradient);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.3s ease;
  border-radius: 3px 0 0 3px;
  pointer-events: none;
}
.post-card:hover::before {
  transform: scaleY(1);
}

/* ─── 富文本编辑器工具栏移动端横向滚动 ─── */
.rt-toolbar {
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.rt-toolbar::-webkit-scrollbar { height: 4px; }

/* ─── 帖子内容图片懒加载占位 ─── */
.post-content img {
  background: var(--bg-card-2);
  transition: opacity 0.3s;
}
.post-content img[data-loading] { opacity: 0.5; }

.like-count, .fav-count {
  font-variant-numeric: tabular-nums;
  transition: opacity 0.15s ease;
}

/* ============================================================
   响应式增强 v3：触摸优化 / 安全区 / 模态框 / 通知面板
   ============================================================ */

/* ─── 触摸设备：完整禁用所有 hover 效果（避免移动端粘滞） ─── */
@media (hover: none) and (pointer: coarse) {
  /* 禁用所有 hover 变换效果，保留颜色变化 */
  .card-hover:hover,
  .post-card:hover,
  .comment-item:hover,
  .message-item:hover,
  .btn:hover,
  .sidebar-link:hover,
  .tab-item:hover,
  .notif-item:hover,
  .dropdown-item:hover,
  .action-sheet-item:hover {
    transform: none !important;
    box-shadow: var(--shadow-sm) !important;
  }
  /* 帖子卡片左侧金条 hover 效果在触摸设备上隐藏 */
  .post-card:hover::before { transform: scaleY(0) !important; }
  /* 链接 hover 下划线禁用 */
  a:hover { text-decoration: none !important; }
  /* 按钮 hover 阴影禁用 */
  .btn:hover { box-shadow: none !important; }
  /* 防止 300ms 点击延迟 */
  * { touch-action: manipulation; }
  /* 防止双击缩放（已通过 viewport 配置，此处双保险） */
  body { -webkit-overflow-scrolling: touch; }
  /* 输入框聚焦时禁用 hover 样式 */
  input:hover, textarea:hover, select:hover { border-color: var(--border) !important; }
}

/* ─── 移动端触摸目标最小尺寸（≥40px，小屏≥36px） ─── */
@media (max-width: 768px) {
  /* 按钮最小触摸尺寸 */
  .btn { min-height: 40px; min-width: 40px; }
  .btn-sm { min-height: 36px; min-width: 36px; }
  .btn-icon { min-width: 40px; min-height: 40px; }
  /* 图标按钮 */
  .icon-btn, [class*="icon-btn"] { min-width: 40px; min-height: 40px; }
  /* TabBar 项 */
  #mobile-tabbar .tab-item { min-height: 48px; }
  /* 评论操作按钮 */
  .comment-action-btn, .comment-like-btn {
    min-height: 36px; min-width: 36px;
    padding: 6px 8px !important;
  }
  /* 通知项 */
  .notif-item { min-height: 56px; }
  /* 表单复选框/单选框 */
  input[type="checkbox"], input[type="radio"] {
    min-width: 20px; min-height: 20px;
  }
  /* 关闭按钮 */
  .modal-close, .close-btn { min-width: 40px; min-height: 40px; }
}

@media (max-width: 480px) {
  .btn { min-height: 36px; min-width: 36px; }
  .btn-sm { min-height: 32px; min-width: 32px; }
  #mobile-tabbar .tab-item { min-height: 44px; }
}

/* ─── 安全区完整适配（刘海屏/底部安全区/横屏左右） ─── */
@supports (padding: env(safe-area-inset-top)) {
  /* 顶部导航栏适配刘海屏 */
  .glass > div {
    padding-top: max(env(safe-area-inset-top, 0px), 0px) !important;
    padding-left: max(env(safe-area-inset-left, 0px), 0px) !important;
    padding-right: max(env(safe-area-inset-right, 0px), 0px) !important;
  }
  /* 底部 TabBar 适配 Home Indicator */
  #mobile-tabbar {
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    padding-left: env(safe-area-inset-left, 0px) !important;
    padding-right: env(safe-area-inset-right, 0px) !important;
  }
  /* FAB 按钮 */
  #mobile-fab {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
    right: calc(14px + env(safe-area-inset-right, 0px)) !important;
  }
  /* 模态框/弹窗底部适配 */
  .modal-content, .modal-body {
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }
  /* 通知下拉面板顶部适配 */
  #notif-dropdown {
    top: calc(50px + env(safe-area-inset-top, 0px)) !important;
  }
  /* 主体内容左右安全区（横屏） */
  @media (orientation: landscape) and (max-width: 1024px) {
    #main-content {
      padding-left: calc(16px + env(safe-area-inset-left, 0px)) !important;
      padding-right: calc(16px + env(safe-area-inset-right, 0px)) !important;
    }
  }
}

/* ─── 通知下拉面板移动端固定定位（防止被 .glass overflow:hidden 裁剪） ─── */
@media (max-width: 768px) {
  #notif-dropdown {
    position: fixed !important;
    top: calc(56px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* ─── 通知下拉面板移动端优化 ─── */
@media (max-width: 480px) {
  #notif-dropdown {
    position: fixed !important;
    top: calc(48px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(80vh - 60px) !important;
    border-radius: 14px !important;
  }
  #color-picker-panel {
    /* 移动端小屏：仅约束最大宽度，定位由 JS 计算（避免覆盖 left/transform） */
    max-width: 280px !important;
  }
}

/* ─── 模态框移动端全屏优化 ─── */
@media (max-width: 768px) {
  .modal-overlay {
    padding: 0 !important;
    align-items: stretch !important;
  }
  .modal-content {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding-top: calc(20px + env(safe-area-inset-top, 0px)) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  /* 模态框标题栏固定在顶部 */
  .modal-content > .modal-header,
  .modal-content > div:first-child {
    position: sticky;
    top: 0;
    background: var(--bg-card);
    z-index: 10;
    padding: 16px !important;
    border-bottom: 1px solid var(--border);
  }
  /* 模态框关闭按钮放大 */
  .modal-close {
    width: 40px !important;
    height: 40px !important;
    font-size: 20px !important;
  }
}

@media (max-width: 480px) {
  /* 小屏手机：模态框内边距减小 */
  .modal-content { padding: 16px 14px !important; }
  .modal-body { padding: 12px !important; }
}

/* ─── 富文本编辑器工具栏移动端增强 ─── */
@media (max-width: 768px) {
  .rich-toolbar, .rt-toolbar {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    position: sticky;
    top: 0;
    background: var(--bg-card);
    z-index: 5;
    padding: 8px 4px !important;
  }
  .rich-toolbar::-webkit-scrollbar,
  .rt-toolbar::-webkit-scrollbar { display: none; }
  .rt-btn {
    padding: 8px 10px !important;
    font-size: 13px !important;
    flex-shrink: 0;
    min-height: 36px;
  }
  /* 编辑器内容区 */
  .post-editor, [contenteditable="true"] {
    min-height: 180px !important;
    font-size: 15px !important;
    -webkit-user-select: text;
    user-select: text;
  }
}

/* ─── 私信页面移动端全屏化 ─── */
@media (max-width: 768px) {
  /* 聊天输入区域：固定在底部，避开键盘 */
  #chat-input-area {
    position: sticky !important;
    bottom: 0 !important;
    background: var(--bg-card) !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid var(--border);
    z-index: 10;
  }
  /* 聊天消息区域：自适应剩余高度 */
  #chat-messages {
    flex: 1 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 12px 10px !important;
  }
  /* 消息气泡最大宽度 */
  .msg-bubble {
    max-width: 75% !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }
  /* 长链接/长字符串换行 */
  .msg-bubble a, .msg-bubble code {
    word-break: break-all !important;
    overflow-wrap: break-word !important;
  }
}

/* ─── 表单元素移动端优化 ─── */
@media (max-width: 768px) {
  /* 输入框聚焦时放大（避免 iOS 自动缩放） */
  input[type="text"], input[type="email"], input[type="password"],
  input[type="search"], input[type="url"], input[type="tel"],
  textarea, select {
    font-size: 16px !important; /* ≥16px 防 iOS 缩放 */
    min-height: 40px;
  }
  /* 搜索框特殊处理 */
  .search-bar input { font-size: 16px !important; }
  /* 复选框/单选框放大 */
  input[type="checkbox"], input[type="radio"] {
    width: 20px; height: 20px;
    vertical-align: middle;
  }
  /* 滑块 */
  input[type="range"] { min-height: 40px; }
}

/* ─── 图片预览/灯箱移动端优化 ─── */
@media (max-width: 768px) {
  .image-preview-overlay, .lightbox {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.9) !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px) !important;
  }
  .image-preview-overlay img, .lightbox img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
  }
  /* 关闭按钮放大 */
  .image-preview-overlay .close-btn,
  .lightbox .close-btn {
    width: 44px !important;
    height: 44px !important;
    font-size: 24px !important;
    top: calc(10px + env(safe-area-inset-top, 0px)) !important;
    right: calc(10px + env(safe-area-inset-right, 0px)) !important;
  }
}

/* ─── 横屏手机优化（修正断点） ─── */
@media (max-height: 500px) and (orientation: landscape) {
  /* 横屏时 TabBar 变矮 */
  #mobile-tabbar {
    height: 48px !important;
    padding-bottom: 0 !important;
  }
  #mobile-tabbar .tab-item { font-size: 9px; min-height: 44px; }
  #mobile-tabbar .tab-item svg { width: 18px; height: 18px; }
  /* 主体内容减少底部留白 */
  #main-content { padding: 8px 14px 60px !important; }
  /* FAB 位置上移 */
  #mobile-fab {
    bottom: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
    width: 44px !important;
    height: 44px !important;
  }
  /* 模态框横屏全屏 */
  .modal-content {
    min-height: 100vh !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
  }
  /* 头像在横屏时缩小 */
  .post-card .avatar { width: 28px !important; height: 28px !important; }
  /* 帖子标题缩小 */
  .post-card .post-title { font-size: 13px !important; }
  .post-card .post-excerpt { font-size: 12px !important; }
}

/* ─── 防止文本选择在高亮色上的不适配 ─── */
::selection {
  background: rgba(224, 201, 122, 0.3);
  color: var(--text);
}
/* 触摸设备禁用长按选择（非输入元素） */
@media (hover: none) and (pointer: coarse) {
  .post-card, .comment-item, .message-item, .notif-item,
  .sidebar-link, .tab-item, .card-hover, .btn {
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
  }
  /* 输入框/内容区域允许选择 */
  input, textarea, [contenteditable="true"],
  .post-content, .comment-content, .msg-bubble {
    -webkit-user-select: text;
    user-select: text;
    -webkit-touch-callout: default;
  }
}

/* ─── 防止移动端横向滚动溢出 ─── */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden;
    width: 100%;
    max-width: 100vw;
  }
  /* 所有容器最大宽度限制 */
  .container, .max-width-1400, #main-content {
    max-width: 100% !important;
    overflow-x: hidden;
  }
  /* 表格水平滚动 */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* 代码块水平滚动 */
  pre, code { white-space: pre-wrap; word-break: break-word; }
  pre { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ─── 滚动条移动端隐藏（提升体验） ─── */
@media (max-width: 768px) {
  ::-webkit-scrollbar {
    width: 4px;
    height: 4px;
  }
  ::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 2px;
  }
  ::-webkit-scrollbar-track {
    background: transparent;
  }
}

/* ============================================================
   分区导航栏移动端优化 + 帖子内容溢出修复
   ============================================================ */
@media (max-width: 768px) {
  /* 分区导航栏：横向滚动优化 */
  #category-nav > div {
    gap: 8px !important;
    padding: 4px 2px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  #category-nav > div::-webkit-scrollbar { display: none; }
  /* 分区按钮缩小 */
  #category-nav a {
    padding: 6px 10px !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
  }
  #category-nav a > div,
  #category-nav a > img {
    width: 24px !important;
    height: 24px !important;
    border-radius: 6px !important;
  }
  #category-nav a > span {
    font-size: 12px !important;
  }

  /* 帖子卡片内容溢出修复：移除 overflow:hidden，使用 word-break 防止溢出 */
  .post-card {
    overflow: visible !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }
  /* 帖子内容中的长链接/长字符串换行 */
  .post-content, .post-excerpt, .comment-content {
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    overflow: visible !important;
  }
  .post-content a, .comment-content a, .post-excerpt a {
    word-break: break-all !important;
    overflow-wrap: break-word !important;
  }
  /* 帖子内容中的 pre/code 块水平滚动 */
  .post-content pre {
    overflow-x: auto !important;
    max-width: 100% !important;
    -webkit-overflow-scrolling: touch;
  }
  .post-content code {
    word-break: break-all !important;
  }
  /* 帖子图片/视频自适应 */
  .post-content img,
  .post-content video {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  /* 折叠状态下的长帖子：移动端高度限制 */
  .post-content-collapsed {
    max-height: 160px !important;
  }
  /* 表格移动端横向滚动 */
  .post-content table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  /* 帖子附件网格：移动端 2 列 */
  .post-card [style*="grid-template-columns:repeat(auto-fill,minmax(120px,1fr))"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }
  /* 帖子操作栏：换行 + 触摸目标 */
  .post-card > div:last-child {
    gap: 12px !important;
    flex-wrap: wrap !important;
    padding-top: 10px !important;
  }
  .post-card .post-action-btn,
  .post-card button[class*="btn"] {
    min-height: 36px !important;
    min-width: 36px !important;
    padding: 6px 10px !important;
  }
  /* 帖子头部：头像 + 用户名 + 时间换行优化 */
  .post-card .post-header {
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }
  .post-card .post-header > div:nth-child(2) {
    min-width: 0 !important;
    flex: 1 !important;
    overflow: hidden !important;
  }
  .post-card .post-header .post-title,
  .post-card .post-header > div:nth-child(2) > span:first-child,
  .post-card .post-header > div:nth-child(2) > div:first-child {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 100% !important;
  }

  /* ─── 移动端帖子排版深度优化 ─── */
  .post-content {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }
  .post-content h1 { font-size: 1.35em !important; margin: 0.6em 0 0.4em !important; }
  .post-content h2 { font-size: 1.2em !important; margin: 0.5em 0 0.3em !important; }
  .post-content h3 { font-size: 1.1em !important; margin: 0.4em 0 0.2em !important; }
  .post-content p { margin: 0.4em 0 !important; }
  .post-content ul, .post-content ol {
    padding-left: 22px !important;
    margin: 0.4em 0 !important;
  }
  .post-content li { margin: 0.2em 0 !important; }
  .post-content blockquote {
    padding: 6px 10px !important;
    margin: 0.6em 0 !important;
  }
  .post-content pre {
    padding: 10px 12px !important;
    font-size: 12px !important;
    margin: 0.6em 0 !important;
  }
  .post-content code {
    font-size: 12px !important;
    padding: 1px 5px !important;
  }
  .post-content img {
    border-radius: 6px !important;
  }
  .post-content table {
    font-size: 13px !important;
  }
  .post-content th, .post-content td {
    padding: 6px 8px !important;
  }
  .post-content hr {
    margin: 0.8em 0 !important;
  }

  /* 评论区：楼中楼缩进优化 */
  .comment-item .comment-item {
    margin-left: 12px !important;
    padding-left: 12px !important;
    border-left: 2px solid var(--border) !important;
  }
  /* 评论输入框移动端优化 */
  #comment-input-*, textarea[id^="comment-input-"] {
    font-size: 16px !important;
    min-height: 40px !important;
  }
}

@media (max-width: 480px) {
  /* 小屏手机：分区按钮进一步缩小 */
  #category-nav a {
    padding: 5px 8px !important;
  }
  #category-nav a > div,
  #category-nav a > img {
    width: 22px !important;
    height: 22px !important;
  }
  #category-nav a > span {
    font-size: 11px !important;
  }
  /* 帖子卡片内边距进一步缩小 */
  .post-card {
    padding: 10px 8px !important;
  }
  /* 小屏手机：帖子内容字体调整 */
  .post-content {
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
  /* 小屏手机：帖子图片网格单列显示 */
  .post-card [style*="grid-template-columns:repeat(auto-fill,minmax(120px,1fr))"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4px !important;
  }
  /* 小屏手机：帖子操作栏按钮更紧凑 */
  .post-card .post-action-btn,
  .post-card button[class*="btn"] {
    min-height: 32px !important;
    min-width: 32px !important;
    padding: 4px 8px !important;
    font-size: 12px !important;
  }
  /* 小屏手机：帖子标题字体缩小 */
  .post-card .post-title,
  .post-card .post-header > div:nth-child(2) > div:first-child {
    font-size: 13px !important;
  }
  /* 小屏手机：帖子时间/统计信息字体缩小 */
  .post-card .post-meta {
    font-size: 10px !important;
  }
}

/* ─── 横屏手机比例优化 ─── */
@media (max-height: 500px) and (orientation: landscape) {
  /* 分区导航栏：横屏时纵向滚动 */
  #category-nav > div {
    flex-wrap: wrap !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    max-height: 80px !important;
  }
  /* 帖子卡片：横屏时减小内边距 */
  .post-card {
    padding: 8px 12px !important;
    margin-bottom: 6px !important;
  }
  /* 帖子标题/摘要：横屏时缩小 */
  .post-card .post-title { font-size: 13px !important; }
  .post-card .post-excerpt { font-size: 12px !important; line-height: 1.4 !important; }
  /* 帖子头像：横屏时缩小 */
  .post-card .avatar { width: 28px !important; height: 28px !important; }
  /* 主体内容：横屏时减小内边距 */
  #main-content { padding: 6px 12px 56px !important; }
  /* 导航栏：横屏时更矮 */
  .glass > div { height: 40px !important; }
  /* TabBar：横屏时更矮 */
  #mobile-tabbar { height: calc(44px + env(safe-area-inset-bottom, 0px)) !important; }
  #mobile-tabbar .tab-item { font-size: 9px !important; min-height: 40px !important; }
  #mobile-tabbar .tab-item svg { width: 18px !important; height: 18px !important; }
}

/* ─── iPad 适配优化 ─── */
@media (min-width: 769px) and (max-width: 1024px) {
  /* iPad：双栏布局变窄 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] {
    grid-template-columns: 1fr 300px !important;
    gap: 16px !important;
  }
  /* 分区导航栏：iPad 可横向滚动 */
  #category-nav > div {
    -webkit-overflow-scrolling: touch;
  }
  /* 帖子卡片：iPad 内边距优化 */
  .post-card { padding: 16px 18px !important; }
}

@media (min-width: 481px) and (max-width: 820px) {
  /* iPad Mini / 竖屏 iPad：单列布局 */
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] {
    grid-template-columns: 1fr !important;
  }
  #main-content > .fade-in[style*="grid-template-columns:1fr 360px"] > div:last-child {
    display: block !important;
    position: static !important;
    margin-top: 16px !important;
  }
}

/* ============================================================
   PC 端帖子详情页排版优化
   提升长文章的阅读体验
   ============================================================ */
#post-detail {
  padding: 0 4px;
}
#post-detail .post-card {
  padding: 28px 32px !important;
}
#post-detail .post-content {
  font-size: 15px;
  line-height: 1.8;
}
#post-detail .post-content h1 { font-size: 1.6em; margin: 1em 0 0.5em; }
#post-detail .post-content h2 { font-size: 1.4em; margin: 0.9em 0 0.5em; }
#post-detail .post-content h3 { font-size: 1.2em; margin: 0.8em 0 0.4em; }
#post-detail .post-content p { margin: 0.7em 0; }
#post-detail .post-content ul,
#post-detail .post-content ol { margin: 0.7em 0; padding-left: 32px; }
#post-detail .post-content li { margin: 0.4em 0; }
#post-detail .post-content blockquote {
  padding: 10px 18px;
  margin: 1em 0;
}
#post-detail .post-content pre {
  padding: 14px 18px;
  margin: 1em 0;
  font-size: 13px;
}
#post-detail .post-content code {
  font-size: 13px;
}
#post-detail .post-content img {
  margin: 0.8em 0;
}
#post-detail .post-content table {
  margin: 1em 0;
}
#post-detail .post-content th,
#post-detail .post-content td {
  padding: 10px 14px;
}

/* ============================================================
   帖子内容防重叠安全机制
   确保所有子元素都不会溢出父容器
   ============================================================ */
.post-content,
.post-content > * {
  max-width: 100%;
  box-sizing: border-box;
}
.post-content img,
.post-content video,
.post-content iframe,
.post-content pre,
.post-content table {
  max-width: 100%;
}
/* 防止浮动元素导致的重叠 */
.post-content::after {
  content: '';
  display: table;
  clear: both;
}
/* 确保块级元素之间有足够间距 */
.post-content > * + * {
  margin-top: 0.3em;
}

/* ============================================================
   长链接和长字符串自动换行
   防止 URL 或连续字符撑破容器
   ============================================================ */
.post-content, .post-excerpt, .comment-content, .msg-bubble {
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
}
.post-content a,
.comment-content a,
.post-excerpt a {
  word-break: break-all;
  overflow-wrap: break-word;
}

/* ============================================================
   管理员后台表格滚动系统 v1
   解决：用户列表/帖子列表等内容区域无法垂直滚动的问题
   方案：表格容器固定最大高度 + 垂直滚动条 + 表头固定
   ============================================================ */

/* 后台表格滚动容器：固定高度 + 垂直滚动 + 表头固定 */
.admin-table-wrapper {
  overflow: auto !important;
  /* 使用固定高度确保滚动条生效（不依赖父容器高度） */
  height: 70vh !important;
  max-height: 70vh !important;
  min-height: 300px !important;
  position: relative !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding: 0 !important;
}

/* 后台表格：表头固定 */
.admin-table-wrapper thead {
  position: sticky !important;
  top: 0 !important;
  z-index: 10 !important;
  background: var(--bg-card-2) !important;
}

/* 后台表格内部：分页栏固定在底部 */
.admin-table-wrapper > table {
  margin-bottom: 0 !important;
}

/* 分页栏：固定在表格容器底部 */
.admin-table-wrapper > div:last-child {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 10 !important;
  background: var(--bg-card) !important;
  border-top: 1px solid var(--border-light) !important;
}

/* 后台内容区域：确保可以垂直滚动 */
#admin-content,
#admin-users-table,
#admin-posts-list,
#admin-pending-list {
  overflow: visible;
}

/* 后台导航栏：横向滚动支持（移动端） */
.fade-in > div[style*="overflow-x:auto"],
.fade-in > div[style*="overflow-x: auto"] {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

/* ============================================================
   通用滚动条样式优化
   ============================================================ */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--bg-card-2);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb {
  background: var(--border-light);
  border-radius: 4px;
  transition: background 0.2s;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--gold-dim);
}
/* Firefox 滚动条 */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--border-light) var(--bg-card-2);
}

/* ============================================================
   后台移动端表格优化
   ============================================================ */
@media (max-width: 768px) {
  /* 后台表格滚动容器：移动端高度调整 */
  .admin-table-wrapper {
    height: 65vh !important;
    max-height: 65vh !important;
    min-height: 250px !important;
    padding: 0 !important;
  }
  /* 后台表格：移动端最小宽度，确保横向滚动 */
  .admin-table-wrapper table {
    min-width: 720px;
  }
  /* 后台导航栏：横向滚动优化 */
  .fade-in > div[style*="overflow-x:auto"],
  .fade-in > div[style*="overflow-x: auto"] {
    padding-bottom: 8px !important;
  }
  /* 后台导航按钮：触摸目标增大 */
  .fade-in > div[style*="overflow-x:auto"] a,
  .fade-in > div[style*="overflow-x: auto"] a {
    padding: 10px 14px !important;
    font-size: 13px !important;
  }
  /* 后台表格单元格内边距缩小 */
  .admin-table-wrapper td {
    padding: 8px 10px !important;
    font-size: 12px !important;
  }
  .admin-table-wrapper th {
    padding: 10px !important;
    font-size: 12px !important;
  }
  /* 分页栏移动端优化：按钮换行 */
  .admin-table-wrapper > div:last-child {
    flex-direction: column !important;
    gap: 8px !important;
  }
}