ai {
  /* --- 基础主题变量 (轻松浅色风) --- */
  --primary-bg: #fefefe; /* 主背景色，接近白色的浅色 */
  --secondary-bg: #ffffff; /* 模块背景色，纯白 */
  --text-color: #333333; /* 主文本色 */
  --heading-color: #4a4a4a; /* 标题文本色 */
  --border-color: #e8e8e8; /* 边框线颜色 */
  --accent-light: #e0f2f7; /* 强调色浅 (淡雅蓝绿) */
  --accent-dark: #66bbbb; /* 强调色深 (柔和青色，用于重点) */
  --shadow-color: rgba(0, 0, 0, 0.06); /* 柔和阴影色 */
  --hover-bg: #f5f5f5; /* 鼠标悬停背景色 */
  --summary-icon-color: #78909c; /* 详情折叠图标颜色 */

  /* --- 字体与排版 --- */
  font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  line-height: 1.6;
  color: var(--text-color);
  font-size: 15px; /* 基准字体大小 */

  /* --- 容器样式 --- */
  display: block; /* 确保ai标签作为块级元素 */
  background-color: var(--primary-bg);
  padding: 15px;
  border-radius: 12px;
  box-shadow: 0 6px 20px var(--shadow-color);
  max-width: 100%; /* 移动端优先 */
  overflow-x: hidden; /* 防止内容溢出导致横向滚动 */
  box-sizing: border-box; /* 边框和内边距包含在宽度内 */
}

/* --- 头部信息 (hd) --- */
ai hd {
  display: flex;
  flex-wrap: wrap; /* 允许换行，适应小屏幕 */
  gap: 10px; /* 元素间距 */
  padding-bottom: 12px;
  margin-bottom: 15px;
  border-bottom: 1px solid var(--border-color);
  color: var(--heading-color);
  font-size: 0.9em;
  font-weight: 500;
}

ai hd d {
  background-color: var(--accent-light);
  padding: 5px 10px;
  border-radius: 20px; /* 胶囊状背景 */
  white-space: nowrap; /* 保持内容不换行 */
  color: #3f51b5; /* 一个稍微深一些的蓝色，用于信息强调 */
  font-weight: bold;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05); /* 轻微阴影 */
}

/* --- 分隔线 (hr) --- */
ai hr {
  border: none;
  border-top: 1px dashed var(--border-color);
  margin: 20px 0;
  opacity: 0.7;
}

/* --- 正文区 (article) --- */
ai article p {
  margin-bottom: 1.2em;
  text-align: justify; /* 正文两端对齐，更整洁 */
  padding: 0 5px; /* 稍微缩进，避免文字贴边 */
}

/* --- 对话文字 (font标签，保留其color属性) --- */
ai p font {
  font-weight: 500; /* 让对话稍显粗体，增强可读性 */
  line-height: 1.8; /* 增加对话行高 */
}

/* --- 详情折叠面板 (details/summary) --- */
ai details {
  background-color: var(--secondary-bg);
  border: 1px solid var(--border-color);
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden; /* 确保圆角显示 */
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); /* 面板阴影 */
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

ai details[open] {
  border-color: var(--accent-dark); /* 打开时边框高亮 */
  box-shadow: 0 5px 15px var(--shadow-color);
}

ai summary {
  display: flex; /* 使用flex布局让图标和文字对齐 */
  align-items: center;
  cursor: pointer;
  padding: 12px 18px;
  font-weight: bold;
  color: var(--heading-color);
  background-color: var(--accent-light);
  border-bottom: 1px solid var(--border-color);
  transition: background-color 0.2s ease;
  user-select: none; /* 防止文本被选中 */
}

ai summary:hover {
  background-color: var(--hover-bg);
}

/* 自定义折叠图标 */
ai summary::before {
  content: '▶'; /* 右向箭头 */
  display: inline-block;
  margin-right: 10px;
  font-size: 0.8em;
  transition: transform 0.2s ease;
  color: var(--summary-icon-color);
}

ai details[open] summary::before {
  content: '▼'; /* 下向箭头 */
  transform: rotate(0deg); /* 保持下箭头正向 */
}

/* 详情面板内的段落 (p) */
ai details p {
  padding: 10px 18px;
  margin: 0;
  font-size: 0.9em;
  display: flex; /* 使用flex布局，方便信息对齐 */
  flex-wrap: wrap; /* 允许内容换行 */
  gap: 5px 12px; /* 内部元素间距 */
  border-bottom: 1px dotted var(--border-color); /* 虚线分隔每行信息 */
}

ai details p:last-of-type {
  border-bottom: none; /* 最后一行无分隔线 */
}

/* 状态标签 (f) */
ai f {
  font-weight: 600;
  color: var(--accent-dark);
  margin-right: 5px;
  display: inline-block; /* 确保它能保持其宽度和间距 */
  min-width: 60px; /* 给予标签最小宽度，帮助对齐 */
  text-align: right; /* 标签右对齐 */
}

/* --- 表格样式 (table, 命运档案馆) --- */
ai table {
  width: calc(100% - 36px); /* 宽度减去两侧padding */
  margin: 15px 18px;
  border-collapse: collapse;
  font-size: 0.9em;
  border-radius: 8px; /* 表格圆角 */
  overflow: hidden; /* 配合圆角 */
}

ai th, ai td {
  border: 1px solid var(--border-color);
  padding: 10px 12px;
  text-align: left;
}

ai th {
  background-color: var(--accent-light);
  color: var(--heading-color);
  font-weight: bold;
  text-align: center;
}

ai tr:nth-child(even) {
  background-color: #fcfcfc; /* 斑马纹 */
}

/* --- 行动推演 (q) --- */
ai q {
  display: block;
  background-color: var(--secondary-bg);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 12px 18px;
  margin: 10px 18px; /* 调整外边距以配合详情面板的内边距 */
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  font-size: 0.95em;
  color: var(--text-color);
  box-shadow: 0 1px 4px rgba(0,0,0,0.04); /* 轻微阴影 */
}

ai q:hover {
  background-color: var(--accent-light);
  border-color: var(--accent-dark);
  box-shadow: 0 4px 12px var(--shadow-color);
  color: var(--accent-dark);
  transform: translateY(-2px); /* 轻微上浮效果 */
}