/* 引入全局中文字体 - 替换为更具古风的衬线字体 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;700;900&display=swap');

/* 全局核心变量 - 古风配色重构 */
:root {
  /* 古风主题配色 */
  --theme-border: #8B4513; /* 棕木色 */
  --theme-shadow: rgba(139, 69, 19, 0.2); /* 木色阴影 */
  --loading-spinner: #5D2906; /* 深棕色 */
  --memory-border: transparent; /* 取消记忆区边框 */
  --status-border: transparent; /* 取消状态栏边框 */
  --action-border: #8B4513; /* 行动选项-棕木色 */
  --logic-border: #8B6914; /* 推演引擎-琥珀色 */
  --logic-bg: rgba(255, 248, 230, 0.6); /* 米黄色背景 */
  
  /* 样式参数 */
  --border-radius: 6px; /* 更圆润的古风圆角 */
  --transition: all 0.3s ease-in-out;
  --bg-glass: rgba(255, 248, 230, 0.8); /* 米白玻璃态 */
  --bg-glass-hover: rgba(255, 250, 240, 0.95); /* hover加深 */
  --bg-btn-default: rgba(245, 240, 225, 0.8);
  --backdrop: blur(8px) saturate(120%);
  
  /* 阴影效果 - 柔和古风阴影 */
  --shadow-3d: 0px 4px 10px rgba(139, 69, 19, 0.1),
               inset 0px 1px 0px rgba(255, 255, 255, 0.4),
               inset 0px -1px 0px rgba(139, 69, 19, 0.1);
  --shadow-3d-hover: 0px 6px 14px rgba(139, 69, 19, 0.15),
                     inset 0px 2px 4px rgba(255, 255, 255, 0.5),
                     inset 0px -2px 4px rgba(139, 69, 19, 0.15);
  --shadow-light: 0px 2px 5px rgba(139, 69, 19, 0.08), 0px 0px 3px rgba(139, 69, 19, 0.1);
  
  /* 文字颜色 - 古风墨色 */
  --text-primary: #2D2415; /* 深墨色 */
  --text-loading: #7A5C38; /* 浅棕色 */

  /* 折叠面板专用 - 古风米白 */
  --details-border-color: #D9C8B4; /* 浅木色边框 */
  --details-header-bg: #FFFAF0; /* 米白色 */
  --details-header-bg-hover: #FFF8E7; /* 浅米黄 */
  --content-bg: #FFFBF5; /* 极浅米黄 */
}

/* 场景信息模块 - 古风重构 */
.scene-info {
  border: 1px solid #D9C8B4;
  padding: 12px 25px;
  width: 100%;
  margin: 15px 0;
  border-radius: var(--border-radius);
  background: rgba(255, 248, 230, 0.9);
  box-shadow: var(--shadow-light);
}
.scene-info p {
  margin: 0 0 6px 0;
  text-align: left;
  color: var(--text-primary);
  font-family: 'Noto Serif SC', serif;
  line-height: 1.7;
}
.scene-info p:last-child {
  margin: 0;
}

/* 角色对话模块 - 古风配色 */
.dialogue {
  margin: 18px 0;
  padding: 12px 20px;
  border-radius: var(--border-radius);
  transition: transform 0.2s ease;
  background: rgba(255, 248, 230, 0.85);
  box-shadow: var(--shadow-light);
}
.dialogue:hover {
  transform: translateX(4px);
  box-shadow: var(--shadow-3d);
}
.dialogue strong {
  display: block;
  font-size: 1.15em;
  margin-bottom: 6px;
  font-weight: 700;
  color: #8B3A3A; /* 暗红角色名 */
}
.dialogue p {
  padding: 0;
  color: var(--text-primary);
  line-height: 1.8;
}
/* 弱化性别区分，统一古风色调 */
.dialogue.male {
  border-left: 5px solid #8B6914; /* 琥珀色 */
}
.dialogue.male strong {
  color: #5D4037; /* 深棕 */
}
.dialogue.female {
  border-left: 5px solid #8B3A3A; /* 暗红 */
}
.dialogue.female strong {
  color: #8B3A3A; /* 暗红 */
}

/* 旁白/讯息模块 - 古风宣纸色 */
.message {
  background-color: #FFFBF0; /* 宣纸白 */
  border: 1px solid #D9C8B4;
  border-left: 6px solid #CD853F; /* 秘鲁色 */
  padding: 18px;
  margin: 25px 0;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-light);
}
.message .title {
  font-size: 1.4em;
  font-weight: 900;
  color: #8B4513; /* 棕木色 */
  text-align: center;
  margin-bottom: 12px;
  font-family: 'Noto Serif SC', serif;
}
.message p {
  color: var(--text-primary);
  line-height: 1.8;
  font-family: 'Noto Serif SC', serif;
}

/* 技巧/奖励模块 - 古风青竹色 */
.skill {
  background-color: #F5FFFA; /* 浅竹色 */
  border: 1px solid #D9C8B4;
  border-left: 6px solid #5C8B5C; /* 竹绿色 */
  padding: 18px;
  margin: 25px 0;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-light);
}
.skill .title {
  font-size: 1.3em;
  font-weight: 700;
  color: #5C8B5C; /* 竹绿色 */
  margin-bottom: 12px;
  font-family: 'Noto Serif SC', serif;
}
.skill p {
  color: var(--text-primary);
  line-height: 1.7;
}
.skill .reward {
  font-style: italic;
  color: #7A5C38;
  margin-top: 10px;
  border-top: 1px dashed #C8B59C;
  padding-top: 8px;
}

/* 通用折叠面板 - 古风样式 */
details {
  background-color: var(--content-bg);
  border: 1px solid var(--details-border-color);
  border-radius: var(--border-radius);
  margin: 15px 0;
  padding: 10px 15px;
  transition: all 0.3s ease;
  box-shadow: var(--shadow-light);
}
details:hover {
  box-shadow: var(--shadow-3d);
}
summary {
  font-weight: 700;
  cursor: pointer;
  color: var(--text-primary);
  list-style: none;
  font-family: 'Noto Serif SC', serif;
}
summary::-webkit-details-marker {
  display: none;
}
details pre code {
  display: block;
  padding: 12px;
  background-color: #FFFBF0;
  border: 1px solid var(--details-border-color);
  border-radius: var(--border-radius);
  white-space: pre-wrap;
  word-break: break-all;
  font-size: 0.9em;
  color: var(--text-primary);
}

/* Markdown高级折叠面板 - 核心：取消记忆/状态栏边框 */
.markdown-body details {
  border: none !important;
  margin: 4px 0 !important;
  background-color: transparent;
  overflow: hidden !important;
  width: 100% !important;
  display: block !important;
  box-shadow: none !important;
}
.markdown-body summary {
  display: flex !important;
  width: 100% !important;
  align-items: center;
  padding: 8px 16px;
  cursor: pointer;
  background-color: var(--details-header-bg);
  color: var(--text-primary);
  font-weight: 700;
  transition: var(--transition);
  border: 1px solid var(--details-border-color);
  border-radius: 9999px;
  box-shadow: var(--shadow-light);
  list-style: none;
  font-family: 'Noto Serif SC', serif;
}
.markdown-body summary::-webkit-details-marker {
  display: none !important;
}
.markdown-body summary::before {
  content: "▶";
  font-size: 12px;
  margin-right: 8px;
  transition: transform 0.2s ease;
  color: #8B4513;
}
.markdown-body details[open] summary::before {
  transform: rotate(90deg);
}
.markdown-body summary:hover {
  background-color: var(--details-header-bg-hover);
  border-color: #C8B59C;
}
/* 关键：取消记忆区边框 */
.markdown-body details#memory-area[open] {
  border: none !important;
  padding: 0 !important;
}
/* 关键：取消男女角色状态栏边框 */
.markdown-body details#player-status[open],
.markdown-body details#female-status[open] {
  border: none !important;
  padding: 0 !important;
}
.markdown-body details:not([open]) {
  border: none !important;
}

/* 剧情行动选项 - 古风棕木色边框 */
.action-options,
.markdown-body .action-options {
  border: 2px solid var(--action-border) !important;
  padding: 12px 20px !important;
  width: 100% !important;
  margin: 12px 0 !important;
  line-height: 1.8 !important;
  display: block !important;
  box-sizing: border-box !important;
  border-radius: var(--border-radius) !important;
  background: rgba(255, 248, 230, 0.8) !important;
  box-shadow: var(--shadow-light) !important;
  color: var(--text-primary) !important;
}

/* 🧠 逻辑推演引擎 - 古风琥珀色 + 虚线分隔 */
.logic-engine {
  border: 2px solid var(--logic-border);
  background-color: var(--logic-bg);
  border-radius: var(--border-radius);
  padding: 15px;
  font-size: 0.95em;
  line-height: 1.6;
  width: 100%;
  box-sizing: border-box;
  box-shadow: var(--shadow-light);
}
.logic-engine strong {
  color: #5D2906;
  font-weight: 700;
  font-family: 'Noto Serif SC', serif;
}
/* 核心：每一个项目都用古风虚线分隔 */
.logic-engine > div {
  border-bottom: 1px dashed #C8B59C !important;
  padding: 10px 0 !important;
  margin: 0 !important;
  color: var(--text-primary);
}
/* 最后一项取消虚线 */
.logic-engine > div:last-child {
  border-bottom: none !important;
}
.logic-engine ul {
  margin: 6px 0 6px 22px;
  padding: 0;
}
.logic-engine li {
  margin: 3px 0;
  color: var(--text-primary);
}

/* AI玻璃态组件 - 古风适配 */
.flex.flex-col.border-\[1\.5px\].border-gray-200,
.bg-white.border-\[1\.5px\] {
  border: 1px solid var(--theme-border) !important;
  border-radius: var(--border-radius) !important;
  background-color: var(--bg-glass) !important;
  backdrop-filter: var(--backdrop) !important;
  -webkit-backdrop-filter: var(--backdrop) !important;
  box-shadow: var(--shadow-3d) !important;
  transition: var(--transition) !important;
}
#ai-mod-button2 {
  border: 1px solid var(--theme-border) !important;
  border-radius: var(--border-radius) !important;
  background-color: transparent !important;
  box-shadow: var(--shadow-light) !important;
  padding: 6px !important;
  transition: var(--transition) !important;
}
#ai-mod-button2 .MuiButton-outlinedPrimary {
  border: 1px solid var(--theme-border) !important;
  border-radius: var(--border-radius) !important;
  background-color: var(--bg-glass) !important;
  backdrop-filter: var(--backdrop) !important;
  box-shadow: var(--shadow-3d) !important;
  margin: 0 4px !important;
  color: var(--text-primary) !important;
  font-family: 'Noto Serif SC', serif;
}
#ai-mod-button2 .MuiButton-outlinedPrimary:hover {
  background-color: var(--bg-glass-hover) !important;
  box-shadow: var(--shadow-3d-hover);
  transform: translateY(-2px);
}
div.relative.flex.w-full.items-center > button {
  border: 1px solid var(--theme-border) !important;
  border-radius: var(--border-radius) !important;
  background-color: var(--bg-glass) !important;
  backdrop-filter: var(--backdrop) !important;
  box-shadow: var(--shadow-3d) !important;
  color: var(--text-primary) !important;
  font-family: 'Noto Serif SC', serif;
}
div.relative.flex.w-full.items-center > button:hover {
  background-color: var(--bg-glass-hover) !important;
  box-shadow: var(--shadow-3d-hover);
  transform: translateY(-2px);
}
textarea {
  background-color: transparent !important;
  width: 100%;
  border: none;
  outline: none;
  resize: none;
  padding: 12px;
  font-size: 14px;
  font-family: 'Noto Serif SC', serif;
  color: var(--text-primary);
  line-height: 1.7;
}
button {
  padding: 8px 16px;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: 14px;
  font-family: 'Noto Serif SC', serif;
  background-color: var(--bg-btn-default);
  border-radius: var(--border-radius);
  color: var(--text-primary);
  transition: var(--transition);
}
button:hover {
  background-color: var(--bg-glass-hover);
  box-shadow: var(--shadow-3d);
}

/* 加载动画 - 古风配色 */
@keyframes ai-answer-spinner-rotation {
  to { transform: rotate(360deg); }
}
#ai-chat-answer .chat-answer-container .style_dot-flashing__8L91Q {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(139, 69, 19, 0.2);
  border-left-color: var(--loading-spinner);
  border-radius: 50%;
  animation: ai-answer-spinner-rotation 0.8s linear infinite;
}
#ai-chat-answer .chat-answer-container div:has(> .style_dot-flashing__8L91Q)::after {
  content: '内容正在生成...';
  font-size: 13px;
  color: var(--text-loading);
  margin-left: 10px;
  font-family: 'Noto Serif SC', serif;
}