/* ═══════ MerlinkFlight 梅翎 — Glassmorphism + Dark Mode ═══════ */
:root {

  --card: rgba(255, 255, 255, 0.72);
  --card-solid: #ffffff;
  --border: rgba(255, 255, 255, 0.6);
  --border-solid: rgba(124, 58, 237, 0.25);
  --ink: #1e1b2e;
  --ink2: #4a4560;
  --ink3: #8078a0;
  --accent: #7c3aed;
  --accent-rgb: 124, 58, 237;
  --accent-light: rgba(124, 58, 237, 0.10);
  --accent-dark: #6d28d9;
  --success: #16a34a;
  --success-light: rgba(22, 163, 74, 0.1);
  --error: #dc2626;
  --error-light: rgba(220, 38, 38, 0.08);
  --radius: 16px;
  --shadow: 0 8px 32px rgba(124, 58, 237, 0.14), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(124, 58, 237, 0.08);
  --glass-blur: blur(16px);
  --transition: all 0.2s ease;
}

/* 暗色模式：星云紫 */
body[data-theme="dark"] {
  --card: rgba(22, 22, 38, 0.85);
  --card-solid: #16162a;
  --border: rgba(167, 139, 250, 0.18);
  --border-solid: rgba(167, 139, 250, 0.15);
  --ink: #e2e8f0;
  --ink2: #94a3b8;
  --ink3: #64748b;
  --accent: #a78bfa;
  --accent-rgb: 167, 139, 250;
  --accent-light: rgba(167, 139, 250, 0.12);
  --accent-dark: #c4b5fd;
  --success: #4ade80;
  --success-light: rgba(74, 222, 128, 0.1);
  --error: #f87171;
  --error-light: rgba(248, 113, 113, 0.08);
  --shadow: 0 8px 32px rgba(167, 139, 250, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(167, 139, 250, 0.08);
}

/* ─── 色彩主题：深海蓝 ─── */
body[data-color-theme="ocean"] {
  --accent: #2563eb;
  --accent-rgb: 37, 99, 235;
  --accent-light: rgba(37, 99, 235, 0.1);
  --accent-dark: #1d4ed8;
  --shadow: 0 8px 32px rgba(37, 99, 235, 0.12), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(37, 99, 235, 0.08);
  background: linear-gradient(145deg, #f0f4fa 0%, #e8eef8 40%, #dce5f2 100%) fixed;
}
body[data-color-theme="ocean"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(37, 99, 235, 0.14) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(59, 130, 246, 0.11) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(96, 165, 250, 0.09) 0%, transparent 65%);
}
body[data-color-theme="ocean"][data-theme="dark"] {
  --accent: #3b82f6;
  --accent-rgb: 59, 130, 246;
  --accent-light: rgba(59, 130, 246, 0.12);
  --accent-dark: #60a5fa;
  --shadow: 0 8px 32px rgba(59, 130, 246, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(59, 130, 246, 0.08);
}
body[data-color-theme="ocean"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(59, 130, 246, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(37, 99, 235, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(96, 165, 250, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题：松柏绿 ─── */
body[data-color-theme="forest"] {
  --accent: #059669;
  --accent-rgb: 5, 150, 105;
  --accent-light: rgba(5, 150, 105, 0.1);
  --accent-dark: #047857;
  --shadow: 0 8px 32px rgba(5, 150, 105, 0.12), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(5, 150, 105, 0.08);
  background: linear-gradient(145deg, #f0faf5 0%, #e6f5ec 40%, #daf0e4 100%) fixed;
}
body[data-color-theme="forest"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(5, 150, 105, 0.14) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(16, 185, 129, 0.11) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(52, 211, 153, 0.09) 0%, transparent 65%);
}
body[data-color-theme="forest"][data-theme="dark"] {
  --accent: #34d399;
  --accent-rgb: 52, 211, 153;
  --accent-light: rgba(52, 211, 153, 0.12);
  --accent-dark: #6ee7b7;
  --shadow: 0 8px 32px rgba(52, 211, 153, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(52, 211, 153, 0.08);
}
body[data-color-theme="forest"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(52, 211, 153, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(5, 150, 105, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(110, 231, 183, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题：海棠粉 ─── */
body[data-color-theme="rose"] {
  --accent: #ec4899;
  --accent-rgb: 236, 72, 153;
  --accent-light: rgba(236, 72, 153, 0.1);
  --accent-dark: #be185d;
  --shadow: 0 8px 32px rgba(236, 72, 153, 0.12), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(236, 72, 153, 0.08);
  background: linear-gradient(145deg, #fdf2f8 0%, #fce7f3 40%, #f9d8ea 100%) fixed;
}
body[data-color-theme="rose"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(236, 72, 153, 0.14) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(244, 114, 182, 0.11) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(249, 168, 212, 0.09) 0%, transparent 65%);
}
body[data-color-theme="rose"][data-theme="dark"] {
  --accent: #f472b6;
  --accent-rgb: 244, 114, 182;
  --accent-light: rgba(244, 114, 182, 0.12);
  --accent-dark: #fbcfe8;
  --shadow: 0 8px 32px rgba(244, 114, 182, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(244, 114, 182, 0.08);
}
body[data-color-theme="rose"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(244, 114, 182, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(236, 72, 153, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(251, 207, 232, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题：泰山灰 ─── */
body[data-color-theme="stone"] {
  --accent: #6b7280;
  --accent-rgb: 107, 114, 128;
  --accent-light: rgba(107, 114, 128, 0.1);
  --accent-dark: #4b5563;
  --shadow: 0 8px 32px rgba(107, 114, 128, 0.12), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(107, 114, 128, 0.08);
  background: linear-gradient(145deg, #f5f5f4 0%, #eeeded 40%, #e7e5e4 100%) fixed;
}
body[data-color-theme="stone"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(107, 114, 128, 0.14) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(156, 163, 175, 0.11) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(209, 213, 219, 0.09) 0%, transparent 65%);
}
body[data-color-theme="stone"][data-theme="dark"] {
  --accent: #9ca3af;
  --accent-rgb: 156, 163, 175;
  --accent-light: rgba(156, 163, 175, 0.12);
  --accent-dark: #d1d5db;
  --shadow: 0 8px 32px rgba(156, 163, 175, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(156, 163, 175, 0.08);
}
body[data-color-theme="stone"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(156, 163, 175, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(107, 114, 128, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(209, 213, 219, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题：月光白 ─── */
body[data-color-theme="moonlight"] {
  --accent: #8b8680;
  --accent-rgb: 139, 134, 128;
  --accent-light: rgba(139, 134, 128, 0.08);
  --accent-dark: #6b6560;
  --shadow: 0 8px 32px rgba(139, 134, 128, 0.10), 0 2px 8px rgba(0,0,0,0.04);
  --shadow-sm: 0 2px 12px rgba(139, 134, 128, 0.06);
  background: linear-gradient(145deg, #fcfbf9 0%, #f7f5f2 40%, #f0eeeb 100%) fixed;
}
body[data-color-theme="moonlight"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(200, 195, 188, 0.10) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(180, 175, 168, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(220, 216, 210, 0.05) 0%, transparent 65%);
}
body[data-color-theme="moonlight"][data-theme="dark"] {
  --accent: #b0aba5;
  --accent-rgb: 176, 171, 165;
  --accent-light: rgba(176, 171, 165, 0.10);
  --accent-dark: #d4d0cc;
  --shadow: 0 8px 32px rgba(176, 171, 165, 0.08), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(176, 171, 165, 0.06);
}
body[data-color-theme="moonlight"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(176, 171, 165, 0.06) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(139, 134, 128, 0.06) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(200, 195, 188, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题：落日橙 ─── */
body[data-color-theme="sunset"] {
  --accent: #c8742b;
  --accent-rgb: 200, 116, 43;
  --accent-light: rgba(200, 116, 43, 0.10);
  --accent-dark: #93511d;
  --border-solid: rgba(214, 173, 97, 0.35);
  --ink: #4a2e1f;
  --ink2: #6f4a34;
  --ink3: #a07f68;
  --shadow: 0 8px 32px rgba(200, 116, 43, 0.14), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-sm: 0 2px 12px rgba(200, 116, 43, 0.08);
  background: linear-gradient(145deg, #faf5f0 0%, #f5ede4 40%, #ece3d8 100%) fixed;
}
body[data-color-theme="sunset"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(200, 116, 43, 0.12) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(214, 173, 97, 0.09) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(234, 179, 100, 0.06) 0%, transparent 65%);
}
body[data-color-theme="sunset"][data-theme="dark"] {
  --accent: #e0954a;
  --accent-rgb: 224, 149, 74;
  --accent-light: rgba(224, 149, 74, 0.12);
  --accent-dark: #f0b878;
  --ink: #e2e8f0;
  --ink2: #94a3b8;
  --ink3: #64748b;
  --shadow: 0 8px 32px rgba(224, 149, 74, 0.1), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-sm: 0 2px 12px rgba(224, 149, 74, 0.08);
}
body[data-color-theme="sunset"][data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(224, 149, 74, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(200, 116, 43, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(234, 179, 100, 0.04) 0%, transparent 65%);
}

/* ─── 色彩主题按钮/渐变覆盖 ─── */
body[data-color-theme="ocean"] .btn-primary {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
}
body[data-color-theme="ocean"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #1d4ed8, #3b82f6) !important;
}
body[data-color-theme="forest"] .btn-primary {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}
body[data-color-theme="forest"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #047857, #10b981) !important;
}
body[data-color-theme="ocean"] .progress-fill {
  background: linear-gradient(90deg, #2563eb, #3b82f6) !important;
}
body[data-color-theme="forest"] .progress-fill {
  background: linear-gradient(90deg, #059669, #10b981) !important;
}
body[data-color-theme="ocean"] .chat-bubble.mine {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
}
body[data-color-theme="forest"] .chat-bubble.mine {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}
body[data-color-theme="ocean"] .avatar {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
}
body[data-color-theme="forest"] .avatar {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}
body[data-color-theme="ocean"] .chat-fab {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
}
body[data-color-theme="forest"] .chat-fab {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}
body[data-color-theme="rose"] .btn-primary {
  background: linear-gradient(135deg, #ec4899, #f472b6) !important;
}
body[data-color-theme="rose"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #be185d, #f472b6) !important;
}
body[data-color-theme="stone"] .btn-primary {
  background: linear-gradient(135deg, #6b7280, #9ca3af) !important;
}
body[data-color-theme="stone"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #4b5563, #9ca3af) !important;
}
body[data-color-theme="moonlight"] .btn-primary {
  background: linear-gradient(135deg, #8b8680, #a09a94) !important;
}
body[data-color-theme="moonlight"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #6b6560, #8b8680) !important;
}
body[data-color-theme="rose"] .progress-fill {
  background: linear-gradient(90deg, #ec4899, #f472b6) !important;
}
body[data-color-theme="stone"] .progress-fill {
  background: linear-gradient(90deg, #6b7280, #9ca3af) !important;
}
body[data-color-theme="moonlight"] .progress-fill {
  background: linear-gradient(90deg, #8b8680, #a09a94) !important;
}
body[data-color-theme="rose"] .chat-bubble.mine {
  background: linear-gradient(135deg, #ec4899, #f472b6) !important;
}
body[data-color-theme="stone"] .chat-bubble.mine {
  background: linear-gradient(135deg, #6b7280, #9ca3af) !important;
}
body[data-color-theme="moonlight"] .chat-bubble.mine {
  background: linear-gradient(135deg, #8b8680, #a09a94) !important;
}
body[data-color-theme="rose"] .avatar {
  background: linear-gradient(135deg, #ec4899, #f472b6) !important;
}
body[data-color-theme="stone"] .avatar {
  background: linear-gradient(135deg, #6b7280, #9ca3af) !important;
}
body[data-color-theme="moonlight"] .avatar {
  background: linear-gradient(135deg, #8b8680, #a09a94) !important;
}
body[data-color-theme="rose"] .chat-fab {
  background: linear-gradient(135deg, #ec4899, #f472b6) !important;
}
body[data-color-theme="stone"] .chat-fab {
  background: linear-gradient(135deg, #6b7280, #9ca3af) !important;
}
body[data-color-theme="moonlight"] .chat-fab {
  background: linear-gradient(135deg, #8b8680, #a09a94) !important;
}
body[data-color-theme="sunset"] .btn-primary {
  background: linear-gradient(135deg, #c8742b, #e0954a) !important;
}
body[data-color-theme="sunset"][data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #93511d, #e0954a) !important;
}
body[data-color-theme="sunset"] .progress-fill {
  background: linear-gradient(90deg, #c8742b, #e0954a) !important;
}
body[data-color-theme="sunset"] .chat-bubble.mine {
  background: linear-gradient(135deg, #c8742b, #e0954a) !important;
}
body[data-color-theme="sunset"] .avatar {
  background: linear-gradient(135deg, #c8742b, #e0954a) !important;
}
body[data-color-theme="sunset"] .chat-fab {
  background: linear-gradient(135deg, #c8742b, #e0954a) !important;
}

/* ─── 色彩主题选择器 ─── */
.color-theme-options { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.color-theme-option {
  flex: 1 1 auto;
  min-width: 60px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 14px 8px; border-radius: 12px;
  border: 2px solid var(--border-solid);
  background: var(--card); cursor: pointer;
  transition: var(--transition);
}
.color-theme-option:hover { border-color: var(--ink3); }
.color-theme-option.active {
  border-color: var(--accent);
  background: var(--accent-light);
}
.color-theme-swatch {
  width: 32px; height: 32px; border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.color-theme-label {
  font-size: 12px; font-weight: 500; color: var(--ink2);
  text-align: center;
}
.color-theme-option.active .color-theme-label { color: var(--accent); font-weight: 600; }

/* ─── 全局重置 ─── */
*{margin:0;padding:0;box-sizing:border-box;}

/* 隐藏桌面端滚动条（保留滚动功能） */
*::-webkit-scrollbar{width:0;height:0;}
*{scrollbar-width:none;}

/* ─── 背景层：日落实景图（与落地页一致） ─── */
body {
  font-family: 'Noto Serif SC', -apple-system, "PingFang SC", serif, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
  color: var(--ink);
  line-height: 1.6;
  min-height: 100vh;
  background: linear-gradient(145deg, #f5f0fa 0%, #ede4f5 40%, #e3d8ec 100%) fixed;
  transition: background 0.4s ease, color 0.3s ease;
  position: relative;
}

/* 装饰叠层：星云紫光晕 */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(124, 58, 237, 0.10) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(219, 39, 119, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(167, 139, 250, 0.06) 0%, transparent 65%);
  transition: opacity 0.4s ease;
}

/* grain 纹理叠层（与落地页一致） */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.06'/%3E%3C/svg%3E");
  opacity: 0.18;
}

/* 暗色模式背景 */
body[data-theme="dark"] {
  background: linear-gradient(145deg, #0a0a14 0%, #0d0d1e 45%, #070b14 100%);
}
body[data-theme="dark"]::after {
  opacity: 0.08;
}

body[data-theme="dark"]::before {
  background:
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(124, 58, 237, 0.08) 0%, transparent 65%),
    radial-gradient(ellipse 600px 600px at 90% 85%, rgba(167, 139, 250, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 500px 700px at 60% 0%, rgba(219, 39, 119, 0.04) 0%, transparent 65%);
}

/* 确保内容层在装饰层上方 */
#root { position: relative; z-index: 1; }

/* ─── 聊天室模式：移除重背景，防止 iOS 键盘弹出时布局重排 ─── */
/* iOS Safari 对 background-attachment:fixed 支持极差，
   且 position:fixed 的伪元素在键盘弹出时会触发重排。
   进入聊天室时加 .mf-chat-active 到 body，换成轻量纯色背景。 */
body.mf-chat-active {
  background: linear-gradient(160deg, #f8f8f6 0%, #f2f1ee 40%, #edece8 100%);
  /* 锁住 body 滚动，防止 iOS 键盘弹出时页面被推走 */
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  /* iOS Safari: 不用 height:100vh/100dvh —— 键盘弹出时高度会变，
     依赖 inset:0 (top+bottom) 让系统自动算高度更稳 */
}
body.mf-chat-active::before,
body.mf-chat-active::after {
  display: none;
}
body.mf-chat-active[data-theme="dark"] {
  background: linear-gradient(160deg, #0a0a14 0%, #0d0d1e 50%, #0f0b18 100%);
}
body.mf-chat-active[data-theme="dark"]::before,
body.mf-chat-active[data-theme="dark"]::after {
  display: none;
}

/* ─── 布局 ─── */
.container{max-width:640px;margin:0 auto;padding:24px 16px 120px;}
.center-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px 16px;}

/* ─── 登录卡片 ─── */
.auth-card{
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 24px;
  padding: 44px 36px;
  box-shadow: 0 20px 60px rgba(139, 69, 19, 0.12), 0 4px 16px rgba(0,0,0,0.06);
  border: 1px solid rgba(139, 69, 19, 0.1);
  width: 100%;
  max-width: 420px;
}
body[data-theme="dark"] .auth-card{
  background: rgba(22, 22, 38, 0.92);
  box-shadow: 0 20px 60px rgba(0,0,0,0.4), 0 4px 16px rgba(96,165,250,0.08);
  border-color: rgba(96,165,250,0.12);
}

/* ─── Logo ─── */
.logo{text-align:center;margin-bottom:32px;}
.logo-icon{display:flex;align-items:center;justify-content:center;gap:10px;}
.logo-icon svg{width:26px;height:26px;filter:drop-shadow(0 1px 3px rgba(139,69,19,0.2));}
body[data-theme="dark"] .logo-icon svg{filter:drop-shadow(0 1px 3px rgba(96,165,250,0.3));}
.logo-name{
  font-family: 'ZCOOL XiaoWei', 'Noto Serif SC', serif;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: 0.1em;
  color: var(--ink);
}
body[data-theme="dark"] .logo-name {
  color: var(--ink);
}
.logo-sub{font-size:13px;color:var(--ink3);margin-top:4px;font-family:'Space Mono','Noto Serif SC',monospace;letter-spacing:0.03em;}
.logo-icon{color:var(--accent);}
body[data-theme="dark"] .logo-icon{color:var(--accent);}

/* ─── Auth 登录/注册切换标签 ─── */
.auth-tabs{display:flex;gap:0;border-radius:10px;overflow:hidden;border:1.5px solid rgba(var(--accent-rgb),0.25);margin-bottom:22px;background:rgba(var(--accent-rgb),0.04);}
.auth-tab{flex:1;padding:10px 0;font-size:13px;font-weight:600;border:none;cursor:pointer;background:transparent;color:var(--accent);font-family:inherit;transition:var(--transition);letter-spacing:0.02em;}
.auth-tab.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px rgba(var(--accent-rgb),0.25);}
.auth-tab:not(.active):hover{background:rgba(var(--accent-rgb),0.08);}

/* ─── Auth 底部 slogan ─── */
.auth-footer{text-align:center;margin-top:24px;padding-top:20px;border-top:1px solid rgba(var(--accent-rgb),0.1);}
.auth-slogan{font-family:'Playfair Display','Noto Serif SC',serif;font-size:14px;font-style:italic;color:var(--ink3);letter-spacing:0.04em;}

/* ─── 页面标题 ─── */
.page-header{padding-top:20px;margin-bottom:24px;}
.page-header h1{font-family:'ZCOOL XiaoWei','Noto Serif SC',serif;font-size:22px;font-weight:400;letter-spacing:0.06em;}
.page-header p{font-size:13px;color:var(--ink2);margin-top:4px;}

/* ─── 表单 ─── */
.field{margin-bottom:14px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:5px;color:var(--ink2);}
.field input,.field select{
  width:100%;padding:11px 14px;border-radius:12px;
  border:1.5px solid var(--border-solid);
  font-size:14px;font-family:inherit;
  background: rgba(255,255,255,0.6);
  color: var(--ink);
  transition: var(--transition);
  backdrop-filter: blur(8px);
}
body[data-theme="dark"] .field input,
body[data-theme="dark"] .field select {
  background: rgba(255,255,255,0.05);
  color: var(--ink);
}
.field input::placeholder { color: var(--ink3); }
.field input:focus,.field select:focus{
  outline:none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
  background: rgba(255,255,255,0.85);
}
body[data-theme="dark"] .field input:focus,
body[data-theme="dark"] .field select:focus {
  background: rgba(255,255,255,0.08);
}
.field-hint{font-size:12px;color:var(--ink3);margin-top:4px;}

/* ─── SBTI 图片保存浮层（移动端长按保存） ─── */
.sbti-save-overlay{
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,0.85);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:20px;
}
.sbti-save-overlay p{color:#fff;font-size:16px;margin-bottom:16px;text-align:center;}
.sbti-save-overlay img{max-width:90%;max-height:70vh;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.3);}
.sbti-save-overlay button{
  margin-top:20px;padding:10px 32px;border-radius:20px;
  border:none;background:#fff;color:#333;font-size:15px;font-weight:600;cursor:pointer;
}

/* ─── 记住密码 ─── */
.remember-row{
  display:flex;align-items:center;gap:8px;
  margin-bottom:14px;cursor:pointer;
  font-size:13px;color:var(--ink2);user-select:none;
}
.remember-row input[type="checkbox"]{
  width:16px;height:16px;accent-color:var(--accent);cursor:pointer;
  margin:0;
}

/* ─── 按钮 ─── */
.btn{display:block;width:100%;padding:13px;border-radius:12px;border:none;font-size:15px;font-weight:600;cursor:pointer;transition: var(--transition);text-align:center;}
.btn-primary{
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #db2777 40%));
  color: #fff;
  box-shadow: 0 4px 16px rgba(var(--accent-rgb), 0.35);
}
body[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
  box-shadow: 0 4px 20px rgba(96, 165, 250, 0.3);
}
.btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb), 0.45);
}
.btn-primary:disabled{opacity:.45;cursor:not-allowed;transform:none;}
.btn-ghost{
  background: rgba(var(--accent-rgb), 0.06);
  color: var(--accent);
  border: 1.5px solid rgba(var(--accent-rgb), 0.3);
}
.btn-ghost:hover{
  background: var(--accent-light);
  border-color: var(--accent);
}
.btn-sm{padding:8px 16px;font-size:13px;width:auto;display:inline-block;border-radius:9px;}

/* ─── 消息提示 ─── */
.msg{padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:12px;}
.msg-error{
  background: var(--error-light);
  color: var(--error);
  border: 1px solid rgba(var(--accent-rgb),0);
  border-color: rgba(220,38,38,0.2);
}
.msg-success{
  background: var(--accent-light);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb),0.25);
}
.msg-info{
  background: var(--accent-light);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb), 0.2);
}
.msg-warn{
  background: #fffbeb;
  color: #92400e;
  border: 1px solid #fcd34d;
}
[data-theme="dark"] .msg-warn{
  background: rgba(251,191,36,0.12);
  color: #fbbf24;
  border: 1px solid rgba(251,191,36,0.3);
}

/* ─── 进度条 ─── */
.progress-wrap{margin-bottom:18px;}
.progress-bar{
  background: rgba(var(--accent-rgb), 0.12);
  border-radius:100px;height:5px;
}
.progress-fill{
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 50%, #db2777));
  height:100%;border-radius:100px;transition:width .4s ease;
}
body[data-theme="dark"] .progress-fill {
  background: linear-gradient(90deg, #60a5fa, #a78bfa);
}
.progress-text{font-size:12px;color:var(--ink3);margin-top:4px;text-align:right;}

/* ─── 问卷标题 ─── */
.questionnaire-header{margin-bottom:14px;}
.questionnaire-title{font-family:'ZCOOL XiaoWei','Noto Serif SC',serif;font-size:17px;font-weight:400;letter-spacing:0.06em;margin-bottom:3px;}
.questionnaire-subtitle{font-size:13px;color:var(--ink2);}

/* ─── 问题区块 ─── */
.section{margin-bottom:28px;}
.section-title{
  font-family:'Noto Serif SC',serif;
  font-size:15px;font-weight:700;
  color: var(--accent);
  margin-bottom:12px;padding-bottom:8px;
  border-bottom: 2px solid rgba(var(--accent-rgb), 0.15);
}

/* ─── 问题卡片 ─── */
.q-card{
  background: rgba(255,255,255,0.68);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 16px;
  padding:18px 20px;margin-bottom:12px;
  box-shadow: 0 2px 12px rgba(139,69,19,0.05);
  border: 1px solid rgba(139,69,19,0.06);
  transition: var(--transition);
}
body[data-theme="dark"] .q-card{
  background: rgba(22,22,38,0.6);
  border-color: rgba(96,165,250,0.08);
  box-shadow: 0 2px 12px rgba(0,0,0,0.15);
}
.q-card.answered{
  border-color: rgba(var(--accent-rgb), 0.3);
  box-shadow: 0 4px 16px rgba(var(--accent-rgb), 0.08);
}
.q-card.gender-locked .option-btn{
  opacity: 0.6;
  pointer-events: none;
  cursor: not-allowed;
}
.q-title{font-size:14px;font-weight:600;margin-bottom:3px;}
.q-desc{font-size:12px;color:var(--ink2);margin-bottom:10px;}
.q-req{color:var(--error);}

/* ─── 选项按钮 ─── */
.option-group{display:flex;flex-direction:column;gap:7px;}
.option-btn{
  display:block;width:100%;padding:9px 13px;border-radius:10px;
  border: 1.5px solid var(--border-solid);
  background: rgba(255,255,255,0.4);
  font-size:13px;color:var(--ink);cursor:pointer;text-align:left;
  transition: var(--transition);
}
body[data-theme="dark"] .option-btn {
  background: rgba(255,255,255,0.04);
}
.option-btn:hover{
  border-color: var(--accent);
  background: var(--accent-light);
  transform: translateX(2px);
}
.option-btn.selected,.option-btn.multi-selected{
  border-color: var(--accent);
  background: var(--accent-light);
  font-weight:600;color:var(--accent);
  box-shadow: 0 2px 8px rgba(var(--accent-rgb), 0.15);
}

/* ─── 标签芯片选项（兴趣标签等短选项） ─── */
.tag-group{display:flex;flex-wrap:wrap;gap:7px;}
.tag-btn{
  display:inline-block;padding:5px 12px;border-radius:20px;
  border: 1.5px solid var(--border-solid);
  background: rgba(255,255,255,0.4);
  font-size:12px;color:var(--ink);cursor:pointer;
  transition: var(--transition);white-space:nowrap;
}
body[data-theme="dark"] .tag-btn {
  background: rgba(255,255,255,0.04);
}
.tag-btn:hover{
  border-color: var(--accent);
  background: var(--accent-light);
}
.tag-btn.multi-selected{
  border-color: var(--accent);
  background: var(--accent-light);
  font-weight:600;color:var(--accent);
  box-shadow: 0 1px 5px rgba(var(--accent-rgb), 0.15);
}

/* ─── 滑块 ─── */
.slider-wrap{padding:6px 0;}
.slider-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--ink3);margin-bottom:4px;}
.slider-input{width:100%;accent-color:var(--accent);cursor:pointer;}
.slider-value{text-align:center;font-size:22px;font-weight:700;color:var(--accent);margin-top:4px;}

/* ─── 文本输入 ─── */
.text-input{
  width:100%;padding:10px 13px;border-radius:10px;
  border:1.5px solid var(--border-solid);
  font-size:13px;font-family:inherit;resize:vertical;min-height:80px;
  background: rgba(255,255,255,0.5);
  color: var(--ink);
  transition: var(--transition);
}
body[data-theme="dark"] .text-input {
  background: rgba(255,255,255,0.05);
  color: var(--ink);
}
.text-input::placeholder { color: var(--ink3); }
.text-input:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
}

/* ─── 评分 ─── */
.rating-grid{display:flex;flex-direction:column;gap:9px;}
.rating-row{display:flex;align-items:center;gap:8px;}
.rating-label{flex:1;font-size:12px;min-width:0;color:var(--ink2);}
.rating-btns{display:flex;gap:4px;flex-shrink:0;}
.rating-btn{
  width:30px;height:30px;border-radius:50%;
  border:1.5px solid var(--border-solid);
  background: rgba(255,255,255,0.4);
  font-size:11px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition: var(--transition);
}
body[data-theme="dark"] .rating-btn { background: rgba(255,255,255,0.05); }
.rating-btn:hover{border-color:var(--accent);background:var(--accent-light);}
.rating-btn.selected{
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #db2777 40%));
  color:#fff;border-color:var(--accent);
  box-shadow: 0 2px 8px rgba(var(--accent-rgb), 0.3);
}
body[data-theme="dark"] .rating-btn.selected {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
}

/* ─── 用户卡片 ─── */
.user-card{
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 18px;
  padding:22px;margin-bottom:16px;
  border:1px solid rgba(139,69,19,0.08);
  box-shadow: 0 4px 20px rgba(139,69,19,0.06), 0 1px 4px rgba(0,0,0,0.04);
  transition: var(--transition);
}
body[data-theme="dark"] .user-card{
  background: rgba(22,22,38,0.7);
  border-color: rgba(96,165,250,0.1);
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}
.user-card-header{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.avatar{
  width:48px;height:48px;border-radius:50%;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 50%, #db2777));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:20px;font-weight:700;flex-shrink:0;
  box-shadow: 0 4px 12px rgba(var(--accent-rgb), 0.3);
}
body[data-theme="dark"] .avatar {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
}
.user-name{font-size:17px;font-weight:700;}
.user-email{font-size:12px;color:var(--ink3);}
.edit-toggle{font-size:12px;color:var(--accent);cursor:pointer;text-decoration:underline;margin-left:auto;}

/* ─── 底栏 ─── */
.bottom-bar{
  position:fixed;bottom:0;left:0;right:0;
  background: rgba(255, 248, 240, 0.88);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding:12px 16px;
  border-top:1px solid rgba(139,69,19,0.08);
  z-index:100;
}
body[data-theme="dark"] .bottom-bar {
  background: rgba(10, 10, 20, 0.88);
  border-top-color: rgba(96,165,250,0.1);
}
.bottom-bar-inner{max-width:640px;margin:0 auto;display:flex;gap:8px;align-items:center;}

/* ─── 暗色模式切换按钮 ─── */
.theme-toggle-btn{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  border:1.5px solid var(--border-solid);
  background: rgba(255,255,255,0.5);
  cursor:pointer;font-size:16px;
  transition: var(--transition);
  flex-shrink:0;
}
body[data-theme="dark"] .theme-toggle-btn {
  background: rgba(255,255,255,0.08);
}
.theme-toggle-btn:hover{
  border-color: var(--accent);
  background: var(--accent-light);
  transform: rotate(15deg) scale(1.05);
}

/* 航线页右上角"搜索航线"图标按钮:无气泡(无边框/背景),只是图标 */
.flight-search-btn{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;
  padding:0;
  border:none;background:transparent;
  color:var(--ink2);cursor:pointer;
  flex-shrink:0;
  transition:color .15s;
}
.flight-search-btn:hover{ color:var(--accent); }
body[data-theme="dark"] .flight-search-btn{ color:var(--ink2); }
body[data-theme="dark"] .flight-search-btn:hover{ color:var(--accent); }

/* 搜索输入条:出现在"+ 发布航线"按钮和航线流之间 */
.flight-search-bar{
  margin:8px 16px 0; padding:0;
}
.flight-search-bar input{
  width:100%; padding:9px 12px;
  border:1.5px solid var(--border-solid); border-radius:10px;
  font-size:14px; font-family:inherit;
  background:var(--card); color:var(--ink); outline:none;
  transition:border-color .15s;
}
.flight-search-bar input:focus{ border-color:var(--accent); }

/* 关键词 chip 行 */
.flight-search-chips{
  display:flex; flex-wrap:wrap; align-items:center;
  gap:6px; margin:8px 16px 0;
}
.flight-search-chip{
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 4px 3px 10px; border-radius:14px;
  background:rgba(0,0,0,0.04); color:var(--ink3);
  font-size:12px; line-height:1.4;
}
body[data-theme="dark"] .flight-search-chip{
  background:rgba(255,255,255,0.08);
}
.flight-search-chip-x{
  width:18px;height:18px;line-height:18px;text-align:center;
  border:none;background:transparent;color:var(--ink3);
  font-size:14px;cursor:pointer;padding:0;border-radius:50%;
}
.flight-search-chip-x:hover{ background:rgba(0,0,0,0.08); color:var(--ink); }
.flight-search-clear-all{
  margin-left:auto;
  font-size:12px; color:var(--ink3);
  text-decoration:underline;
  cursor:pointer;
}
.flight-search-clear-all:hover{ color:var(--ink); }

/* ─── 加载 ─── */
.loading{text-align:center;padding:60px;color:var(--ink3);font-size:14px;}

/* ─── 响应式 ─── */
@media(min-width:640px){
  .container{padding:40px 24px 120px;}
  .bottom-bar{padding:14px 24px;}
}

/* ═══════ 聊天组件 ═══════ */
.chat-fab{
  position:fixed;bottom:80px;right:20px;
  width:52px;height:52px;border-radius:50%;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 50%, #db2777));
  color:#fff;border:none;cursor:pointer;
  box-shadow: 0 4px 20px rgba(var(--accent-rgb), 0.4);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;z-index:200;transition: var(--transition);
}
body[data-theme="dark"] .chat-fab {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
  box-shadow: 0 4px 20px rgba(96, 165, 250, 0.35);
}
.chat-fab:hover{transform:scale(1.08) translateY(-2px);}
.chat-fab .badge{
  position:absolute;top:-2px;right:-2px;
  min-width:18px;height:18px;border-radius:9px;
  background:var(--error);color:#fff;
  font-size:10px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  padding:0 4px;border:2px solid #fff;
}

.chat-panel{
  position:fixed;bottom:80px;right:20px;
  width:360px;max-width:calc(100vw - 24px);
  height:500px;max-height:calc(100vh - 120px);
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-radius:20px;
  box-shadow: var(--shadow), 0 20px 60px rgba(0,0,0,0.15);
  z-index:201;display:flex;flex-direction:column;
  overflow:hidden;border:1px solid var(--border);
}

.chat-header{
  padding:14px 16px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 65%, #8B4513));
  color:#fff;display:flex;align-items:center;gap:10px;flex-shrink:0;
}
body[data-theme="dark"] .chat-header {
  background: linear-gradient(135deg, #1e293b, #1e1b4b);
  border-bottom: 1px solid var(--border);
}
.chat-header .back-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:2px 6px;border-radius:4px;}
.chat-header .back-btn:hover{background:rgba(255,255,255,.15);}
.chat-header .title{flex:1;min-width:0;}
.chat-header .title h4{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chat-header .title .subtitle{font-size:11px;opacity:.8;}
.chat-header .close-btn{background:none;border:none;color:#fff;font-size:20px;cursor:pointer;padding:2px 6px;border-radius:4px;}
.chat-header .close-btn:hover{background:rgba(255,255,255,.15);}
.peer-gender-tag{font-size:13px;opacity:.85;margin-left:3px;vertical-align:middle;}
.peer-note-btn{background:none;border:none;color:rgba(255,255,255,.75);cursor:pointer;font-size:12px;padding:0 3px;vertical-align:middle;line-height:1;}
.peer-note-btn:hover{color:#fff;}
.peer-tags-container{display:flex;align-items:flex-start;gap:6px;margin-top:5px;}
.tags-toggle-btn{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;padding:0 2px;font-size:11px;flex-shrink:0;line-height:1.6;transition:color 0.2s ease;}
.tags-toggle-btn:hover{color:#fff;}
.peer-tags-row{display:flex;flex-wrap:wrap;gap:4px;flex:1;transition:all 0.2s ease;}
.peer-tags-container.tags-collapsed .peer-tags-row{display:none;}
.peer-tag-chip{font-size:11px;padding:2px 10px;border-radius:10px;background:var(--bg);color:var(--ink2);white-space:nowrap;line-height:1.6;border:1px solid var(--border);}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9000;display:flex;align-items:center;justify-content:center;}
.modal-box{background:#fff;border-radius:14px;padding:24px;width:90%;box-shadow:0 8px 32px rgba(0,0,0,.18);}
body[data-theme="dark"] .modal-box{background:#1e293b;color:#e2e8f0;}
body[data-theme="dark"] .modal-box input{background:#0f172a;border-color:#334155;color:#e2e8f0;}
.modal-card{background:var(--bg);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.18);}
body[data-theme="dark"] .modal-card{background:#1e293b;color:#e2e8f0;}
body[data-theme="dark"] .modal-card input{background:#0f172a;border-color:#334155;color:#e2e8f0;}

.add-friend-section{background:rgba(var(--accent-rgb),0.06);border:1px solid rgba(var(--accent-rgb),0.12);border-radius:14px;padding:20px;margin-bottom:16px;}
body[data-theme="dark"] .add-friend-section{background:rgba(var(--accent-rgb),0.08);border-color:rgba(var(--accent-rgb),0.18);}
.add-friend-section svg{max-width:100%;height:auto;}

/* ── 通讯录页 ── */
.contacts-section-entry{
  display:flex;align-items:center;gap:12px;padding:14px 16px;
  cursor:pointer;transition:var(--transition);
  border-bottom:1px solid var(--border);
}
.contacts-section-entry:hover{background:var(--accent-light);}
.contacts-entry-icon{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.contacts-entry-text{flex:1;font-size:15px;font-weight:500;color:var(--ink);}
.contacts-req-count{
  background:var(--error);color:#fff;font-size:11px;font-weight:600;
  border-radius:10px;padding:2px 8px;min-width:20px;text-align:center;line-height:1.5;
}
.contacts-list{padding:0 0 20px;}
.contacts-group-header{
  padding:6px 16px;font-size:12px;font-weight:600;color:var(--ink3);
  background:var(--bg);position:sticky;top:0;z-index:1;
}
.contacts-item{
  display:flex;align-items:center;gap:12px;padding:12px 16px;
  cursor:pointer;transition:var(--transition);
}
.contacts-item:hover{background:var(--accent-light);}
.contacts-item-info{flex:1;min-width:0;}
.contacts-item-name{font-size:14px;font-weight:500;display:flex;align-items:center;gap:6px;}
.contacts-item-name .close-friend-badge,.contacts-item-name .friend-badge{
  font-size:10px;font-weight:600;padding:1px 6px;border-radius:6px;flex-shrink:0;line-height:1.4;
}
.contacts-item-name .friend-badge{
  color:var(--accent);background:transparent;border:1px solid rgba(var(--accent-rgb),0.4);
}
.contacts-item-note{font-size:12px;color:var(--ink3);margin-top:2px;}
.contacts-item-private{
  font-size:11px;color:var(--ink3);font-weight:400;margin-left:6px;
  padding:1px 6px;border-radius:6px;background:var(--bg);
}

/* ── 收纳群聊模块 ──────────────────────────── */
.contacts-archived-header{
  display:flex;align-items:center;gap:12px;padding:14px 16px;
  cursor:pointer;transition:var(--transition);
  border-bottom:1px solid var(--border);
}
.contacts-archived-header:hover{background:var(--accent-light);}
.contacts-archived-count{
  font-size:12px;color:var(--ink3);font-weight:500;
  padding:1px 8px;border-radius:10px;background:var(--bg);min-width:20px;text-align:center;
}
.contacts-archived-chevron{
  flex-shrink:0;transition:transform 0.2s ease;
}
.contacts-archived-header.expanded .contacts-archived-chevron{
  transform:rotate(90deg);
}
.contacts-archived-list{
  background:var(--bg);
}
.contacts-archived-item{
  display:flex;align-items:center;gap:12px;padding:10px 16px 10px 24px;
  cursor:pointer;transition:var(--transition);
  border-bottom:1px solid var(--border);
}
.contacts-archived-item:hover{background:var(--accent-light);}
.contacts-archived-x{
  margin-left:auto;flex-shrink:0;
  width:24px;height:24px;border:none;background:none;cursor:pointer;
  font-size:13px;line-height:1;color:var(--ink3);opacity:0.45;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  transition:opacity 0.15s ease,background 0.15s ease;filter:grayscale(1);
}
.contacts-archived-x:hover{opacity:0.85;background:rgba(0,0,0,0.06);}

.chat-conv-list{flex:1;overflow-y:auto;padding:8px;}
.chat-conv-item{
  display:flex;align-items:center;gap:12px;padding:12px;
  border-radius:12px;cursor:pointer;transition: var(--transition);
  border:1px solid transparent;
}
.chat-conv-item:hover{background:var(--accent-light);border-color:rgba(var(--accent-rgb),0.2);}
.chat-conv-item.conv-pinned{background:rgba(var(--accent-rgb),0.04);}
.chat-conv-avatar{
  width:40px;height:40px;border-radius:50%;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 50%, #db2777));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;flex-shrink:0;
}
body[data-theme="dark"] .chat-conv-avatar {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
}
.chat-conv-info{flex:1;min-width:0;}
.chat-conv-name{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px;}
.chat-conv-name .unread-dot{width:8px;height:8px;border-radius:50%;background:var(--error);flex-shrink:0;}
.chat-conv-name .new-match-badge{font-size:10px;font-weight:600;color:#fff;background:var(--accent);padding:1px 6px;border-radius:6px;flex-shrink:0;line-height:1.4;}
.chat-conv-name .close-friend-badge{font-size:10px;font-weight:600;color:var(--accent);background:transparent;border:1px solid var(--accent);padding:1px 6px;border-radius:6px;flex-shrink:0;line-height:1.4;margin-left:4px;}
.chat-conv-name .cross-uni-badge{font-size:10px;font-weight:600;color:#fff;background:linear-gradient(135deg,#f59e0b,#ef4444);padding:1px 6px;border-radius:6px;flex-shrink:0;line-height:1.4;margin-left:4px;}
.chat-conv-last{font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.chat-conv-score{font-size:11px;color:var(--accent);font-weight:600;flex-shrink:0;}

.chat-messages{flex:1;min-height:0;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:6px;}
.chat-load-more{text-align:center;padding:6px 0 2px;flex-shrink:0;}
.chat-load-more button{background:none;border:1px solid var(--border);border-radius:20px;padding:5px 16px;font-size:12px;color:var(--ink3);cursor:pointer;transition:var(--transition);}
.chat-load-more button:hover:not(:disabled){background:var(--hover);color:var(--ink);}
.chat-load-more button:disabled{opacity:0.55;cursor:default;}


.chat-bubble{max-width:75%;min-width:72px;padding:9px 14px;border-radius:16px;font-size:13px;line-height:1.5;word-break:break-word;}
.chat-bubble.mine{
  align-self:flex-end;
  /* 我发的:淡紫底 + 黑字(原本是 accent 渐变 + 白字) */
  background: #ede4f5;
  color: #1a1a2e;
  border-bottom-right-radius:4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
body[data-theme="dark"] .chat-bubble.mine {
  background: #ede4f5;
  color: #1a1a2e;
}
.chat-bubble.theirs{
  align-self:flex-start;
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(10px);
  color:var(--ink);border-bottom-left-radius:4px;
  border:1px solid rgba(0,0,0,0.04);
}
body[data-theme="dark"] .chat-bubble.theirs {
  background: rgba(255,255,255,0.07);
}
/* 气泡内时间戳：inline显示，避免短文本换行 */
.bbl-time{display:inline-block;font-size:10px;opacity:.6;white-space:nowrap;margin-left:6px;vertical-align:bottom;line-height:1.8;}
/* 图片消息的时间戳单独成行 */
.bbl-time-block{display:block;font-size:10px;opacity:.6;white-space:nowrap;text-align:right;margin-top:3px;}
/* 兼容旧的 .time 类（游戏消息等） */
.chat-bubble .time{font-size:10px;opacity:.6;margin-top:2px;white-space:nowrap;}
.chat-date-sep{text-align:center;font-size:11px;color:var(--ink3);padding:8px 0;}
.chat-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:13px;text-align:center;padding:20px;}

.chat-input-bar{
  display:flex;gap:8px;padding:10px 14px;
  border-top:1px solid rgba(139,69,19,0.06);flex-shrink:0;
  background: rgba(250,248,245,0.82);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
body[data-theme="dark"] .chat-input-bar {
  background: rgba(13,13,30,0.8);
  border-top-color: var(--border);
}
.chat-input-bar input{
  flex:1;min-width:0;padding:9px 14px;border-radius:20px;
  border:1.5px solid var(--border-solid);
  font-size:13px;font-family:inherit;outline:none;
  background: rgba(255,255,255,0.6);
  color: var(--ink);
  transition: var(--transition);
}
body[data-theme="dark"] .chat-input-bar input {
  background: rgba(255,255,255,0.07);
  color: var(--ink);
}
.chat-input-bar input::placeholder { color: var(--ink3); }
.chat-input-bar input:focus{
  border-color:var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
}
.chat-input-bar button{
  width:36px;height:36px;border-radius:50%;
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;flex-shrink:0;transition: var(--transition);
}
.chat-input-bar button:disabled{opacity:.4;cursor:not-allowed;}
.chat-input-bar button:not(:disabled):hover{transform:scale(1.08);}

/* ── 聊天输入整体容器 ── */
.chat-input-wrap{
  flex-shrink:0;
  border-top:1px solid rgba(139,69,19,0.06);
  background: rgba(250,248,245,0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding-bottom: env(safe-area-inset-bottom);
  /* iOS Safari: 防止子元素撑宽导致水平溢出 */
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
body[data-theme="dark"] .chat-input-wrap{
  background: rgba(10,10,20,0.88);
  border-top-color: var(--border);
}
.chat-input-wrap.drag-over{border-top:1.5px solid rgba(var(--accent-rgb),0.35);background:rgba(var(--accent-rgb),0.04);}

/* ── 输入行 ── */
.chat-input-bar{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;
  background:transparent;
  border-top:none;
}

.chat-input-bar input{
  flex:1;min-width:0;padding:9px 14px;border-radius:20px;
  border:1.5px solid var(--border-solid);
  font-size:13px;font-family:inherit;outline:none;
  background: rgba(255,255,255,0.8);
  color: var(--ink);
  transition: var(--transition);
}
body[data-theme="dark"] .chat-input-bar input{
  background: rgba(255,255,255,0.07);
  color: var(--ink);
}
.chat-input-bar input::placeholder{color:var(--ink3);}
.chat-input-bar input:focus{
  border-color:var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
}

/* ── 😊 表情键 ── */
.chat-emoji-btn,
.chat-voice-btn,
.chat-kbd-btn{
  width:36px;height:36px;border-radius:50%;
  background:transparent;color:var(--ink2);
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition: var(--transition);
  box-shadow:none;
}
.chat-emoji-btn:hover,
.chat-voice-btn:hover,
.chat-kbd-btn:hover{color:var(--accent);background:rgba(var(--accent-rgb),0.08);}
body[data-theme="dark"] .chat-emoji-btn,
body[data-theme="dark"] .chat-voice-btn,
body[data-theme="dark"] .chat-kbd-btn{color:var(--ink3);}
body[data-theme="dark"] .chat-emoji-btn:hover,
body[data-theme="dark"] .chat-voice-btn:hover,
body[data-theme="dark"] .chat-kbd-btn:hover{color:var(--accent);background:rgba(var(--accent-rgb),0.12);}

/* ── + 键（无文字时） ── */
.chat-plus-btn{
  width:36px;height:36px;border-radius:50%;
  background: rgba(255,255,255,0.9);
  color:var(--ink2);
  border:1.5px solid var(--border-solid);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition: var(--transition);
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.chat-plus-btn:hover{background:var(--accent-light);color:var(--accent);border-color:var(--accent);}
body[data-theme="dark"] .chat-plus-btn{
  background:rgba(255,255,255,0.08);
  color:var(--ink2);
}

/* ── 发送键（有文字时） ── */
.chat-send-btn{
  width:36px;height:36px;border-radius:50%;
  background: linear-gradient(135deg, #c9622a, #8B4513);
  color:#fff;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition: var(--transition);
  box-shadow: 0 2px 10px rgba(var(--accent-rgb), 0.35);
}
body[data-theme="dark"] .chat-send-btn{
  background: linear-gradient(135deg, #2563eb, #4f46e5);
}
.chat-send-btn:hover{transform:scale(1.08);box-shadow:0 4px 16px rgba(var(--accent-rgb),0.45);}
.chat-send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;}

/* ── 扩展功能面板（点击+展开） ── */
.chat-extra-panel{
  display:flex;gap:0;
  padding:12px 16px 14px;
  background:transparent;
  animation:slideUp 0.18s ease-out;
}
.chat-extra-btn{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  width:64px;padding:8px 0;
  background:none;border:none;cursor:pointer;
  font-family:inherit;
}
.chat-extra-icon{
  width:48px;height:48px;border-radius:14px;
  background:rgba(255,255,255,0.9);
  border:1px solid rgba(139,69,19,0.08);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;
  color:var(--ink2);
  box-shadow:0 2px 8px rgba(0,0,0,0.06);
  transition:var(--transition);
}
body[data-theme="dark"] .chat-extra-icon{
  background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.08);
}
.chat-extra-btn:hover .chat-extra-icon{
  background:var(--accent-light);
  border-color:rgba(var(--accent-rgb),0.2);
  color:var(--accent);
  transform:translateY(-2px);
}
.chat-extra-label{font-size:11px;color:var(--ink3);}
.chat-extra-icon svg{display:block;}

/* ── 返回键未读角标 ── */
.back-btn{position:relative;}
.back-btn-badge{
  position:absolute;top:-4px;right:-6px;
  min-width:16px;height:16px;line-height:16px;
  padding:0 4px;border-radius:8px;
  background:var(--error);color:#fff;
  font-size:10px;font-weight:700;text-align:center;
  pointer-events:none;
}

/* ── 在线状态点 ── */
.online-dot{
  display:inline-block;width:8px;height:8px;border-radius:50%;
  vertical-align:middle;margin-left:4px;
}
.online-dot.pulse{
  background:#22c55e;
  box-shadow:0 0 0 0 rgba(34,197,94,.6);
  animation:onlinePulse 2s infinite;
}
.online-dot.offline{
  background:var(--ink3);opacity:.5;
}
@keyframes onlinePulse{
  0%{box-shadow:0 0 0 0 rgba(34,197,94,.55);}
  70%{box-shadow:0 0 0 6px rgba(34,197,94,0);}
  100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}
}

/* 会话列表头像在线指示 */
.chat-conv-avatar-wrap{position:relative;flex-shrink:0;}
.avatar-online-dot{
  position:absolute;bottom:0;right:0;
  width:10px;height:10px;border-radius:50%;
  border:2px solid var(--card);
}
.avatar-online-dot.pulse{
  background:#22c55e;
  box-shadow:0 0 0 0 rgba(34,197,94,.6);
  animation:onlinePulse 2s infinite;
}

/* 会话未读提醒（微信风格）：未免打扰显示数字红圈，免打扰只显示小红点
   颜色使用与底部导航栏未读小圆同样的 var(--error)；居中方式用 flex（line-height
   居中在不同字体下容易偏移）。 */
.chat-conv-avatar-wrap .unread-badge{
  position:absolute;top:-4px;right:-4px;
  min-width:18px;height:18px;padding:0 5px;
  border-radius:9px;background:var(--error);color:#fff;
  font-size:11px;font-weight:700;line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-sizing:border-box;
  border:2px solid var(--card);
}
.chat-conv-avatar-wrap .unread-badge.muted{
  min-width:10px;width:10px;height:10px;padding:0;
  border-radius:50%;font-size:0;line-height:0;
  display:block;
  border:2px solid var(--card);
  top:-2px;right:-2px;
}

/* ── 语音录制条 ── */
.voice-recording-bar{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  background:rgba(250,248,245,0.82);
  backdrop-filter:blur(16px);
  border-top:1px solid rgba(139,69,19,0.06);
  flex-shrink:0;
}
body[data-theme="dark"] .voice-recording-bar{
  background:rgba(13,13,30,0.8);
  border-top-color:var(--border);
}
.voice-rec-indicator{display:flex;align-items:center;gap:6px;flex:1;}
.voice-rec-dot{
  width:10px;height:10px;border-radius:50%;background:#ef4444;
  animation:voiceRecBlink 1s infinite;
}
@keyframes voiceRecBlink{0%,100%{opacity:1;}50%{opacity:.3;}}
.voice-rec-text{font-size:13px;color:var(--ink2);}
.voice-rec-duration{font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;}
.voice-rec-cancel{
  padding:6px 14px;border-radius:16px;
  background:none;border:1px solid var(--border-solid);
  font-size:13px;color:var(--ink2);cursor:pointer;font-family:inherit;
}
.voice-rec-send{
  padding:6px 14px;border-radius:16px;
  background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7c3aed));
  border:none;color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;
}

/* ── 语音消息气泡 ── */
.voice-msg{
  display:flex;align-items:center;gap:8px;
  cursor:pointer;padding:2px 0;
  min-width:80px;
}
.voice-play-icon{
  font-size:14px;opacity:.85;flex-shrink:0;
  transition:transform .2s;
}
.voice-msg.playing .voice-play-icon{
  color:var(--accent);
}
.voice-bars{
  display:flex;align-items:center;gap:2px;flex:1;
}
.voice-bar{
  width:3px;height:10px;border-radius:2px;
  background:currentColor;opacity:.4;
}
.voice-bar:nth-child(1){height:6px;}
.voice-bar:nth-child(2){height:12px;}
.voice-bar:nth-child(3){height:8px;}
.voice-bar:nth-child(4){height:14px;}
.voice-msg.playing .voice-bar{
  animation:voiceBarAnim .6s ease-in-out infinite alternate;
}
.voice-msg.playing .voice-bar:nth-child(2){animation-delay:.15s;}
.voice-msg.playing .voice-bar:nth-child(3){animation-delay:.3s;}
.voice-msg.playing .voice-bar:nth-child(4){animation-delay:.45s;}
@keyframes voiceBarAnim{
  0%{transform:scaleY(0.5);}
  100%{transform:scaleY(1.5);}
}
.voice-dur{font-size:12px;opacity:.7;flex-shrink:0;white-space:nowrap;}

/* ── 消息行包装器 ── */
.chat-msg-row{display:flex;flex-direction:column;gap:2px;max-width:80%;}
.chat-msg-row.mine{align-self:flex-end;align-items:flex-end;}
.chat-msg-row.theirs{align-self:flex-start;align-items:flex-start;}
.chat-msg-inner{display:flex;align-items:flex-end;gap:4px;}

/* ── 消息行右键/长按上下文菜单 ── */
.msg-context-menu{
  position:fixed;z-index:9999;
  background:var(--card);
  border:1px solid var(--border-solid);
  border-radius:12px;padding:4px;
  box-shadow:0 8px 24px rgba(0,0,0,0.15);
  min-width:130px;
  backdrop-filter:blur(12px);
}
body[data-theme="dark"] .msg-context-menu{
  box-shadow:0 8px 24px rgba(0,0,0,0.4);
}
.msg-context-menu button{
  display:block;width:100%;
  padding:10px 16px;
  background:none;border:none;border-radius:8px;
  font-size:14px;color:var(--ink);
  cursor:pointer;text-align:left;
  font-family:inherit;transition:var(--transition);
}
.msg-context-menu button:hover{background:var(--accent-light);color:var(--accent);}
.msg-context-menu button.ctx-danger{color:var(--error);}
.msg-context-menu button.ctx-danger:hover{background:var(--error-light);color:var(--error);}

.chat-bubble.pending{opacity:0.6;}
.chat-bubble.pending .bbl-time{opacity:.5;}
.chat-msg-row.recalled{max-width:100%;}
.chat-msg-recalled{
  font-size:12px;color:var(--ink3);
  padding:4px 0;
  background:none;border:none;
}
.chat-msg-recalled .recalled-time{margin-left:8px;font-size:10px;opacity:.75;}

/* ── 引用块（消息内部） ── */
.chat-reply-quote{
  padding:4px 8px;border-radius:4px;
  background:rgba(var(--accent-rgb),0.08);
  margin-bottom:6px;cursor:pointer;
}
.chat-bubble.mine .chat-reply-quote{
  background:rgba(255,255,255,0.15);
}
.quote-sender{font-size:11px;font-weight:600;opacity:.8;margin-bottom:2px;}
.quote-text{font-size:12px;opacity:.75;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:200px;}

/* ── 图片消息 ── */
.chat-img-wrap{max-width:75%;}
.chat-img-wrap.mine{align-self:flex-end;}
.chat-img-wrap.theirs{align-self:flex-start;}
.chat-img-wrap .bbl-time-block{color:var(--ink3);}
.chat-msg-image{
  max-width:220px;max-height:220px;
  border-radius:10px;display:block;
  cursor:zoom-in;object-fit:cover;
}
.chat-msg-image-expired{
  width:200px;height:200px;
  border-radius:10px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:#f3f4f6;border:1px solid #e5e7eb;
  font-size:36px;color:#9ca3af;
}
.chat-msg-image-expired span{font-size:13px;color:#9ca3af;font-weight:500;}

/* 消息删除按钮:hover/触摸气泡时显现 */
.chat-msg-bubble-wrap{position:relative;display:inline-flex;align-items:center;gap:6px;}
.chat-msg-row.mine .chat-msg-bubble-wrap{flex-direction:row-reverse;}
.chat-msg-del-btn{
  opacity:0;visibility:hidden;
  flex-shrink:0;width:22px;height:22px;border-radius:50%;
  border:none;background:rgba(0,0,0,0.10);color:#6b7280;
  cursor:pointer;font-size:14px;line-height:1;font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;
  transition:opacity 0.15s ease, background 0.15s ease;
}
.chat-msg-bubble-wrap:hover .chat-msg-del-btn,
.chat-msg-bubble-wrap:focus-within .chat-msg-del-btn{
  opacity:1;visibility:visible;
}
.chat-msg-del-btn:hover{background:rgba(220,38,38,0.18);color:#dc2626;}

/* 消息转发按钮:与删除按钮一样 hover/触摸气泡时显现 */
.chat-msg-fwd-btn{
  opacity:0;visibility:hidden;
  flex-shrink:0;width:22px;height:22px;border-radius:50%;
  border:none;background:rgba(0,0,0,0.10);color:#6b7280;
  cursor:pointer;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
  transition:opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.chat-msg-bubble-wrap:hover .chat-msg-fwd-btn,
.chat-msg-bubble-wrap:focus-within .chat-msg-fwd-btn{
  opacity:1;visibility:visible;
}
.chat-msg-fwd-btn:hover{background:rgba(var(--accent-rgb),0.18);color:var(--accent);}

/* ── 转发会话选择器 ── */
.chat-forward-list{max-height:50vh;overflow-y:auto;display:flex;flex-direction:column;gap:2px;}
.chat-forward-item{
  display:flex;align-items:center;gap:10px;
  padding:8px 8px;border-radius:10px;cursor:pointer;
  transition:background 0.12s ease;
}
.chat-forward-item:hover{background:var(--accent-light);}
.chat-forward-name{font-size:15px;color:var(--ink);font-weight:500;word-break:break-word;}

/* ── 表情回应 ── */
.chat-reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px;}
.reaction-item{
  padding:2px 7px;border-radius:12px;
  border:1px solid var(--border-solid);
  background:var(--card);
  font-size:13px;cursor:pointer;
  transition: var(--transition);
  line-height:1.6;
}
.reaction-item.active{
  background:var(--accent-light);
  border-color:rgba(var(--accent-rgb),0.45);
}
.reaction-item:hover{background:rgba(var(--accent-rgb),0.12);}

/* ── 置顶消息横幅 ── */
.pinned-banner{
  flex-shrink:0;
  border-bottom:1px solid var(--border);
  background:var(--card);
  max-height:140px;
  overflow-y:auto;
}
.pinned-banner-inner{padding:6px 12px;}
.pinned-banner-label{
  font-size:11px;color:var(--ink3);font-weight:600;margin-bottom:4px;
}
.pinned-item{
  display:flex;align-items:center;gap:8px;
  padding:5px 8px;border-radius:8px;cursor:pointer;
  border-left:3px solid var(--accent);
  background:rgba(var(--accent-rgb),0.06);
  margin-bottom:4px;
  transition:background .15s;
}
.pinned-item:last-child{margin-bottom:0;}
.pinned-item:hover{background:rgba(var(--accent-rgb),0.12);}
.pinned-item-content{
  flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;
}
.pinned-item-sender{
  font-size:11px;font-weight:600;color:var(--accent);
}
.pinned-item-text{
  font-size:12px;color:var(--ink2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pinned-item-remove{
  flex-shrink:0;width:20px;height:20px;
  border:none;background:none;cursor:pointer;
  color:var(--ink3);font-size:12px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
.pinned-item-remove:hover{
  background:rgba(0,0,0,0.08);color:var(--ink1);
}

/* ── 引用预览条（输入框上方） ── */
/* 正在输入提示 */
.typing-indicator{
  padding:4px 16px 6px;
  font-size:12px;
  color:var(--ink3);
  flex-shrink:0;
}
.typing-dots span{
  animation:typingBounce 1.4s infinite both;
  font-weight:bold;
  font-size:16px;
  line-height:1;
}
.typing-dots span:nth-child(2){animation-delay:0.2s}
.typing-dots span:nth-child(3){animation-delay:0.4s}
@keyframes typingBounce{
  0%,80%,100%{opacity:0.3}
  40%{opacity:1}
}

.chat-reply-bar{
  border-top:1px solid var(--border);
  background:rgba(var(--accent-rgb),0.06);
  flex-shrink:0;
}
.reply-bar-inner{
  display:flex;align-items:center;gap:8px;
  padding:6px 14px;
}
.reply-bar-icon{font-size:14px;color:var(--accent);flex-shrink:0;}
.reply-bar-body{flex:1;min-width:0;}
.reply-bar-sender{font-size:11px;font-weight:600;color:var(--accent);}
.reply-bar-preview{font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.reply-bar-cancel{
  background:none;border:none;color:var(--ink3);
  font-size:16px;cursor:pointer;padding:2px 4px;
  border-radius:4px;flex-shrink:0;
}
.reply-bar-cancel:hover{color:var(--ink);}

/* ── 表情选择器 ── */
.chat-emoji-picker{
  display:flex;flex-direction:column;gap:4px;
  padding:8px 14px;
  border-top:1px solid var(--border);
  background:var(--card);
  flex-shrink:0;
}
.emoji-row{
  display:flex;align-items:center;gap:6px;
}
.emoji-pick-btn{
  background:none;border:none;font-size:22px;
  cursor:pointer;padding:2px;border-radius:8px;
  transition: var(--transition);line-height:1;
}
.emoji-pick-btn:hover{background:var(--accent-light);transform:scale(1.2);}
.emoji-pick-close{
  background:none;border:none;color:var(--ink3);
  font-size:16px;cursor:pointer;margin-left:4px;
  padding:2px 6px;border-radius:4px;
}
.emoji-pick-close:hover{color:var(--ink);}

/* ── 表情面板 Tabs ── */
.emoji-picker-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:6px;
}
.emoji-tab{
  flex:1;background:none;border:none;padding:6px 0;
  font-size:13px;color:var(--ink3);cursor:pointer;
  border-bottom:2px solid transparent;transition:var(--transition);
  font-family:inherit;
}
.emoji-tab.active{
  color:var(--accent);border-bottom-color:var(--accent);font-weight:600;
}

/* ── 表情包网格 ── */
.sticker-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:6px;
  max-height:180px;overflow-y:auto;padding:4px 0;
  -webkit-overflow-scrolling:touch;
}
.sticker-pick-btn{
  background:none;border:none;cursor:pointer;padding:4px;
  border-radius:8px;transition:var(--transition);
  display:flex;align-items:center;justify-content:center;
}
.sticker-pick-btn:hover{background:var(--accent-light);transform:scale(1.08);}
.sticker-pick-btn img{
  width:60px;height:60px;object-fit:contain;
}
.sticker-loading{
  grid-column:1/-1;text-align:center;color:var(--ink3);
  font-size:13px;padding:16px 0;
}

/* ── 表情包消息气泡 ── */
.chat-msg-sticker{
  max-width:120px;max-height:120px;
  display:block;object-fit:contain;
}

/* ── 表情包市场入口按钮（picker 底部） ── */
.sticker-market-entry{
  display:flex;align-items:center;justify-content:center;gap:4px;
  padding:8px 0 4px;border-top:1px solid var(--border);
  font-size:13px;color:var(--accent);cursor:pointer;
  transition:var(--transition);
}
.sticker-market-entry:hover{opacity:0.7;}
.sticker-empty{
  grid-column:1/-1;text-align:center;color:var(--ink3);
  font-size:13px;padding:20px 0;line-height:1.8;
}

/* ── 表情包市场页 ── */
.sticker-upload-btn{
  display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;cursor:pointer;
  color:var(--accent);transition:var(--transition);
}
.sticker-upload-btn:hover{background:var(--accent-light);}
.sticker-market-grid{padding:0 16px 24px;}
.sticker-market-section{
  font-size:13px;font-weight:600;color:var(--ink2);
  padding:12px 0 8px;
}
.sticker-market-items{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
}
.sticker-market-item{
  position:relative;
  background:var(--card);border:2px solid var(--border);
  border-radius:10px;padding:6px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  aspect-ratio:1;transition:var(--transition);
}
.sticker-market-item img{
  width:100%;height:100%;object-fit:contain;
}
.sticker-market-item.collected{
  border-color:var(--accent);
}
.sticker-market-check{
  position:absolute;top:2px;right:2px;
  width:20px;height:20px;border-radius:50%;
  font-size:12px;line-height:20px;text-align:center;
  background:var(--border);color:var(--ink3);
  transition:var(--transition);
}
.sticker-market-item.collected .sticker-market-check{
  background:var(--accent);color:#fff;
}

/* ── 图片预览栏（批量上传） ── */
.img-preview-bar{
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;
  border-top:1px solid var(--border);
  background:var(--card);
  flex-shrink:0;
  overflow-x:auto;
}
.img-preview-item{
  position:relative;width:60px;height:60px;flex-shrink:0;
  border-radius:8px;overflow:hidden;border:1px solid var(--border-solid);
}
.img-preview-item img{
  width:100%;height:100%;object-fit:cover;
}
.img-preview-del{
  position:absolute;top:2px;right:2px;
  width:18px;height:18px;border-radius:50%;
  background:rgba(0,0,0,0.55);color:#fff;
  font-size:12px;line-height:18px;text-align:center;
  border:none;cursor:pointer;padding:0;
}
.img-preview-del:hover{background:var(--error);}
.img-preview-actions{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  margin-left:auto;flex-shrink:0;
}
.img-preview-count{
  font-size:12px;color:var(--ink3);
}

/* ── 文件预览栏（上传文本文件） ── */
.file-preview-bar{
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;
  border-top:1px solid var(--border);
  background:var(--card);
  flex-shrink:0;
  overflow-x:auto;
}
.file-preview-item{
  position:relative;
  display:flex;align-items:center;gap:6px;
  padding:6px 10px;
  border-radius:8px;
  border:1px solid var(--border-solid);
  background:rgba(var(--accent-rgb),0.08);
  flex-shrink:0;
  font-size:12px;color:var(--ink2);
}
.file-preview-icon{
  font-size:14px;
}
.file-preview-name{
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.file-preview-del{
  position:absolute;top:-6px;right:-6px;
  width:20px;height:20px;border-radius:50%;
  background:var(--error);color:#fff;
  font-size:12px;line-height:20px;text-align:center;
  border:none;cursor:pointer;padding:0;
}
.file-preview-del:hover{background:var(--error);opacity:0.8;}
.file-preview-actions{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  margin-left:auto;flex-shrink:0;
}
.file-preview-count{
  font-size:12px;color:var(--ink3);
}

/* ── 文件消息样式 ── */
/* 文件消息:整条消息气泡本身就是文件卡片,内部不再套第二层气泡 */
.chat-msg-bubble.chat-msg-bubble--file{
  padding:10px 12px;
  min-width:200px;
  max-width:260px;
}
.chat-msg-file{
  display:flex;
  align-items:center;
  gap:10px;
  background:transparent;
  color:inherit;
  text-decoration:none;
  transition:var(--transition);
}
.chat-msg-file:hover .chat-file-name{ text-decoration:underline; }
.chat-file-ico{ flex-shrink:0; width:40px; height:40px; display:block; }
.chat-file-meta{ min-width:0; display:flex; flex-direction:column; gap:3px; }
.chat-file-name{
  font-weight:600; font-size:14px; line-height:1.3; color:var(--ink);
  word-break:break-all;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.chat-file-sub{ font-size:11px; color:var(--ink3); }
body[data-theme="dark"] .chat-file-name{ color:var(--ink); }

/* ── 个人名片(contact_card)── 白卡:好友头像 + 名字 + 浅灰"个人名片",点卡进资料卡 */
.chat-msg-bubble.chat-msg-bubble--card{ padding:0; background:transparent; border:none; box-shadow:none; }
.chat-card{ width:222px; padding:12px; border-radius:12px; background:var(--card-solid); border:1px solid var(--border-solid); cursor:pointer; }
.chat-card-top{ display:flex; align-items:center; gap:10px; }
.chat-card-name{ font-size:15px; font-weight:600; color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-card-div{ height:1px; background:var(--border-solid); margin:10px 0 6px; }
.chat-card-label{ font-size:11px; color:var(--ink3); }

/* ── 消息高亮（点击引用跳转） ── */
@keyframes msg-flash{
  0%{background:rgba(var(--accent-rgb),0.25);}
  100%{background:transparent;}
}
.msg-highlight{animation:msg-flash 1.5s ease-out;border-radius:12px;}

/* ── 图片全屏查看 ── */
.img-overlay{
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,0.88);
  display:flex;align-items:center;justify-content:center;
  cursor:zoom-out;
}
.img-overlay img{
  max-width:92vw;max-height:92vh;
  border-radius:8px;object-fit:contain;
  cursor:default;
}

@media(max-width:420px){.chat-panel{right:8px;width:calc(100vw - 16px);bottom:70px;height:calc(100vh - 90px);}}

/* ═══════ 全屏聊天页 ═══════ */
.chat-page{display:flex;flex-direction:column;height:100vh;height:100dvh;}
.chat-page-header{
  padding:16px 20px;display:flex;align-items:center;gap:10px;flex-shrink:0;
  border-bottom:1px solid rgba(139,69,19,0.08);
  background: rgba(255, 248, 240, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
body[data-theme="dark"] .chat-page-header {
  background: rgba(10,10,20,0.88);
  border-bottom-color: var(--border);
}
.chat-page-header .logo-name{font-family:'ZCOOL XiaoWei','Noto Serif SC',serif;font-size:20px;font-weight:400;letter-spacing:0.08em;}
.chat-page-header .spacer{flex:1;}
.chat-page-header .nav-link{
  font-size:13px;color:var(--accent);cursor:pointer;
  padding:6px 14px;border-radius:10px;
  border:1.5px solid rgba(var(--accent-rgb),0.35);
  white-space:nowrap;background:var(--accent-light);
  font-family:inherit;font-weight:500;
  transition: var(--transition);
}
.chat-page-header .nav-link:hover{background:rgba(var(--accent-rgb),0.18);}
.chat-page-header .logout-link{
  font-size:13px;color:var(--ink3);cursor:pointer;
  padding:6px 12px;border-radius:10px;
  border:1px solid var(--border-solid);white-space:nowrap;
  background:none;font-family:inherit;
  transition: var(--transition);
}
.chat-page-header .logout-link:hover{background:rgba(var(--accent-rgb),0.06);color:var(--ink);}
.chat-page-list{flex:1;overflow-y:auto;max-width:640px;width:100%;margin:0 auto;padding:8px 12px;}
.chat-page-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;color:var(--ink3);text-align:center;padding:40px 24px;gap:20px;}
.chat-page-empty .empty-icon{font-size:56px;opacity:0.8;}
.chat-page-empty .empty-text{font-size:14px;line-height:1.9;max-width:320px;}
.chat-page-empty .empty-text span{font-family:'Space Mono','Noto Serif SC',monospace;}
.chat-page-room{
  display:flex;flex-direction:column;
  /* position:fixed 钉死在视口，防止 iOS 键盘弹出时 body 滚动导致整个聊天室被推走 */
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  /* iOS Safari: inset shorthand 兼容性不如显式四边 */
  z-index:50;
  overflow:hidden;
  background:#FFF8F0;
}
body[data-theme="dark"] .chat-page-room{
  background:#0a0a14;
}
.chat-page-room .chat-header{border-radius:0;}
.chat-page-room .chat-messages{flex:1;min-height:0;padding:12px 16px;}

/* ═══════ 游戏模块：骰子问答 ═══════ */
.dice-icon{vertical-align:middle;display:inline-block;margin-top:-2px;}
.dice-btn{
  width:36px;height:36px;border-radius:50%;
  background:transparent;color:var(--ink);
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;transition: var(--transition);
}
.dice-btn:hover{background:rgba(var(--accent-rgb),0.1);}
.game-card{
  margin:12px 8px;border-radius:16px;
  border:2px dashed rgba(var(--accent-rgb),0.35);
  background:var(--accent-light);
  padding:14px 16px;display:flex;flex-direction:column;gap:10px;
}
.game-title{font-weight:700;font-size:14px;color:var(--accent);}
.game-rolled{font-size:13px;color:var(--ink2);}
.game-won{font-size:13px;font-weight:600;color:var(--accent);}
.game-lost{font-size:13px;color:var(--ink3);}
.game-roll-btn{
  align-self:flex-start;padding:8px 20px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7c3aed));
  color:#fff;border:none;border-radius:20px;
  font-size:13px;cursor:pointer;font-family:inherit;font-weight:600;
  transition: var(--transition);
  box-shadow: 0 2px 8px rgba(var(--accent-rgb),0.3);
}
.game-roll-btn:hover{opacity:.85;transform:translateY(-1px);}
.game-q-btn{
  width:100%;padding:10px 14px;
  background: rgba(255,255,255,0.5);
  border:1.5px solid rgba(var(--accent-rgb),0.25);
  border-radius:10px;font-size:13px;color:var(--ink);
  cursor:pointer;font-family:inherit;text-align:left;line-height:1.5;
  transition: var(--transition);
}
body[data-theme="dark"] .game-q-btn { background: rgba(255,255,255,0.05); }
.game-q-btn:hover{background:var(--accent-light);}
.game-cancel-btn{
  align-self:flex-start;margin-top:6px;padding:6px 16px;
  background:transparent;border:1.5px solid rgba(180,180,180,0.5);
  border-radius:16px;font-size:12px;color:var(--ink-light);
  cursor:pointer;font-family:inherit;transition:var(--transition);
}
.game-cancel-btn:hover{background:rgba(180,180,180,0.15);}
.game-reroll-btn{
  align-self:flex-start;margin-top:6px;padding:6px 16px;
  background:transparent;border:1.5px solid rgba(var(--accent-rgb),0.35);
  border-radius:16px;font-size:12px;color:var(--accent);
  cursor:pointer;font-family:inherit;transition:var(--transition);
}
.game-reroll-btn:hover{background:var(--accent-light);}
.game-question-msg{
  max-width:80%;padding:10px 14px;border-radius:14px;
  font-size:13px;line-height:1.5;word-break:break-word;
  border:2px solid rgba(var(--accent-rgb),0.3);
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(8px);
}
body[data-theme="dark"] .game-question-msg { background: rgba(255,255,255,0.07); }
.game-question-msg.mine{align-self:flex-end;border-bottom-right-radius:4px;}
.game-question-msg.theirs{align-self:flex-start;border-bottom-left-radius:4px;}
.game-question-msg .gq-label{font-size:11px;color:var(--accent);font-weight:600;margin-bottom:4px;}
.game-question-msg .gq-text{font-size:13px;color:var(--ink);}
.game-question-msg .gq-reply-btn{
  display:inline-block;margin-top:6px;padding:4px 14px;
  font-size:12px;font-weight:600;color:var(--accent);
  background:rgba(var(--accent-rgb),0.1);border:1px solid rgba(var(--accent-rgb),0.3);
  border-radius:12px;cursor:pointer;transition:var(--transition);
}
.game-question-msg .gq-reply-btn:hover{background:rgba(var(--accent-rgb),0.2);}
.game-question-msg .time{font-size:10px;opacity:.6;margin-top:4px;white-space:nowrap;}
.dice-result-msg{
  max-width:80%;padding:10px 14px;border-radius:14px;
  font-size:13px;line-height:1.5;word-break:break-word;
  border:2px solid rgba(var(--accent-rgb),0.3);
  background:var(--accent-light);align-self:center;text-align:center;
}
.dice-result-msg .gq-label{font-size:11px;color:var(--accent);font-weight:600;margin-bottom:4px;}
.dice-result-msg .gq-text{font-size:13px;color:var(--ink);font-weight:600;}
.dice-result-msg .time{font-size:10px;opacity:.6;margin-top:4px;}

/* ═══════ 游戏入口菜单（对话内卡片） ═══════ */
.game-menu-card{
  align-self:center;max-width:260px;margin-left:auto;margin-right:auto;
  text-align:center;
}
.game-menu-card .game-q-btn{
  text-align:center;font-weight:600;font-size:14px;
}

/* ═══════ 猜一猜：选题弹窗 ═══════ */
.guess-setup-overlay{
  position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.45);z-index:9999;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.guess-setup-card{
  background:var(--card);border-radius:20px;
  padding:24px 20px;max-width:360px;width:100%;
  display:flex;flex-direction:column;gap:12px;
  box-shadow:0 8px 32px rgba(0,0,0,0.15);
}
body[data-theme="dark"] .guess-setup-card{box-shadow:0 8px 32px rgba(0,0,0,0.5);}
.guess-setup-title{font-size:18px;font-weight:700;color:var(--accent);text-align:center;}
.guess-setup-subtitle{font-size:12px;color:var(--ink3);text-align:center;margin-top:-4px;}
.guess-setup-question{
  font-size:15px;font-weight:600;color:var(--ink);
  text-align:center;padding:8px 0;line-height:1.5;
}
.guess-setup-opt{
  width:100%;padding:12px 16px;
  background:rgba(255,255,255,0.5);
  border:1.5px solid rgba(var(--accent-rgb),0.25);
  border-radius:12px;font-size:14px;color:var(--ink);
  cursor:pointer;font-family:inherit;text-align:left;line-height:1.5;
  transition:var(--transition);display:flex;align-items:center;gap:10px;
}
body[data-theme="dark"] .guess-setup-opt{background:rgba(255,255,255,0.05);}
.guess-setup-opt:hover{background:var(--accent-light);border-color:var(--accent);}
.guess-setup-opt:active{transform:scale(0.98);}
.guess-setup-actions{
  display:flex;gap:8px;justify-content:center;margin-top:4px;
}
.guess-setup-refresh,.guess-setup-cancel{
  padding:8px 18px;border-radius:16px;font-size:12px;
  cursor:pointer;font-family:inherit;transition:var(--transition);
}
.guess-setup-refresh{
  background:transparent;border:1.5px solid rgba(var(--accent-rgb),0.35);color:var(--accent);
}
.guess-setup-refresh:hover{background:var(--accent-light);}
.guess-setup-cancel{
  background:transparent;border:1.5px solid rgba(180,180,180,0.5);color:var(--ink-light);
}
.guess-setup-cancel:hover{background:rgba(180,180,180,0.15);}

/* ═══════ 猜一猜：互动卡片 ═══════ */
.guess-card .guess-card-question{
  font-size:14px;font-weight:600;color:var(--ink);line-height:1.5;
}
.guess-card .guess-card-my-answer{
  font-size:13px;color:var(--ink2);
  padding:8px 12px;border-radius:10px;
  background:rgba(var(--accent-rgb),0.08);
}
.guess-card .guess-card-waiting{font-size:13px;color:var(--ink3);}
.guess-card .guess-card-prompt{font-size:13px;font-weight:600;color:var(--accent);}
.guess-choice-btn{
  width:100%;padding:10px 14px;
  background:rgba(255,255,255,0.5);
  border:1.5px solid rgba(var(--accent-rgb),0.25);
  border-radius:10px;font-size:13px;color:var(--ink);
  cursor:pointer;font-family:inherit;text-align:left;line-height:1.5;
  transition:var(--transition);display:flex;align-items:center;gap:8px;
}
body[data-theme="dark"] .guess-choice-btn{background:rgba(255,255,255,0.05);}
.guess-choice-btn:hover{background:var(--accent-light);border-color:var(--accent);}
.guess-choice-btn:active{transform:scale(0.98);}

/* ═══════ 猜一猜：消息气泡 ═══════ */
.guess-opt-label{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;
  background:var(--accent);color:#fff;font-size:11px;font-weight:700;
  flex-shrink:0;
}
.guess-question-msg{
  max-width:85%;padding:12px 16px;border-radius:14px;
  font-size:13px;line-height:1.5;word-break:break-word;
  border:2px solid rgba(var(--accent-rgb),0.3);
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-rgb),0.02));
  align-self:center;
}
body[data-theme="dark"] .guess-question-msg{background:linear-gradient(135deg, rgba(var(--accent-rgb),0.15), rgba(var(--accent-rgb),0.05));}
.guess-question-msg .gq-label{font-size:12px;color:var(--accent);font-weight:600;margin-bottom:6px;}
.guess-question-msg .guess-q-text{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:8px;}
.guess-question-msg .guess-options-preview{font-size:13px;color:var(--ink2);line-height:1.8;}
.guess-question-msg .guess-hint{font-size:11px;color:var(--ink3);margin-top:6px;font-style:italic;}
.guess-question-msg .time{font-size:10px;opacity:.6;margin-top:6px;white-space:nowrap;}

.guess-result-msg{
  max-width:85%;padding:12px 16px;border-radius:14px;
  font-size:13px;line-height:1.5;word-break:break-word;
  align-self:center;text-align:left;
}
.guess-result-msg.guess-correct{
  border:2px solid rgba(76,175,80,0.4);
  background:linear-gradient(135deg, rgba(76,175,80,0.08), rgba(76,175,80,0.02));
}
.guess-result-msg.guess-wrong{
  border:2px solid rgba(255,152,0,0.4);
  background:linear-gradient(135deg, rgba(255,152,0,0.08), rgba(255,152,0,0.02));
}
body[data-theme="dark"] .guess-result-msg.guess-correct{background:linear-gradient(135deg, rgba(76,175,80,0.15), rgba(76,175,80,0.05));}
body[data-theme="dark"] .guess-result-msg.guess-wrong{background:linear-gradient(135deg, rgba(255,152,0,0.15), rgba(255,152,0,0.05));}
.guess-result-msg .gq-label{font-size:12px;color:var(--accent);font-weight:600;margin-bottom:6px;}
.guess-result-msg .guess-q-text{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:10px;}
.guess-result-msg .guess-result-answers{display:flex;flex-direction:column;gap:6px;margin-bottom:8px;}
.guess-result-msg .guess-answer-row{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink);}
.guess-result-msg .guess-answer-label{font-size:12px;color:var(--ink3);min-width:70px;}
.guess-result-msg .guess-verdict{
  font-size:14px;font-weight:600;text-align:center;
  padding:6px 0;margin-top:4px;
}
.guess-correct .guess-verdict{color:#4caf50;}
.guess-wrong .guess-verdict{color:#ff9800;}
.guess-result-msg .time{font-size:10px;opacity:.6;margin-top:6px;white-space:nowrap;}

/* ═══════ 复旦对话引导消息（每日话题推送，按发送方左右对齐） ═══════ */
.fudan-dialog-msg{
  max-width:80%;padding:10px 14px;border-radius:14px;
  font-size:13px;line-height:1.5;word-break:break-word;
  border:1px dashed rgba(var(--accent-rgb),0.35);
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.06), rgba(var(--accent-rgb),0.02));
  backdrop-filter:blur(8px);
}
body[data-theme="dark"] .fudan-dialog-msg{background:linear-gradient(135deg, rgba(var(--accent-rgb),0.12), rgba(var(--accent-rgb),0.05));}
.fudan-dialog-msg.mine{align-self:flex-end;border-bottom-right-radius:4px;}
.fudan-dialog-msg.theirs{align-self:flex-start;border-bottom-left-radius:4px;}
.fudan-dialog-msg .fd-label{font-size:11px;color:var(--accent);font-weight:600;margin-bottom:4px;opacity:0.8;}
.fudan-dialog-msg .fd-text{font-size:13px;color:var(--ink);}
.fudan-dialog-msg .fd-time{font-size:10px;opacity:.5;margin-top:3px;white-space:nowrap;}
.fd-reply-btn{display:block;margin-top:8px;font-size:12px;padding:6px 14px;border-radius:8px;border:1px solid rgba(var(--accent-rgb),0.35);background:rgba(var(--accent-rgb),0.08);color:var(--accent);cursor:pointer;font-weight:500;}
.fd-reply-btn:active{opacity:0.7;}

/* ═══════ 系统/机器人消息 ═══════ */
.system-msg{
  align-self:center;text-align:center;
  max-width:90%;padding:8px 16px;margin:8px auto;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-rgb),0.04));
  border:1px dashed rgba(var(--accent-rgb),0.25);
  font-size:12px;color:var(--ink2);line-height:1.6;
}
.system-msg-icon{margin-right:4px;font-size:13px;}
.system-msg-text{font-size:12px;}
.system-msg-time{font-size:10px;opacity:.5;margin-top:2px;}
.chat-msg-row.system{display:flex;justify-content:center;}

/* 聊天内嵌系统提问卡片（用于 M-M 询问"在折腾什么"） */
.system-question-card{
  align-self:center;
  width:min(92%, 420px);
  margin:12px auto;
  padding:14px 18px 16px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.1), rgba(var(--accent-rgb),0.04));
  border:1px dashed rgba(var(--accent-rgb),0.32);
  color:var(--ink2);
  text-align:center;
}
.system-question-icon{
  display:flex;justify-content:center;align-items:center;
  margin:0 auto 6px;
  width:36px;height:36px;
  border-radius:50%;
  background:rgba(var(--accent-rgb),0.12);
  color:rgba(var(--accent-rgb),0.95);
}
.system-question-svg{
  width:22px;height:22px;
}
.system-question-title{
  font-size:11px;font-weight:700;letter-spacing:0.15em;
  color:rgba(var(--accent-rgb),0.85);
  margin-bottom:6px;
}
.system-question-text{
  font-size:14px;font-weight:600;color:var(--ink);
  line-height:1.5;margin-bottom:4px;
}
.system-question-hint{
  font-size:11px;color:var(--ink3);line-height:1.5;margin-bottom:10px;
}
.system-question-form{
  display:flex;gap:8px;align-items:stretch;
}
.system-question-input{
  flex:1;min-width:0;
  padding:8px 12px;
  border:1px solid rgba(var(--accent-rgb),0.25);
  border-radius:10px;
  background:rgba(255,255,255,0.7);
  font-size:13px;color:var(--ink);
  outline:none;
}
.system-question-input:focus{
  border-color:rgba(var(--accent-rgb),0.6);
  background:#fff;
}
.system-question-submit{
  display:flex;align-items:center;justify-content:center;
  width:38px;height:auto;
  padding:0;
  border:none;border-radius:10px;
  background:rgba(var(--accent-rgb),0.9);
  color:#fff;
  cursor:pointer;
}
.system-question-submit svg{width:18px;height:18px;}
.system-question-submit:hover{background:rgba(var(--accent-rgb),1);}
.system-question-submit:active{transform:scale(0.97);}

/* ═══════ 匹配参与卡片 ═══════ */
/* ── 下次匹配倒计时卡片 ── */
.countdown-card{
  margin:16px auto;padding:16px 20px;
  border-radius:14px;text-align:center;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-rgb),0.03));
  border:1px solid rgba(var(--accent-rgb),0.2);
  max-width:340px;
}
body[data-theme="dark"] .countdown-card{
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.12), rgba(var(--accent-rgb),0.04));
}
.countdown-card-time{
  font-family:'Playfair Display','Space Mono','Noto Serif SC',serif;
  font-style:italic;
  font-size:28px;font-weight:700;
  color:var(--accent);
  letter-spacing:0.04em;
  line-height:1.2;
}
.countdown-card-label{
  font-size:12px;color:var(--ink3);
  margin-top:6px;letter-spacing:0.02em;
}

.match-opt-in-card{
  margin:16px auto;padding:14px 18px;
  border-radius:12px;text-align:center;
  background:var(--card);border:1px solid var(--border-solid);
  box-shadow:var(--shadow-sm);max-width:340px;
}
.match-opt-in-card.opted-in{
  display:flex;align-items:center;justify-content:center;gap:12px;
  flex-wrap:wrap;
}
.match-opt-in-actions{
  display:flex;gap:8px;justify-content:center;align-items:center;
  flex-wrap:wrap;
}
.match-opt-in-actions .btn{
  flex:1 1 152px;
  min-width:140px;
}
@media (max-width: 360px){
  .match-opt-in-actions .btn{
    flex:1 1 100%;
    min-width:0;
  }
}

/* ═══════ SBTI 入口横幅 ═══════ */
.sbti-banner-card{
  position:relative;
  max-width:640px;width:calc(100% - 24px);margin:10px auto 0;
  padding:14px 16px;border-radius:14px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-rgb),0.03));
  border:1px solid rgba(var(--accent-rgb),0.18);
}
.sbti-banner-close{
  position:absolute;top:8px;right:10px;
  background:none;border:none;font-size:18px;color:var(--ink3);
  cursor:pointer;padding:0 2px;line-height:1;
}
.sbti-banner-close:hover{color:var(--ink);}
.sbti-banner-body{
  display:flex;align-items:center;gap:12px;
}
.sbti-banner-icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:10px;
  background:rgba(var(--accent-rgb),0.10);
}
.sbti-banner-text{
  flex:1;min-width:0;
}
.sbti-banner-title{
  font-size:14px;font-weight:600;color:var(--ink);
}
.sbti-banner-desc{
  font-size:12px;color:var(--ink2);margin-top:2px;line-height:1.5;
}
.sbti-banner-btn{
  margin-top:10px;display:inline-block;text-decoration:none;
}

/* ═══════ SBTI 结果卡片（设置页） ═══════ */
.sbti-result-hero{
  background:#eaf3ee;border-radius:16px;padding:10px;
  border:1px solid #d8e4de;margin-bottom:14px;
}
.sbti-result-hero-inner{
  background:#fff;border-radius:12px;padding:20px 16px 16px;
  text-align:center;
}
.sbti-result-label{
  font-size:13px;color:#8f9d96;letter-spacing:1px;margin-bottom:8px;
}
.sbti-result-name{
  font-size:42px;font-weight:900;line-height:1.15;color:var(--ink);
  margin-bottom:2px;
}
.sbti-result-code{
  font-size:28px;font-weight:800;line-height:1.2;margin-bottom:10px;
}
.sbti-result-avatar{
  font-size:88px;line-height:1.1;
  filter:drop-shadow(0 6px 3px rgba(0,0,0,.06));
  margin-bottom:6px;
}
.sbti-result-tagline{
  font-size:15px;color:#5a6b63;line-height:1.6;
  margin-top:6px;padding:0 8px;
}
.sbti-dims-section{
  margin-bottom:14px;
}
.sbti-dim-row{
  margin-bottom:8px;
}
.sbti-dim-header{
  display:flex;justify-content:space-between;
  font-size:12px;color:var(--ink2);margin-bottom:4px;
}
.sbti-dim-track{
  height:6px;background:var(--border);border-radius:999px;overflow:hidden;
}
.sbti-dim-fill{
  height:100%;border-radius:999px;transition:width .5s ease;
}
.sbti-save-btn{
  width:100%;margin-bottom:8px;
  border:1.5px dashed rgba(var(--accent-rgb),.35) !important;
  color:var(--accent) !important;
}

/* ═══════ 新手引导 ═══════ */
.onboarding-guide{
  padding:20px 22px;border-radius:16px;
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(var(--accent-rgb),0.15);
  box-shadow:0 4px 20px rgba(var(--accent-rgb),0.08);
}
body[data-theme="dark"] .onboarding-guide{
  background:rgba(255,255,255,0.05);
}
.onboarding-steps{
  display:flex;flex-direction:column;gap:10px;margin-top:12px;
}
.onboarding-step{
  display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;
}
.onboarding-step-num{
  flex-shrink:0;width:22px;height:22px;border-radius:50%;
  background:var(--accent);color:#fff;font-size:12px;font-weight:600;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}

/* ═══════ 功能介绍页 ═══════ */
.guide-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:14px;padding:20px;margin-bottom:14px;
  box-shadow:var(--shadow-sm);
}
.guide-card-icon{font-size:28px;margin-bottom:8px;}
.guide-card-title{font-size:15px;font-weight:700;margin-bottom:10px;color:var(--ink);}
.guide-card-body{font-size:13px;color:var(--ink2);line-height:1.8;}
.guide-card-body p{margin:0 0 8px;}
.guide-card-body p:last-child{margin-bottom:0;}
.guide-card-body ul{margin:4px 0 8px;padding-left:18px;}
.guide-card-body ul li{margin-bottom:2px;}
.guide-card-body a{color:var(--accent);text-decoration:none;font-weight:500;}
.guide-card-body a:hover{text-decoration:underline;}
.guide-highlight{
  margin-top:10px;padding:10px 14px;border-radius:10px;
  background:var(--accent-light);
  display:flex;flex-direction:column;gap:6px;
}
.guide-highlight-row{font-size:12px;color:var(--ink2);display:flex;align-items:baseline;gap:8px;}
.guide-label{
  flex-shrink:0;font-weight:600;color:var(--accent);font-size:12px;
  min-width:60px;
}
.guide-card-new{
  position:relative;
  border-color:rgba(var(--accent-rgb),0.3);
  background:linear-gradient(135deg, var(--card) 0%, rgba(var(--accent-rgb),0.04) 100%);
}
.guide-new-tag{
  position:absolute;top:12px;right:14px;
  font-size:10px;font-weight:700;letter-spacing:1px;
  padding:2px 8px;border-radius:6px;
  background:var(--accent);color:#fff;
}
.guide-section-divider{
  display:flex;align-items:center;gap:12px;margin:24px 0 16px;
  font-size:12px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:0.5px;
}
.guide-section-divider::before,.guide-section-divider::after{
  content:'';flex:1;height:1px;background:var(--border);
}

/* ═══════ 新功能发现弹窗 ═══════ */
.feature-modal-overlay{
  display:flex;align-items:center;justify-content:center;
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,0.5);backdrop-filter:blur(4px);
  opacity:0;transition:opacity .25s ease;
}
.feature-modal-overlay.visible{opacity:1;}
.feature-modal-overlay.visible .feature-modal-box{
  transform:translateY(0) scale(1);opacity:1;
}
.feature-modal-box{
  width:calc(100% - 40px);max-width:400px;max-height:calc(100dvh - 80px);
  border-radius:20px;overflow:hidden;
  background:var(--card);border:1px solid var(--border);
  box-shadow:0 20px 60px rgba(0,0,0,0.25);
  transform:translateY(20px) scale(0.96);opacity:0;
  transition:transform .3s ease,opacity .3s ease;
  display:flex;flex-direction:column;
}
.feature-modal-header{
  position:relative;overflow:hidden;
  padding:28px 24px 20px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.15) 0%, rgba(var(--accent-rgb),0.05) 100%);
}
.feature-modal-wave{
  position:absolute;bottom:-1px;left:0;right:0;height:20px;
  background:var(--card);
  border-radius:20px 20px 0 0;
}
.feature-modal-title-area{position:relative;z-index:1;}
.feature-modal-badge{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:1.5px;
  padding:3px 10px;border-radius:6px;
  background:var(--accent);color:#fff;margin-bottom:10px;
}
.feature-modal-title{
  font-size:20px;font-weight:800;color:var(--ink);margin:0 0 4px;
}
.feature-modal-subtitle{
  font-size:13px;color:var(--ink2);margin:0;
}
.feature-modal-list{
  flex:1;overflow-y:auto;padding:4px 16px 8px;
  display:flex;flex-direction:column;gap:2px;
}
.feature-modal-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 10px;border-radius:12px;
}
.feature-modal-icon{
  flex-shrink:0;font-size:24px;width:40px;height:40px;
  display:flex;align-items:center;justify-content:center;
  border-radius:12px;background:rgba(var(--accent-rgb),0.08);
}
.feature-modal-item-text{
  flex:1;min-width:0;
}
.feature-modal-item-text strong{
  display:block;font-size:14px;color:var(--ink);margin-bottom:2px;
}
.feature-modal-item-text span{
  font-size:12px;color:var(--ink2);line-height:1.5;
}
.feature-modal-footer{
  padding:12px 20px 20px;display:flex;flex-direction:column;gap:8px;
}
.feature-modal-guide-btn{
  width:100%;padding:12px;border-radius:12px;font-size:14px;font-weight:600;
}
.feature-modal-dismiss-btn{
  background:none;border:none;cursor:pointer;
  font-size:13px;color:var(--ink3);padding:6px;
  font-family:inherit;
}
.feature-modal-dismiss-btn:hover{color:var(--ink2);}

/* ═══════ 通用轻量确认弹窗（MerlinkFlight 风格） ═══════ */
.wl-confirm-overlay{
  position:fixed;inset:0;z-index:10001;
  display:flex;align-items:center;justify-content:center;
  padding:24px;
  background:rgba(20,18,36,0.45);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  opacity:0;transition:opacity .2s ease;
}
.wl-confirm-overlay.visible{opacity:1;}
.wl-confirm-overlay.visible .wl-confirm-box{
  transform:translateY(0) scale(1);opacity:1;
}
.wl-confirm-box{
  width:100%;max-width:340px;
  background:var(--card);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border);
  border-radius:20px;
  box-shadow:0 20px 60px rgba(0,0,0,0.22), 0 4px 16px rgba(0,0,0,0.08);
  overflow:hidden;
  transform:translateY(12px) scale(0.96);opacity:0;
  transition:transform .25s ease, opacity .25s ease;
}
body[data-theme="dark"] .wl-confirm-box{
  background:rgba(22,22,38,0.92);
  box-shadow:0 20px 60px rgba(0,0,0,0.5), 0 4px 16px rgba(0,0,0,0.3);
}
.wl-confirm-body{
  padding:26px 24px 18px;
  text-align:center;
}
.wl-confirm-icon{
  width:52px;height:52px;margin:0 auto 14px;
  border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  font-size:26px;
  background:rgba(var(--accent-rgb),0.10);
  color:var(--accent);
}
.wl-confirm-icon.danger{
  background:rgba(239,68,68,0.10);
  color:#ef4444;
}
.wl-confirm-title{
  font-family:'ZCOOL XiaoWei','Noto Serif SC',serif;
  font-size:19px;font-weight:400;letter-spacing:0.04em;
  color:var(--ink);margin:0 0 8px;
}
.wl-confirm-message{
  font-size:13.5px;line-height:1.65;
  color:var(--ink2);margin:0;
}
.wl-confirm-actions{
  display:flex;gap:10px;
  padding:14px 20px 20px;
}
.wl-confirm-btn{
  flex:1;padding:11px 14px;
  border-radius:12px;border:none;cursor:pointer;
  font-family:inherit;font-size:14px;font-weight:600;
  letter-spacing:0.02em;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.wl-confirm-btn:active{transform:scale(0.97);}
.wl-confirm-btn-cancel{
  background:rgba(var(--accent-rgb),0.08);
  color:var(--ink2);
}
.wl-confirm-btn-cancel:hover{
  background:rgba(var(--accent-rgb),0.14);
  color:var(--ink);
}
.wl-confirm-btn-ok{
  background:var(--accent);color:#fff;
  box-shadow:0 4px 14px rgba(var(--accent-rgb),0.3);
}
.wl-confirm-btn-ok:hover{
  background:var(--accent-dark);
  box-shadow:0 6px 18px rgba(var(--accent-rgb),0.4);
}
.wl-confirm-btn-danger{
  background:#ef4444;color:#fff;
  box-shadow:0 4px 14px rgba(239,68,68,0.3);
}
.wl-confirm-btn-danger:hover{
  background:#dc2626;
  box-shadow:0 6px 18px rgba(239,68,68,0.4);
}

/* 聊天中"我已拉黑对方"的顶部温和提示（与 chat-blocked-hint 同源） */
.chat-i-blocked-hint{
  text-align:center;padding:12px 16px;
  color:var(--ink3);font-size:13px;
  display:flex;align-items:center;justify-content:center;gap:10px;
}
.chat-i-blocked-hint .unblock-link{
  background:none;border:none;
  color:var(--accent);font-size:13px;font-weight:600;
  cursor:pointer;padding:2px 6px;border-radius:6px;
  font-family:inherit;
}
.chat-i-blocked-hint .unblock-link:hover{
  background:rgba(var(--accent-rgb),0.10);
}

/* ═══════ 功能提示卡片 ═══════ */
.feature-tips-card{
  max-width:640px;width:calc(100% - 24px);margin:8px auto 0;
  padding:14px 16px;border-radius:14px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-rgb),0.03));
  border:1px solid rgba(var(--accent-rgb),0.18);
}
.feature-tips-header{
  display:flex;align-items:center;justify-content:space-between;
}
.feature-tips-close{
  background:none;border:none;font-size:20px;color:var(--ink3);
  cursor:pointer;padding:0 2px;line-height:1;
}
.feature-tips-close:hover{color:var(--ink);}
.feature-tips-list{
  display:flex;flex-direction:column;gap:10px;margin-top:10px;
}
.feature-tip-item{
  display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;
  cursor:pointer;border-radius:8px;padding:6px 8px;transition:background .15s;
}
.feature-tip-item:hover{background:rgba(var(--accent-rgb),0.06);}
.feature-tip-icon{
  flex-shrink:0;font-size:18px;margin-top:1px;
}

/* ═══════ 记忆档案页 ═══════ */
.memory-page{display:flex;flex-direction:column;height:100vh;height:100dvh;}
.memory-body{flex:1;overflow-y:auto;max-width:640px;width:100%;margin:0 auto;padding:16px 12px 40px;}

.memory-summary-card{
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-radius:16px;padding:20px;margin-bottom:16px;
  border:1px solid var(--border);box-shadow:var(--shadow);
}
.memory-empty-summary{background:rgba(255,255,255,0.4);}
body[data-theme="dark"] .memory-empty-summary { background: rgba(255,255,255,0.03); }
.memory-summary-title{font-size:15px;font-weight:700;margin-bottom:12px;color:var(--ink);}
.memory-summary-topics{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.topic-chip{
  padding:4px 10px;border-radius:20px;
  background:var(--accent-light);color:var(--accent);
  font-size:12px;font-weight:500;
  border:1px solid rgba(var(--accent-rgb),0.2);
}
.topic-chip-sm{
  padding:2px 8px;border-radius:12px;
  background:rgba(var(--accent-rgb),0.06);
  color:var(--ink3);font-size:11px;
}
.memory-summary-insights{margin-bottom:12px;display:flex;flex-direction:column;gap:8px;}
.memory-insight-item{
  font-size:13px;color:var(--ink2);padding:10px 12px;
  background:rgba(255,255,255,0.4);
  border-left:3px solid var(--accent);border-radius:0 8px 8px 0;line-height:1.6;
}
body[data-theme="dark"] .memory-insight-item { background: rgba(255,255,255,0.05); }
.memory-growth{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;}
.growth-signal{
  font-size:12px;color:var(--accent);padding:6px 10px;
  background:var(--accent-light);border-radius:8px;
  border:1px solid rgba(var(--accent-rgb),0.2);
}
.memory-export-btn{
  display:inline-block;padding:8px 16px;border-radius:9px;
  background:rgba(255,255,255,0.5);
  border:1.5px solid var(--border-solid);
  color:var(--ink2);font-size:13px;cursor:pointer;
  font-family:inherit;transition: var(--transition);
}
body[data-theme="dark"] .memory-export-btn { background: rgba(255,255,255,0.06); }
.memory-export-btn:hover{border-color:var(--accent);color:var(--accent);}

.memory-reflect-card{
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-radius:16px;padding:20px;margin-bottom:16px;
  border:1px solid var(--border);
}
.memory-reflect-title{font-size:15px;font-weight:700;margin-bottom:12px;}
.memory-layer-select{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px;align-items:center;font-size:13px;color:var(--ink2);}
.layer-radio{display:flex;align-items:center;gap:4px;font-size:12px;cursor:pointer;color:var(--ink2);}
.layer-radio input{accent-color:var(--accent);}
.layer-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;white-space:nowrap;}
.memory-textarea{
  width:100%;padding:12px;border-radius:10px;
  border:1.5px solid var(--border-solid);
  font-size:14px;font-family:inherit;resize:vertical;min-height:100px;
  margin-bottom:10px;
  background: rgba(255,255,255,0.5);
  color: var(--ink);
  transition: var(--transition);
}
body[data-theme="dark"] .memory-textarea {
  background: rgba(255,255,255,0.05);
  color: var(--ink);
}
.memory-textarea::placeholder { color: var(--ink3); }
.memory-textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);}
.memory-btn-primary{
  padding:10px 20px;border-radius:9px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7c3aed));
  color:#fff;border:none;font-size:14px;font-weight:600;
  cursor:pointer;font-family:inherit;transition: var(--transition);
  box-shadow: 0 4px 12px rgba(var(--accent-rgb),0.3);
}
body[data-theme="dark"] .memory-btn-primary {
  background: linear-gradient(135deg, #2563eb, #4f46e5);
}
.memory-btn-primary:hover{opacity:.88;transform:translateY(-1px);}

.memory-timeline-title{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:12px;}
.memory-timeline{display:flex;flex-direction:column;gap:0;position:relative;}
.timeline-month-sep{font-size:12px;font-weight:700;color:var(--ink3);margin:16px 0 8px 28px;text-transform:uppercase;letter-spacing:.5px;}
.timeline-node{display:flex;gap:12px;margin-bottom:12px;position:relative;}
.timeline-node-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;margin-top:6px;border:2px solid var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.15);}
.timeline-node-card{
  flex:1;
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(8px);
  border-radius:12px;padding:14px 16px;
  border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
body[data-theme="dark"] .timeline-node-card { background: rgba(255,255,255,0.06); }
.timeline-node-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:6px;}
.timeline-node-type{font-size:11px;color:var(--ink3);}
.timeline-node-date{font-size:11px;color:var(--ink3);margin-left:auto;}
.timeline-node-title{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:5px;}
.timeline-node-delete{background:none;border:none;cursor:pointer;font-size:15px;color:var(--ink3);padding:0 2px;line-height:1;opacity:.5;transition:opacity .15s;}
.timeline-node-delete:hover{opacity:1;color:#e05;}
.timeline-node-topics{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px;}
.timeline-node-preview{font-size:13px;color:var(--ink2);line-height:1.6;}
.memory-empty{text-align:center;padding:60px 20px;color:var(--ink3);font-size:14px;}

/* ═══════ AI记忆助手 ═══════ */
.memory-ai-card{
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-radius:var(--radius);margin-bottom:20px;
  border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden;
}
.memory-ai-header{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border);gap:10px;}
.memory-ai-title{font-size:15px;font-weight:700;flex:1;}
.memory-ai-subtitle{font-size:12px;color:var(--ink3);}
.ai-chat-messages{
  height:220px;overflow-y:auto;padding:14px 16px;
  display:flex;flex-direction:column;gap:10px;
  background:rgba(var(--accent-rgb),0.03);
  scroll-behavior:smooth;
}
.ai-msg{display:flex;gap:8px;max-width:88%;}
.ai-msg-ai{align-self:flex-start;}
.ai-msg-user{align-self:flex-end;flex-direction:row-reverse;}
.ai-msg-avatar{font-size:18px;flex-shrink:0;line-height:1.6;}
.ai-msg-bubble{padding:9px 13px;border-radius:14px;font-size:13px;line-height:1.65;}
.ai-msg-ai .ai-msg-bubble{
  background:rgba(255,255,255,0.7);
  backdrop-filter: blur(8px);
  border:1px solid var(--border);
  border-top-left-radius:4px;color:var(--ink);
}
body[data-theme="dark"] .ai-msg-ai .ai-msg-bubble {
  background: rgba(255,255,255,0.07);
}
.ai-msg-user .ai-msg-bubble{
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 70%, #7c3aed));
  color:#fff;border-top-right-radius:4px;
}
body[data-theme="dark"] .ai-msg-user .ai-msg-bubble {
  background: linear-gradient(135deg, #2563eb, #4f46e5);
}
.ai-chat-input-area{
  padding:10px 12px;border-top:1px solid var(--border);
  display:flex;gap:8px;align-items:flex-end;
  background:rgba(255,255,255,0.5);
  backdrop-filter: blur(8px);
}
body[data-theme="dark"] .ai-chat-input-area { background: rgba(10,10,20,0.6); }
.ai-chat-input{
  flex:1;padding:9px 12px;border-radius:9px;
  border:1.5px solid var(--border-solid);
  font-size:14px;font-family:inherit;resize:none;
  min-height:40px;max-height:100px;outline:none;
  background: rgba(255,255,255,0.6);
  color: var(--ink);
  transition: var(--transition);line-height:1.5;
}
body[data-theme="dark"] .ai-chat-input {
  background: rgba(255,255,255,0.06);
  color: var(--ink);
}
.ai-chat-input::placeholder { color: var(--ink3); }
.ai-chat-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);}
.ai-chat-send{
  padding:9px 16px;border-radius:9px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7c3aed));
  color:#fff;border:none;font-size:14px;font-weight:600;
  cursor:pointer;flex-shrink:0;transition: var(--transition);
  align-self:flex-end;
  box-shadow: 0 2px 8px rgba(var(--accent-rgb),0.3);
}
body[data-theme="dark"] .ai-chat-send {
  background: linear-gradient(135deg, #2563eb, #4f46e5);
}
.ai-chat-send:hover{opacity:.88;transform:translateY(-1px);}
.ai-chat-send:disabled{opacity:.4;cursor:not-allowed;transform:none;}
.ai-chat-save-row{padding:8px 14px 14px;display:flex;gap:8px;flex-wrap:wrap;}
.ai-save-btn{
  padding:8px 16px;border-radius:9px;
  background:var(--accent-light);color:var(--accent);
  border:1px solid rgba(var(--accent-rgb),0.25);
  font-size:13px;font-weight:600;cursor:pointer;transition: var(--transition);
}
.ai-save-btn:hover{background:rgba(var(--accent-rgb),0.18);}
.ai-clear-btn{
  padding:8px 12px;border-radius:9px;
  background:rgba(var(--accent-rgb),0.05);
  color:var(--ink3);border:1px solid var(--border-solid);
  font-size:13px;cursor:pointer;transition: var(--transition);
}
.ai-clear-btn:hover{color:var(--ink);border-color:var(--ink3);}
.ai-typing{display:flex;gap:4px;align-items:center;padding:4px 0;}
.ai-typing span{width:6px;height:6px;border-radius:50%;background:var(--ink3);animation:aiTyping 1.2s infinite;}
.ai-typing span:nth-child(2){animation-delay:.2s;}
.ai-typing span:nth-child(3){animation-delay:.4s;}
@keyframes aiTyping{0%,60%,100%{opacity:.2;transform:translateY(0);}30%{opacity:1;transform:translateY(-4px);}}
.memory-section-header{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.memory-section-title{font-size:15px;font-weight:700;flex:1;}

/* ─── 暗色模式：输入框选项特殊处理 ─── */
body[data-theme="dark"] select option {
  background: #1a1a2e;
  color: #e2e8f0;
}

/* ─── 全局过渡动画 ─── */
body, .q-card, .auth-card, .user-card, .chat-panel,
.memory-summary-card, .memory-reflect-card, .memory-ai-card,
.timeline-node-card, .chat-page-header, .bottom-bar, #app-nav {
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

/* ─── 匹配权重偏好 ─── */
.wl-weight-bar {
  display: flex;
  height: 10px;
  border-radius: 6px;
  overflow: hidden;
  gap: 2px;
  margin-bottom: 10px;
}
.wl-weight-seg {
  border-radius: 3px;
  transition: width 0.35s ease;
  min-width: 2px;
}
.wl-weight-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.wl-weight-legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--ink2);
}
.wl-weight-legend-item b {
  color: var(--ink);
  font-weight: 600;
}
.wl-weight-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.wl-weight-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wl-weight-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.wl-weight-row-label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 13px;
  font-weight: 600;
}
.wl-weight-row-desc {
  font-size: 11px;
  color: var(--ink3);
  font-weight: 400;
}
.wl-weight-row-ctrl {
  display: flex;
  align-items: center;
  gap: 10px;
}
.wl-slider {
  flex: 1;
  height: 4px;
  cursor: pointer;
  border-radius: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: var(--border-solid);
}
.wl-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: currentColor;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
  border: 2px solid #fff;
}
body[data-theme="dark"] .wl-slider::-webkit-slider-thumb {
  border-color: #1a1a2e;
}
.wl-weight-val {
  width: 28px;
  text-align: right;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  flex-shrink: 0;
}

/* ── 权重排序列表 ── */
.wl-rank-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.wl-rank-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--surface2, #f5f5f5);
  cursor: grab;
  transition: background 0.15s, box-shadow 0.15s;
  user-select: none;
}
.wl-rank-item:active { cursor: grabbing; }
.wl-rank-item:hover { background: var(--accent-light, #f0ecff); }
.wl-rank-num {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--accent, #7c3aed);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wl-rank-arrows {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex-shrink: 0;
  line-height: 1;
}
.wl-rank-arrow {
  font-size: 10px;
  cursor: pointer;
  color: var(--ink3);
  padding: 0 2px;
  transition: color 0.15s;
}
.wl-rank-arrow:hover:not(.disabled) { color: var(--accent); }
.wl-rank-arrow.disabled { opacity: 0.25; pointer-events: none; }
.wl-rank-label {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.wl-rank-desc {
  font-size: 11px;
  color: var(--ink3);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wl-rank-pct {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  flex-shrink: 0;
  width: 32px;
  text-align: right;
}

/* ── 骰子自定义问题 ── */
.game-bottom-actions {
  display: flex;
  gap: 8px;
  margin-top: 6px;
}
.game-custom-btn {
  flex: 1;
  padding: 6px 10px;
  border: 1.5px dashed var(--accent, #7c3aed);
  background: transparent;
  color: var(--accent, #7c3aed);
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s;
}
.game-custom-btn:hover { background: var(--accent-light, #f0ecff); }
.game-custom-input {
  width: 100%;
  padding: 8px 10px;
  border: 1.5px solid var(--border-solid, #e0e0e0);
  border-radius: 8px;
  font-size: 13px;
  outline: none;
  background: var(--bg, #fff);
  color: var(--ink, #1a1a2e);
  box-sizing: border-box;
}
.game-custom-input:focus { border-color: var(--accent, #7c3aed); }
.game-custom-submit { margin-top: 6px; }

/* ══════════════════════════════════════
   应用导航栏 — 移动端底部 / 电脑端右上角
   ══════════════════════════════════════ */
#app-nav { display: none; }

/* 移动端：底部标签栏 */
@media (max-width: 767px) {
  #app-nav.visible {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 300;
    display: flex;
    flex-direction: row;
    background: rgba(255, 248, 240, 0.92);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid rgba(139,69,19,0.08);
    padding: 6px 0 8px;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }
  body[data-theme="dark"] #app-nav.visible {
    background: rgba(10,10,20,0.94);
    border-top-color: rgba(96,165,250,0.1);
  }
  .nav-tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    cursor: pointer;
    padding: 4px 0;
    border: none;
    background: none;
    font-family: inherit;
    color: var(--ink3);
    transition: color 0.2s;
    position: relative;
  }
  .nav-tab.active { color: var(--accent); }
  .nav-tab-icon { width: 22px; height: 22px; flex-shrink: 0; }
  .nav-tab-label { font-size: 10px; font-weight: 600; letter-spacing: 0.02em; }
  .nav-tab .nav-badge {
    position: absolute; top: 2px; left: 50%;
    transform: translateX(4px);
    min-width: 16px; height: 16px;
    background: var(--error); color: #fff;
    font-size: 10px; font-weight: 700;
    border-radius: 8px; padding: 0 3px;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
  }
  body[data-theme="dark"] .nav-tab .nav-badge { border-color: #0a0a14; }
  /* 底部底栏在移动端上移，避免被导航栏遮挡 */
  body.has-app-nav .bottom-bar { bottom: 60px; }
  body.has-app-nav .container { padding-bottom: 160px; }
  body.has-app-nav .chat-fab { bottom: 78px; }
  body.has-app-nav .chat-panel { bottom: 78px; }
  /* 聊天列表页：底部留出导航栏高度，避免最后一个聊天被遮挡 */
  body.has-app-nav .chat-page-list { padding-bottom: max(72px, calc(60px + env(safe-area-inset-bottom))); }
  body.has-app-nav .chat-page-empty { padding-bottom: max(72px, calc(60px + env(safe-area-inset-bottom))); }
}

/* 电脑端：给聊天页顶栏留出导航空间 */
@media (min-width: 768px) {
  body.has-app-nav .chat-page-header { padding-right: 200px; }
}

/* 电脑端：右上角胶囊 */
@media (min-width: 768px) {
  #app-nav.visible {
    position: fixed;
    top: 12px; right: 16px;
    z-index: 300;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2px;
    background: rgba(255, 248, 240, 0.88);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(139,69,19,0.08);
    border-radius: 14px;
    padding: 5px 8px;
    box-shadow: 0 4px 16px rgba(139,69,19,0.06);
  }
  body[data-theme="dark"] #app-nav.visible {
    background: rgba(22,22,38,0.85);
    border-color: rgba(96,165,250,0.1);
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  }
  .nav-tab {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    padding: 6px 12px;
    border: none;
    background: none;
    font-family: inherit;
    color: var(--ink2);
    font-size: 13px;
    font-weight: 500;
    border-radius: 10px;
    transition: var(--transition);
    position: relative;
    white-space: nowrap;
  }
  .nav-tab.active { color: var(--accent); position: relative; }
  .nav-tab.active::after {
    content: '';
    position: absolute;
    bottom: 2px; left: 50%; transform: translateX(-50%);
    width: 16px; height: 2.5px;
    background: var(--accent);
    border-radius: 2px;
  }
  .nav-tab:hover:not(.active) { color: var(--ink); }
  .nav-tab-icon { width: 18px; height: 18px; flex-shrink: 0; }
  .nav-tab-label { font-size: 13px; }
  .nav-tab .nav-badge {
    min-width: 16px; height: 16px;
    background: var(--error); color: #fff;
    font-size: 10px; font-weight: 700;
    border-radius: 8px; padding: 0 3px;
    display: flex; align-items: center; justify-content: center;
    margin-left: 2px;
  }
}

/* ─── iOS Safari 防止输入框聚焦时自动 zoom ─── */
/* iOS Safari 在 font-size < 16px 的输入框获得焦点时会自动放大页面。
   双重保险：viewport meta 设置 maximum-scale=1 + CSS font-size 兜底。 */
@supports (-webkit-touch-callout: none) {
  input, textarea, select,
  .field input, .field select,
  .text-input,
  .chat-input-bar input,
  .chat-input-bar textarea, textarea.chat-input-ta,
  .memory-reflect-input,
  .memory-textarea,
  .ai-chat-input,
  #reply-timeout-select,
  #notif-email-input,
  #inp-email, #inp-password, #inp-code, #inp-captcha, #inp-invite,
  #edit-nickname, #edit-name, #edit-grade, #edit-major, #edit-gender,
  #edit-new-password, #edit-confirm-password,
  .thought-compose-textarea,
  #compose-thought-text, #edit-thought-text {
    font-size: 16px !important;
  }
}

/* ─── 新增：开局问题选择器 & 聊天菜单 ─── */
@keyframes slideUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

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

.chat-more-btn {
  background: none;
  border: none;
  color: inherit;
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  transition: background 0.2s;
}

.chat-more-btn:hover {
  background: rgba(0, 0, 0, 0.1);
}

body[data-theme="dark"] .chat-more-btn:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* ══════════ 用户数绿点脉冲 ══════════ */
.user-count-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--ink2);
}
.user-count-live .count-number {
  font-weight: 700;
  color: var(--ink);
}
.user-count-live .live-dot {
  width: 7px;
  height: 7px;
  background: #22c55e;
  border-radius: 50%;
  display: inline-block;
  animation: livePulse 2s ease-in-out infinite;
}
@keyframes livePulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(34,197,94,.5); }
  50% { opacity: .7; box-shadow: 0 0 0 5px rgba(34,197,94,0); }
}

/* ══════════ 滚动通知栏 ══════════ */
.announcement-bar {
  width: 100%;
  background: linear-gradient(90deg, #fffbe6 0%, #fff7cc 100%);
  border-bottom: 1px solid #f0e6b8;
  overflow: hidden;
  height: 32px;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 100;
}
body[data-theme="dark"] .announcement-bar {
  background: linear-gradient(90deg, #2a2518 0%, #302a1a 100%);
  border-bottom-color: #4a4030;
}
.announcement-bar .announce-icon {
  flex-shrink: 0;
  padding: 0 10px;
  font-size: 14px;
  color: #d97706;
}
body[data-theme="dark"] .announcement-bar .announce-icon {
  color: #fbbf24;
}
.announcement-bar .announce-scroll {
  flex: 1;
  overflow: hidden;
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}
.announcement-bar .announce-track {
  display: inline-block;
  white-space: nowrap;
  animation: announceScroll var(--scroll-duration, 20s) linear infinite;
  font-size: 13px;
  color: #92400e;
  line-height: 32px;
}
body[data-theme="dark"] .announcement-bar .announce-track {
  color: #fcd34d;
}
.announcement-bar .announce-track .announce-item {
  display: inline;
  padding-right: 80px;
}
@keyframes announceScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ═══════ 页面进入动画 ═══════ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.center-wrap .auth-card{animation:fadeUp 0.4s ease-out;}
.container{animation:fadeUp 0.35s ease-out;}
.chat-page{animation:fadeUp 0.3s ease-out;}

/* ═══════ 记忆板块 — 匹配记忆卡片（v2 重设计） ═══════ */
.memories-page { padding: 0 0 24px; }
.memories-header { text-align: center; padding: 24px 16px 12px; }
.memories-header-title { font-size: 18px; font-weight: 600; color: var(--ink); letter-spacing: 0.04em; }
.memories-header-sub { font-size: 13px; color: var(--ink3); margin-top: 6px; line-height: 1.6; }

.memories-loading { text-align: center; padding: 60px 0; color: var(--ink3); font-size: 14px; }
.memories-loading-icon { font-size: 32px; margin-bottom: 12px; animation: pulse 1.5s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.6;transform:scale(1.1)} }

.memories-empty { text-align: center; padding: 80px 24px; }
.memories-empty-icon { font-size: 40px; margin-bottom: 16px; opacity: 0.8; }
.memories-empty-text { font-size: 15px; color: var(--ink2); line-height: 1.8; }

/* 时间线容器 */
.memories-timeline {
  position: relative;
  padding: 8px 16px 0;
}
.memories-timeline::before {
  content: '';
  position: absolute;
  left: 27px;
  top: 0;
  bottom: 0;
  width: 1.5px;
  background: linear-gradient(to bottom, rgba(var(--accent-rgb), 0.25), rgba(var(--accent-rgb), 0.05));
}

/* ── 单张记忆卡片 ── */
.memory-card {
  position: relative;
  margin-left: 28px;
  margin-bottom: 20px;
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border-solid);
  border-radius: 20px;
  overflow: hidden;
  animation: fadeUp 0.5s cubic-bezier(0.23, 1, 0.32, 1) backwards;
  animation-delay: calc(var(--card-index) * 0.06s);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}
.memory-card:hover {
  box-shadow: 0 8px 28px rgba(var(--accent-rgb), 0.10), 0 2px 8px rgba(0,0,0,0.04);
  transform: translateY(-1px);
}

/* 时间线节点圆点 */
.memory-card::before {
  content: '';
  position: absolute;
  left: -19px;
  top: 26px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  border: 2px solid var(--card-solid);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.15);
  z-index: 1;
}

/* 卡片顶部渐变装饰条 */
.memory-card-accent-bar {
  height: 3px;
  background: linear-gradient(90deg,
    rgba(var(--accent-rgb), 0.6),
    rgba(var(--accent-rgb), 0.15) 60%,
    transparent);
}

/* Header */
.memory-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 20px 0;
  cursor: pointer;
  user-select: none;
}
.memory-card-header:active { opacity: 0.7; }
.memory-card-header-right { display: flex; align-items: center; gap: 8px; }
.memory-card-round {
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 0.06em;
}
.memory-card-date { font-size: 11px; color: var(--ink3); letter-spacing: 0.02em; }
.memory-card-arrow {
  font-size: 10px;
  color: var(--ink3);
  transition: transform 0.25s ease;
}
.memory-card.collapsed .memory-card-arrow { transform: rotate(180deg); }

/* ── Hero 区域 —— 情感核心 ── */
.memory-card-hero {
  padding: 16px 20px 14px;
  cursor: pointer;
  user-select: none;
}
.memory-card-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: 0.06em;
  line-height: 1.4;
}
.memory-card-poem {
  font-size: 13px;
  color: var(--ink3);
  margin-top: 6px;
  font-style: italic;
  letter-spacing: 0.03em;
  line-height: 1.6;
}

/* 折叠状态 */
.memory-card.collapsed .memory-card-body,
.memory-card.collapsed .memory-card-footer { display: none; }
.memory-card.collapsed .memory-card-hero { padding-bottom: 16px; }
.memory-card-peek {
  font-size: 12px;
  color: var(--ink3);
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ── Body ── */
.memory-card-body { padding: 0 20px 8px; }

/* 对方信息 — 更紧凑 */
.memory-card-peer {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid rgba(var(--accent-rgb), 0.06);
}
.memory-card-avatar {
  width: 36px; height: 36px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.15), rgba(var(--accent-rgb), 0.05));
  color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700;
  flex-shrink: 0;
}
.memory-card-peer-info { flex: 1; display: flex; align-items: baseline; gap: 8px; }
.memory-card-name { font-size: 14px; font-weight: 600; color: var(--ink); }
.memory-card-gender { font-size: 12px; color: var(--ink3); margin-left: 2px; }
.memory-card-score-inline {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink3);
  margin-left: auto;
}

/* 共鸣指示器 — 圆弧替代进度条 */
.memory-card-score-ring {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0 14px;
}
.memory-card-score-ring svg {
  width: 44px; height: 44px;
  flex-shrink: 0;
}
.memory-card-score-ring .ring-bg {
  fill: none;
  stroke: rgba(var(--accent-rgb), 0.1);
  stroke-width: 3;
}
.memory-card-score-ring .ring-fill {
  fill: none;
  stroke: var(--accent);
  stroke-width: 3;
  stroke-linecap: round;
  transition: stroke-dashoffset 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.memory-card-score-num {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
}
.memory-card-score-label {
  font-size: 13px;
  color: var(--ink2);
  line-height: 1.5;
}

/* 旧的分数条 — 保留向后兼容 */
.memory-card-score-bar-full { display: none; }
.memory-card-score-fill { display: none; }

/* 独特共鸣 */
.memory-card-resonance {
  margin: 4px 0 16px;
  padding: 14px 16px;
  background: rgba(var(--accent-rgb), 0.03);
  border-radius: 14px;
}
.memory-resonance-title {
  font-size: 11px;
  font-weight: 600;
  color: var(--ink3);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 10px;
}
.memory-resonance-item {
  font-size: 13px;
  color: var(--ink2);
  line-height: 1.8;
  margin-bottom: 4px;
  padding-left: 14px;
  position: relative;
}
.memory-resonance-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(var(--accent-rgb), 0.4);
}
.memory-resonance-item:last-child { margin-bottom: 0; }

/* 维度标签 — 更柔和 */
.memory-card-dims {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px 0 12px;
}
.memory-dim-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(var(--accent-rgb), 0.05);
  border-radius: 8px;
  padding: 4px 10px;
  font-size: 11px;
}
.memory-dim-label { color: var(--ink2); }
.memory-dim-score { color: var(--accent); font-weight: 600; font-size: 11px; }

/* 对话统计 — 淡化为辅助信息 */
.memory-card-stats {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 0 4px;
  font-size: 12px;
  color: var(--ink3);
}
.memory-stat-num { font-weight: 600; color: var(--ink2); margin-right: 1px; }
.memory-stat-sep { color: var(--ink3); margin: 0 4px; opacity: 0.5; }

/* 骰子问答 */
.memory-card-dice {
  margin: 8px 0 12px;
  padding: 10px 14px;
  background: rgba(var(--accent-rgb), 0.03);
  border-radius: 12px;
}
.memory-dice-title { font-size: 11px; font-weight: 600; color: var(--ink3); margin-bottom: 8px; letter-spacing: 0.04em; }
.memory-dice-item {
  font-size: 13px; color: var(--ink2);
  padding: 5px 0;
  border-bottom: 1px solid rgba(var(--accent-rgb), 0.05);
  line-height: 1.5;
}
.memory-dice-item:last-child { border-bottom: none; }

/* 话题标签 */
.memory-card-topics { margin-bottom: 4px; }
.memory-topics-title { font-size: 11px; font-weight: 600; color: var(--ink3); margin-bottom: 8px; letter-spacing: 0.04em; }
.memory-topics-list { display: flex; flex-wrap: wrap; gap: 6px; }
.memory-topic-tag {
  font-size: 11px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.06);
  padding: 3px 10px;
  border-radius: 8px;
  white-space: nowrap;
}

/* ── 卡片底部 ── */
.memory-card-footer {
  padding: 0 20px 16px;
}
.memory-card-sentence {
  text-align: center;
  font-size: 13px;
  color: var(--ink2);
  font-style: italic;
  padding: 10px 4px 10px;
  line-height: 1.6;
  letter-spacing: 0.02em;
}
.memory-card-footer-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid rgba(var(--accent-rgb), 0.06);
}
.memory-card-footer-actions .btn {
  font-size: 12px;
}
.memory-card-watermark {
  font-size: 10px;
  color: var(--ink3);
  opacity: 0.4;
  letter-spacing: 0.04em;
  font-family: monospace;
  margin-left: auto;
}

/* 时间线末尾 */
.memories-timeline-end {
  text-align: center;
  padding: 40px 0 48px;
  position: relative;
}
.memories-timeline-end-icon { font-size: 20px; margin-bottom: 8px; opacity: 0.7; }

/* 底部诗歌 */
.memories-poem {
  margin-top: 36px;
  padding: 28px 24px;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.03), transparent);
  border-radius: 16px;
  font-family: "Noto Serif SC", "Songti SC", "STSong", serif;
  font-size: 14px;
  line-height: 2.2;
  color: var(--ink3);
  letter-spacing: 0.12em;
}
.memories-poem p { margin: 0; }
.memories-poem-author {
  margin-top: 16px;
  font-size: 12px;
  color: var(--ink3);
  opacity: 0.7;
  letter-spacing: 0.06em;
  font-family: -apple-system, "Noto Sans SC", sans-serif;
}
.memories-timeline-end-text { font-size: 13px; color: var(--ink3); font-style: italic; }

/* 记忆页面动画 */
.memories-page { animation: fadeUp 0.35s ease-out; }

/* 记忆卡片删除按钮 */
.memory-card-delete-btn {
  color: var(--ink3) !important;
  font-size: 12px !important;
  opacity: 0.4;
  transition: opacity 0.2s, color 0.2s;
}
.memory-card-delete-btn:hover { opacity: 0.8; }

/* 桌面端适配 */
@media (min-width: 768px) {
  .memories-timeline { max-width: 520px; margin: 0 auto; }
  .memories-timeline::before { left: 27px; }
}

/* ══════════════════════════════════════
   聊天页记忆卡片横幅
   ══════════════════════════════════════ */
.chat-memory-banner {
  background: var(--card);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  overflow: hidden;
  flex-shrink: 0;
}
.chat-memory-banner-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  cursor: pointer;
  user-select: none;
}
.chat-memory-banner-toggle:active { opacity: 0.7; }
.chat-memory-banner-icon { font-size: 14px; }
.chat-memory-banner-title {
  font-weight: 600;
  color: var(--accent);
  flex-shrink: 0;
}
.chat-memory-banner-poem {
  color: var(--ink3);
  font-size: 12px;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chat-memory-banner-arrow {
  font-size: 10px;
  color: var(--ink3);
  flex-shrink: 0;
}
.chat-memory-banner-body {
  padding: 0 16px 12px;
  animation: fadeUp 0.2s ease-out;
}
.chat-memory-resonance-item {
  color: var(--ink2);
  font-size: 12px;
  line-height: 1.6;
  padding: 2px 0;
}
.chat-memory-sentence {
  margin-top: 8px;
  font-size: 12px;
  color: var(--accent);
  font-style: italic;
  text-align: right;
}
.chat-info-section {
  margin-bottom: 10px;
}
.chat-info-section:last-child {
  margin-bottom: 0;
}
.chat-info-label {
  font-size: 11px;
  color: var(--ink3);
  margin-bottom: 4px;
  font-weight: 600;
}
.chat-info-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.common-goal-chip {
  font-size: 11px;
  padding: 2px 10px;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  white-space: nowrap;
  line-height: 1.6;
}

/* ═══════ 想法（共享思绪） ═══════ */
/* ═══════ 「我」页面 ═══════ */
.me-profile-card {
  display: flex; align-items: center; gap: 14px;
  padding: 20px 16px; margin: 6px 16px 12px;
  background: var(--card); backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  cursor: default;
}

.me-avatar {
  width: 140px; height: 140px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: 700; flex-shrink: 0; cursor: pointer;
  overflow: hidden;
}
.me-profile-info { flex: 1; min-width: 0; }
.me-name {
  font-size: 18px; font-weight: 600; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  cursor: pointer;
}
.me-name:active { opacity: 0.7; }
.me-email {
  font-size: 12px; color: var(--ink3); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.me-chips {
  display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap;
}
.me-chip {
  font-size: 11px; padding: 2px 8px; border-radius: 8px;
  background: var(--accent-light); color: var(--accent);
}
.me-arrow {
  width: 20px; height: 20px; color: var(--ink3); flex-shrink: 0;
}

/* ── 个人资料编辑页 ── */
.profile-edit-body {
  padding: 0 16px 40px;
}
.profile-edit-section {
  background: var(--card); backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 16px; margin-bottom: 12px;
}
.profile-edit-section-title {
  font-size: 12px; font-weight: 700; color: var(--accent);
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-bottom: 14px;
}
.profile-edit-row {
  display: flex; gap: 10px;
}
.profile-edit-textarea {
  width: 100%; padding: 11px 14px; border-radius: 12px;
  border: 1.5px solid var(--border-solid);
  font-size: 14px; font-family: inherit; line-height: 1.5;
  background: rgba(255,255,255,0.6); color: var(--ink);
  resize: vertical; min-height: 72px;
  transition: var(--transition);
}
body[data-theme="dark"] .profile-edit-textarea {
  background: rgba(255,255,255,0.05); color: var(--ink);
}
.profile-edit-textarea::placeholder { color: var(--ink3); }
.profile-edit-textarea:focus {
  outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
  background: rgba(255,255,255,0.85);
}
body[data-theme="dark"] .profile-edit-textarea:focus {
  background: rgba(255,255,255,0.08);
}
.profile-save-btn {
  background: var(--accent); color: #fff;
  border: none; border-radius: 8px;
  padding: 6px 16px; font-size: 14px; font-weight: 600;
  cursor: pointer; font-family: inherit;
  transition: var(--transition);
}
.profile-save-btn:disabled { opacity: 0.5; cursor: default; }
.profile-save-btn:not(:disabled):hover { opacity: 0.88; }
.required-star { color: var(--error); margin-left: 2px; }
.field-hint-inline { font-size: 12px; color: var(--ink3); margin-left: 4px; font-weight: 400; }
.me-motto {
  font-size: 12px; color: var(--ink3); margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.page-title {
  font-size: 16px; font-weight: 600; color: var(--ink);
}

/* ── 头像裁剪器 ── */
.avatar-crop-overlay {
  position: fixed; inset: 0; background: #111;
  z-index: 10000; display: flex; flex-direction: column;
}
.avatar-crop-bar {
  display: flex; align-items: center; justify-content: space-between;
  height: 52px; padding: 0 16px; flex-shrink: 0;
  background: rgba(0,0,0,0.75); border-bottom: 1px solid rgba(255,255,255,0.08);
}
.avatar-crop-title { font-size: 15px; font-weight: 600; color: #fff; }
.avatar-crop-btn {
  background: none; border: none; cursor: pointer;
  font-size: 15px; color: rgba(255,255,255,0.65); padding: 8px 4px;
  font-family: inherit; transition: color 0.15s;
}
.avatar-crop-btn:hover { color: #fff; }
.avatar-crop-btn.avatar-crop-confirm { color: var(--accent); font-weight: 700; }
.avatar-crop-btn.avatar-crop-confirm:disabled { opacity: 0.5; cursor: default; }
.avatar-crop-stage {
  flex: 1; display: flex; align-items: center; justify-content: center;
  overflow: hidden; background: #000;
}
.avatar-crop-stage canvas { display: block; touch-action: none; cursor: grab; }
.avatar-crop-stage canvas:active { cursor: grabbing; }
.avatar-crop-hint {
  text-align: center; color: rgba(255,255,255,0.38);
  font-size: 12px; padding: 12px 0 20px; flex-shrink: 0; margin: 0;
}

/* 菜单组 */
.me-menu-group {
  margin: 0 16px 12px;
  background: var(--card); backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); overflow: hidden;
}
.me-menu-item {
  display: flex; align-items: center; gap: 14px;
  padding: 15px 16px; cursor: pointer;
  transition: var(--transition);
  border-bottom: 1px solid var(--border);
}
.me-menu-item:last-child { border-bottom: none; }
.me-menu-item:active { background: var(--accent-light); }
.me-menu-icon {
  width: 22px; height: 22px; color: var(--accent); flex-shrink: 0;
}
/* 航线朋友圈彩色镜头快门 icon — 多色 fill 不走 currentColor */
.me-menu-icon--moments { color: inherit; }

/* ── 通用图片编辑器 (image_editor.js) ── */
.mf-imgedit-overlay {
  position: fixed; inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.92);
  display: flex; flex-direction: column;
  color: #fff;
  user-select: none; -webkit-user-select: none;
  touch-action: none;
}
.mf-imgedit-bar {
  height: 52px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 14px; flex-shrink: 0;
}
.mf-imgedit-btn {
  background: none; border: none; color: #fff;
  font-size: 15px; padding: 8px 12px; cursor: pointer;
  border-radius: 6px; font-family: inherit;
}
.mf-imgedit-btn:hover { background: rgba(255, 255, 255, 0.08); }
.mf-imgedit-confirm { color: #ffd84a; font-weight: 600; }
.mf-imgedit-title { font-size: 16px; font-weight: 500; }
.mf-imgedit-stage {
  flex: 1; min-height: 0;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.mf-imgedit-stage canvas {
  width: 100%; height: 100%;
  display: block;
  touch-action: none;
}
.mf-imgedit-toolbar {
  height: 64px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; gap: 14px;
  padding: 0 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.mf-imgedit-tool {
  background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff; padding: 7px 16px; border-radius: 18px; font-size: 13px;
  cursor: pointer; font-family: inherit;
}
.mf-imgedit-tool:hover { background: rgba(255, 255, 255, 0.18); }
.mf-imgedit-hint {
  font-size: 11.5px; color: rgba(255, 255, 255, 0.55);
}
@media (max-width: 480px) {
  .mf-imgedit-hint { display: none; }
}

/* ── 单张图保留照片自身比例 (4 处共用约定) ──
   航线 / 朋友圈 / 谜题 / 广告 在只有 1 张图时,把容器和 img 解锁成自然比例 + max-height,
   保留照片原始的长方形;多张图仍走原本的网格/方块缩略图。 */
.flight-images--single,
.hf-moment-images--single,
.puzzle-card-images--single,
.biz-ad-images--single {
  display: block;
  margin-top: 6px;
}
.flight-image--single,
.hf-moment-images--single img,
.puzzle-card-images--single img,
.biz-ad-images--single img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 380px;
  aspect-ratio: auto;
  object-fit: contain;
  border-radius: 10px;
  display: block;
  cursor: pointer;
  background: transparent;
}
.me-menu-label {
  flex: 1; font-size: 15px; color: var(--ink);
}
.me-arrow-sm {
  width: 16px; height: 16px; color: var(--ink3); flex-shrink: 0;
}

/* 返回按钮 */
.me-back-btn {
  background: none; border: none; padding: 4px;
  cursor: pointer; color: var(--ink); display: flex;
  align-items: center; justify-content: center;
}
.me-back-btn svg { width: 22px; height: 22px; }

/* ── 子 Tab 切换栏 ── */
.flight-sub-tabs {
  display: flex; gap: 0; padding: 0 16px; margin-bottom: 4px;
}
.flight-sub-tab {
  flex: 1; padding: 10px 0; border: none;
  background: none; color: var(--ink3); font-size: 15px;
  font-weight: 500; cursor: pointer; position: relative;
  transition: var(--transition); text-align: center;
}
.flight-sub-tab.active {
  color: var(--accent); font-weight: 600;
}
.flight-sub-tab.active::after {
  content: ''; position: absolute; bottom: 0; left: 25%; right: 25%;
  height: 2.5px; background: var(--accent); border-radius: 2px;
}

.flight-page { padding: 0 0 24px; }
.flight-header { text-align: center; padding: 12px 0 4px; }
.flight-header-title { font-size: 14px; color: var(--ink3); }

/* ── Waver 入口卡片 ── */
.waver-entry-card {
  display: flex; align-items: center; gap: 14px;
  margin: 8px 16px 0; padding: 14px 16px;
  background: linear-gradient(135deg, var(--card) 0%, color-mix(in srgb, var(--accent) 8%, var(--card)) 100%);
  border: 1.5px solid color-mix(in srgb, var(--accent) 20%, var(--border-solid));
  border-radius: var(--radius);
  cursor: pointer; transition: var(--transition);
}
.waver-entry-card:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 12px color-mix(in srgb, var(--accent) 12%, transparent);
}
.waver-entry-card:active { transform: scale(0.98); }
.waver-entry-avatar {
  width: 44px; height: 44px; border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 12%, var(--card));
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.waver-entry-avatar .ai-persona-svg {
  width: 26px; height: 26px; color: var(--accent);
}
.waver-entry-body { flex: 1; min-width: 0; }
.waver-entry-title {
  font-size: 15px; font-weight: 600; color: var(--ink);
  margin-bottom: 2px;
}
.waver-entry-desc {
  font-size: 13px; color: var(--ink3); line-height: 1.4;
}
.waver-entry-arrow {
  width: 18px; height: 18px; color: var(--ink3);
  flex-shrink: 0;
}

.flight-compose-bar {
  display: flex; gap: 10px; padding: 10px 16px 4px;
  justify-content: center;
}
.flight-compose-btn {
  flex: 1; padding: 10px 0; border: 1.5px solid var(--border-solid);
  border-radius: var(--radius); background: var(--card);
  backdrop-filter: var(--glass-blur); font-size: 14px;
  color: var(--ink); cursor: pointer; transition: var(--transition);
  text-align: center;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.flight-btn-icon {
  width: 16px; height: 16px; vertical-align: middle;
  color: var(--accent); flex-shrink: 0;
}
.flight-compose-btn:hover {
  border-color: var(--accent); color: var(--accent);
}

.profile-compose-btn {
  padding: 6px 12px;
  border: 1.5px solid var(--border-solid);
  border-radius: var(--radius);
  background: var(--card);
  backdrop-filter: var(--glass-blur);
  font-size: 13px;
  color: var(--ink);
  cursor: pointer;
  transition: var(--transition);
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto;
  margin-left: auto;
}

.profile-btn-icon {
  width: 16px; height: 16px; vertical-align: middle;
  color: var(--accent); flex-shrink: 0;
}

.profile-compose-btn:hover {
  border-color: var(--accent); color: var(--accent);
}

.flight-empty {
  text-align: center; padding: 48px 16px; color: var(--ink3);
}
.flight-empty-icon { font-size: 36px; margin-bottom: 12px; }
.flight-empty-text { font-size: 15px; line-height: 1.6; }

.flight-loading {
  text-align: center; padding: 48px 16px; color: var(--ink3);
}
.flight-loading-icon { font-size: 28px; margin-bottom: 8px; }

.flight-load-more {
  text-align: center; padding: 16px;
}
.flight-load-more button {
  padding: 8px 24px; border: 1px solid var(--border-solid);
  border-radius: var(--radius); background: var(--card);
  color: var(--ink2); cursor: pointer; font-size: 13px;
}

/* ── 航线卡片 ── */
.flight-card {
  margin: 12px 16px;
  background: var(--card); backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); overflow: hidden;
}
.flight-ticket-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; background: var(--accent-light);
  border-bottom: 1px solid var(--border);
  font-size: 13px; font-weight: 600;
}
.flight-ticket-dest {
  display: flex; align-items: center; gap: 4px;
  flex: 1; color: var(--ink);
}
.flight-ticket-time { color: var(--accent); font-weight: 700; }
.flight-ticket-seats { color: var(--ink2); font-size: 12px; white-space: nowrap; }
.flight-members-row {
  display: flex; align-items: center; gap: 5px;
  padding: 6px 14px; font-size: 12px; color: var(--ink2);
  border-bottom: 1px solid var(--border);
}
.flight-card-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px 6px; font-size: 13px;
}
.flight-author { font-weight: 600; color: var(--ink); }
.flight-vis-tag {
  font-size: 11px; padding: 1px 8px; border-radius: 8px;
  background: var(--bg); color: var(--ink3);
}
.flight-time { margin-left: auto; color: var(--ink3); font-size: 12px; }
.flight-delete-btn, .flight-edit-btn, .flight-complete-btn {
  background: none; border: none; color: var(--ink3);
  cursor: pointer; font-size: 13px; padding: 4px 8px;
  border-radius: 6px; transition: background 0.15s;
}
.flight-delete-btn:hover { color: var(--error); background: var(--hover); }
.flight-edit-btn:hover { color: var(--accent); background: var(--hover); }
.flight-complete-btn:hover { color: #0e7a45; background: var(--hover); }

/* ── 航线朋友圈"墙"顶部 (头像 + 背景 + 姓名 + 个性签名) ── */
.hf-wall-container { position: relative; padding-top: 0 !important; }
.hf-wall-header {
  position: relative; width: 100%; margin-bottom: 64px;
}
.hf-wall-banner {
  width: 100%; aspect-ratio: 16/9; max-height: 340px;
  background-color: #555;
  position: relative;
}
.hf-wall-edit-bg {
  /* 放在右上角,避免与右下角的头像重叠 */
  position: absolute; right: 12px; top: 12px;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 10px; border-radius: 14px;
  background: rgba(0, 0, 0, 0.55); border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff; font-size: 12px; cursor: pointer; font-family: inherit;
}
.hf-wall-edit-bg:hover { background: rgba(0, 0, 0, 0.75); }
.hf-wall-id-row {
  position: absolute; left: 16px; right: 16px; bottom: -58px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 12px;
}
.hf-wall-id-text {
  flex: 1; min-width: 0; padding-bottom: 6px;
  text-align: right;
}
.hf-wall-name {
  font-size: 18px; font-weight: 600;
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hf-wall-motto {
  font-size: 12.5px; margin-top: 4px;
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hf-wall-avatar {
  /* 圆形 — 比"我的"页面略大,突出墙主身份 */
  width: 90px; height: 90px; border-radius: 50%;
  border: 3px solid #fff;
  overflow: hidden; flex-shrink: 0;
  background: #fff;        /* 明确不透明,避免背景墙透过来 */
  opacity: 1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.hf-wall-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 1; }
.hf-wall-avatar-fallback { border-radius: 50%; }
.hf-wall-avatar-fallback {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%;
  background: var(--accent-light, #eef0ff); color: var(--accent);
  font-size: 36px; font-weight: 600;
}
.hf-wall-loading { padding: 40px 20px; text-align: center; color: var(--ink3); }
.hf-wall-topbar {
  position: absolute; top: 8px; left: 8px; z-index: 2;
}
.hf-wall-back {
  width: 36px; height: 36px; border-radius: 50%;
  border: none; cursor: pointer;
  background: rgba(0, 0, 0, 0.42); color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.hf-wall-back:hover { background: rgba(0, 0, 0, 0.65); }
.hf-wall-back svg { width: 20px; height: 20px; }
.hf-wall-limit-banner {
  margin: 12px 12px 14px;
  padding: 9px 12px; border-radius: 8px;
  background: var(--accent-light, #eef0ff); color: var(--ink2);
  font-size: 12.5px; line-height: 1.55;
}

/* iOS 风开关 — 用于"陌生人可看 10 条朋友圈"等设置项 */
.me-switch {
  position: relative; display: inline-block;
  width: 46px; height: 26px; flex-shrink: 0;
}
.me-switch input { opacity: 0; width: 0; height: 0; }
.me-switch-slider {
  position: absolute; inset: 0; cursor: pointer;
  background: #d4d4dc; border-radius: 26px;
  transition: 0.18s;
}
.me-switch-slider::before {
  content: ""; position: absolute;
  width: 22px; height: 22px; left: 2px; bottom: 2px;
  background: #fff; border-radius: 50%;
  transition: 0.18s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
}
.me-switch input:checked + .me-switch-slider { background: var(--accent); }
.me-switch input:checked + .me-switch-slider::before { transform: translateX(20px); }

/* ── 历史航线页面 ── */
.hf-card {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 16px; margin: 10px 12px;
}
.hf-card-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 8px;
  margin-bottom: 6px; flex-wrap: wrap;
}
.hf-dest { font-size: 16px; font-weight: 600; color: var(--ink); }
.hf-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hf-time-label { font-size: 12px; color: var(--ink3); }
.hf-completed-badge {
  font-size: 11px; padding: 2px 0;
  background: transparent; color: var(--ink3);
}
.hf-content { font-size: 14px; color: var(--ink); margin: 4px 0 8px; line-height: 1.55; }
.hf-members-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.hf-member-chip {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--bg); border-radius: 999px; padding: 2px 8px 2px 2px;
}
.hf-member-fallback {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--accent-light, #eef0ff); color: var(--accent); font-size: 11px; font-weight: 600;
}
.hf-member-name { font-size: 12px; color: var(--ink2); }
.hf-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.hf-action-btn {
  background: none; border: 1px solid var(--line); color: var(--ink2);
  cursor: pointer; font-size: 13px; padding: 5px 12px;
  border-radius: 6px; transition: all 0.15s;
}
.hf-action-btn:hover { background: var(--hover); color: var(--ink); }
.hf-action-btn--primary {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.hf-action-btn--primary:hover { opacity: 0.92; color: #fff; background: var(--accent); }

.hf-moments-section {
  margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line);
}
.hf-moments-section-title {
  font-size: 12px; color: var(--ink3); margin-bottom: 8px;
}
.hf-moment-card {
  background: var(--bg); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px;
}
.hf-moment-card:last-child { margin-bottom: 0; }
.hf-moment-card--orphan {
  background: var(--card); border: 1px solid var(--line);
  margin: 10px 12px;
}
.hf-moment-meta { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; flex-wrap: wrap; }

/* 置顶徽标 — 微信朋友圈风格 */
.hf-pin-badge {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 1px 7px; border-radius: 9px;
  background: #ffeede; color: #b45309;
  font-size: 11px; font-weight: 500;
  margin-left: auto;
}
.hf-pin-badge svg { transform: rotate(45deg); }
.hf-moment-card--pinned {
  /* 置顶不再有橘色左边框,样式与普通航线朋友圈一致 */
}
.hf-moment-date { font-size: 11px; color: var(--ink3); }
.hf-moment-vis { font-size: 11px; color: var(--ink3); }
.hf-moment-content {
  font-size: 14px; color: var(--ink); line-height: 1.55;
  white-space: pre-wrap; word-break: break-word; margin-bottom: 6px;
}
.hf-moment-images {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px;
  margin-bottom: 6px;
}
.hf-moment-images img {
  width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; cursor: pointer;
}
.hf-moment-actions { display: flex; gap: 6px; }
.hf-mini-action {
  background: none; border: none; color: var(--ink3);
  cursor: pointer; font-size: 12px; padding: 2px 6px; border-radius: 4px;
}
.hf-mini-action:hover { color: var(--ink); background: var(--hover); }
.hf-mini-action--delete { color: var(--ink3); }
.hf-mini-action--delete:hover { color: var(--ink); background: var(--hover); }

/* compose modal 内的图片网格 */
.hf-mc-thumb {
  position: relative; width: 70px; height: 70px;
  border-radius: 8px; overflow: hidden;
}
.hf-mc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.hf-mc-thumb-x {
  position: absolute; top: 2px; right: 2px;
  width: 20px; height: 20px; border-radius: 50%; border: none;
  background: rgba(0, 0, 0, 0.6); color: #fff; font-size: 14px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.hf-mc-add {
  width: 70px; height: 70px; border-radius: 8px;
  border: 2px dashed var(--line); background: none; color: var(--ink3);
  font-size: 28px; line-height: 1; cursor: pointer;
}
.hf-mc-add:hover { border-color: var(--accent); color: var(--accent); }
.flight-owner-actions {
  margin-left: auto; display: flex; align-items: center; gap: 2px;
}
.flight-content {
  padding: 4px 14px 10px; font-size: 15px; line-height: 1.7;
  color: var(--ink); word-break: break-word;
}
.flight-images { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 14px 10px; }
.flight-image { width: 100px; height: 100px; object-fit: cover; border-radius: 8px; cursor: pointer; }
.flight-actions {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-top: 1px solid var(--border);
}
.flight-action-btn {
  display: flex; align-items: center; gap: 4px;
  background: none; border: none; color: var(--ink2);
  cursor: pointer; font-size: 13px; padding: 4px 8px;
  border-radius: 6px; transition: background 0.15s;
}
.flight-action-btn:hover { background: var(--hover); }
.flight-action-btn.active { color: var(--accent); }
.flight-join-badge {
  margin-left: auto; font-size: 12px; padding: 4px 10px;
  border-radius: 12px;
}
.flight-join-badge--on { background: transparent; color: #7399C6; padding-left: 0; padding-right: 0; }
.flight-join-badge--pending { background: var(--bg); color: var(--ink3); }
.flight-join-badge--rejected { background: #fee2e2; color: #dc2626; }
.flight-join-badge--full { background: var(--bg); color: var(--ink3); }
.flight-interactions {
  padding: 8px 14px; border-top: 1px solid var(--border);
  font-size: 13px;
}
.flight-likes-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; color: var(--ink2); }
.flight-interactions-divider { height: 1px; background: var(--border); margin: 6px 0; }
.flight-comment-item {
  display:flex; gap:8px; align-items:flex-start;
  padding:5px 0;
}
.flight-comment-avatar { flex-shrink:0; padding-top:2px; }
.flight-comment-body {
  flex:1; min-width:0;
  display:flex; flex-wrap:wrap; gap:4px; align-items:baseline;
  font-size:13px; line-height:1.5;
}
.flight-comment-reply-btn {
  font-size:11px; color:var(--ink3);
  background:none; border:none; cursor:pointer; padding:0 4px;
}
.flight-comment-reply-btn:hover { color:var(--accent); }
.flight-comment-clickable { cursor: pointer; }
.flight-comment-clickable:hover { color: var(--accent); }
.flight-comment-author { font-weight: 600; color: var(--ink); }
/* min-width:0 让该 flex 子项可收缩,配合断词使超长字符串自动换行而不溢出评论区
   (航线/广告/谜题/航线朋友圈/历史航线评论都走 _renderCommentRow → 共用此类) */
.flight-comment-text { color: var(--ink); min-width: 0; overflow-wrap: anywhere; word-break: break-word; white-space: pre-wrap; }
.flight-reply-prefix { color: var(--ink3); font-size: 12px; }
/* 微信群聊风格的回复抬头:作者[头衔] @被回复者[头衔] 正文 */
.flight-reply-at { color: var(--ink3); margin: 0 1px; }
.flight-reply-target { color: var(--ink2); font-weight: 500; }
.flight-reply-target:hover { color: var(--accent); }
.flight-comment-del { background: none; border: none; color: var(--ink3); font-size: 11px; cursor: pointer; padding: 0 2px; }
.flight-comment-del:hover { color: var(--error); }

/* 登录 / 注册按钮下方:协议勾选行
   浅灰小字,协议名用中蓝色无下划线,具备链接功能 */
.auth-agree-row {
  display: flex; align-items: flex-start; gap: 6px;
  margin-top: 10px; padding: 0 2px;
  font-size: 12px; color: var(--ink3); line-height: 1.55;
  user-select: none;
}
.auth-agree-row input[type=checkbox] {
  margin: 2px 2px 0 0; flex-shrink: 0; cursor: pointer;
  width: 14px; height: 14px;
}
.auth-agree-text { color: var(--ink3); }
.auth-agree-link {
  color: #2563eb;        /* 中蓝色 */
  text-decoration: none;
  cursor: pointer;
}
.auth-agree-link:hover { color: #1d4ed8; }

/* 通用"我不要看这条评论"× — 航线 / 谜题评论行右侧 */
.comment-dismiss-x {
  background: none; border: none; cursor: pointer;
  color: var(--ink3); opacity: 0.55;
  font-size: 16px; line-height: 1;
  padding: 0 4px; margin-left: 6px;
  flex-shrink: 0; align-self: flex-start;
}
.comment-dismiss-x:hover { opacity: 1; color: var(--ink); }
.flight-comment-input-wrap {
  display: flex; flex-direction: row; align-items: flex-end; gap: 6px;
  padding: 8px 14px; border-top: 1px solid var(--border);
}
.flight-reply-hint {
  font-size: 12px; color: var(--ink3); padding: 2px 0;
  display: flex; align-items: center; flex-wrap: wrap; gap: 2px;
}
.reply-hint-me { color: var(--ink2); font-weight: 600; }
.reply-hint-at { color: var(--ink3); margin: 0 2px; }
.reply-hint-target { color: var(--ink2); font-weight: 500; }
.flight-comment-input {
  flex: 1; padding: 7px 10px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--bg);
  font-size: 13px; font-family: inherit; color: var(--ink);
}
.flight-comment-send {
  padding: 7px 14px; border-radius: 8px; border: none;
  background: var(--accent); color: #fff; cursor: pointer;
  font-size: 13px; white-space: nowrap;
}
.flight-pending-requests {
  padding: 8px 14px; background: #fef3c7; border-bottom: 1px solid #fcd34d;
}
.flight-pending-item {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 13px; padding: 4px 0;
}
.flight-pending-btns { display: flex; gap: 8px; }
.flight-pending-btn {
  padding: 3px 12px; border-radius: 12px; border: none;
  cursor: pointer; font-size: 12px; font-weight: 600;
}
.flight-pending-approve { background: var(--accent); color: #fff; }
.flight-pending-reject { background: var(--bg); color: var(--ink2); border: 1px solid var(--border-solid); }

/* ── 发布航线表单 ── */
.compose-flight-body { padding: 16px; }
.time-chip-group { display: flex; flex-wrap: wrap; gap: 8px; }
.time-chip {
  padding: 6px 14px; border-radius: 20px; border: 1.5px solid var(--border-solid);
  background: var(--bg); color: var(--ink2); cursor: pointer;
  font-size: 13px; transition: all 0.15s;
}
.time-chip.selected {
  border-color: var(--accent); background: var(--accent-light); color: var(--accent); font-weight: 600;
}
.count-btn {
  width: 32px; height: 32px; border-radius: 50%; border: 1.5px solid var(--border-solid);
  background: var(--bg); color: var(--ink); font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.count-btn:hover { border-color: var(--accent); color: var(--accent); }
.compose-img-item { position: relative; display: inline-block; }
.compose-img-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; display: block; }
.compose-img-del {
  position: absolute; top: -6px; right: -6px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--error); color: #fff; border: none;
  cursor: pointer; font-size: 12px; line-height: 18px; text-align: center; padding: 0;
}

/* ── 通知列表 ── */
.flight-notif-item {
  padding: 12px 16px; border-bottom: 1px solid var(--border);
  cursor: pointer; transition: background 0.1s;
}
.flight-notif-item:hover { background: var(--hover); }
.flight-notif-item.unread { background: var(--accent-light); }
.flight-notif-actor { font-weight: 600; font-size: 14px; color: var(--ink); }
.flight-notif-action { font-size: 13px; color: var(--ink2); margin-top: 2px; }
.flight-notif-flight { font-size: 12px; color: var(--ink3); margin-top: 2px; }
.flight-notif-time { font-size: 11px; color: var(--ink3); margin-top: 4px; }

/* ── 全屏图片预览 ── */
.img-preview-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.88); display: flex;
  align-items: center; justify-content: center; cursor: zoom-out;
}
.img-preview-full {
  max-width: 92vw; max-height: 88vh; border-radius: 8px; object-fit: contain;
}

/* ── 思绪卡片 ── */
.thought-card {
  margin: 12px 16px; padding: 16px;
  background: var(--card); backdrop-filter: var(--glass-blur);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}
.thought-card-header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 10px; font-size: 13px;
}
.thought-author {
  font-weight: 600; color: var(--ink);
}
.thought-vis-tag {
  font-size: 11px; padding: 1px 8px; border-radius: 8px;
  background: var(--accent-light); color: var(--accent);
}
.thought-time {
  margin-left: auto; color: var(--ink3); font-size: 12px;
}
.thought-delete-btn, .thought-edit-btn {
  background: none; border: none; color: var(--ink3);
  cursor: pointer; font-size: 12px; padding: 0 4px;
}
.thought-delete-btn:hover { color: var(--error); }
.thought-edit-btn:hover { color: var(--accent); }

.thought-dur-tag {
  background: var(--bg); color: var(--ink3);
}

.thought-content {
  font-size: 15px; line-height: 1.7; color: var(--ink);
  word-break: break-word; margin-bottom: 12px;
}

/* ── 想法图片 ── */
.thought-images {
  display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px;
}
.thought-image {
  width: 100px; height: 100px; object-fit: cover;
  border-radius: 8px; cursor: pointer;
  transition: opacity 0.15s;
}
.thought-image:hover { opacity: 0.85; }
.thought-images:has(> :only-child) .thought-image {
  width: 200px; height: auto; max-height: 260px;
}

/* ── 图片预览全屏 ── */
.image-preview-overlay {
  position: fixed; inset: 0; z-index: 999;
  background: rgba(0,0,0,0.85); display: flex;
  align-items: center; justify-content: center;
  cursor: zoom-out;
}
.image-preview-full {
  max-width: 90vw; max-height: 90vh;
  border-radius: 8px; object-fit: contain;
}

/* ── AI 多视角点评 ── */
.thought-ai-comments {
  padding: 10px 12px; margin-bottom: 10px;
  background: var(--accent-light); border-radius: 10px;
}
.thought-ai-comment {
  display: flex; align-items: flex-start; gap: 6px;
  margin-bottom: 6px; font-size: 13px; line-height: 1.5;
}
.thought-ai-comment:last-of-type { margin-bottom: 0; }
.thought-ai-emoji { flex-shrink: 0; }
.thought-ai-label {
  flex-shrink: 0; font-weight: 600; color: var(--accent);
  font-size: 12px; min-width: 40px;
}
.thought-ai-text { color: var(--ink2); }
.thought-ai-note {
  font-size: 11px; color: var(--ink3); margin-top: 6px;
  text-align: right; font-style: italic;
}
.thought-ai-loading {
  font-size: 13px; color: var(--ink3); text-align: center;
  padding: 4px 0;
}

/* ── 评论条目 ── */
.thought-comment-item {
  display: flex; align-items: flex-start; gap: 6px;
  padding: 4px 0; font-size: 13px; line-height: 1.5;
}
.thought-comment-author {
  font-weight: 600; color: var(--accent); flex-shrink: 0;
}
.thought-comment-text { color: var(--ink); word-break: break-word; }
.thought-comment-del, .thought-comment-reply-btn {
  margin-left: 4px; background: none; border: none;
  color: var(--ink3); cursor: pointer; font-size: 11px;
  flex-shrink: 0;
}
.thought-comment-del:hover { color: var(--error); }
.thought-comment-reply-btn:hover { color: var(--accent); }
.thought-reply-prefix {
  color: var(--ink3); font-size: 12px; margin-right: 2px;
}
.thought-reply-prefix b { color: var(--accent); font-weight: 600; }
.thought-comment-ai .thought-comment-author {
  color: var(--ink3); font-weight: 500;
  background: rgba(var(--accent-rgb, 139,115,85), 0.10);
  padding: 1px 6px; border-radius: 8px; font-size: 11px;
}
.thought-comment-ai .thought-comment-text { color: var(--ink3); font-style: italic; }
.thought-comment-ai-reply { padding-left: 16px; }
.thought-comment-clickable { cursor: pointer; }
.thought-comment-clickable:active { opacity: 0.7; }
.ai-tag {
  background: rgba(var(--accent-rgb, 139,115,85), 0.10);
  padding: 1px 5px; border-radius: 8px; font-size: 11px;
  color: var(--ink3);
}

/* ── 操作栏（微信风格：赞 | 评论） ── */
.thought-actions {
  display: flex; align-items: center;
  border-top: 1px solid var(--border); padding-top: 8px;
}
.thought-action-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 4px;
  background: none; border: none; color: var(--ink3);
  cursor: pointer; font-size: 13px; padding: 4px 0;
  transition: var(--transition);
}
.thought-action-btn:hover { color: var(--accent); }
.thought-action-btn.active { color: var(--accent); }
.thought-action-btn + .thought-action-btn {
  border-left: 1px solid var(--border);
}
.thought-action-btn svg { vertical-align: middle; }

/* ── 互动区（点赞列表 + 评论） ── */
.thought-interactions {
  background: var(--bg); border-radius: 6px;
  padding: 8px 10px; margin-top: 8px; font-size: 13px;
}
.thought-likes-row {
  color: var(--accent); font-size: 13px; line-height: 1.5;
}
.thought-ai-react-row {
  color: var(--text-secondary, #888); font-size: 13px; line-height: 1.5;
}
.thought-interactions-divider {
  height: 1px; background: var(--border); margin: 6px 0;
}

/* ── 评论输入 ── */
.thought-comment-input-wrap {
  display: flex; gap: 8px; margin-top: 10px;
  padding-top: 10px; border-top: 1px solid var(--border);
}
.thought-comment-input {
  flex: 1; padding: 8px 12px; border: 1px solid var(--border-solid);
  border-radius: 10px; background: var(--card); color: var(--ink);
  font-size: 14px; outline: none;
}
.thought-comment-input:focus { border-color: var(--accent); }
.thought-comment-send {
  padding: 8px 16px; border: none; border-radius: 10px;
  background: var(--accent); color: #fff; cursor: pointer;
  font-size: 13px; font-weight: 600;
}

/* ── 发布弹窗 ── */
.thought-compose-overlay {
  position: fixed; inset: 0; z-index: 400;
  background: rgba(0,0,0,0.45); display: flex;
  align-items: flex-end; justify-content: center;
}
.thought-compose-modal {
  width: 100%; max-width: 500px;
  background: var(--card-solid); border-radius: 20px 20px 0 0;
  padding: 20px; padding-bottom: max(20px, env(safe-area-inset-bottom));
  animation: slideUp 0.25s ease;
}
.thought-ai-chat-modal {
  width: 100%; max-width: 500px; height: 75vh;
  background: var(--card-solid); border-radius: 20px 20px 0 0;
  padding: 20px; display: flex; flex-direction: column;
  animation: slideUp 0.25s ease;
}
@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.thought-compose-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 16px; font-size: 16px; font-weight: 600; color: var(--ink);
}
.thought-compose-header button {
  background: none; border: none; font-size: 20px;
  color: var(--ink3); cursor: pointer;
}
.thought-compose-textarea {
  width: 100%; min-height: 120px; padding: 12px;
  border: 1px solid var(--border-solid); border-radius: 12px;
  background: var(--card); color: var(--ink); font-size: 15px;
  line-height: 1.6; resize: vertical; outline: none;
  font-family: inherit;
}
.thought-compose-textarea:focus { border-color: var(--accent); }
/* ── 发布 / 编辑图片预览 ── */
.thought-compose-images {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px;
}
.thought-compose-img-item {
  position: relative; width: 72px; height: 72px;
}
.thought-compose-img-item img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 6px;
}
.thought-compose-img-item button {
  position: absolute; top: -6px; right: -6px;
  width: 20px; height: 20px; border-radius: 50%;
  background: rgba(0,0,0,0.6); color: #fff;
  border: none; font-size: 12px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.thought-add-image-btn {
  cursor: pointer; color: var(--ink3); display: flex; align-items: center;
}
.thought-add-image-btn:hover { color: var(--accent); }

.thought-compose-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px; gap: 8px;
}
.thought-compose-footer-left {
  display: flex; align-items: center; gap: 8px; flex: 1;
  flex-wrap: wrap;
}
.thought-compose-vis {
  padding: 8px 12px; border: 1px solid var(--border-solid);
  border-radius: 10px; background: var(--card); color: var(--ink2);
  font-size: 13px; outline: none;
}
.thought-vis-summary {
  font-size: 12px; padding: 4px 10px; border-radius: 8px;
  background: var(--accent-light); color: var(--accent);
  white-space: nowrap;
}

/* ── 好友选择器（自定义可见范围） ── */
.friend-picker-modal {
  display: flex; flex-direction: column;
  max-height: 80vh;
}
.friend-picker-hint {
  font-size: 12px; color: var(--ink3);
  padding: 0 4px 8px;
}
.friend-picker-search {
  width: 100%; box-sizing: border-box;
  padding: 10px 14px; border: 1px solid var(--border-solid);
  border-radius: 10px; background: var(--card); color: var(--ink);
  font-size: 14px; outline: none; margin-bottom: 8px;
}
.friend-picker-search:focus { border-color: var(--accent); }
.friend-picker-list {
  flex: 1; overflow-y: auto;
  border: 1px solid var(--border-solid); border-radius: 10px;
  background: var(--card); padding: 4px 0;
  min-height: 200px; max-height: 50vh;
}
.friend-picker-empty {
  padding: 20px; text-align: center;
  color: var(--ink3); font-size: 13px;
}
.friend-picker-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px; cursor: pointer;
  border-bottom: 1px solid var(--border-light, transparent);
}
.friend-picker-row:hover { background: var(--accent-light); }
.friend-picker-row input[type=checkbox] {
  width: 18px; height: 18px;
  accent-color: var(--accent);
}
.friend-picker-name {
  flex: 1; font-size: 14px; color: var(--ink);
  display: flex; align-items: center; gap: 6px;
}
.friend-picker-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px; gap: 8px;
}
.friend-picker-count {
  font-size: 13px; color: var(--ink3);
}
.friend-picker-cancel {
  background: none; border: none; color: var(--ink3);
  font-size: 18px; cursor: pointer;
}
.thought-compose-submit {
  padding: 10px 28px; border: none; border-radius: 12px;
  background: var(--accent); color: #fff; font-size: 14px;
  font-weight: 600; cursor: pointer;
}
.thought-compose-submit:hover { background: var(--accent-dark); }

/* ── AI 聊天面板 ── */
.thought-ai-chat-hint {
  font-size: 13px; color: var(--ink3); margin-bottom: 12px;
  text-align: center;
}
.thought-ai-chat-messages {
  flex: 1; overflow-y: auto; padding: 8px 0;
  display: flex; flex-direction: column; gap: 10px;
}
.ai-chat-bubble {
  max-width: 85%; padding: 10px 14px; border-radius: 14px;
  font-size: 14px; line-height: 1.6; word-break: break-word;
}
.ai-chat-ai {
  align-self: flex-start;
  background: var(--accent-light); color: var(--ink);
}
.ai-chat-thinking {
  opacity: 0.6;
  animation: ai-thinking-pulse 1.5s ease-in-out infinite;
}
@keyframes ai-thinking-pulse {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 0.3; }
}
.ai-chat-user {
  align-self: flex-end;
  background: var(--accent); color: #fff;
}
.thought-ai-chat-input-row {
  display: flex; gap: 8px; margin-top: 12px;
}
.thought-ai-chat-input {
  flex: 1; padding: 10px 14px; border: 1px solid var(--border-solid);
  border-radius: 12px; background: var(--card); color: var(--ink);
  font-size: 14px; outline: none;
}
.thought-ai-chat-input:focus { border-color: var(--accent); }
.thought-ai-chat-send {
  padding: 10px 20px; border: none; border-radius: 12px;
  background: var(--accent); color: #fff; cursor: pointer;
  font-size: 14px; font-weight: 600;
}
.thought-ai-refine-bar {
  display: flex; justify-content: center; margin-top: 12px;
}
.thought-ai-refine-btn {
  padding: 10px 24px; border: none; border-radius: 12px;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: #fff; cursor: pointer; font-size: 14px; font-weight: 600;
}

/* 自动草稿预览 */
.ai-chat-draft-preview {
  margin: 12px 0 4px; padding: 14px;
  background: linear-gradient(135deg, var(--accent-light), rgba(var(--accent-rgb), 0.06));
  border: 1.5px solid var(--accent);
  border-radius: 14px;
}
.ai-chat-draft-label {
  font-size: 12px; color: var(--accent); font-weight: 600; margin-bottom: 8px;
}
.ai-chat-draft-text {
  font-size: 14px; line-height: 1.7; color: var(--ink);
  margin-bottom: 12px; word-break: break-word;
}
.ai-chat-draft-actions {
  display: flex; gap: 8px;
}
.ai-chat-draft-publish {
  flex: 1; padding: 8px 0; border: none; border-radius: 10px;
  background: var(--accent); color: #fff; font-size: 13px;
  font-weight: 600; cursor: pointer; transition: background 0.3s;
}
.ai-chat-draft-publish.ai-draft-published {
  background: var(--success, #22c55e); cursor: default;
}
.ai-chat-draft-edit {
  flex: 1; padding: 8px 0; border: 1px solid var(--accent);
  border-radius: 10px; background: transparent; color: var(--accent);
  font-size: 13px; cursor: pointer;
}

/* ── 想法互动通知 ── */
.flight-notif-btn {
  position: relative; background: none; border: none;
  color: var(--ink2); cursor: pointer; padding: 4px;
  display: flex; align-items: center; justify-content: center;
}
.flight-notif-btn:hover { color: var(--accent); }
.notif-red-dot {
  position: absolute; top: 2px; right: 0;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--error, #ef4444);
}
.nav-badge-dot {
  position: absolute; top: 6px; left: 50%;
  transform: translateX(8px);
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--error, #ef4444);
  border: 1.5px solid var(--bg);
}
.notif-list {
  padding: 0 0 20px;
}
.notif-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; border-bottom: 1px solid var(--border);
  cursor: pointer; transition: background 0.15s;
}
.notif-item:hover { background: var(--card); }
.notif-item.notif-unread { background: rgba(var(--accent-rgb, 99,102,241), 0.04); }
.notif-item-left { flex-shrink: 0; }
.notif-actor-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--accent-light); color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 600;
}
.notif-item-body { flex: 1; min-width: 0; }
.notif-actor-name {
  font-size: 15px; font-weight: 600; color: var(--ink);
  margin-bottom: 2px;
}
.notif-action {
  font-size: 13px; color: var(--ink2); margin-bottom: 4px;
}
.notif-comment {
  font-size: 13px; color: var(--ink3);
  background: var(--card); border-radius: 6px;
  padding: 6px 10px; margin: 4px 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.notif-time {
  font-size: 12px; color: var(--ink3);
}
.notif-item-right {
  flex-shrink: 0; width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
}
.notif-thought-img {
  width: 44px; height: 44px; border-radius: 6px;
  object-fit: cover;
}
.notif-thought-text {
  width: 44px; height: 44px; border-radius: 6px;
  background: var(--card); font-size: 10px; color: var(--ink3);
  overflow: hidden; padding: 4px;
  line-height: 1.2; word-break: break-all;
}

/* ── AI 全屏聊天 & 人设选择 ── */
.ai-chat-fullpage {
  position: fixed; inset: 0; z-index: 50;
  display: flex; flex-direction: column;
  background: var(--bg);
}
.ai-chat-fullpage .chat-header {
  flex-shrink: 0;
}
.ai-chat-fullpage .chat-messages {
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.ai-chat-fullpage .chat-input-wrap {
  flex-shrink: 0;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.ai-chat-fullpage .thought-ai-refine-bar {
  flex-shrink: 0; padding: 0 16px;
}

/* 人设选择页 */
.ai-persona-select {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-start;
  padding: 20px; overflow-y: auto; padding-top: 40px;
}
.ai-persona-hint {
  font-size: 14px; color: var(--ink2); text-align: center;
  line-height: 1.7; margin-bottom: 28px;
}
.ai-persona-cards {
  display: flex; flex-direction: column; gap: 14px;
  width: 100%; max-width: 360px;
}
.ai-persona-card {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 20px; border: 1.5px solid var(--border-solid);
  border-radius: 16px; background: var(--card);
  cursor: pointer; text-align: left;
  transition: all 0.2s ease;
}
.ai-persona-card:hover {
  border-color: var(--accent);
  background: var(--accent-light);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.ai-persona-card:active {
  transform: translateY(0);
}
.ai-persona-featured {
  border-color: var(--accent);
  background: var(--accent-light);
}
.ai-persona-star {
  font-size: 12px; margin-left: 2px;
}
.ai-persona-icon {
  flex-shrink: 0; width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent-light); border-radius: 12px;
  color: var(--accent);
}
.ai-persona-svg {
  width: 24px; height: 24px;
}
.ai-persona-info {
  flex: 1; min-width: 0;
}
.ai-persona-name {
  font-size: 16px; font-weight: 600; color: var(--ink);
  margin-bottom: 2px;
}
.ai-persona-desc {
  font-size: 13px; color: var(--ink3); line-height: 1.5;
}
.ai-persona-loading {
  text-align: center; color: var(--ink3); padding: 40px 0;
}

/* AI 聊天气泡（全屏模式复用） */
.ai-chat-fullpage .ai-chat-bubble {
  max-width: 80%; padding: 10px 14px; border-radius: 14px;
  font-size: 14px; line-height: 1.6; word-break: break-word;
}
.ai-chat-fullpage .ai-chat-ai {
  align-self: flex-start;
  background: var(--accent-light); color: var(--ink);
}
.ai-chat-fullpage .ai-chat-user {
  align-self: flex-end;
  background: var(--accent); color: #fff;
}

/* AI 打字动画 */
.ai-chat-typing {
  display: flex; gap: 4px; padding: 12px 16px;
  align-self: flex-start;
}
.ai-chat-typing span {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ink3); opacity: 0.4;
  animation: aiTypingBounce 1.2s infinite;
}
.ai-chat-typing span:nth-child(2) { animation-delay: 0.15s; }
.ai-chat-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes aiTypingBounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
  30% { transform: translateY(-6px); opacity: 1; }
}

/* AI 聊天历史 */
.ai-chat-history-section {
  width: 100%; max-width: 360px; margin-top: 32px;
}
.ai-chat-history-title {
  font-size: 14px; font-weight: 600; color: var(--ink2);
  margin-bottom: 12px; padding-left: 2px;
}
.ai-chat-history-list {
  display: flex; flex-direction: column; gap: 8px;
}
.ai-chat-history-empty {
  text-align: center; color: var(--ink3); font-size: 13px;
  padding: 20px 0;
}
.ai-chat-history-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border: 1px solid var(--border-solid);
  border-radius: 12px; background: var(--card);
  cursor: pointer; text-align: left; width: 100%;
  transition: all 0.15s ease;
}
.ai-chat-history-item:hover {
  border-color: var(--accent);
  background: var(--accent-light);
}
.ai-chat-history-icon {
  font-size: 20px; flex-shrink: 0;
}
.ai-chat-history-info {
  flex: 1; min-width: 0; overflow: hidden;
}
.ai-chat-history-item-title {
  font-size: 14px; font-weight: 500; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ai-chat-history-meta {
  font-size: 12px; color: var(--ink3); margin-top: 2px;
}
.ai-chat-delete-btn {
  background: none; border: none; cursor: pointer;
  font-size: 16px; padding: 6px 8px; opacity: 0.6;
  transition: opacity 0.15s;
}
.ai-chat-delete-btn:hover { opacity: 1; }

.ai-chat-continue-bar {
  padding: 12px 16px;
  display: flex; justify-content: center;
}
.ai-chat-continue-btn {
  background: var(--accent); color: #fff; border: none; border-radius: 20px;
  padding: 10px 28px; font-size: 15px; font-weight: 600; cursor: pointer;
  transition: opacity 0.15s;
}
.ai-chat-continue-btn:hover { opacity: 0.85; }

/* 想法作者可点击 */
.thought-author {
  color: var(--accent); font-weight: 600;
}
.thought-author:hover {
  text-decoration: underline;
}

/* ── 关注按钮 ── */
.follow-btn {
  font-size: 12px; padding: 3px 10px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.5); background: transparent;
  color: #fff; cursor: pointer; white-space: nowrap;
  transition: all 0.2s;
}
.follow-btn:hover { background: rgba(255,255,255,0.15); }
.follow-btn.following {
  border-color: rgba(255,255,255,0.3); color: rgba(255,255,255,0.7);
}
.follow-btn.peer-follows {
  background: rgba(255,255,255,0.2); border-color: #fff;
  color: #fff; font-weight: 500;
}
.follow-btn.mutual {
  background: rgba(255,255,255,0.15); border-color: rgba(255,255,255,0.4);
  color: #fff;
}

/* 关注反馈 toast */
.follow-toast {
  position: fixed; top: 60px; left: 50%; transform: translateX(-50%) translateY(-12px);
  background: var(--card); color: var(--ink);
  font-size: 13px; padding: 8px 20px; border-radius: 20px;
  box-shadow: 0 4px 24px rgba(0,0,0,.12);
  border: 1px solid var(--border);
  z-index: 999; opacity: 0; transition: opacity 0.25s, transform 0.25s;
  pointer-events: none; white-space: nowrap;
}
.follow-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.follow-toast-highlight { border-color: var(--accent); color: var(--accent); font-weight: 500; }
body[data-theme="dark"] .follow-toast { box-shadow: 0 4px 24px rgba(0,0,0,.35); }

/* 聊天头部查看想法按钮 */
.chat-peer-flight-btn {
  background: none; border: none;
  cursor: pointer; padding: 6px; opacity: 0.85;
  transition: opacity 0.15s; color: #fff;
}
.chat-peer-flight-btn:hover { opacity: 1; }
.chat-peer-flight-svg { width: 20px; height: 20px; }

/* AI 聊天头部人设图标 */
.ai-chat-header-icon {
  display: inline-flex; vertical-align: middle; margin-right: 4px;
}
.ai-chat-header-icon .ai-persona-svg {
  width: 20px; height: 20px;
}

/* ═══════ 移动端适配补丁 ═══════ */

/* ── 想法：emoji 反应选择器（原缺失） ── */
.thought-react-picker {
  display: flex; gap: 4px; margin-top: 6px;
  padding: 6px 8px; border-radius: 12px;
  background: var(--card-solid);
  border: 1px solid var(--border-solid);
  box-shadow: var(--shadow-sm);
  animation: slideUp 0.15s ease;
}
.thought-react-picker button {
  background: none; border: none; cursor: pointer;
  font-size: 20px; padding: 4px 6px; border-radius: 8px;
  transition: background 0.15s;
  min-width: 36px; min-height: 36px;
  display: flex; align-items: center; justify-content: center;
}
.thought-react-picker button:hover,
.thought-react-picker button:active {
  background: var(--accent-light);
}

/* ── 想法：撰写弹窗小屏适配 ── */
.thought-compose-modal {
  max-height: 90vh;
  max-height: 90dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── 想法：评论删除/回复按钮加大触摸区域 ── */
.thought-comment-del, .thought-comment-reply-btn {
  min-width: 32px; min-height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 4px 8px;
}

/* ── 想法：卡片编辑/删除按钮加大触摸区域 ── */
.thought-delete-btn, .thought-edit-btn {
  min-width: 36px; min-height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 4px 8px;
}

/* ── 设置：权重排序项加大触摸区域 ── */
@media (max-width: 767px) {
  .wl-rank-item {
    padding: 10px 10px;
    min-height: 44px;
  }
  .wl-rank-arrow {
    font-size: 12px;
    padding: 4px 6px;
    min-width: 28px; min-height: 24px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .wl-rank-desc {
    display: none;
  }
  /* ── 设置：色彩选择器小屏两行排列 ── */
  .color-theme-options {
    gap: 8px;
  }
  .color-theme-option {
    flex: 0 1 calc(25% - 6px);
    min-width: 56px;
    padding: 10px 4px;
  }
  .color-theme-swatch {
    width: 28px; height: 28px;
  }
  .color-theme-label {
    font-size: 10px;
  }
  /* ── 聊天：引用回复文本适配 ── */
  .quote-text {
    max-width: 140px;
  }
}

/* ═══════ WaverAI 聊天列表条目 ═══════ */
.chat-conv-item.waver-ai-item {
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 6%, var(--card)) 0%, color-mix(in srgb, var(--accent) 12%, var(--card)) 100%);
  border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--border-solid));
  margin-bottom: 8px;
}
.chat-conv-item.waver-ai-item:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 12px color-mix(in srgb, var(--accent) 14%, transparent);
}
.chat-conv-avatar.waver-avatar {
  background: color-mix(in srgb, var(--accent) 18%, var(--card));
  color: var(--accent);
}
.chat-conv-avatar.waver-avatar .ai-persona-svg {
  width: 24px; height: 24px;
}
.ai-badge {
  display: inline-block;
  font-size: 10px; font-weight: 700; letter-spacing: 0.5px;
  padding: 1px 6px; margin-left: 6px;
  border-radius: 6px;
  background: var(--accent); color: #fff;
  vertical-align: middle;
  line-height: 1.5;
}
.ai-badge-inline {
  font-size: 9px;
  padding: 1px 5px;
  margin-left: 4px;
  background: color-mix(in srgb, var(--accent) 80%, transparent);
}
.waver-new-dot {
  position: absolute;
  top: -2px; right: -2px;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #ef4444;
  border: 2px solid var(--bg);
  box-shadow: 0 0 0 0 rgba(239,68,68,0.6);
  animation: waver-new-pulse 1.8s ease-out infinite;
}
@keyframes waver-new-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(239,68,68,0.55); }
  70%  { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
  100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); }
}
.chat-conv-item.waver-ai-item .chat-conv-avatar-wrap {
  position: relative;
}

/* ══════════════════════════════════════
   并肩打卡 / Pair Check-in
   ══════════════════════════════════════ */
.chat-info-cwo {
  margin: 4px 0 8px;
  padding: 8px 10px;
  background: var(--cream, #fff8ec);
  border-radius: 8px;
  font-size: 13px;
  color: var(--ink2);
  line-height: 1.5;
}
.chat-info-cwo-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cwo-action-btn {
  padding: 6px 12px;
  font-size: 12px;
  border-radius: 14px;
  border: 1px solid var(--line, #e5e7eb);
  background: #fff;
  color: var(--ink1);
  cursor: pointer;
  transition: background .15s;
}
.cwo-action-btn:hover {
  background: var(--cream, #fff8ec);
}

.pair-checkin-modal {
  max-width: 480px;
  width: 92vw;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  padding: 18px 18px 16px;
}
.pair-checkin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.modal-close-x {
  border: none;
  background: transparent;
  font-size: 22px;
  cursor: pointer;
  color: var(--ink3, #999);
  padding: 0 4px;
}
.pair-checkin-hint {
  font-size: 12px;
  color: var(--ink3, #999);
  margin-bottom: 14px;
  line-height: 1.5;
}
.pair-goals-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}
.pair-goal-box {
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--cream, #fff8ec);
  border: 1px solid var(--line, #f0e5cc);
  font-size: 13px;
}
.pair-goal-box.empty {
  background: #fafafa;
  border: 1px dashed var(--line, #e5e7eb);
}
.pair-goal-label {
  font-size: 11px;
  color: var(--ink3, #999);
  margin-bottom: 4px;
}
.pair-goal-text {
  font-weight: 600;
  color: var(--ink1);
  line-height: 1.4;
  word-break: break-word;
}
.pair-goal-empty-hint {
  color: var(--ink3, #999);
  font-size: 12px;
  line-height: 1.5;
}
.pair-goal-actions {
  margin-top: 8px;
  display: flex;
  gap: 6px;
}
.pair-goal-edit-btn {
  padding: 3px 10px;
  font-size: 11px;
  border-radius: 10px;
  border: 1px solid var(--line, #e5e7eb);
  background: #fff;
  cursor: pointer;
}
.pair-checkin-action-bar {
  display: flex;
  justify-content: center;
  margin: 8px 0 14px;
}
.pair-checkin-list {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pair-checkins-empty {
  text-align: center;
  color: var(--ink3, #999);
  font-size: 13px;
  padding: 20px 0;
}
.pair-checkin-row {
  padding: 10px 12px;
  border-radius: 10px;
  background: #f8f9fb;
  font-size: 13px;
}
.pair-checkin-row.mine {
  background: #eef2ff;
}
.pair-checkin-head {
  font-size: 13px;
  color: var(--ink2);
}
.pair-checkin-goal {
  color: var(--ink1);
  font-weight: 600;
}
.pair-checkin-time {
  float: right;
  font-size: 11px;
  color: var(--ink3, #999);
}
.pair-checkin-note {
  margin-top: 4px;
  color: var(--ink1);
  line-height: 1.5;
}
.pair-rx-row {
  margin-top: 6px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pair-rx-chip {
  padding: 2px 8px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line, #e5e7eb);
  font-size: 12px;
  cursor: pointer;
}
.pair-rx-chip.mine {
  background: #fef3c7;
  border-color: #fcd34d;
}
.pair-rx-btns {
  margin-top: 6px;
  display: flex;
  gap: 4px;
}
.pair-rx-add {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--line, #e5e7eb);
  background: #fff;
  font-size: 14px;
  cursor: pointer;
  padding: 0;
}
.pair-rx-add:hover {
  background: var(--cream, #fff8ec);
}

/* M-M 聊天横幅中"你在折腾什么"未填写时的引导文案 */
.chat-info-cwo-empty {
  margin: 4px 0 8px;
  padding: 8px 10px;
  background: #fafafa;
  border: 1px dashed var(--line, #e5e7eb);
  border-radius: 8px;
  font-size: 12px;
  color: var(--ink3, #999);
  line-height: 1.5;
}

  html, body {
    height: 100%;
    background: linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.9)), 
                url('/static/image.png') no-repeat center center fixed;
    background-size: cover;
    color: var(--ink);
    font-family: 'Noto Serif SC', serif;
    overflow-x: hidden;
  }

  /* ── DARK OVERLAY FOR READABILITY ── */
  body::after {
    content: '';
    position: fixed;
    inset: 0;
    background: linear-gradient(
      180deg,
      rgba(255, 248, 240, 0.1) 0%,
      rgba(255, 240, 230, 0.05) 50%,
      rgba(40, 20, 30, 0.15) 100%
    );
    pointer-events: none;
    z-index: 0;
  }

  /* ── GRAIN OVERLAY ── */
  body::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.06'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 1;
    opacity: 0.3;
  }

  /* ── ATMOSPHERIC BLOBS (SUBTLE) ── */
  .blob-wrap {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
  }
  .blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.15;
  }
  .blob-1 { width: 600px; height: 600px; background: #FFD580; top: -100px; left: -150px; }
  .blob-2 { width: 500px; height: 500px; background: #FF6B8A; top: 40%; right: -120px; }
  .blob-3 { width: 400px; height: 400px; background: #7B1F5E; bottom: -80px; left: 30%; }

/* ══════ Merlink 重写版聊天室 — 微信风格气泡 ══════ */
.chat-page-room {
  display:flex; flex-direction:column;
  /* 使用 transparent，让 body 的渐变背景透过来，与其它页面保持一致 */
  background:transparent !important;
}
body[data-theme="dark"] .chat-page-room { background:transparent !important; }

.chat-page-room .chat-header {
  display:flex; align-items:center; gap:8px;
  padding:10px 14px; background:rgba(255,255,255,0.55);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.chat-page-room .chat-header .back-btn {
  background:none; border:none; font-size:24px; color:var(--ink);
  cursor:pointer; padding:4px 10px; line-height:1;
}
.chat-page-room .chat-header .title {
  display:flex; align-items:center;
  flex:1; min-width:0;
}
.chat-page-room .chat-header h4 {
  margin:0; font-size:16px; font-weight:600; color:var(--ink);
  flex:1; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.chat-header-avatar {
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.chat-header-avatar-wrap { flex-shrink:0; display:inline-flex; }
.chat-header-name { display:flex; align-items:center; gap:8px; }
.chat-header-tag {
  font-size:11px; color:var(--ink3); font-weight:400;
  flex-shrink:0;
}
body[data-theme="dark"] .chat-page-room .chat-header { background:rgba(20,20,30,0.55); }

#chat-msg-list {
  flex:1; min-height:0; overflow-y:auto; padding:14px 14px 8px;
  display:flex; flex-direction:column; gap:10px;
}
.chat-msg-day {
  align-self:center; font-size:11px; color:var(--ink3);
  padding:4px 10px; background:transparent;
}
.chat-msg-recalled {
  align-self:center; font-size:12px; color:var(--ink3);
  padding:4px 0; opacity:.85; user-select:none;
}
/* 覆盖默认的 column 布局 */
/* 聊天行：头像 + 内容 横向排列 */
.chat-page-room .chat-msg-row {
  display:flex !important; flex-direction:row !important;
  align-items:flex-start; gap:8px;
  width:100% !important; max-width:100% !important;
}
.chat-page-room .chat-msg-row.mine {
  flex-direction:row-reverse !important;
  align-self:auto;
}

/* 内容容器：限制最大宽度为父行的 70%，让气泡能正常计算文本宽度 */
.chat-msg-avatar { flex-shrink:0; }
.chat-msg-content {
  display:flex; flex-direction:column;
  max-width:70%;
  min-width:0;
  align-items:flex-start;
}
.chat-msg-row.mine .chat-msg-content { align-items:flex-end; }
/* 自己发送的消息不显示头像(与 mobile 一致;气泡靠右、无头像)。对方消息(各类型:文字/图片/文件/原图/语音/卡片)头像照常显示 */
.chat-page-room .chat-msg-row.mine .chat-msg-avatar { display:none; }
.chat-msg-name { font-size:11px; color:var(--ink3); margin-bottom:2px; padding:0 4px; }

/* 气泡：宽度只包住实际文本，不被 fit-content 与 max-width 互相挤压 */
.chat-msg-bubble {
  display:inline-block;
  max-width:100%;
  padding:8px 12px; border-radius:14px;
  background:#fff; color:var(--ink);
  box-shadow:0 1px 2px rgba(0,0,0,0.05);
  word-break:break-word;
  overflow-wrap:break-word;
  white-space:normal;
  line-height:1.5;
}
.chat-msg-row.mine .chat-msg-bubble {
  /* 我发的:浅蓝底 + 黑字(与"宠物"出场信息同色,但不要其边框) */
  background:rgba(115,153,198,0.12); color:#1a1a2e;
}
.chat-msg-text {
  /* 字号由 #root 的全局 zoom(var(--mf-fs)) 统一缩放,此处保持基准 px */
  font-size:14px;
  /* 关键：横向排列文本，不让父级 flex-direction:column 把字符拆成纵向 */
  display:block;
  white-space:normal;
  word-break:break-word;
  overflow-wrap:break-word;
}

/* 图片消息：气泡退化为图片本身的容器，无 padding，clip 圆角。 */
.chat-msg-bubble.chat-msg-bubble--image {
  padding:0;
  background:transparent;
  box-shadow:none;
  overflow:hidden;
  border-radius:12px;
  min-width:0;
}
.chat-msg-image {
  display:block;
  max-width:220px; max-height:280px;
  width:auto; height:auto;
  object-fit:contain;
  border-radius:12px;
  cursor:zoom-in;
}
body[data-theme="dark"] .chat-msg-bubble { background:#222; color:var(--ink); }

#chat-emoji-picker {
  display:flex; flex-wrap:wrap; gap:4px;
  padding:10px; background:rgba(255,255,255,0.95);
  border-top:1px solid var(--line); max-height:200px; overflow-y:auto;
}
body[data-theme="dark"] #chat-emoji-picker { background:rgba(20,20,30,0.95); }

.chat-img-preview {
  display:flex; gap:8px; padding:8px 12px;
  background:rgba(255,255,255,0.7); border-top:1px solid var(--line);
  overflow-x:auto;
}
.chat-img-thumb { position:relative; width:60px; height:60px; flex-shrink:0; }
.chat-img-thumb img { width:100%; height:100%; object-fit:cover; border-radius:6px; }
.chat-img-thumb-x {
  position:absolute; top:-6px; right:-6px;
  width:18px; height:18px; border-radius:50%;
  border:none; background:rgba(0,0,0,0.7); color:#fff;
  font-size:12px; cursor:pointer; line-height:1;
}

.chat-page-room .chat-input-bar {
  /* 输入框可多行撑高:按钮贴底对齐(flex-end),与微信一致 */
  display:flex; align-items:flex-end; gap:8px; padding:8px 12px;
  background:rgba(255,255,255,0.55);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
body[data-theme="dark"] .chat-page-room .chat-input-bar { background:rgba(20,20,30,0.55); }
.chat-page-room .chat-input-bar input,
.chat-page-room .chat-input-bar textarea.chat-input-ta {
  flex:1; min-width:0; padding:9px 14px; border-radius:18px;
  border:1px solid var(--line); font-size:14px; line-height:20px;
  background:rgba(255,255,255,0.85); color:var(--ink);
}
/* 多行输入框:微信式自适应高度(JS 控制 1~9 行,满则内部滚动),禁手动拖拽 */
.chat-input-bar textarea.chat-input-ta {
  font-family:inherit; outline:none; resize:none;
  overflow-y:hidden; box-sizing:border-box;
  transition:border-color .15s, box-shadow .15s;
}
.chat-input-bar textarea.chat-input-ta:focus {
  border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-light);
}
/* emoji / 图片图标按钮 + 「+」键:保持圆形 36px、贴底 */
.chat-page-room .chat-input-bar .chat-emoji-btn,
.chat-page-room .chat-input-bar .chat-voice-btn,
.chat-page-room .chat-input-bar .chat-kbd-btn,
.chat-page-room .chat-input-bar .chat-img-btn,
.chat-page-room .chat-input-bar .chat-plus-btn {
  width:36px; height:36px; border-radius:50%;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.chat-page-room .chat-input-bar .chat-emoji-btn,
.chat-page-room .chat-input-bar .chat-voice-btn,
.chat-page-room .chat-input-bar .chat-kbd-btn,
.chat-page-room .chat-input-bar .chat-img-btn {
  background:none; border:none; color:var(--ink2); padding:0;
}
/* 发送按钮：横向排列、自适应宽度，避免"发""送"上下断行 */
.chat-page-room .chat-input-bar .chat-send-btn {
  width:auto !important; height:auto !important;
  min-width:0 !important;
  padding:8px 18px !important;
  border-radius:18px !important;
  background:var(--accent); color:#fff;
  font-weight:500; font-size:14px;
  white-space:nowrap;
  border:none; cursor:pointer; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  line-height:1;
}

/* ══════ 互动消息 — 待处理加入申请卡片 ══════ */
.flight-pending-section {
  margin:12px;
  background:rgba(255,255,255,0.65);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
body[data-theme="dark"] .flight-pending-section {
  background:rgba(20,20,30,0.55);
}
.flight-pending-section-title {
  font-size:13px; font-weight:600; color:var(--ink2);
  margin-bottom:10px;
}
.flight-pending-card {
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.flight-pending-card:last-child { border-bottom:none; padding-bottom:0; }
.flight-pending-card:first-child { padding-top:0; }
.flight-pending-row {
  display:flex; align-items:flex-start; gap:10px;
}
.flight-pending-meta { flex:1; min-width:0; }
.flight-pending-name { font-size:14px; font-weight:600; color:var(--ink); }
.flight-pending-target { font-size:13px; color:var(--ink2); margin-top:3px; line-height:1.5; }
.flight-pending-sub { font-size:11px; color:var(--ink3); margin-top:3px; }
.flight-pending-actions {
  display:flex; align-items:center; gap:14px;
  margin-top:10px; padding-left:50px;
}
.flight-pending-accept { padding:6px 18px !important; }
.flight-pending-ignore {
  font-size:12px; color:var(--ink3);
  text-decoration:underline; cursor:pointer;
  user-select:none;
}
.flight-pending-ignore:hover { color:var(--ink2); }

/* 加好友：搜索结果卡片 */
.friend-search-empty {
  font-size:13px; color:var(--ink3);
  padding:10px 4px;
}
.friend-search-card {
  display:flex; align-items:center; gap:12px;
  padding:12px;
  background:rgba(var(--accent-rgb),0.05);
  border:1px solid rgba(var(--accent-rgb),0.18);
  border-radius:12px;
}
.friend-search-avatar { cursor:pointer; flex-shrink:0; }
.friend-search-info { flex:1; min-width:0; }
.friend-search-name { font-size:15px; font-weight:600; color:var(--ink); cursor:pointer; }
.friend-search-name:hover { color:var(--accent); }
.friend-search-mlid { font-size:12px; color:var(--ink3); margin-top:2px; word-break:break-all; }
.friend-search-state { font-size:12px; color:var(--ink3); padding:0 6px; }
.friend-search-actions { flex-shrink:0; }

/* 通讯录条目右侧 ❌ 删除好友 */
.contacts-item { position:relative; padding-right:42px !important; }
.contacts-item-del {
  position:absolute; top:50%; right:10px; transform:translateY(-50%);
  width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,0.05); color:var(--ink3);
  border:none; font-size:13px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0.65; transition: opacity 0.15s ease, background 0.15s ease;
}
.contacts-item-del:hover { opacity:1; background:rgba(0,0,0,0.12); color:var(--ink); }

/* 发布航线：选好友 chips + picker 弹窗行 */
.cf-friend-chip {
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 10px; border-radius:14px;
  background:rgba(var(--accent-rgb),0.10);
  color:var(--accent-dark, var(--accent));
  border:1px solid rgba(var(--accent-rgb),0.25);
  font-size:12px; line-height:1;
}
.cf-friend-chip-x {
  display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; border-radius:50%;
  background:rgba(0,0,0,0.06); color:var(--ink3);
  border:none; font-size:11px; line-height:1; cursor:pointer;
  margin-left:2px;
}
.cf-friend-chip-x:hover { background:rgba(0,0,0,0.12); color:var(--ink); }

.friend-picker-row {
  display:flex; align-items:center; gap:10px;
  padding:8px 4px;
  border-bottom:1px solid var(--line);
  cursor:pointer;
}
.friend-picker-row:last-child { border-bottom:none; }
.friend-picker-row:hover { background:rgba(0,0,0,0.02); }
.friend-picker-row input[type="checkbox"] {
  width:18px; height:18px; flex-shrink:0; cursor:pointer;
}

/* 发现页 — 好友推荐对子 */
.discover-page {
  max-width:680px; margin:0 auto;
  padding:8px 14px 80px;
}
.discover-intro {
  font-size:12px; color:var(--ink3);
  text-align:center;
  padding:8px 16px 16px;
  line-height:1.5;
}
.discover-empty {
  display:flex; flex-direction:column; align-items:center; gap:10px;
  padding:60px 24px; color:var(--ink3); text-align:center;
  font-size:14px;
}
.discover-card {
  position:relative;
  background:rgba(255,255,255,0.65);
  border:1px solid var(--line);
  border-radius:14px;
  padding:18px 16px 14px;
  margin-bottom:12px;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
body[data-theme="dark"] .discover-card { background:rgba(20,20,30,0.55); }
/* 推荐卡片右上角的浅灰小 ❌（用户点击后从页面隐藏该推荐） */
.discover-dismiss-x {
  position:absolute; top:6px; right:6px;
  width:24px; height:24px; padding:0; line-height:24px; text-align:center;
  border:none; background:transparent;
  font-size:18px; color:var(--ink3); opacity:.45;
  cursor:pointer; border-radius:50%;
  transition:opacity .15s, background .15s, color .15s;
}
.discover-dismiss-x:hover { opacity:1; background:rgba(0,0,0,0.08); color:var(--ink); }
body[data-theme="dark"] .discover-dismiss-x:hover { background:rgba(255,255,255,0.10); }

/* 推荐流航线卡片右上角"不感兴趣" × */
.flight-card-dismiss {
  position:absolute; top:6px; right:6px; z-index:2;
  width:24px; height:24px; padding:0; line-height:24px; text-align:center;
  border:none; background:transparent;
  font-size:18px; color:var(--ink3); opacity:.4;
  cursor:pointer; border-radius:50%;
  transition:opacity .15s, background .15s, color .15s;
}
.flight-card-dismiss:hover { opacity:1; background:rgba(0,0,0,0.08); color:var(--ink); }
body[data-theme="dark"] .flight-card-dismiss:hover { background:rgba(255,255,255,0.10); }
.discover-pair {
  display:flex; align-items:flex-start; justify-content:center; gap:14px;
}
.discover-person {
  flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:8px;
  text-align:center;
}
.discover-person-name {
  font-size:14px; font-weight:600; color:var(--ink);
  word-break:break-word; line-height:1.3;
}
.discover-person-sub {
  font-size:11px; color:var(--ink3);
  word-break:break-word; line-height:1.3;
}
.discover-link {
  flex-shrink:0; align-self:center;
  color:var(--ink3); padding-top:24px;
}
/* premium 推荐：保留同等留白，但不显示锁链图标 */
.discover-link--blank { width:22px; height:22px; }
.discover-reason {
  margin-top:12px;
  font-size:12px; color:var(--ink3);
  text-align:center; line-height:1.4;
}
.discover-add-btn {
  margin-top:6px;
  padding:6px 16px; border-radius:14px;
  background:var(--accent); color:#fff;
  border:none; font-size:12px; font-weight:500;
  cursor:pointer; line-height:1;
}
.discover-add-btn:hover { opacity:0.92; }
.discover-add-btn--done {
  background:rgba(0,0,0,0.06); color:var(--ink3); cursor:default;
}
body[data-theme="dark"] .discover-add-btn--done { background:rgba(255,255,255,0.08); }

/* 明星评论:名字用橙色(配合 .flight-comment-author 一起用) */
.comment-name-star { color:#f59e0b; }
.comment-name-star:hover { color:#d97706; }
/* "更多评论"弹窗中,每条评论之间用细线分隔(航线/广告/谜题共用同一弹窗) */
.flight-comment-item.with-divider { border-bottom:1px solid var(--line); }
.flight-comment-item.with-divider:last-child { border-bottom:none; }
.comments-more-btn {
  display:inline-block; margin-top:6px;
  font-size:12px; color:var(--accent);
  background:none; border:none; cursor:pointer; padding:4px 0;
}
.comments-more-btn:hover { text-decoration:underline; }
.comments-modal-list { padding:4px 0; }
/* 全局把滚动条隐藏了(见 *::-webkit-scrollbar),但"更多评论"弹窗的列表评论可能很多,
   需要给用户一条可见、可拖拽的滚动条,否则不知道还能往下翻 */
.comments-modal-list { scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.28) transparent; }
.comments-modal-list::-webkit-scrollbar { width: 8px; height: 8px; }
.comments-modal-list::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.28); border-radius: 4px;
}
.comments-modal-list::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.45); }
.comments-modal-list::-webkit-scrollbar-track { background: transparent; }
body[data-theme="dark"] .comments-modal-list { scrollbar-color: rgba(255,255,255,0.30) transparent; }
body[data-theme="dark"] .comments-modal-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.30); }
body[data-theme="dark"] .comments-modal-list::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.48); }

/* 商家推荐分隔符 */
.discover-divider {
  display:flex; align-items:center;
  margin:18px 6px 10px;
  font-size:11px; color:var(--ink3);
  letter-spacing:0.5px;
}
.discover-divider::before,
.discover-divider::after {
  content:''; flex:1; height:1px; background:var(--line, rgba(0,0,0,0.08));
}
.discover-divider span { padding:0 12px; white-space:nowrap; }

/* premium 推荐与普通好友推荐之间的灰色分隔线 */
.discover-premium-divider {
  height:1px; margin:14px 6px;
  background:var(--line, rgba(0,0,0,0.08));
}

/* premium 个人推荐：两列网格；若总数为奇数，最后一行单卡片自动居中 */
.discover-premium-grid {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
  margin-bottom:6px;
}
.discover-premium-grid > .discover-card {
  margin:0;   /* 网格自带间距 */
}
/* 网格里只有一张卡 OR 奇数张卡的最后一张：跨两列并居中 */
.discover-premium-grid > .discover-card:only-child,
.discover-premium-grid > .discover-card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  max-width:50%;
  margin-left:auto;
  margin-right:auto;
}
.discover-premium-person-wrap {
  display:flex; justify-content:center;
}

/* 商家广告卡片 */
.biz-ad-card {
  position:relative;
  background:rgba(255,255,255,0.65);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  margin-bottom:12px;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
body[data-theme="dark"] .biz-ad-card { background:rgba(20,20,30,0.55); }
.biz-ad-dismiss {
  position:absolute; top:10px; right:10px;
  width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,0.05); color:var(--ink3);
  border:none; font-size:13px; cursor:pointer; line-height:1;
  display:flex; align-items:center; justify-content:center;
  opacity:0.65; transition: opacity 0.15s ease, background 0.15s ease;
}
.biz-ad-dismiss:hover { opacity:1; background:rgba(0,0,0,0.12); color:var(--ink); }

.biz-ad-header { display:flex; align-items:center; gap:10px; padding-right:32px; }
.biz-avatar {
  width:40px; height:40px; border-radius:50%; overflow:hidden;
  background:transparent; flex-shrink:0;
}
.biz-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.biz-avatar-fallback {
  background:linear-gradient(135deg,var(--accent),var(--accent-dark,var(--accent)));
  color:#fff; display:flex; align-items:center; justify-content:center;
  font-weight:600; font-size:16px;
}
.biz-ad-name { font-size:15px; font-weight:600; color:var(--ink); }

.biz-ad-content {
  margin-top:10px; font-size:13px; line-height:1.55;
  color:var(--ink); word-break:break-word; white-space:pre-wrap;
}
.biz-ad-images {
  margin-top:10px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:6px;
}
.biz-ad-images img {
  width:100%; aspect-ratio:1/1; object-fit:cover;
  border-radius:8px; cursor:zoom-in;
}

.biz-ad-actions {
  margin-top:12px; display:flex; gap:8px; align-items:center; flex-wrap:wrap;
}
.biz-ad-btn {
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 12px; border-radius:14px;
  background:rgba(0,0,0,0.04); color:var(--ink2);
  border:none; font-size:12px; cursor:pointer; line-height:1;
}
.biz-ad-btn:hover { background:rgba(0,0,0,0.08); }
.biz-ad-btn.liked { color:var(--accent); }
.biz-ad-btn-primary {
  background:rgba(var(--accent-rgb),0.12);
  color:var(--accent-dark, var(--accent));
}
.biz-ad-btn-primary:hover { background:rgba(var(--accent-rgb),0.20); }
.biz-ad-btn-primary { margin-left:auto; }

/* 广告 / 谜题评论列表:与航线评论一致——无灰色背景,纯流式列 */
.biz-ad-comments-list {
  margin-top:8px;
}

.biz-ad-comment-bar {
  margin-top:8px;
  display:flex; gap:6px; align-items:flex-end;
}
.biz-ad-comment-bar input, .biz-ad-comment-bar textarea {
  flex:1; padding:7px 12px;
  border:1px solid var(--line); border-radius:18px;
  font-size:13px; outline:none;
  background:rgba(255,255,255,0.85); color:var(--ink);
  font-family:inherit;
}

/* 评论输入框自适应换行/撑高(input→textarea),≈6 行后内部滚动。
   与原 input 在单行时视觉一致(圆角/内边距/边框/背景沿用各自 .biz-ad-comment-bar / .flight-comment-input 规则)。 */
.comment-input-ta{
  flex:1; resize:none; overflow-y:hidden;
  min-height:34px; max-height:160px; line-height:1.5;
  word-break:break-word; overflow-wrap:anywhere; white-space:pre-wrap;
  font-family:inherit;
}

/* 航线 "new" 徽标：第一次见到时高亮提示 */
.flight-new-badge {
  display:inline-block;
  padding:1px 6px;
  background:linear-gradient(135deg,#ff6b6b,#ff3d3d);
  color:#fff;
  font-size:10px; font-weight:700;
  border-radius:4px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  line-height:1.4;
  vertical-align:middle;
}

/* 航线推荐流分段 */
.flight-section-header {
  font-size:12px; color:var(--ink3);
  margin:8px 16px 6px;
  letter-spacing:0.5px;
}
.flight-section-divider {
  position:relative;
  display:flex; align-items:center;
  margin:16px 16px 10px;
  font-size:11px; color:var(--ink3);
  letter-spacing:0.5px;
}
.flight-section-divider::before,
.flight-section-divider::after {
  content:'';
  flex:1;
  height:1px;
  background:var(--line, rgba(0,0,0,0.08));
}
.flight-section-divider span {
  padding:0 12px;
  white-space:nowrap;
}

/* 互动消息空态 + 通知项样式 */
.flight-notif-empty {
  text-align:center;
  padding:48px 24px;
  color:var(--ink3);
  font-size:14px;
}
.flight-notif-section-title {
  margin:14px 16px 8px;
  font-size:13px; font-weight:600; color:var(--ink2);
}
.flight-notif-item {
  display:flex; align-items:flex-start; gap:10px;
  padding:12px 16px;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,0.55);
}
body[data-theme="dark"] .flight-notif-item { background:rgba(20,20,30,0.55); }
.flight-notif-avatar { flex-shrink:0; display:inline-flex; }
.flight-notif-body { flex:1; min-width:0; }
.flight-notif-actor:hover { color:var(--accent); }
.flight-notif-item.unread { background:rgba(var(--accent-rgb),0.08); }
.flight-notif-actor { font-weight:600; font-size:14px; color:var(--ink); }
.flight-notif-action { font-size:13px; color:var(--ink2); margin-top:2px; }
.flight-notif-preview {
  font-size:13px; color:var(--ink); margin-top:3px;
  padding:6px 10px; border-radius:8px;
  background:rgba(0,0,0,0.04);
  word-break:break-word;
}
body[data-theme="dark"] .flight-notif-preview { background:rgba(255,255,255,0.06); }
.flight-notif-flight { font-size:12px; color:var(--ink3); margin-top:2px; }
.flight-notif-time { font-size:11px; color:var(--ink3); margin-top:4px; }
.flight-notif-del {
  width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,0.05); color:var(--ink3);
  border:none; font-size:13px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; opacity:0.7;
  transition: opacity 0.15s ease, background 0.15s ease;
}
.flight-notif-del:hover { opacity:1; background:rgba(0,0,0,0.12); color:var(--ink); }

/* 航线：发起人移出成员的浅灰 ❌ */
.flight-member-chip { position:relative; }
.flight-member-kick {
  display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; border-radius:50%;
  background:rgba(0,0,0,0.05); color:var(--ink3);
  font-size:11px; line-height:1; cursor:pointer; user-select:none;
  margin-left:2px; opacity:0.7;
  transition: opacity 0.15s ease, background 0.15s ease;
}
.flight-member-kick:hover { opacity:1; background:rgba(0,0,0,0.12); color:var(--ink); }

/* 航线：退出航线灰字下划线 */
.flight-leave-link {
  font-size:12px; color:var(--ink3);
  text-decoration:underline; cursor:pointer;
  margin-left:auto; padding:0 4px;
  user-select:none;
}
.flight-leave-link:hover { color:var(--ink2); }

/* 群聊：右上角群成员按钮 */
.chat-room-members-btn {
  width:34px; height:34px; border-radius:50%;
  background:transparent; border:none; cursor:pointer;
  color:var(--ink2);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.chat-room-members-btn:hover { background:rgba(0,0,0,0.06); color:var(--ink); }

.group-members-list {
  max-height:60vh; overflow-y:auto;
}
.group-member-row {
  display:flex; align-items:center; gap:12px;
  padding:10px 4px; cursor:pointer;
  border-bottom:1px solid var(--line);
}
.group-member-row:last-child { border-bottom:none; }
.group-member-row:hover { background:rgba(0,0,0,0.02); }

/* 航线页头部图标条：合理排布、不重叠 */
.flight-page-header { gap:8px; }
.flight-page-header .logo-icon { flex:0 1 auto; min-width:0; overflow:hidden; }
.flight-page-header .spacer { flex:1; }
.flight-notif-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:14px;
  background:rgba(var(--accent-rgb),0.10);
  color:var(--accent-dark, var(--accent));
  border:1px solid rgba(var(--accent-rgb),0.25);
  font-size:13px; font-weight:500; cursor:pointer;
  flex-shrink:0; line-height:1; white-space:nowrap;
}
.flight-notif-btn:hover { background:rgba(var(--accent-rgb),0.18); }
.flight-notif-btn .flight-notif-label {
  font-size:13px;
}
.flight-notif-count {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:20px; height:20px; padding:0 6px;
  border-radius:10px;
  background:var(--error,#ef4444); color:#fff;
  font-size:11px; font-weight:600; line-height:20px;
  flex-shrink:0;
}
.flight-page-header .theme-toggle-btn { flex-shrink:0; }
@media (max-width:480px) {
  .flight-notif-btn .flight-notif-label { display:none; }
  .flight-page-header .logo-name { font-size:16px; }
}

/* 密码输入框 + 眼睛切换可见性 */
.password-input-wrap { position:relative; display:block; }
.password-input-wrap input { padding-right:40px; width:100%; box-sizing:border-box; }
.password-toggle-btn {
  position:absolute; top:50%; right:8px; transform:translateY(-50%);
  width:30px; height:30px; padding:0;
  border:none; background:transparent; cursor:pointer;
  color:var(--ink3); display:flex; align-items:center; justify-content:center;
  border-radius:50%;
}
.password-toggle-btn:hover { background:rgba(0,0,0,0.04); color:var(--ink2); }
.password-toggle-btn .eye-icon { display:block; }

/* "进入好友列表" 入口按钮 + 红点徽标 */
.contacts-entry-btn {
  display:inline-flex; align-items:center; gap:10px;
  cursor:pointer; padding:6px 12px; border-radius:10px;
  background:rgba(255,255,255,0.55);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.8);
  transition:all 0.2s ease;
}
.contacts-entry-btn:hover { background:rgba(255,255,255,0.75); }
.contacts-entry-badge {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:18px; height:18px; padding:0 6px;
  border-radius:9px;
  background:var(--error,#ef4444); color:#fff;
  font-size:11px; font-weight:600; line-height:18px;
}

/* 好友请求行 */
.friend-req-row {
  display:flex; align-items:center; gap:12px;
  padding:10px 0; border-bottom:1px solid var(--border);
}
.friend-req-row:last-child { border-bottom:none; }
.friend-req-avatar { cursor:pointer; flex-shrink:0; }
.friend-req-info { flex:1; min-width:0; }
.friend-req-name { font-size:14px; font-weight:500; color:var(--ink); cursor:pointer; }
.friend-req-name:hover { color:var(--accent); }
.friend-req-msg-text { font-size:12px; color:var(--ink3); margin-top:2px; }
.friend-req-sub { font-size:11px; color:var(--ink3); margin-top:3px; }
.friend-req-actions { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.friend-req-ignore {
  font-size:12px; color:var(--ink3);
  text-decoration:underline; cursor:pointer;
}
.friend-req-ignore:hover { color:var(--ink2); }
.friend-req-status { font-size:13px; flex-shrink:0; }

/* 行内浅灰色小 ❌（用于删除一条记录） */
.row-dismiss-x {
  flex-shrink:0; margin-left:8px;
  width:22px; height:22px; padding:0; line-height:22px; text-align:center;
  border:none; background:transparent;
  font-size:18px; color:var(--ink3); opacity:.55;
  cursor:pointer; border-radius:50%;
  transition:opacity .15s, background .15s, color .15s;
}
.row-dismiss-x:hover { opacity:1; background:rgba(0,0,0,0.08); color:var(--ink); }
body[data-theme="dark"] .row-dismiss-x:hover { background:rgba(255,255,255,0.10); }

/* 用户信息卡片 */
.user-info-list {
  background:rgba(0,0,0,0.02);
  border-radius:10px;
  padding:8px 12px;
}
body[data-theme="dark"] .user-info-list { background:rgba(255,255,255,0.04); }
.user-info-row {
  display:flex; justify-content:space-between; gap:12px;
  padding:8px 0; border-bottom:1px solid var(--line);
  font-size:13px;
}
.user-info-row:last-child { border-bottom:none; }
.user-info-key { color:var(--ink3); flex-shrink:0; }
.user-info-val { color:var(--ink); text-align:right; word-break:break-word; }

/* ── 好友资料卡:苹果系统设置风格开关行(设为私密 / 不看推荐 / 不给推荐) ── */
.friend-switch-list { margin-top:16px; }
.friend-switch-row {
  display:flex; align-items:center; justify-content:space-between;
  padding:11px 2px; border-bottom:1px solid var(--line);
}
.friend-switch-row:last-child { border-bottom:none; }
.friend-switch-label { font-size:15px; color:var(--ink); }
/* 胶囊轨道 + 白色圆形滑块,默认关闭时滑块在左、轨道灰色 #5a595f */
.mf-switch {
  position:relative; display:inline-block;
  width:48px; height:30px; flex-shrink:0; cursor:pointer;
  -webkit-tap-highlight-color:transparent; user-select:none;
}
.mf-switch .mf-switch-track {
  position:absolute; inset:0; border-radius:999px;
  background:#5a595f; transition:background .22s ease;
}
.mf-switch .mf-switch-knob {
  position:absolute; top:3px; left:3px;
  width:24px; height:24px; border-radius:50%;
  background:#fff; box-shadow:0 1px 3px rgba(0,0,0,0.35);
  transition:transform .22s ease;
}
.mf-switch.on .mf-switch-knob { transform:translateX(18px); }
.mf-switch.on.green .mf-switch-track { background:#2ed259; }
.mf-switch.on.red   .mf-switch-track { background:#fa4343; }

/* 聊天列表条目右侧的隐藏 ❌ */
.chat-conv-hide-btn {
  position:absolute; top:50%; right:8px; transform:translateY(-50%);
  width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,0.05); color:var(--ink3);
  border:none; font-size:13px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0.65; transition:opacity 0.15s ease, background 0.15s ease;
}
.chat-conv-hide-btn:hover { opacity:1; background:rgba(0,0,0,0.12); }

/* 航线卡片：进入群聊按钮 */
.flight-group-chat-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:14px;
  background:rgba(var(--accent-rgb),0.10);
  color:var(--accent-dark, var(--accent));
  border:1px solid rgba(var(--accent-rgb),0.25);
  font-size:13px; font-weight:500; cursor:pointer;
}
.flight-group-chat-btn:hover { background:rgba(var(--accent-rgb),0.18); }

/* 联系人列表头像对齐 */
.contacts-item { display:flex; align-items:center; gap:12px; padding:12px 16px; cursor:pointer; border-bottom:1px solid var(--line); }
.contacts-item:hover { background:rgba(0,0,0,0.02); }
.contacts-item-info { flex:1; min-width:0; }
.contacts-item-name { font-size:15px; font-weight:500; color:var(--ink); }
.contacts-item-note { font-size:12px; color:var(--ink3); margin-top:2px; }

/* 聊天列表 — 重写整条规则，覆盖 line 975 的旧版以避免视觉冲突 */
.chat-conv-item {
  position:relative;
  display:flex; align-items:center; gap:12px;
  padding:12px 44px 12px 14px !important;   /* 右边给隐藏按钮预留 */
  margin:0 !important;
  cursor:pointer;
  border:none !important;
  border-bottom:1px solid var(--line) !important;
  border-radius:0 !important;               /* 去掉 line 975 的圆角，避免和 border-bottom 错位 */
  background:transparent;
  transition:background 0.15s ease;
}
.chat-conv-item:hover { background:rgba(0,0,0,0.03); }
.chat-conv-item:last-child { border-bottom:none !important; }

.chat-conv-avatar-wrap { position:relative; flex-shrink:0; }
.chat-conv-info { flex:1; min-width:0; }
.chat-conv-name {
  font-size:15px; font-weight:500; color:var(--ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.chat-conv-last { font-size:13px; color:var(--ink3); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.unread-badge {
  position:absolute; top:-4px; right:-4px;
  background:var(--error,#ef4444); color:#fff;
  font-size:11px; min-width:18px; height:18px;
  border-radius:9px; padding:0 5px; line-height:18px;
  text-align:center; font-weight:600;
}

/* ── pro / promax 角标 ─────────────────────────────────────────
   promax.md 第 19 条:在名字右侧用浅灰色小字显示"pro",或用 #5A2D81 小字显示"promax"。
   .user-badge-slot 是占位 <span>,加载完批量 tier 数据后由 JS 填充内容。 */
.user-badge-slot { display:inline-block; vertical-align:middle; }
.user-badge {
  display:inline-block; margin-left:6px;
  font-size:11px; font-weight:600; letter-spacing:0.3px;
  line-height:1; vertical-align:middle;
  font-family:-apple-system,"Helvetica Neue",sans-serif;
}
.user-badge-pro { color:var(--ink3); }
.user-badge-promax { color:#5A2D81; }

/* ── 人脉搜索(promax.md 阶段 2) ──────────────────────────── */
.conn-form {
  padding: 12px 16px;
  background: var(--card);
  border-bottom: 1px solid var(--line);
}
.conn-form-row {
  display: flex; gap: 8px; margin-bottom: 8px;
}
.conn-input {
  flex: 1; padding: 9px 12px;
  border: 1.5px solid var(--border-solid);
  border-radius: 8px; font-size: 14px;
  background: var(--card-solid, #fff); color: var(--ink);
}
.conn-input:focus { border-color: var(--accent); outline: none; }
.conn-deg-label {
  font-size: 12px; color: var(--ink3); margin: 8px 0 6px;
}
.conn-deg-chips {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px;
}
.conn-chip {
  padding: 5px 12px; border-radius: 14px;
  font-size: 12px; cursor: pointer; user-select: none;
  border: 1px solid var(--border-solid);
  background: var(--card-solid, #fff); color: var(--ink2);
  transition: all 0.15s;
}
.conn-chip:hover { border-color: var(--accent); }
.conn-chip.on {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.conn-form-actions {
  display: flex; justify-content: flex-end; gap: 8px;
}

.conn-results { padding: 12px 12px 28px; }
.conn-empty {
  text-align: center; color: var(--ink3); font-size: 14px;
  padding: 48px 20px;
}
.conn-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px;
}
/* 末尾落单时居中(类似发现页 premium grid) */
.conn-grid > .conn-card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  max-width: calc(50% - 5px);
  margin: 0 auto;
}
.conn-card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 12px; padding: 14px 12px; text-align: center;
  cursor: pointer; transition: box-shadow 0.15s, transform 0.15s;
  min-height: 140px;
}
.conn-card:hover {
  box-shadow: 0 6px 18px rgba(124, 58, 237, 0.10);
  transform: translateY(-1px);
}
.conn-card-avatar { display: flex; justify-content: center; margin-bottom: 8px; }
.conn-card-name {
  font-size: 14px; font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.conn-card-degree {
  font-size: 11px; color: var(--accent); margin-top: 2px;
  font-weight: 600;
}
.conn-card-sub {
  font-size: 11px; color: var(--ink3); margin-top: 4px;
  line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.conn-card-motto {
  font-size: 11px; color: var(--ink2); margin-top: 4px;
  font-style: italic;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* 人脉链 modal */
.conn-chain-flow {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 8px;
  padding: 8px 0;
}
.conn-chain-node {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px; min-width: 70px;
  padding: 6px;
}
.conn-chain-name {
  font-size: 12px; color: var(--ink);
  max-width: 80px; text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.conn-chain-arrow {
  font-size: 18px; color: var(--accent); padding: 0 4px;
}

/* ── 谜题(promax.md 阶段 3) ──────────────────────────── */
.discover-puzzle-section { padding: 0 12px; margin: 10px 0; }
.discover-puzzle-section-title {
  font-size: 13px; font-weight: 600; color: var(--ink2);
  padding: 8px 4px;
  border-top: 1px solid var(--line); margin-top: 8px;
}
.puzzle-card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 14px; padding: 14px;
  margin-bottom: 12px;
}
.puzzle-card-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
}
.puzzle-card-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #7c3aed, #5A2D81);
  color: #fff; font-weight: 700; font-size: 18px;
  flex-shrink: 0;
}
.puzzle-card-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px; border-radius: 10px;
  font-size: 11px; color: var(--ink2);
  background: rgba(124, 58, 237, 0.08);
}
.puzzle-card-pill svg { color: var(--accent); }
.puzzle-card-op-edit,
.puzzle-card-op-del,
.puzzle-card-op-dismiss {
  background: transparent; border: none; cursor: pointer;
  font-size: 12px; color: var(--ink3); padding: 4px 8px;
}
.puzzle-card-op-edit:hover { color: var(--accent); }
.puzzle-card-op-del:hover { color: var(--error); }
.puzzle-card-op-dismiss { font-size: 18px; padding: 4px 6px; line-height: 1; }
.puzzle-card-op-dismiss:hover { color: var(--ink); }
.puzzle-card-text {
  font-size: 15px; line-height: 1.5; color: var(--ink);
  white-space: pre-wrap; word-break: break-word;
  margin-bottom: 8px;
}
.puzzle-card-images {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px;
}
.puzzle-card-images img {
  width: 80px; height: 80px; object-fit: cover; border-radius: 8px;
  cursor: pointer;
}
.puzzle-card-meta {
  display: flex; gap: 8px; font-size: 12px; color: var(--ink3);
  margin-bottom: 10px; flex-wrap: wrap;
}
.puzzle-card-meta strong { color: var(--ink2); font-weight: 600; }
.puzzle-card-answer-row {
  display: flex; gap: 6px; margin: 8px 0;
}
.puzzle-card-answer-input {
  flex: 1; padding: 8px 12px;
  border: 1.5px solid var(--border-solid); border-radius: 8px;
  font-size: 14px; background: var(--card-solid, #fff); color: var(--ink);
}
.puzzle-card-answer-input:focus { border-color: var(--accent); outline: none; }
.puzzle-card-solved {
  font-size: 13px; color: var(--success, #059669);
  background: rgba(5,150,105,0.10);
  padding: 8px 12px; border-radius: 8px;
  margin: 8px 0; text-align: center;
}
.puzzle-card-attempt-exhausted {
  font-size: 12px; color: var(--ink3); text-align: center;
  padding: 8px; margin: 8px 0;
  background: rgba(0,0,0,0.04); border-radius: 8px;
}
.puzzle-card-ops-bar {
  display: flex; gap: 18px;
  padding-top: 8px; border-top: 1px solid var(--line);
}
.puzzle-card-op {
  background: transparent; border: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 13px; color: var(--ink3); padding: 4px 0;
}
.puzzle-card-op:hover { color: var(--accent); }

/* ── 剪报(新民晚报风格)──────────────────────────────────────── */
/* 信息流最底部的小段标题,如"剪报" */
.news-clip-section-header {
  margin: 18px 16px 4px; font-size: 13px; font-weight: 600;
  color: var(--ink3); letter-spacing: 1px;
}
/* 单篇剪报卡片:浅灰底、圆角、相对定位(承载右上角按钮) */
/* 剪报卡片仿纸质印刷:亮色模式浅灰底(#f9f9f9)+ 深色文字;
   深色模式改用深色卡片 + 浅色文字(见下方 [data-theme="dark"] 覆盖)。 */
.news-clip {
  position: relative;
  margin: 8px 16px 14px; padding: 16px 16px 14px;
  background: #f9f9f9; border-radius: var(--radius);
  box-shadow: var(--shadow-sm); overflow: hidden;
}
body[data-theme="dark"] .news-clip { background: rgba(255,255,255,0.06); }
/* 标题:黑体加粗、居中(字号随字体设置 --mf-fs 缩放) */
.news-clip-title {
  text-align: center; font-weight: 700;
  font-size: 19px;
  line-height: 1.4; color: #1a1a1a;
  font-family: "PingFang SC", "Microsoft YaHei", "Heiti SC", sans-serif;
  /* 给右上角两个按钮预留横向空间,避免标题压到按钮上 */
  padding: 0 64px;
}
body[data-theme="dark"] .news-clip-title { color: var(--ink); }
/* 作者行:左对齐、缩进约两个汉字;有头像时头像在名字左侧 */
.news-clip-author {
  display: flex; align-items: center; gap: 6px;
  padding-left: 2em; margin-top: 14px;
  font-size: 14px; color: #333;
}
body[data-theme="dark"] .news-clip-author { color: #ececec; }
/* 正文段落:段间留白、无首行缩进、行距舒适、保留段内换行;
   字号 / 行距加大利于长文阅读,且随字体设置 --mf-fs 缩放。 */
.news-clip-para {
  margin-top: 12px;
  font-size: 16px; line-height: 1.85;
  color: #222; text-indent: 0;
  white-space: pre-wrap; word-break: break-word;
}
body[data-theme="dark"] .news-clip-para { color: #d8d8d8; }
/* 图片区(0~3 张) */
.news-clip-images {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px;
}
.news-clip-image {
  max-width: 100%; border-radius: 8px; cursor: pointer;
  object-fit: cover;
}
/* 右上角操作区:折叠/展开 + 浅灰 ❌ */
.news-clip-actions {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  display: flex; align-items: center; gap: 4px;
}
.news-clip-toggle {
  border: none; background: transparent; cursor: pointer;
  font-size: 12px; color: var(--ink3); padding: 2px 8px;
  border-radius: 10px; transition: background .15s, color .15s;
}
.news-clip-toggle:hover { color: var(--ink); background: rgba(0,0,0,0.06); }
body[data-theme="dark"] .news-clip-toggle:hover { background: rgba(255,255,255,0.10); }
.news-clip-remove {
  width: 22px; height: 22px; padding: 0; line-height: 22px; text-align: center;
  border: none; background: transparent;
  font-size: 16px; color: #bbb; opacity: .8;
  cursor: pointer; border-radius: 50%;
  transition: opacity .15s, background .15s, color .15s;
}
.news-clip-remove:hover { opacity: 1; color: var(--ink2); background: rgba(0,0,0,0.06); }
body[data-theme="dark"] .news-clip-remove:hover { background: rgba(255,255,255,0.10); }
.puzzle-card-op.active { color: var(--error, #dc2626); }

/* ── 剪报划线(highlight)UI ───────────────────────────────────── */
/* 「我」的划线:正文上的浅灰下划线,点击可删除 */
.news-hl {
  border-bottom: 2px solid #bbb;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.news-hl:hover { border-bottom-color: #888; background: rgba(0,0,0,0.04); }
body[data-theme="dark"] .news-hl { border-bottom-color: #888; }
body[data-theme="dark"] .news-hl:hover { border-bottom-color: #bbb; background: rgba(255,255,255,0.08); }
/* 聊天气泡里「共同划线」消息中,重叠部分的浅灰下划线(非交互,行内不影响换行) */
.news-msg-hl {
  text-decoration: underline;
  text-decoration-color: #bbb;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}
body[data-theme="dark"] .news-msg-hl { text-decoration-color: #888; }

/* 浮动「划线」按钮:选中正文后浮出在选区附近(fixed/absolute,随文档定位) */
.news-hl-float-btn {
  position: fixed; z-index: 9999;
  padding: 5px 14px; border: none; border-radius: 16px;
  background: #1a1a1a; color: #fff;
  font-size: 13px; font-weight: 600; cursor: pointer;
  box-shadow: 0 3px 10px rgba(0,0,0,0.28);
  white-space: nowrap;
}
.news-hl-float-btn:active { transform: scale(.96); }
body[data-theme="dark"] .news-hl-float-btn { background: #f2f2f2; color: #1a1a1a; }

/* 划线区底栏:额度标签 + 查看重叠好友按钮 */
.news-clip-hlbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 16px; padding-top: 10px;
  border-top: 1px dashed rgba(0,0,0,0.10);
}
body[data-theme="dark"] .news-clip-hlbar { border-top-color: rgba(255,255,255,0.12); }
.news-clip-overlap-btn {
  margin-left: auto;
  border: 1px solid rgba(0,0,0,0.12); background: transparent;
  cursor: pointer; font-size: 12px; color: var(--ink2);
  padding: 4px 12px; border-radius: 14px;
  transition: background .15s, color .15s, border-color .15s;
}
.news-clip-overlap-btn:hover { color: var(--ink); background: rgba(0,0,0,0.05); }
body[data-theme="dark"] .news-clip-overlap-btn { border-color: rgba(255,255,255,0.18); }
body[data-theme="dark"] .news-clip-overlap-btn:hover { background: rgba(255,255,255,0.10); }

/* 重叠好友面板 */
.news-clip-overlap-panel {
  margin-top: 10px; padding: 8px;
  background: rgba(0,0,0,0.03); border-radius: 10px;
}
body[data-theme="dark"] .news-clip-overlap-panel { background: rgba(255,255,255,0.05); }
.news-clip-overlap-empty {
  font-size: 13px; color: var(--ink3); text-align: center; padding: 8px 0;
}
.news-clip-overlap-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 4px;
}
.news-clip-overlap-row + .news-clip-overlap-row {
  border-top: 1px solid rgba(0,0,0,0.06);
}
body[data-theme="dark"] .news-clip-overlap-row + .news-clip-overlap-row { border-top-color: rgba(255,255,255,0.08); }
.news-clip-overlap-name {
  font-size: 14px; color: var(--ink); font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}
.news-clip-degree-badge {
  flex-shrink: 0;
  font-size: 11px; font-weight: 600; color: #5A2D81;
  background: rgba(90,45,129,0.12);
  padding: 1px 7px; border-radius: 9px;
}
body[data-theme="dark"] .news-clip-degree-badge { color: #cbb1e8; background: rgba(164,121,202,0.20); }
.news-clip-overlap-send {
  margin-left: auto; flex-shrink: 0;
  border: none; background: rgba(115,153,198,0.12); color: #187ABA;
  cursor: pointer; font-size: 12px; font-weight: 600;
  padding: 5px 14px; border-radius: 14px;
  transition: opacity .15s;
}
.news-clip-overlap-send:hover { opacity: .88; }
.news-clip-overlap-hint {
  font-size: 11px; color: var(--ink3);
  margin-top: 6px; padding: 0 4px;
}

/* ── 全局字体大小（设置页 小/中/大 → --mf-fs = 1 / 1.15 / 1.3）──────────────
   做法:对内容根 #root（以及弹层 .modal-box）整体 zoom,这样无论文字是写在 class 里
   还是内联 style="font-size:..px" 都会一起放大 —— 广告/朋友圈/航线发布/航线显示/聊天
   /剪报等全部内容"全方位"缩放,和微信一致。
   底部导航在独立的 #app-nav 里(不在 #root 内),天然不受影响;
   顶部栏目(页面顶栏 / 聊天顶栏 / 朋友圈墙顶栏)用反向 zoom 抵消,保持原始字号不变。 */
#root,
.modal-box { zoom: var(--mf-fs, 1); }
/* 顶部栏目反向缩放 → 实际字号 = var(--mf-fs) * (1/var(--mf-fs)) = 1（不变） */
.chat-page-header,
.chat-header,
.hf-wall-topbar,
.page-header { zoom: calc(1 / var(--mf-fs, 1)); }

/* ══════════ 语音消息 ══════════ */
/* 输入栏「按住说话」模式(布局与 mobile 一致:语音/键盘按钮 · 输入框/按住说话 · 表情 · +)
   .voice-mode 时:左侧语音键变键盘键,文本框换成「按住说话」;表情按钮两种模式都在。
   —— 这几条是"模式开关",必须压过更高优先级的尺寸/基础按钮样式
      (.chat-page-room .chat-input-bar .chat-kbd-btn{display:flex} 和 .chat-input-bar button{display:flex}),
      否则键盘模式下键盘键 / 「按住说话」会一直显示。故用 !important 强制生效。 */
.chat-kbd-btn{ display:none !important; }                              /* 默认(键盘模式):隐藏键盘键,只显示语音键 */
.chat-input-bar.voice-mode .chat-voice-btn{ display:none !important; }  /* 语音模式:隐藏语音键 */
.chat-input-bar.voice-mode .chat-kbd-btn{ display:flex !important; }    /* 语音模式:显示键盘键 */
.chat-hold-btn{ display:none !important; }                             /* 默认(键盘模式):不显示「按住说话」 */
.chat-input-bar.voice-mode #chatInput{ display:none !important; }       /* 语音模式:隐藏文本框 */
.chat-input-bar.voice-mode .chat-hold-btn{ display:block !important; flex:1; }  /* 语音模式:「按住说话」替换文本框 */
.chat-input-bar .chat-hold-btn{
  width:auto; height:38px; border-radius:20px;
  border:1.5px solid var(--border-solid); background:transparent;
  color:var(--ink2); font-size:14px; font-weight:600; letter-spacing:1px;
  font-family:inherit; cursor:pointer;
  touch-action:none; user-select:none; -webkit-user-select:none;
}
.chat-input-bar .chat-hold-btn:active{ background:rgba(var(--accent-rgb),0.12); }
.chat-input-bar button.chat-hold-btn:not(:disabled):hover{ transform:none; }

/* 录音浮层(微信式):录音气泡(声波) + 两个弧形区域(取消/发送) + 底部提示 */
.chat-voice-overlay{
  position:fixed; inset:0; z-index:4000; pointer-events:none;
  display:flex; flex-direction:column; justify-content:flex-end; align-items:center;
  background:rgba(0,0,0,0.32);
}
/* 录音气泡(声波),向上浮 */
.cvo-panel{
  margin-top:24vh; margin-bottom:auto;
  min-width:128px; border-radius:18px; padding:13px 22px;
  display:flex; flex-direction:column; align-items:center; gap:5px;
  background:#7399c6; color:#fff; position:relative;  /* 正常态:蓝色(与气泡/头像同色) */
  transition:transform .18s ease, background .18s ease;
}
.cvo-panel.cancel{ background:#e15b4c; transform:translateX(-66px) scaleX(0.72); }  /* 进入取消:变红+变窄+移到左上"取消"正上方 */
.cvo-panel::after{   /* 气泡小尾巴 */
  content:''; position:absolute; left:50%; bottom:-7px; width:15px; height:15px;
  background:inherit; transform:translateX(-50%) rotate(45deg); border-radius:3px;
}
.cvo-dur{ font-size:13px; font-weight:500; opacity:.9; }
.cvo-wave{ display:flex; align-items:center; height:24px; gap:3px; position:relative; z-index:1; }
.cvo-wave span{
  width:3px; height:100%; border-radius:3px; background:#fff;
  transform:scaleY(0.35); transform-origin:center;
  animation: cvWave 0.6s ease-in-out infinite alternate;
}
@keyframes cvWave{ from{ transform:scaleY(0.35); } to{ transform:scaleY(1); } }
/* 上方并排两个条状弧形(胶囊条):取消 / 发送 */
.cvo-zones{ display:flex; gap:22px; margin-bottom:18px; z-index:1; }
.cvo-zone{
  min-width:108px; height:60px; border-radius:30px; padding:0 32px;
  display:flex; align-items:center; justify-content:center;
  font-size:16px; color:rgba(255,255,255,0.9); background:rgba(120,122,134,0.55);
}
.cvo-zone.active{ background:rgba(255,255,255,0.96); color:#222; }
.cvo-zone.cvo-cancel.active{ background:#fff; color:#e15b4c; }   /* 取消选中 → 红字 */
/* 底部"球切面状"按住录制区(大,弧顶) */
.cvo-hold{
  width:100%; height:120px;
  background:rgba(210,212,220,0.5);
  border-radius:50% 50% 0 0 / 62px 62px 0 0;   /* 宽而浅的弧顶 = 球切面(缩小) */
  display:flex; align-items:flex-start; justify-content:center; padding-top:26px;
  font-size:15px; color:rgba(255,255,255,0.92);
}
.cvo-hold.active{ background:rgba(238,239,244,0.62); color:#222; }

/* 语音消息气泡:微信式"从源扩散"声波 + 时长;播放时两道弧依次淡入淡出 */
.chat-msg-voice{ display:flex; align-items:center; gap:8px; cursor:pointer; min-width:64px; padding-right:var(--cv-pad,8px); }
.chat-msg-row.mine .chat-msg-voice{ flex-direction:row-reverse; padding-right:0; padding-left:var(--cv-pad,8px); }
.chat-msg-voice .cv-wave-svg{ flex-shrink:0; }
.chat-msg-row.mine .cv-wave-svg{ transform:scaleX(-1); }   /* 自己发的:声波开口朝左 */
.chat-msg-voice .cv-arc{ opacity:1; }
.chat-msg-voice.playing .cv-arc1{ animation: cvArc 1.1s ease-in-out infinite; }
.chat-msg-voice.playing .cv-arc2{ animation: cvArc 1.1s ease-in-out infinite; animation-delay:.45s; }
@keyframes cvArc{ 0%,100%{ opacity:.2; } 45%{ opacity:1; } }
.chat-msg-voice .cv-dur{ font-size:12px; font-weight:600; flex-shrink:0; min-width:20px; text-align:center; }