/* ━━━━━━━━━━ 字体引入 ━━━━━━━━━━ */
@import url('https://cdn.jsdelivr.net/npm/lxgw-wenkai-webfont@1.7.0/style.css');

/* 全局字体设置——霞鹜文楷为首选，降级到系统字体 */
.markdown-body,
.markdown-body * {
  font-family: 'LXGW WenKai', '霞鹜文楷', 'Noto Serif SC', 'Source Han Serif SC',
               'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB',
               'WenQuanYi Micro Hei', sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════
   🌌 星夜幻境 · Trainers Theme v5.0
   平台 UI 层（顶部导航 + 侧边栏 + 输入框 v2）完全重构
   兼容 IE/Edge/Chrome/移动端
   ═══════════════════════════════════════════════════════════ */

/* ━━━━━━━━━━ 顶部导航栏 · 星夜泡泡模板 ━━━━━━━━━━ */
header.flex.h-12.items-center {
  background: rgba(15, 15, 26, 0.75) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
  margin: 8px 12px 0 12px !important;
  border-radius: 16px !important;
  width: calc(100% - 24px) !important;
  transition: all 0.35s ease !important;
}

header.flex.h-12.items-center:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* 侧边栏切换按钮 */
#nav-left button[data-sidebar="trigger"] {
  color: #94a3b8 !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

#nav-left button[data-sidebar="trigger"]:hover {
  background: rgba(102, 126, 234, 0.15) !important;
  color: #a5b4fc !important;
  box-shadow: 0 0 12px rgba(102, 126, 234, 0.3) !important;
}

/* 右侧按钮通用 */
#nav-right button {
  color: #94a3b8 !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

#nav-right button:hover {
  background: rgba(102, 126, 234, 0.15) !important;
  color: #a5b4fc !important;
  box-shadow: 0 0 12px rgba(102, 126, 234, 0.3) !important;
  transform: translateY(-1px) !important;
}

/* 公告按钮（有未读提示时） */
#nav-right button[aria-label="系统公告"] {
  position: relative !important;
}

/* 通知按钮 */
#nav-right button[aria-label="通知"] {
  position: relative !important;
}

/* 主题切换按钮 */
#nav-right button[aria-label="theme scheme"] {
  margin-left: 2px !important;
}

/* 顶部中间区域 */
#nav-middle {
  color: #e2e8f0 !important;
}

/* ━━━━━━━━━━ ③ 模型选择器（保留旧版兼容） ━━━━━━━━━━ */
#ai-model-selector .group.flex.items-center {
  color: #cbd5e1 !important;
}
#ai-model-selector .group.flex.items-center:hover {
  color: #a5b4fc !important;
}
#ai-model-selector .truncate.text-\[13px\] {
  color: #94a3b8 !important;
}
#ai-model-selector .shrink-0.flex.items-center svg {
  fill: #94a3b8 !important;
}
#ai-model-selector .shrink-0.flex.items-center:hover svg {
  fill: #a5b4fc !important;
}
#header-setting-button {
  color: #94a3b8 !important;
}
#header-setting-button:hover {
  color: #a5b4fc !important;
}

/* ━━━━━━━━━━ ④ 侧边栏 ━━━━━━━━━━ */
.shadow-lg.border-r.border-gray-200 {
  background: #0f0f1a !important;
  background: rgba(15, 15, 26, 0.85) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}
.MuiList-root {
  background: transparent !important;
  color: #e2e8f0 !important;
}
.conversation-text {
  color: #cbd5e1 !important;
}

/* ━━━━━━━━━━ ⑤ 功能按钮 ━━━━━━━━━━ */
#ai-mod-button2 button.MuiButton-root {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
  background: rgba(102, 126, 234, 0.2) !important;
  border-color: rgba(166, 139, 250, 0.3) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  fill: #94a3b8 !important;
}

/* ━━━━━━━━━━ ⑥ 聊天气泡（容器） ━━━━━━━━━━ */
.bg-gray-100\/90.relative.inline-block {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 18px !important;
  padding: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
  color: #e2e8f0 !important;
}
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
  background: #2a2a4a !important;
  background: rgba(102, 126, 234, 0.08) !important;
  border-color: rgba(166, 139, 250, 0.2) !important;
}

/* ━━━━━━━━━━ ⑦ 加载动画 ━━━━━━━━━━ */
#loading-anim,
#customized-answer-content-loading-anim-container,
#customized-answer-avatar-loading-anim-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
}
#loading-anim::before,
#customized-answer-content-loading-anim-container::before,
#customized-answer-avatar-loading-anim-container::before {
  content: '' !important;
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #a5b4fc !important;
  box-shadow: 0 0 12px #667eea !important;
  animation: pokeload 0.8s ease infinite alternate !important;
}
@keyframes pokeload {
  from { transform: scale(0.8); opacity: 0.4; }
  to { transform: scale(1.2); opacity: 1; }
}

/* ━━━━━━━━━━ ⑧ 输入框组件层（v2 data-slot 结构 · 完全重写） ━━━━━━━━━━ */

/* 输入框最外层表单容器 */
#prompt-input {
  background: transparent !important;
}

/* 输入框主体容器（data-slot 包裹层） */
[data-slot="input-group"] {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

/* 输入框顶部按钮栏（模组/评论/滚动到底部/图片/搜索等） */
#prompt-input-header {
  background: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding: 8px 12px !important;
}

/* 输入框底部操作栏 */
#prompt-input-footer {
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding: 8px 12px !important;
}

/* 顶部和底部操作栏内的所有按钮 */
#prompt-input-header button {
  background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.8), 0 1px 3px rgba(0, 0, 0, 0.5) !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
}

#prompt-input-header button:hover,
#prompt-input-footer button:hover {
  background: rgba(102, 126, 234, 0.2) !important;
  border-color: rgba(166, 139, 250, 0.35) !important;
  color: #a5b4fc !important;
}

/* 自定义快捷按钮（修正格式/导出存档/导入存档/开场群像） */
#prompt-input-header button span.truncate {
  color: inherit !important;
}

/* 输入框本体（textarea） */
[data-slot="input-group-control"] {
  background: transparent !important;
  font-size: 16px !important;
  min-height: 36px !important;
  border: none !important;
  outline: none !important;

}

[data-slot="input-group-control"]::placeholder {
  opacity: 1 !important;              /* 移除透明度，避免双重弱化 */
  text-shadow: 0 0 2px rgba(91, 83, 83, 0.7) !important;
}

[data-slot="input-group-control"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* 发送按钮 */
button[type="submit"] {
  background: linear-gradient(135deg, #667eea, #764ba2) !important;
  color: white !important;
  border-radius: 8px !important;
  box-shadow: 0 0 16px rgba(102, 126, 234, 0.5) !important;
  transition: all 0.2s ease !important;
}

button[type="submit"]:hover {
  background: linear-gradient(135deg, #7c3aed, #8b5cf6) !important;
  box-shadow: 0 0 24px rgba(124, 58, 237, 0.7) !important;
  transform: scale(1.05) !important;
}

button[type="submit"]:disabled {
  background: rgba(255, 255, 255, 0.1) !important;
  box-shadow: none !important;
  color: #64748b !important;
  transform: none !important;
}

/* 模型选择器按钮 */
#prompt-input-footer button[aria-haspopup="dialog"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 模型选择器按钮中的图片 */
#prompt-input-footer button[aria-haspopup="dialog"] img {
  opacity: 0.9 !important;
}

/* 回复模式按钮 */
button[aria-label="回复模式"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

button[aria-label="回复模式"]:hover {
  background: rgba(102, 126, 234, 0.15) !important;
  color: #a5b4fc !important;
}

/* 滚动到底部按钮 */
button[aria-label="滚动到底部"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 图片上传按钮 */
button[aria-label="Add image"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 搜索按钮 */
button[aria-label="搜索"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 模组按钮 */
button:has(span:contains("模组")) {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 评论按钮 */
button:has(span:contains("评论")) {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

/* 输入框操作栏内的分隔线 */
#prompt-input-header .w-px.shrink-0 {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* ━━━━━━━━━━ ⑨ 评论区 ━━━━━━━━━━ */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: #0f0f1a !important;
  background: rgba(15, 15, 26, 0.9) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
div.text-lg.font-bold {
  color: #c4b5fd !important;
}
p.MuiTypography-body1.text-grey-600 {
  color: #506685 !important;
}
span.MuiRating-iconEmpty svg {
  fill: rgba(255, 255, 255, 0.2) !important;
}
span.MuiRating-iconFilled svg {
  fill: #a5b4fc !important;
}
span.text-orange-500 {
  color: #a78bfa !important;
}
div.flex.flex-col.border-gray-200 {
  border-color: rgba(255, 255, 255, 0.08) !important;
}
div.bg-gray-100.text-gray-500 {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #94a3b8 !important;
}
div.cursor-pointer.group.flex.items-center.justify-center {
  background: transparent !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover {
  background: rgba(102, 126, 234, 0.15) !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
  fill: #94a3b8 !important;
}
button.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #667eea, #764ba2) !important;
  color: white !important;
  border-radius: 10px !important;
}
button.MuiButton-outlinedPrimary {
  border-color: #667eea !important;
  color: #a5b4fc !important;
}
button.MuiButton-outlinedPrimary:hover {
  background: rgba(102, 126, 234, 0.15) !important;
}
div.group.ml-0 div.text-sm.text-grey-600 span.font-bold {
  color: #c4b5fd !important;
}
span.text-\[10px\] {
  color: #64748b !important;
}
div.text-xs.text-grey-600 {
  color: #94a3b8 !important;
}
button.text-gray-400 {
  color: #94a3b8 !important;
}
button.text-gray-400:hover {
  color: #a5b4fc !important;
}
span.cursor-pointer {
  color: #94a3b8 !important;
}
span.cursor-pointer:hover {
  color: #a5b4fc !important;
}
div.ml-8.border-l {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ━━━━━━━━━━ ⑩ 滚动条 ━━━━━━━━━━ */
::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}
::-webkit-scrollbar-track {
  background: transparent !important;
}
::-webkit-scrollbar-thumb {
  background: rgba(166, 139, 250, 0.3) !important;
  border-radius: 4px !important;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(166, 139, 250, 0.5) !important;
}

/* ━━━━━━━━━━ 好感变动区域 .affection-adjust ━━━━━━━━━━ */

.affection-adjust {
  background: rgba(20, 20, 40, 0.55) !important;
  border: 1px solid rgba(180, 140, 200, 0.25) !important;
  border-radius: 14px !important;
  padding: 14px 18px !important;
  margin-bottom: 16px !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
  transition: all 0.35s ease !important;
}

.affection-adjust:hover {
  border-color: rgba(180, 140, 200, 0.45) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.affection-label {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #c4b5fd !important;
  display: block !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.5px !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.8) !important;
}

.affection-hint {
  font-size: 12px !important;
  color: #94a3b8 !important;
  display: block !important;
  margin-bottom: 12px !important;
  line-height: 1.6 !important;
}

.affection-options {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

.affection-btn {
  min-width: 44px !important;
  height: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  color: #cbd5e1 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: inherit !important;
  padding: 0 12px !important;
  user-select: none !important;
}

.affection-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

.affection-btn:active {
  transform: scale(0.95) !important;
}

.affection-btn.minus {
  border-color: rgba(130, 160, 220, 0.35) !important;
  color: #93b4e8 !important;
  background: rgba(130, 160, 220, 0.1) !important;
}

.affection-btn.minus:hover {
  background: rgba(130, 160, 220, 0.22) !important;
  border-color: rgba(130, 160, 220, 0.6) !important;
  box-shadow: 0 4px 16px rgba(130, 160, 220, 0.2) !important;
}

.affection-btn.plus {
  border-color: rgba(200, 140, 180, 0.35) !important;
  color: #d4a8c8 !important;
  background: rgba(200, 140, 180, 0.1) !important;
}

.affection-btn.plus:hover {
  background: rgba(200, 140, 180, 0.22) !important;
  border-color: rgba(200, 140, 180, 0.6) !important;
  box-shadow: 0 4px 16px rgba(200, 140, 180, 0.2) !important;
}

.affection-input-hint {
  font-size: 11px !important;
  color: #64748b !important;
  display: block !important;
  margin-top: 4px !important;
}

@media (max-width: 768px) {
  .affection-btn {
    min-width: 38px !important;
    height: 32px !important;
    font-size: 13px !important;
    padding: 0 10px !important;
  }
  .affection-options {
    gap: 6px !important;
  }
  .affection-adjust {
    padding: 12px 14px !important;
  }
}

/* ━━━━━━━━━━ ⑪ 响应式 · 移动端 ━━━━━━━━━━ */
@media (max-width: 768px) {
  #prompt-input-header {
    padding: 6px 8px !important;
  }
  #prompt-input-footer {
    padding: 6px 8px !important;
  }
  #prompt-input-header button,
  #prompt-input-footer button {
    padding: 4px 8px !important;
    font-size: 10px !important;
    min-height: 32px !important;
  }
  [data-slot="input-group-control"] {
    font-size: 16px !important;
  }
}

@media (max-width: 480px) {
  .bg-gray-100\/90.relative.inline-block {
    padding: 10px !important;
    border-radius: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   作品组件层（星夜幻境 v4.0 · 去重 · 面板整合）
   ═══════════════════════════════════════════════════════════ */

/* ━━━━━━━━━━ 正文与面板通用基底（毛玻璃泡泡） ━━━━━━━━━━ */
text,
.narrative,
details.think-panel,
details.hunter,
details.team,
details.battle,
details.shop,
details.home,
details.sky,
details.forum,
details.memory,
details.action {
  display: block !important;
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.045) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
  transition: all 0.35s ease !important;
  overflow: hidden !important;
}

text:hover,
.narrative:hover,
details.think-panel:hover,
details.hunter:hover,
details.team:hover,
details.battle:hover,
details.shop:hover,
details.home:hover,
details.sky:hover,
details.forum:hover,
details.memory:hover,
details.action:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  transform: translateY(-2px) !important;
}

/* ━━━━━━━━━━ 正文特有排版（字号加大） ━━━━━━━━━━ */
text,
.narrative {
  padding: 24px 28px !important;
  line-height: 2.0 !important;
}

text p,
.narrative p {
  font-size: 1.15em !important;
  line-height: 2.0 !important;
  margin: 10px 0 !important;
}

text strong,
.narrative strong {
  color: #62519a !important;
  font-weight: 700 !important;
}

text em,
.narrative em {
  color: #8173b7 !important;
  font-style: italic !important;
}

/* ━━━━━━━━━━ Details Summary 通用（字号加大） ━━━━━━━━━━ */
details.think-panel > summary,
details.hunter > summary,
details.team > summary,
details.battle > summary,
details.shop > summary,
details.home > summary,
details.sky > summary,
details.forum > summary,
details.memory > summary,
details.action > summary {
  font-size: 18px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  letter-spacing: 0.5px !important;
  list-style: none !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.8) !important;
}

details.think-panel > summary::-webkit-details-marker,
details.hunter > summary::-webkit-details-marker,
details.team > summary::-webkit-details-marker,
details.battle > summary::-webkit-details-marker,
details.shop > summary::-webkit-details-marker,
details.home > summary::-webkit-details-marker,
details.sky > summary::-webkit-details-marker,
details.forum > summary::-webkit-details-marker,
details.memory > summary::-webkit-details-marker,
details.action > summary::-webkit-details-marker {
  display: none !important;
}

/* Summary 展开箭头 */
details.think-panel > summary::before,
details.hunter > summary::before,
details.team > summary::before,
details.battle > summary::before,
details.shop > summary::before,
details.home > summary::before,
details.sky > summary::before,
details.forum > summary::before,
details.memory > summary::before,
details.action > summary::before {
  content: '▸' !important;
  display: inline-block !important;
  margin-right: 10px !important;
  font-size: 0.8em !important;
  transition: transform 0.3s ease !important;
}

details.think-panel[open] > summary::before,
details.hunter[open] > summary::before,
details.team[open] > summary::before,
details.battle[open] > summary::before,
details.shop[open] > summary::before,
details.home[open] > summary::before,
details.sky[open] > summary::before,
details.forum[open] > summary::before,
details.memory[open] > summary::before,
details.action[open] > summary::before {
  transform: rotate(90deg) !important;
}

/* ━━━━━━━━━━ 各面板互补底色 ━━━━━━━━━━ */

/* 思维链面板 */
details.think-panel {
  background: rgba(100, 80, 140, 0.15) !important;
  border: 1px solid rgba(160, 120, 220, 0.25) !important;
}
details.think-panel > summary {
  background: linear-gradient(135deg, rgba(128, 96, 160, 0.5), rgba(180, 140, 220, 0.35)) !important;
  color: #E0D0FF !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 训练师面板 */
details.hunter {
  background: rgba(200, 170, 100, 0.12) !important;
  border: 1px solid rgba(240, 200, 80, 0.25) !important;
}
details.hunter > summary {
  background: linear-gradient(135deg, rgba(184, 134, 11, 0.5), rgba(240, 200, 80, 0.35)) !important;
  color: #FFE8A0 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 宝可梦面板 */
details.team {
  background: rgba(220, 140, 160, 0.12) !important;
  border: 1px solid rgba(236, 72, 153, 0.22) !important;
}
details.team > summary {
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.45), rgba(248, 113, 113, 0.3)) !important;
  color: #FFD0E0 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 战场面板 */
details.battle {
  background: rgba(160, 40, 50, 0.12) !important;
  border: 1px solid rgba(200, 50, 60, 0.22) !important;
}
details.battle > summary {
  background: linear-gradient(135deg, rgba(160, 16, 32, 0.5), rgba(200, 50, 60, 0.35)) !important;
  color: #FFC8C8 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 商城面板 */
details.shop {
  background: rgba(200, 150, 60, 0.12) !important;
  border: 1px solid rgba(232, 152, 46, 0.25) !important;
}
details.shop > summary {
  background: linear-gradient(135deg, rgba(232, 152, 46, 0.5), rgba(240, 180, 60, 0.35)) !important;
  color: #FFE0B0 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 住所/场景面板 */
details.home,
details.sky {
  background: rgba(80, 160, 140, 0.12) !important;
  border: 1px solid rgba(94, 168, 94, 0.25) !important;
}
details.home > summary,
details.sky > summary {
  background: linear-gradient(135deg, rgba(94, 168, 94, 0.45), rgba(120, 200, 120, 0.3)) !important;
  color: #C8FFD0 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 论坛面板 */
details.forum {
  background: rgba(119, 138, 169, 0.15) !important;
  border: 1px solid rgba(35, 82, 158, 0.25) !important;
}
details.forum > summary {
  background: linear-gradient(135deg, rgba(91, 126, 181, 0.45), rgba(120, 160, 210, 0.3)) !important;
  color: #D0E0FF !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 记忆面板 */
details.memory {
  background: rgba(120, 90, 150, 0.12) !important;
  border: 1px solid rgba(128, 96, 160, 0.25) !important;
}
details.memory > summary {
  background: linear-gradient(135deg, rgba(128, 96, 160, 0.45), rgba(160, 120, 200, 0.3)) !important;
  color: #dcc6fb !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* 行动面板 */
details.action {
  background: rgba(50, 130, 140, 0.12) !important;
  border: 1px solid rgba(58, 136, 144, 0.25) !important;
}
details.action > summary {
  background: linear-gradient(135deg, rgba(58, 136, 144, 0.45), rgba(80, 180, 190, 0.3)) !important;
  color: #C0F8F8 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* ━━━━━━━━━━ 内容区文本样式（字号加大） ━━━━━━━━━━ */
details.think-panel p,
details.hunter p,
details.team p,
details.battle p,
details.shop p,
details.home p,
details.sky p,
details.forum p,
details.memory p,
details.action p {
  font-size: 1.05em !important;
  line-height: 1.8 !important;
  margin: 8px 0 !important;
}

details.think-panel strong,
details.hunter strong,
details.team strong,
details.battle strong,
details.shop strong,
details.home strong,
details.sky strong,
details.forum strong,
details.memory strong,
details.action strong {
  color: #c4b5fd !important;
  font-weight: 700 !important;
}

/* ━━━━━━━━━━ 宝可梦卡片 .poke-card ━━━━━━━━━━ */
.poke-card {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border-left: 4px solid #ec4899 !important;
  padding: 12px !important;
  margin: 10px 0 !important;
  border-radius: 10px !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  transition: all 0.3s ease !important;
}
.poke-card:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-left-color: #f472b6 !important;
}

/* ━━━━━━━━━━ 标签 .tag / .rare ━━━━━━━━━━ */
.tag {
  background: linear-gradient(135deg, #667eea, #764ba2) !important;
  color: white !important;
  padding: 4px 12px !important;
  border-radius: 14px !important;
  font-size: 12px !important;
  margin-left: 8px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3) !important;
}

.rare {
  background: linear-gradient(135deg, #ec4899, #f472b6) !important;
  color: white !important;
  padding: 4px 12px !important;
  border-radius: 14px !important;
  font-size: 12px !important;
  margin-left: 5px !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(236, 72, 153, 0.3) !important;
}

/* ━━━━━━━━━━ 商城标题 .shop-title ━━━━━━━━━━ */
.shop-title {
  font-weight: 700 !important;
  color: #c4b5fd !important;
  margin-top: 15px !important;
  border-bottom: 2px solid rgba(196, 181, 253, 0.4) !important;
  padding-bottom: 6px !important;
  letter-spacing: 0.5px !important;
  font-size: 1.05em !important;
}

/* 商城宝可梦卡片 .shop-poke */
.shop-poke {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.05) !important;
  padding: 14px !important;
  border-radius: 10px !important;
  margin: 10px 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  transition: all 0.3s ease !important;
}
.shop-poke:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(196, 181, 253, 0.3) !important;
}

/* ━━━━━━━━━━ 论坛帖子 .forum-post ━━━━━━━━━━ */
.forum-post {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.05) !important;
  padding: 14px !important;
  margin: 10px 0 !important;
  border-radius: 10px !important;
  border-left: 3px solid rgba(9, 81, 152, 0.758) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  transition: all 0.3s ease !important;
}
.forum-post:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-left-color: rgba(47, 97, 148, 0.821) !important;
}

.post-title {
  font-weight: 700 !important;
  color: #ad2123ee !important;
  margin-bottom: 6px !important;
  font-size: 1.05em !important;
}

.post-meta {
  font-size: 12px !important;
  margin-bottom: 8px !important;
  color: #000000 !important;
}

.post-content {
  line-height: 1.8 !important;
  font-size: 1.05em !important;
}

.post-reply {
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
  font-size: 13px !important;
  padding-left: 10px !important;
  border-left: 2px solid rgba(255, 255, 255, 0.15) !important;

}

.reply-author {
  font-weight: 600 !important;
  color: #6c3ccc !important;
}

.post-author {
  color: #6c3ccc !important;
  font-weight: 600 !important;
}

/* ━━━━━━━━━━ 记忆区 ━━━━━━━━━━ */
.mem-title {
  font-weight: 700 !important;
  margin-top: 15px !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  letter-spacing: 0.4px !important;
}

.mem-title.core {
  background: rgba(255, 107, 107, 0.2) !important;
  color: #ff9090 !important;
}

.mem-title.long {
  background: rgba(102, 126, 234, 0.2) !important;
  color: #a5b4fc !important;
}

.mem-title.short {
  background: rgba(118, 75, 162, 0.2) !important;
  color: #c4b5fd !important;
}

.mem-c,
.mem-l,
.mem-s {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.05) !important;
  padding: 14px !important;
  margin: 10px 0 !important;
  border-radius: 10px !important;
  line-height: 1.8 !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}

.mem-c { border-left: 3px solid rgba(255, 107, 107, 0.6) !important; }
.mem-l { border-left: 3px solid rgba(102, 126, 234, 0.6) !important; }
.mem-s { border-left: 3px solid rgba(142, 197, 252, 0.6) !important; }

/* 嵌套 details（记忆区） */
details.memory details {
  background: #1a1a2e !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  margin: 10px 0 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15) !important;
}

details.memory details > summary {
  background: rgba(160, 120, 200, 0.25) !important;
  color: #986ada !important;
  font-size: 0.95em !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}

/* 记忆区表格 */
details.memory table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 0.95em !important;
  margin: 10px 0 !important;
  table-layout: auto !important;
}

details.memory th {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #9989da !important;
  padding: 10px 12px !important;
  font-weight: 700 !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.12) !important;
  text-align: left !important;
  white-space: nowrap !important;
}

details.memory td {
  padding: 10px 12px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* 记忆区水平滚动容器 */
.mem-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  margin: 8px 0;
  border-radius: 8px;
  scrollbar-width: thin;
  scrollbar-color: rgba(160, 120, 200, 0.4) rgba(255, 255, 255, 0.06);
}

.mem-scroll table {
  min-width: 600px;
  white-space: nowrap;
}

/* 记忆区滚动条 */
.mem-scroll::-webkit-scrollbar {
  height: 6px;
}
.mem-scroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.04);
  border-radius: 3px;
}
.mem-scroll::-webkit-scrollbar-thumb {
  background: rgba(160, 120, 200, 0.35);
  border-radius: 3px;
}
.mem-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(160, 120, 200, 0.65);
}
.mem-scroll::-webkit-scrollbar-thumb:active {
  background: rgba(160, 120, 200, 0.8);
}

/* 核心记忆区滚动容器 */
.mem-core-scroll {
  border-left: 3px solid #ffd700 !important;
  background: rgba(255, 215, 0, 0.05) !important;
}
/* 核心记忆区标题 */
.mem-core-scroll p b {
  color: #ffd700 !important;
}

/* 移动端滚动优化 */
@media (max-width: 768px) {
  .mem-scroll {
    -webkit-overflow-scrolling: touch;
    max-width: calc(100vw - 40px);
  }
}

/* PC端鼠标悬浮时高亮滚动条 */
@media (hover: hover) and (pointer: fine) {
  .mem-scroll::-webkit-scrollbar {
    height: 8px;
    cursor: pointer;
  }
  .mem-scroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    margin: 0 4px;
  }
  .mem-scroll::-webkit-scrollbar-thumb {
    background: rgba(160, 120, 200, 0.35);
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s ease;
  }
  .mem-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(160, 120, 200, 0.65);
  }
  .mem-scroll::-webkit-scrollbar-thumb:active {
    background: rgba(160, 120, 200, 0.8);
  }
}

.mem-scroll table {
  min-width: 600px;
  white-space: nowrap;
}

/* ━━━━━━━━━━ 面板内滚动条 ━━━━━━━━━━ */
details.think-panel ::-webkit-scrollbar,
details.hunter ::-webkit-scrollbar,
details.team ::-webkit-scrollbar,
details.battle ::-webkit-scrollbar,
details.shop ::-webkit-scrollbar,
details.home ::-webkit-scrollbar,
details.sky ::-webkit-scrollbar,
details.forum ::-webkit-scrollbar,
details.memory ::-webkit-scrollbar,
details.action ::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

details.think-panel ::-webkit-scrollbar-thumb,
details.hunter ::-webkit-scrollbar-thumb,
details.team ::-webkit-scrollbar-thumb,
details.battle ::-webkit-scrollbar-thumb,
details.shop ::-webkit-scrollbar-thumb,
details.home ::-webkit-scrollbar-thumb,
details.sky ::-webkit-scrollbar-thumb,
details.forum ::-webkit-scrollbar-thumb,
details.memory ::-webkit-scrollbar-thumb,
details.action ::-webkit-scrollbar-thumb {
  background: rgba(196, 181, 253, 0.35) !important;
  border-radius: 3px !important;
}

details.think-panel ::-webkit-scrollbar-track,
details.hunter ::-webkit-scrollbar-track,
details.team ::-webkit-scrollbar-track,
details.battle ::-webkit-scrollbar-track,
details.shop ::-webkit-scrollbar-track,
details.home ::-webkit-scrollbar-track,
details.sky ::-webkit-scrollbar-track,
details.forum ::-webkit-scrollbar-track,
details.memory ::-webkit-scrollbar-track,
details.action ::-webkit-scrollbar-track {
  background: transparent !important;
}

/* ━━━━━━━━━━ 行动选项（泡泡面板 + 按钮美化） ━━━━━━━━━━ */
div.flex.flex-col.gap-2.w-full:has(#suggestions) {
  background: rgba(50, 130, 140, 0.12) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(58, 136, 144, 0.25) !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
  transition: all 0.35s ease !important;
  overflow: hidden !important;
}

div.flex.flex-col.gap-2.w-full:has(#suggestions):hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  transform: translateY(-2px) !important;
}

div.flex.flex-col.gap-2.w-full:has(#suggestions) > .text-xs.font-medium.text-muted-foreground {
  color: #C0F8F8 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  padding: 10px 14px !important;
  margin: -16px -20px 10px -20px !important;
  background: linear-gradient(135deg, rgba(58, 136, 144, 0.45), rgba(80, 180, 190, 0.3)) !important;
  border-radius: 10px 10px 0 0 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.8) !important;
  text-transform: none !important;
  display: flex !important;
  align-items: center !important;
}

div.flex.flex-col.gap-2.w-full:has(#suggestions) > .text-xs.font-medium.text-muted-foreground::before {
  content: '▸' !important;
  display: inline-block !important;
  margin-right: 10px !important;
  font-size: 0.8em !important;
  transition: transform 0.3s ease !important;
}

#suggestions {
  gap: 6px !important;
}

#suggestions {
  gap: 6px !important;
  width: 100% !important;              /* 强制容器撑满 */
  min-width: 100% !important;          /* 覆盖 w-fit 和 min-w-[50%] */
}

/* 覆盖平台自带的 w-fit min-w-[50%] */
#suggestions[data-orientation="vertical"] {
  width: 100% !important;
  min-width: 100% !important;
}

#suggestions button {
  width: 100% !important;
  box-sizing: border-box !important;
  background: linear-gradient(135deg, rgba(69, 100, 100, 0.854), rgba(34, 90, 96, 0.784)) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(58, 136, 144, 0.25) !important;
  border-radius: 12px !important;
  color: #e2e8f0 !important;
  font-size: 1.0em !important;
  padding: 12px 16px !important;
  transition: all 0.3s ease !important;
  text-align: left !important;
  line-height: 1.6 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
  white-space: normal !important;
  word-break: break-word !important;
  display: flex !important;            /* 覆盖平台 inline-flex */
}

#suggestions button:hover {
  background: linear-gradient(135deg, rgba(58, 136, 144, 0.35), rgba(62, 111, 116, 0.513)) !important;
  border-color: rgba(52, 109, 114, 0.685) !important;
  color: #060707 !important;
  transform: translateX(4px) !important;
  box-shadow: 0 0 16px rgba(67, 75, 76, 0.794) !important;
}

#suggestions button span {
  color: inherit !important;
}

/* ━━━━━━━━━━ 响应式（字号加大） ━━━━━━━━━━ */
@media (max-width: 768px) {
  details.think-panel > summary,
  details.hunter > summary,
  details.team > summary,
  details.battle > summary,
  details.shop > summary,
  details.home > summary,
  details.sky > summary,
  details.forum > summary,
  details.memory > summary,
  details.action > summary {
    padding: 8px 12px !important;
    font-size: 16px !important;
  }

  details.think-panel,
  details.hunter,
  details.team,
  details.battle,
  details.shop,
  details.home,
  details.sky,
  details.forum,
  details.memory,
  details.action {
    padding: 12px 14px !important;
    margin-bottom: 12px !important;
  }

  details.think-panel p,
  details.hunter p,
  details.team p,
  details.battle p,
  details.shop p,
  details.home p,
  details.sky p,
  details.forum p,
  details.memory p,
  details.action p {
    font-size: 0.95em !important;
  }

  text,
  .narrative {
    padding: 16px 18px !important;
    margin-bottom: 12px !important;
  }

  text p,
  .narrative p {
    font-size: 1.05em !important;
  }

  div.flex.flex-col.gap-2.w-full:has(#suggestions) {
    padding: 12px 14px !important;
    margin-bottom: 12px !important;
  }

  div.flex.flex-col.gap-2.w-full:has(#suggestions) > .text-xs.font-medium.text-muted-foreground {
    font-size: 16px !important;
    padding: 8px 12px !important;
    margin: -12px -14px 10px -14px !important;
  }

  #suggestions button {
    padding: 10px 12px !important;
    font-size: 0.95em !important;
  }

  /* 记忆区移动端滚动 */
  .mem-scroll {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    max-width: calc(100vw - 40px);
  }
  .mem-scroll table {
    min-width: 500px;
    font-size: 0.9em !important;
  }
}

@media (max-width: 480px) {
  .bg-gray-100\/90.relative.inline-block {
    padding: 10px !important;
    border-radius: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }

  details.think-panel,
  details.hunter,
  details.team,
  details.battle,
  details.shop,
  details.home,
  details.sky,
  details.forum,
  details.memory,
  details.action,
  text,
  .narrative,
  div.flex.flex-col.gap-2.w-full:has(#suggestions) {
    transition: none !important;
  }

  details.think-panel > summary::before,
  details.hunter > summary::before,
  details.team > summary::before,
  details.battle > summary::before,
  details.shop > summary::before,
  details.home > summary::before,
  details.sky > summary::before,
  details.forum > summary::before,
  details.memory > summary::before,
  details.action > summary::before {
    transition: none !important;
  }

  details.think-panel:hover,
  details.hunter:hover,
  details.team:hover,
  details.battle:hover,
  details.shop:hover,
  details.home:hover,
  details.sky:hover,
  details.forum:hover,
  details.memory:hover,
  details.action:hover,
  text:hover,
  .narrative:hover,
  div.flex.flex-col.gap-2.w-full:has(#suggestions):hover {
    transform: none !important;
  }

  #suggestions button,
  #suggestions button:hover {
    transition: none !important;
    transform: none !important;
  }
}