/* ═══ B平台表格修正（自动注入）═══ */
.rili-markdown-renderer table { display:table!important; table-layout:auto!important; width:100%!important; border-collapse:collapse!important; }
.rili-markdown-renderer table caption { display:table-caption!important; caption-side:top!important; text-align:center!important; padding:8px!important; }
.rili-markdown-renderer thead { display:table-header-group!important; }
.rili-markdown-renderer tbody { display:table-row-group!important; }
.rili-markdown-renderer tr { display:table-row!important; }
.rili-markdown-renderer th, .rili-markdown-renderer td { display:table-cell!important; }

/* ═══ B平台按钮组保护（自动注入 — 防止按钮消失）═══
   原理：B平台消息操作按钮结构为：
   .flex.items-center.gap-1.ml-auto (hover显隐包装)
     └── .bg-muted.rounded.flex.p-0.5 (按钮组容器)
           └── button.rounded-full.size-7 (单个按钮)
   以下规则使用高specificity + !important确保按钮
   不被任何转换后/透传的CSS规则意外隐藏
   ═══════════════════════════════════════════════ */
/* 按钮组容器保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5,
.is-user .bg-muted.rounded.flex.p-0\.5,
.is-assistant .bg-muted.rounded.flex.p-0\.5 {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  clip: auto !important;
  clip-path: none !important;
}
/* 单个按钮保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5 > button,
.is-user .bg-muted.rounded.flex.p-0\.5 > button,
.is-assistant .bg-muted.rounded.flex.p-0\.5 > button {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  clip: auto !important;
  clip-path: none !important;
}
/* hover显隐包装层保护 — 仅保留B平台原生的opacity过渡 */
.flex.items-center.gap-1.ml-auto.md\:opacity-0.group-hover\:opacity-100 {
  visibility: visible !important;
  display: flex !important;
  pointer-events: auto !important;
  overflow: visible !important;
}
/* 操作行保护 */
.flex.w-full.items-center.justify-between.gap-2.px-2 {
  display: flex !important;
  visibility: visible !important;
  overflow: visible !important;
}

/* ========== 1. 隐藏顶部颜色条 ========== */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* ========== 2. 统一聊天框（双方共用基底） ========== */
.is-user > .border.border-muted,
.is-assistant > .border.border-muted {
    border-radius: 16px !important;
    box-shadow: 0 4px 14px rgba(255, 128, 171, 0.12) !important;
    padding: 12px 16px !important;
    transition: box-shadow 0.2s ease !important;
    position: relative !important;
    isolation: isolate !important;
}

/* 对方（输出）气泡：暖粉渐变 */
.is-assistant > .border.border-muted {
    background: linear-gradient(135deg, #fff5f7 0%, #fce4ec 100%) !important;
    border: 1px solid rgba(255, 182, 193, 0.35) !important;
}

/* 自己（输入）气泡：淡蓝渐变 */
.chat-user-container .is-user > .border.border-muted,
.is-assistant > .border.border-muted {
    background: linear-gradient(135deg, #f0f8ff 0%, #e6f2ff 100%) !important;
    border: 1px solid rgba(173, 216, 230, 0.45) !important;
}

/* ========== 3. 文本绝对可读 ========== */
.rili-markdown-renderer {
    color: #333333 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ========== 4. 底部附加元素 ========== */
.bg-muted.rounded.flex.p-0\.5 > button.rounded-full.size-7{
    color: #8a8a8a !important;
    font-weight: 500 !important;
    transition: color 0.2s !important;
}
.flex.items-center.gap-2.text-xs.font-mono.text-muted-foreground {
    color: #9e9e9e !important;
}
/* [Token消耗hover逻辑转换未启用]
.text-orange-500 {
    color: #b8937a !important;
}
*/

/* ========== 5. 移动端微调 ========== */
@media (max-width: 480px) {
    .is-user > .border.border-muted,
.is-assistant > .border.border-muted {
        border-radius: 12px !important;
        padding: 10px 12px !important;
    }
    .rili-markdown-renderer { font-size: 14px !important; }
}

/* ========== 6. 减少动效偏好 ========== */
@media (prefers-reduced-motion: reduce) {
    .is-user > .border.border-muted,
.is-assistant > .border.border-muted { transition: none !important; }
}

/* ========== 核心变量与容器 ========== */
ai {
  --bg: #faf8f5;
  --card-bg: #ffffff;
  --primary: #e8956a;
  --primary-soft: #fef0e8;
  --accent: #5b8c85;
  --accent-soft: #edf6f4;
  --text: #4a4a4a;
  --text-light: #6b6b6b;
  --border: #f0e8e0;
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  --radius: 16px;
  --gap: 16px;
  --font: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  display: block;
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  padding: var(--gap);
  border-radius: 24px;
  line-height: 1.6;
  max-width: 100%;
  box-sizing: border-box;
}

/* ========== 卡片系统 ========== */
ai .card {
  background: var(--card-bg);
  border-radius: var(--radius);
  margin-bottom: var(--gap);
  box-shadow: var(--shadow);
  overflow: hidden;
  border: 1px solid var(--border);
  transition: box-shadow 0.3s ease;
}
ai .card:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
ai .card summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  font-weight: 700;
  font-size: 1.05em;
  background: linear-gradient(135deg, var(--primary-soft), #fff5f0);
  cursor: pointer;
  user-select: none;
  color: var(--primary);
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}
ai .card summary:hover {
  background: linear-gradient(135deg, #fde4d4, #fff0e5);
}
ai .card summary span { font-size: 1.2em; }
ai .card[open] > summary {
  border-bottom: 1px solid var(--primary);
  background: linear-gradient(135deg, #fde4d4, #ffe8d5);
}

/* ========== 网格系统 ========== */
ai .grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px var(--gap);
  margin: 10px 0;
}
ai .grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
  padding: 12px 18px;
}

/* ========== 文本排版 ========== */
ai b { color: var(--accent); font-weight: 600; }
ai p { margin: 4px 0 0 0; color: var(--text-light); font-size: 0.95em; }
ai .section { margin: 12px 0; }

ai .highlight-box {
  background: var(--primary-soft);
  border-left: 4px solid var(--primary);
  padding: 10px 14px;
  border-radius: 0 12px 12px 0;
  margin: 12px 0;
  font-size: 0.95em;
}

/* ========== 主角信息卡片内部 ========== */
ai .profile-main { padding: 16px 18px; }
ai .profile-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
ai .avatar {
  font-size: 2.2em;
  background: var(--primary-soft);
  border-radius: 50%;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--primary);
}
ai .tag {
  background: var(--accent-soft);
  color: var(--accent);
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 0.8em;
  font-weight: 600;
}
ai h3 { margin: 0; color: var(--primary); font-size: 1.2em; }

/* ========== NPC卡片网格（三张卡片均已完整美化） ========== */
ai .npc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--gap);
  padding: 16px;
}

ai .npc-card {
  background: #fefcf9;
  border-radius: 12px;
  padding: 16px;
  border: 1px solid var(--border);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

/* 夏沫 – 暖粉色系 */
ai .npc-card.n1 {
  border-top: 3px solid #f4a0a0;
  background: linear-gradient(135deg, #fff8f8 0%, #fefcf9 100%);
  box-shadow: 0 2px 8px rgba(244, 160, 160, 0.12);
}

/* 晏知遥 – 淡蓝色系 */
ai .npc-card.n2 {
  border-top: 3px solid #8eaae4;
  background: linear-gradient(135deg, #f5f8ff 0%, #fefcf9 100%);
  box-shadow: 0 2px 8px rgba(142, 170, 228, 0.12);
}

/* 顾清词 – 淡紫色系 */
ai .npc-card.n3 {
  border-top: 3px solid #b09ad4;
  background: linear-gradient(135deg, #f8f5fc 0%, #fefcf9 100%);
  box-shadow: 0 2px 8px rgba(176, 154, 212, 0.12);
}

/* 悬停效果统一 */
ai .npc-card.n1:hover,
ai .npc-card.n2:hover,
ai .npc-card.n3:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

ai .npc-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
ai .npc-avatar { font-size: 1.8em; }
ai .thought-bubble {
  background: #f9f7f2;
  border-radius: 12px;
  padding: 10px 14px;
  margin-top: 10px;
  position: relative;
}
ai .thought-bubble::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #f9f7f2;
}

/* ========== 表格（记忆区） ========== */
ai .mem-section { margin: 14px 18px; }
ai .mem-section h4 { margin: 0 0 8px 0; color: var(--accent); }
ai table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85em;
  border-radius: 8px;
  overflow: hidden;
}
ai th {
  background: var(--accent-soft);
  color: var(--accent);
  padding: 8px 6px;
  text-align: left;
  font-weight: 600;
}
ai td {
  padding: 8px 6px;
  border-bottom: 1px solid var(--border);
}
ai tr:last-child td { border-bottom: none; }

/* ========== 行动列表 ========== */
ai .action-list {
  list-style: none;
  counter-reset: action;
  padding: 12px 18px;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px;
}
ai .action-list li {
  counter-increment: action;
  background: var(--primary-soft);
  padding: 12px 16px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  font-weight: 500;
}
ai .action-list li::before {
  content: counter(action);
  background: var(--primary);
  color: white;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8em;
  margin-right: 8px;
  font-weight: 700;
}
ai .action-list li:hover {
  background: #fde4d4;
  transform: scale(1.02);
}

/* ========== 军师频道 ========== */
ai .strategy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  padding: 16px;
}
ai .strategy-block {
  background: #fefcf9;
  border-radius: 12px;
  padding: 16px;
  border: 1px solid var(--border);
}
ai .strategy-block.our {
  border-left: 4px solid var(--accent);
  background: linear-gradient(to right, #f4faf9, #fefcf9);
}
ai .strategy-block.enemy {
  border-left: 4px solid #e8a0a0;
  background: linear-gradient(to right, #fdf6f6, #fefcf9);
}
ai .strat-item { margin-bottom: 14px; }
ai .strat-item:last-child { margin-bottom: 0; }
ai .private-msg {
  margin: 0 16px 16px;
  background: #fff9f0;
  padding: 14px 18px;
  border-radius: 12px;
  border: 1px dashed #e8cfa0;
  font-style: italic;
  color: #8b7355;
}

/* ========== 校园广播站 ========== */
ai .social-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  padding: 16px;
}
ai .social-section {
  background: #fefcf9;
  border-radius: 12px;
  padding: 16px;
  border: 1px solid var(--border);
}
ai .social-section h4 { margin: 0 0 12px 0; color: var(--primary); }
ai .feed-item { margin-bottom: 12px; }
ai .msg-item {
  margin-bottom: 14px;
  padding: 10px;
  border-radius: 8px;
  background: #f9f9f6;
}
ai .msg-item.wechat-xiamo { background: #fef9f0; }
ai .msg-item.wechat-zhiyao { background: #f4f6fa; }
ai .msg-item.moments { background: #fdf6f8; }
ai .msg-item ul { margin: 6px 0 0 0; padding-left: 18px; }
ai .msg-item li { margin-bottom: 4px; font-size: 0.9em; }

/* ========== 移动端适配 ========== */
@media (max-width: 640px) {
  ai .grid-3,
  ai .strategy-grid,
  ai .social-grid { grid-template-columns: 1fr; }
  ai .grid-2 { grid-template-columns: 1fr; gap: 6px; }
  ai .npc-grid { grid-template-columns: 1fr; }
  ai .action-list { grid-template-columns: 1fr; }
  ai table { font-size: 0.75em; }
}

/* ========== 滚动条美化 ========== */
ai ::-webkit-scrollbar { width: 6px; }
ai ::-webkit-scrollbar-track { background: var(--bg); }
ai ::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; }