/* =========================================================
   蓝色监狱 Ego Reborn｜清爽高级版 CSS
   重点：字清楚 / 状态栏适配 / 正文舒服 / 按钮评论区完整 / 足球鼠标
   使用方式：删除旧CSS，整段替换
   ========================================================= */

/* ========== 0. 主题变量 ========== */
:root {
  --bl-bg: #eef6ff;
  --bl-bg-soft: #f7fbff;
  --bl-card: rgba(255, 255, 255, 0.94);
  --bl-card-blue: rgba(232, 245, 255, 0.96);

  --bl-text: #102033;
  --bl-text-soft: #314963;
  --bl-muted: #66819a;

  --bl-blue: #1d8cff;
  --bl-blue-deep: #0a4f9f;
  --bl-blue-soft: #d9efff;
  --bl-cyan: #00a7d8;
  --bl-gold: #c98b18;
  --bl-red: #d94155;

  --bl-border: rgba(38, 123, 196, 0.22);
  --bl-border-strong: rgba(29, 140, 255, 0.38);

  --bl-radius: 18px;
  --bl-radius-small: 12px;

  --bl-shadow: 0 12px 32px rgba(28, 90, 145, 0.14);
  --bl-shadow-small: 0 6px 18px rgba(28, 90, 145, 0.10);

  --bl-font: "Inter", "Segoe UI", "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;

  /* 小足球鼠标 */
  --bl-cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='11.5' fill='%23ffffff' stroke='%23102033' stroke-width='1.6'/%3E%3Cpath d='M14 7.2l4.2 3.1-1.6 4.9h-5.2l-1.6-4.9z' fill='%23102033'/%3E%3Cpath d='M5.5 13l4.3-2.7 1.6 4.9-3.5 3.2-3.2-1.5zM22.5 13l-4.3-2.7-1.6 4.9 3.5 3.2 3.2-1.5zM9.2 22.1l2.2-6.9h5.2l2.2 6.9L14 24.8z' fill='none' stroke='%23102033' stroke-width='1.25' stroke-linejoin='round'/%3E%3C/svg%3E") 14 14, auto;
}

/* ========== 1. 全局基础 ========== */
html,
body {
  cursor: var(--bl-cursor) !important;
}

body {
  font-family: var(--bl-font) !important;
  color: var(--bl-text) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(29, 140, 255, 0.16), transparent 30%),
    radial-gradient(circle at 100% 20%, rgba(0, 167, 216, 0.10), transparent 28%),
    linear-gradient(180deg, #f4f9ff 0%, #e9f4ff 48%, #f7fbff 100%) !important;
}

/* 点击元素也使用足球鼠标 */
a,
button,
summary,
label,
input,
textarea,
select,
[role="button"],
#ai-send-button,
#ai-mod-button2 {
  cursor: var(--bl-cursor) !important;
}

/* ========== 2. 主体聊天区域 ========== */
#customized-answer-content,
#customized-question-content,
.markdown-body,
.prose,
.message-content,
.ai-response,
.chat-message {
  color: var(--bl-text) !important;
  font-family: var(--bl-font) !important;
  font-size: 16px !important;
  line-height: 1.82 !important;
  letter-spacing: 0.01em !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* AI回复正文卡片 */
#customized-answer-content,
.markdown-body,
.prose {
  max-width: 100% !important;
  padding: 20px !important;
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(241,248,255,0.96)) !important;
  border: 1px solid var(--bl-border) !important;
  box-shadow: var(--bl-shadow) !important;
}

/* 顶部小标签，不挡正文 */
#customized-answer-content::before,
.markdown-body::before,
.prose::before {
  content: "BLUE LOCK · EGO REBORN";
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 14px 0;
  padding: 5px 12px;
  border-radius: 999px;
  background: #e4f3ff;
  color: var(--bl-blue-deep);
  border: 1px solid rgba(29, 140, 255, 0.25);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

/* 正文段落 */
#customized-answer-content p,
.markdown-body p,
.prose p {
  color: var(--bl-text) !important;
  margin: 0.88em 0 !important;
}

/* 强调文字 */
strong,
b,
#customized-answer-content strong,
.markdown-body strong,
.prose strong {
  color: var(--bl-blue-deep) !important;
  font-weight: 800 !important;
}

/* 斜体 */
em,
i {
  color: var(--bl-text-soft) !important;
}

/* 分割线 */
hr {
  border: 0 !important;
  height: 1px !important;
  margin: 20px 0 !important;
  background: linear-gradient(90deg, transparent, rgba(29,140,255,0.36), transparent) !important;
}

/* ========== 3. 标题 ========== */
h1,
h2,
h3,
h4 {
  color: var(--bl-text) !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
}

h1 {
  font-size: 1.75rem !important;
  color: var(--bl-blue-deep) !important;
}

h2 {
  font-size: 1.38rem !important;
  margin-top: 1.5em !important;
  padding: 8px 12px !important;
  border-left: 5px solid var(--bl-blue) !important;
  border-radius: 10px !important;
  background: linear-gradient(90deg, rgba(29,140,255,0.10), transparent) !important;
}

h3 {
  font-size: 1.16rem !important;
  color: var(--bl-gold) !important;
}

/* ========== 4. 状态栏 details 总体 ========== */
details {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 14px 0 !important;
  border-radius: var(--bl-radius) !important;
  background: var(--bl-card) !important;
  border: 1px solid var(--bl-border) !important;
  box-shadow: var(--bl-shadow-small) !important;
  overflow: hidden !important;
  color: var(--bl-text) !important;
}

/* 展开时更明显 */
details[open] {
  border-color: var(--bl-border-strong) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f1f8ff 100%) !important;
}

/* 状态栏标题 */
summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 11px 44px 11px 14px !important;
  position: relative !important;

  color: #08345f !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  letter-spacing: 0.04em !important;

  background:
    linear-gradient(90deg, #dff1ff 0%, #f6fbff 100%) !important;
  border-bottom: 1px solid rgba(29, 140, 255, 0.14) !important;
  user-select: none !important;
}

summary::-webkit-details-marker {
  display: none !important;
}

/* summary 左侧图标 */
summary::before {
  content: "⚽";
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  color: var(--bl-blue-deep);
  border: 1px solid rgba(29, 140, 255, 0.24);
  box-shadow: 0 3px 8px rgba(29, 140, 255, 0.12);
  font-size: 13px;
}

/* summary 右侧箭头 */
summary::after {
  content: "⌄";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-54%) rotate(-90deg);
  color: var(--bl-blue-deep);
  font-size: 20px;
  font-weight: 800;
  transition: transform 0.2s ease;
}

details[open] > summary::after {
  transform: translateY(-54%) rotate(0deg);
}

/* details 内部内容 */
details > p,
details > div,
details > ul,
details > ol,
details > table,
details > blockquote {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

details > p:first-of-type,
details > div:first-of-type,
details > ul:first-of-type,
details > ol:first-of-type,
details > table:first-of-type {
  margin-top: 14px !important;
}

details > p:last-child,
details > div:last-child,
details > ul:last-child,
details > ol:last-child,
details > table:last-child {
  margin-bottom: 16px !important;
}

/* 状态栏内文字 */
details p,
details li,
details td,
details div {
  color: var(--bl-text) !important;
}

details strong {
  color: var(--bl-blue-deep) !important;
}

/* 嵌套 details，例如记忆区里面的星记忆回廊 */
details details {
  margin: 12px 16px !important;
  background: #f8fcff !important;
  border-color: rgba(29, 140, 255, 0.18) !important;
  box-shadow: none !important;
}

details details summary {
  background: #eef7ff !important;
  font-size: 14px !important;
}

/* ========== 5. 按 summary 名称区分状态栏图标 ========== */
summary {
  white-space: normal !important;
}

summary:has-text {
  color: inherit;
}

/* 兼容性写法：按出现顺序给图标，不影响功能 */
details:nth-of-type(1) > summary::before { content: "🧠"; }
details:nth-of-type(2) > summary::before { content: "📌"; }
details:nth-of-type(3) > summary::before { content: "👤"; }
details:nth-of-type(4) > summary::before { content: "👥"; }
details:nth-of-type(5) > summary::before { content: "🔗"; }
details:nth-of-type(6) > summary::before { content: "🏟️"; }
details:nth-of-type(7) > summary::before { content: "💾"; }
details:nth-of-type(8) > summary::before { content: "🎯"; }

/* ========== 6. 表格：关系网 / 竞技态势 / 记忆区 ========== */
table {
  width: calc(100% - 32px) !important;
  max-width: calc(100% - 32px) !important;
  margin: 14px 16px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid rgba(29, 140, 255, 0.20) !important;
  box-shadow: 0 4px 12px rgba(28, 90, 145, 0.08) !important;
}

th {
  padding: 10px 12px !important;
  background: #dcefff !important;
  color: #08345f !important;
  border: none !important;
  border-bottom: 1px solid rgba(29, 140, 255, 0.20) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

td {
  padding: 10px 12px !important;
  color: var(--bl-text) !important;
  background: #ffffff !important;
  border: none !important;
  border-bottom: 1px solid rgba(29, 140, 255, 0.10) !important;
  font-size: 13px !important;
  vertical-align: top !important;
}

tr:nth-child(even) td {
  background: #f6fbff !important;
}

tr:hover td {
  background: #edf7ff !important;
}

/* ========== 7. 列表 ========== */
ul,
ol {
  color: var(--bl-text) !important;
  padding-left: 1.5em !important;
}

li {
  color: var(--bl-text) !important;
  margin: 0.35em 0 !important;
}

li::marker {
  color: var(--bl-blue) !important;
}

/* ========== 8. 行动推荐优化 ========== */
details:last-of-type {
  border-color: rgba(201, 139, 24, 0.30) !important;
}

details:last-of-type > summary {
  color: #704800 !important;
  background: linear-gradient(90deg, #fff3d6 0%, #f7fbff 100%) !important;
}

details:last-of-type > summary::before {
  content: "🎯";
}

/* 行动推荐里的 A/B/C/D/E 如果被输出成段落，会更像按钮 */
details:last-of-type p {
  padding: 9px 12px !important;
  border-radius: 12px !important;
  background: rgba(255, 250, 238, 0.72) !important;
  border: 1px solid rgba(201, 139, 24, 0.18) !important;
}

/* ========== 9. 按钮 ========== */
button,
.btn,
.button,
input[type="button"],
input[type="submit"],
#ai-send-button,
#ai-mod-button2,
.copy-code-button,
[class*="btn"],
[class*="button"] {
  border-radius: 999px !important;
  border: 1px solid rgba(29, 140, 255, 0.34) !important;
  background: linear-gradient(180deg, #ffffff 0%, #e8f5ff 100%) !important;
  color: #08345f !important;
  font-weight: 850 !important;
  letter-spacing: 0.03em !important;
  box-shadow: 0 5px 14px rgba(28, 90, 145, 0.13) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}

button:hover,
.btn:hover,
.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
#ai-send-button:hover,
#ai-mod-button2:hover,
.copy-code-button:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(29, 140, 255, 0.62) !important;
  background: linear-gradient(180deg, #ffffff 0%, #dff1ff 100%) !important;
  box-shadow: 0 8px 20px rgba(28, 90, 145, 0.18) !important;
}

button:active,
.btn:active,
.button:active,
#ai-send-button:active,
#ai-mod-button2:active {
  transform: translateY(0) scale(0.98) !important;
}

/* 发送按钮突出一点 */
#ai-send-button {
  background: linear-gradient(180deg, #2898ff 0%, #0b64c7 100%) !important;
  color: #ffffff !important;
  border-color: rgba(10, 79, 159, 0.5) !important;
}

/* MOD按钮 */
#ai-mod-button2 {
  background: linear-gradient(180deg, #fff8e7 0%, #f1e3bd 100%) !important;
  color: #704800 !important;
  border-color: rgba(201, 139, 24, 0.28) !important;
}

/* ========== 10. 输入框 / 评论区 ========== */
textarea,
input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
select,
#ai-chat-input,
.comment-area,
.comment-box,
.comment-input,
.reply-box,
[class*="comment"] textarea,
[class*="reply"] textarea {
  box-sizing: border-box !important;
  width: 100%;
  color: var(--bl-text) !important;
  background: #ffffff !important;
  border: 1px solid rgba(29, 140, 255, 0.26) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  font-family: var(--bl-font) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 4px 12px rgba(28,90,145,0.08) !important;
  outline: none !important;
}

textarea::placeholder,
input::placeholder,
#ai-chat-input::placeholder {
  color: #8aa2b8 !important;
}

textarea:focus,
input:focus,
select:focus,
#ai-chat-input:focus {
  border-color: rgba(29, 140, 255, 0.62) !important;
  box-shadow:
    0 0 0 3px rgba(29, 140, 255, 0.12),
    0 6px 16px rgba(28, 90, 145, 0.12) !important;
}

/* 评论卡片 */
.comment,
.comment-item,
.reply,
.reply-item,
[class*="comment-item"],
[class*="reply-item"],
[class*="commentContent"],
[class*="replyContent"] {
  color: var(--bl-text) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(29, 140, 255, 0.18) !important;
  border-radius: 18px !important;
  padding: 14px !important;
  margin: 10px 0 !important;
  box-shadow: 0 6px 18px rgba(28, 90, 145, 0.10) !important;
}

/* 评论区昵称/时间 */
[class*="comment"] strong,
[class*="reply"] strong,
[class*="userName"],
[class*="nickname"],
[class*="time"] {
  color: var(--bl-blue-deep) !important;
}

/* ========== 11. 引用 / 代码块 ========== */
blockquote {
  margin: 16px 0 !important;
  padding: 12px 14px !important;
  border-left: 5px solid var(--bl-blue) !important;
  border-radius: 0 14px 14px 0 !important;
  background: #eef7ff !important;
  color: var(--bl-text) !important;
}

pre {
  max-width: 100% !important;
  overflow-x: auto !important;
  padding: 14px !important;
  border-radius: 14px !important;
  background: #102033 !important;
  color: #eaf6ff !important;
  border: 1px solid rgba(29, 140, 255, 0.28) !important;
}

code {
  font-family: "JetBrains Mono", "Consolas", monospace !important;
}

:not(pre) > code {
  color: var(--bl-blue-deep) !important;
  background: #e4f3ff !important;
  border: 1px solid rgba(29, 140, 255, 0.20) !important;
  border-radius: 8px !important;
  padding: 2px 6px !important;
}

/* ========== 12. 链接 ========== */
a {
  color: var(--bl-blue-deep) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

a:hover {
  color: var(--bl-gold) !important;
  text-decoration: underline !important;
}

/* ========== 13. 滚动条 ========== */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #e6f1fb;
}

::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #9cc9ee;
  border: 2px solid #e6f1fb;
}

::-webkit-scrollbar-thumb:hover {
  background: #6fb0e8;
}

/* ========== 14. 防黑字、防溢出 ========== */
#customized-answer-content *,
#customized-question-content *,
.markdown-body *,
.prose *,
details *,
.comment *,
.comment-item *,
.reply *,
.reply-item * {
  box-sizing: border-box !important;
}

#customized-answer-content span,
#customized-answer-content div,
#customized-question-content span,
#customized-question-content div,
.markdown-body span,
.markdown-body div,
.prose span,
.prose div {
  color: inherit;
}

/* 图片不撑爆 */
img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 14px;
}

/* ========== 15. 手机适配 ========== */
@media (max-width: 768px) {
  #customized-answer-content,
  #customized-question-content,
  .markdown-body,
  .prose {
    padding: 14px !important;
    border-radius: 18px !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
  }

  #customized-answer-content::before,
  .markdown-body::before,
  .prose::before {
    font-size: 10px !important;
    letter-spacing: 0.08em !important;
    padding: 4px 9px !important;
  }

  details {
    margin: 12px 0 !important;
    border-radius: 15px !important;
  }

  summary {
    min-height: 40px !important;
    padding: 10px 38px 10px 12px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
  }

  summary::before {
    width: 22px !important;
    height: 22px !important;
    font-size: 12px !important;
  }

  summary::after {
    right: 13px !important;
  }

  details > p,
  details > div,
  details > ul,
  details > ol,
  details > table,
  details > blockquote {
    margin-left: 12px !important;
    margin-right: 12px !important;
  }

  /* 手机表格横向滑动，不挤爆状态栏 */
  table {
    display: block !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    margin: 12px !important;
  }

  th,
  td {
    font-size: 12.5px !important;
    padding: 8px 10px !important;
  }

  button,
  .btn,
  .button,
  #ai-send-button,
  #ai-mod-button2 {
    min-height: 36px !important;
    font-size: 14px !important;
  }

  textarea,
  input,
  select,
  #ai-chat-input {
    font-size: 15px !important;
  }
}

/* ========== 16. 超小屏 ========== */
@media (max-width: 420px) {
  #customized-answer-content,
  #customized-question-content,
  .markdown-body,
  .prose {
    padding: 12px !important;
    font-size: 14px !important;
  }

  summary {
    font-size: 13px !important;
  }

  details p,
  details li,
  td,
  th {
    font-size: 12px !important;
  }

  h1 { font-size: 1.45rem !important; }
  h2 { font-size: 1.18rem !important; }
  h3 { font-size: 1.05rem !important; }
}

/* =========================================================
   蓝色监狱 Ego Reborn｜状态栏专用美化
   专门适配：思维链 / 当前篇幅 / 主角信息 / NPC信息 / 关系网 /
            竞技态势 / 记忆区 / 行动推荐
   使用方式：放在所有CSS最底部，覆盖前面的状态栏样式
   ========================================================= */

/* ========== 状态栏整体容器 ========== */
#customized-answer-content details,
.markdown-body details,
.prose details {
  width: 100% !important;
  max-width: 100% !important;
  margin: 12px 0 !important;
  padding: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;

  background: #ffffff !important;
  border: 1px solid rgba(40, 125, 205, 0.22) !important;
  box-shadow:
    0 6px 16px rgba(20, 78, 130, 0.10),
    inset 0 1px 0 rgba(255,255,255,0.9) !important;

  color: #17283b !important;
}

/* 展开状态 */
#customized-answer-content details[open],
.markdown-body details[open],
.prose details[open] {
  background: linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%) !important;
  border-color: rgba(23, 126, 225, 0.38) !important;
}

/* ========== 状态栏标题 summary ========== */
#customized-answer-content details > summary,
.markdown-body details > summary,
.prose details > summary {
  list-style: none !important;
  min-height: 42px !important;
  padding: 10px 42px 10px 14px !important;
  margin: 0 !important;

  display: flex !important;
  align-items: center !important;
  gap: 8px !important;

  position: relative !important;
  background:
    linear-gradient(90deg, #e3f2ff 0%, #f8fcff 100%) !important;
  border-bottom: 1px solid rgba(23, 126, 225, 0.15) !important;

  color: #073b72 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.35 !important;

  cursor: pointer !important;
  user-select: none !important;
}

#customized-answer-content summary::-webkit-details-marker,
.markdown-body summary::-webkit-details-marker,
.prose summary::-webkit-details-marker {
  display: none !important;
}

/* 左侧小图标 */
#customized-answer-content details > summary::before,
.markdown-body details > summary::before,
.prose details > summary::before {
  content: "⚽";
  width: 23px !important;
  height: 23px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;

  background: #ffffff !important;
  border: 1px solid rgba(23, 126, 225, 0.25) !important;
  color: #0c5aaa !important;
  font-size: 12px !important;
  box-shadow: 0 3px 8px rgba(23, 126, 225, 0.12) !important;
}

/* 右侧展开箭头 */
#customized-answer-content details > summary::after,
.markdown-body details > summary::after,
.prose details > summary::after {
  content: "›";
  position: absolute !important;
  right: 15px !important;
  top: 50% !important;
  transform: translateY(-50%) rotate(90deg) !important;

  color: #0c5aaa !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  transition: transform 0.18s ease !important;
}

#customized-answer-content details[open] > summary::after,
.markdown-body details[open] > summary::after,
.prose details[open] > summary::after {
  transform: translateY(-50%) rotate(-90deg) !important;
}

/* ========== 不同状态栏图标：按出现顺序 ========== */
#customized-answer-content details:nth-of-type(1) > summary::before,
.markdown-body details:nth-of-type(1) > summary::before,
.prose details:nth-of-type(1) > summary::before {
  content: "🧠";
}

#customized-answer-content details:nth-of-type(2) > summary::before,
.markdown-body details:nth-of-type(2) > summary::before,
.prose details:nth-of-type(2) > summary::before {
  content: "📍";
}

#customized-answer-content details:nth-of-type(3) > summary::before,
.markdown-body details:nth-of-type(3) > summary::before,
.prose details:nth-of-type(3) > summary::before {
  content: "👤";
}

#customized-answer-content details:nth-of-type(4) > summary::before,
.markdown-body details:nth-of-type(4) > summary::before,
.prose details:nth-of-type(4) > summary::before {
  content: "👥";
}

#customized-answer-content details:nth-of-type(5) > summary::before,
.markdown-body details:nth-of-type(5) > summary::before,
.prose details:nth-of-type(5) > summary::before {
  content: "🔗";
}

#customized-answer-content details:nth-of-type(6) > summary::before,
.markdown-body details:nth-of-type(6) > summary::before,
.prose details:nth-of-type(6) > summary::before {
  content: "🏟";
}

#customized-answer-content details:nth-of-type(7) > summary::before,
.markdown-body details:nth-of-type(7) > summary::before,
.prose details:nth-of-type(7) > summary::before {
  content: "💾";
}

#customized-answer-content details:nth-of-type(8) > summary::before,
.markdown-body details:nth-of-type(8) > summary::before,
.prose details:nth-of-type(8) > summary::before {
  content: "🎯";
}

/* ========== 状态栏内部内容排版 ========== */
#customized-answer-content details > *:not(summary),
.markdown-body details > *:not(summary),
.prose details > *:not(summary) {
  margin-left: 14px !important;
  margin-right: 14px !important;
}

#customized-answer-content details p,
.markdown-body details p,
.prose details p {
  color: #1c3046 !important;
  font-size: 14px !important;
  line-height: 1.72 !important;
  margin: 9px 14px !important;
}

#customized-answer-content details div,
.markdown-body details div,
.prose details div {
  color: #1c3046 !important;
}

#customized-answer-content details strong,
.markdown-body details strong,
.prose details strong {
  color: #075aa7 !important;
  font-weight: 800 !important;
}

/* 列表 */
#customized-answer-content details ul,
#customized-answer-content details ol,
.markdown-body details ul,
.markdown-body details ol,
.prose details ul,
.prose details ol {
  padding-left: 1.4em !important;
  margin: 10px 14px !important;
}

#customized-answer-content details li,
.markdown-body details li,
.prose details li {
  color: #1c3046 !important;
  font-size: 14px !important;
  line-height: 1.68 !important;
  margin: 5px 0 !important;
}

#customized-answer-content details li::marker,
.markdown-body details li::marker,
.prose details li::marker {
  color: #1685e8 !important;
}

/* ========== 状态栏表格美化 ========== */
#customized-answer-content details table,
.markdown-body details table,
.prose details table {
  width: calc(100% - 28px) !important;
  max-width: calc(100% - 28px) !important;

  margin: 12px 14px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;

  display: table !important;
  overflow: hidden !important;

  background: #ffffff !important;
  border: 1px solid rgba(23, 126, 225, 0.20) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(20, 78, 130, 0.06) !important;
}

#customized-answer-content details thead,
.markdown-body details thead,
.prose details thead {
  background: #dceeff !important;
}

#customized-answer-content details th,
.markdown-body details th,
.prose details th {
  padding: 9px 10px !important;
  background: #dceeff !important;
  color: #073b72 !important;

  border: none !important;
  border-bottom: 1px solid rgba(23, 126, 225, 0.18) !important;

  font-size: 12.5px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

#customized-answer-content details td,
.markdown-body details td,
.prose details td {
  padding: 9px 10px !important;
  background: #ffffff !important;
  color: #20364c !important;

  border: none !important;
  border-bottom: 1px solid rgba(23, 126, 225, 0.10) !important;

  font-size: 12.5px !important;
  line-height: 1.55 !important;
  vertical-align: top !important;
}

#customized-answer-content details tr:nth-child(even) td,
.markdown-body details tr:nth-child(even) td,
.prose details tr:nth-child(even) td {
  background: #f6fbff !important;
}

#customized-answer-content details tr:hover td,
.markdown-body details tr:hover td,
.prose details tr:hover td {
  background: #edf7ff !important;
}

/* ========== 记忆区嵌套 details ========== */
#customized-answer-content details details,
.markdown-body details details,
.prose details details {
  margin: 12px 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(23, 126, 225, 0.18) !important;
  box-shadow: none !important;
  background: #f8fcff !important;
}

#customized-answer-content details details > summary,
.markdown-body details details > summary,
.prose details details > summary {
  min-height: 38px !important;
  padding: 9px 38px 9px 12px !important;
  font-size: 13px !important;
  background: #edf7ff !important;
}

#customized-answer-content details details > summary::before,
.markdown-body details details > summary::before,
.prose details details > summary::before {
  content: "✦";
  width: 21px !important;
  height: 21px !important;
  font-size: 12px !important;
}

/* ========== 当前篇幅 / 主角信息这类字段美化 ========== */
#customized-answer-content details p strong:first-child,
.markdown-body details p strong:first-child,
.prose details p strong:first-child {
  display: inline-block !important;
  min-width: 5em !important;
  color: #074f93 !important;
}

/* ========== 行动推荐模块 ========== */
#customized-answer-content details:last-of-type,
.markdown-body details:last-of-type,
.prose details:last-of-type {
  border-color: rgba(201, 139, 24, 0.28) !important;
  background: #fffdf7 !important;
}

#customized-answer-content details:last-of-type > summary,
.markdown-body details:last-of-type > summary,
.prose details:last-of-type > summary {
  background: linear-gradient(90deg, #fff2d2 0%, #ffffff 100%) !important;
  color: #7a5108 !important;
}

#customized-answer-content details:last-of-type > summary::before,
.markdown-body details:last-of-type > summary::before,
.prose details:last-of-type > summary::before {
  content: "🎯";
  border-color: rgba(201, 139, 24, 0.28) !important;
}

/* 如果行动推荐输出成 A. B. C. D. E. 纯文本段落，做成选项卡效果 */
#customized-answer-content details:last-of-type p,
.markdown-body details:last-of-type p,
.prose details:last-of-type p {
  padding: 9px 11px !important;
  margin: 8px 14px !important;
  border-radius: 10px !important;

  background: #fff8e8 !important;
  border: 1px solid rgba(201, 139, 24, 0.18) !important;
  color: #3a2a13 !important;
}

/* ========== 代码块状态栏：防止黑底糊成一片 ========== */
#customized-answer-content details code,
.markdown-body details code,
.prose details code {
  color: #075aa7 !important;
  background: #e7f4ff !important;
  border: 1px solid rgba(23, 126, 225, 0.18) !important;
  border-radius: 7px !important;
  padding: 2px 5px !important;
}

#customized-answer-content details pre,
.markdown-body details pre,
.prose details pre {
  max-width: calc(100% - 28px) !important;
  margin: 12px 14px !important;
  padding: 12px !important;
  overflow-x: auto !important;

  color: #eaf6ff !important;
  background: #102033 !important;
  border-radius: 12px !important;
  border: 1px solid rgba(23, 126, 225, 0.26) !important;
}

/* ========== 手机适配：状态栏不炸 ========== */
@media (max-width: 768px) {
  #customized-answer-content details,
  .markdown-body details,
  .prose details {
    margin: 10px 0 !important;
    border-radius: 13px !important;
  }

  #customized-answer-content details > summary,
  .markdown-body details > summary,
  .prose details > summary {
    min-height: 39px !important;
    padding: 9px 36px 9px 11px !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
  }

  #customized-answer-content details > summary::before,
  .markdown-body details > summary::before,
  .prose details > summary::before {
    width: 21px !important;
    height: 21px !important;
    font-size: 11px !important;
  }

  #customized-answer-content details > summary::after,
  .markdown-body details > summary::after,
  .prose details > summary::after {
    right: 12px !important;
    font-size: 19px !important;
  }

  #customized-answer-content details p,
  .markdown-body details p,
  .prose details p,
  #customized-answer-content details li,
  .markdown-body details li,
  .prose details li {
    font-size: 12.5px !important;
    line-height: 1.62 !important;
  }

  /* 手机表格横向滑动 */
  #customized-answer-content details table,
  .markdown-body details table,
  .prose details table {
    display: block !important;
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    margin: 10px !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }

  #customized-answer-content details th,
  .markdown-body details th,
  .prose details th,
  #customized-answer-content details td,
  .markdown-body details td,
  .prose details td {
    font-size: 12px !important;
    padding: 7px 8px !important;
  }

  #customized-answer-content details > *:not(summary),
  .markdown-body details > *:not(summary),
  .prose details > *:not(summary) {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
}

/* =========================================================
   修复：关系网 / 竞技态势 / 记忆区表格太宽被挡住
   放在所有CSS最底部
   ========================================================= */

/* 1. 先解除状态栏外层裁切，不然表格滑动条会被吃掉 */
#customized-answer-content details,
.markdown-body details,
.prose details {
  overflow: visible !important;
}

/* 2. summary 保持圆角，内容区单独处理 */
#customized-answer-content details > summary,
.markdown-body details > summary,
.prose details > summary {
  border-radius: 14px 14px 0 0 !important;
}

/* 3. 所有状态栏表格都允许横向滚动 */
#customized-answer-content details table,
.markdown-body details table,
.prose details table {
  display: block !important;
  width: calc(100% - 24px) !important;
  max-width: calc(100% - 24px) !important;
  margin: 12px !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;

  border-radius: 12px !important;
  border: 1px solid rgba(23, 126, 225, 0.20) !important;
  background: #ffffff !important;
  box-shadow: 0 4px 12px rgba(20, 78, 130, 0.06) !important;
}

/* 4. 让表格内部保持真实宽度，不要硬挤压 */
#customized-answer-content details table thead,
#customized-answer-content details table tbody,
#customized-answer-content details table tr,
.markdown-body details table thead,
.markdown-body details table tbody,
.markdown-body details table tr,
.prose details table thead,
.prose details table tbody,
.prose details table tr {
  width: max-content !important;
}

/* 5. 单元格不要被压成竖排 */
#customized-answer-content details table th,
#customized-answer-content details table td,
.markdown-body details table th,
.markdown-body details table td,
.prose details table th,
.prose details table td {
  white-space: nowrap !important;
  min-width: 86px !important;
}

/* 6. 长内容列给更宽一点，避免特别丑 */
#customized-answer-content details table th:nth-child(4),
#customized-answer-content details table td:nth-child(4),
#customized-answer-content details table th:nth-child(6),
#customized-answer-content details table td:nth-child(6),
#customized-answer-content details table th:nth-child(7),
#customized-answer-content details table td:nth-child(7),
#customized-answer-content details table th:nth-child(8),
#customized-answer-content details table td:nth-child(8),
.markdown-body details table th:nth-child(4),
.markdown-body details table td:nth-child(4),
.markdown-body details table th:nth-child(6),
.markdown-body details table td:nth-child(6),
.markdown-body details table th:nth-child(7),
.markdown-body details table td:nth-child(7),
.markdown-body details table th:nth-child(8),
.markdown-body details table td:nth-child(8),
.prose details table th:nth-child(4),
.prose details table td:nth-child(4),
.prose details table th:nth-child(6),
.prose details table td:nth-child(6),
.prose details table th:nth-child(7),
.prose details table td:nth-child(7),
.prose details table th:nth-child(8),
.prose details table td:nth-child(8) {
  min-width: 130px !important;
}

/* 7. 横向滚动条做得细一点，不占地方 */
#customized-answer-content details table::-webkit-scrollbar,
.markdown-body details table::-webkit-scrollbar,
.prose details table::-webkit-scrollbar {
  height: 7px !important;
}

#customized-answer-content details table::-webkit-scrollbar-track,
.markdown-body details table::-webkit-scrollbar-track,
.prose details table::-webkit-scrollbar-track {
  background: #e8f3ff !important;
  border-radius: 999px !important;
}

#customized-answer-content details table::-webkit-scrollbar-thumb,
.markdown-body details table::-webkit-scrollbar-thumb,
.prose details table::-webkit-scrollbar-thumb {
  background: #8fc7f2 !important;
  border-radius: 999px !important;
}

#customized-answer-content details table::-webkit-scrollbar-thumb:hover,
.markdown-body details table::-webkit-scrollbar-thumb:hover,
.prose details table::-webkit-scrollbar-thumb:hover {
  background: #4fa5e8 !important;
}

/* 8. 手机端进一步压缩一点 */
@media (max-width: 768px) {
  #customized-answer-content details table,
  .markdown-body details table,
  .prose details table {
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    margin: 8px !important;
  }

  #customized-answer-content details table th,
  #customized-answer-content details table td,
  .markdown-body details table th,
  .markdown-body details table td,
  .prose details table th,
  .prose details table td {
    min-width: 76px !important;
    padding: 7px 8px !important;
    font-size: 12px !important;
  }

  #customized-answer-content details table th:nth-child(4),
  #customized-answer-content details table td:nth-child(4),
  #customized-answer-content details table th:nth-child(6),
  #customized-answer-content details table td:nth-child(6),
  #customized-answer-content details table th:nth-child(7),
  #customized-answer-content details table td:nth-child(7),
  #customized-answer-content details table th:nth-child(8),
  #customized-answer-content details table td:nth-child(8),
  .markdown-body details table th:nth-child(4),
  .markdown-body details table td:nth-child(4),
  .markdown-body details table th:nth-child(6),
  .markdown-body details table td:nth-child(6),
  .markdown-body details table th:nth-child(7),
  .markdown-body details table td:nth-child(7),
  .markdown-body details table th:nth-child(8),
  .markdown-body details table td:nth-child(8),
  .prose details table th:nth-child(4),
  .prose details table td:nth-child(4),
  .prose details table th:nth-child(6),
  .prose details table td:nth-child(6),
  .prose details table th:nth-child(7),
  .prose details table td:nth-child(7),
  .prose details table th:nth-child(8),
  .prose details table td:nth-child(8) {
    min-width: 118px !important;
  }
}

/* =========================================================
   当前篇幅基础信息美化：时间 / 地点 / 天气 / 篇章
   放在所有 CSS 最底部
   ========================================================= */

/* 当前篇幅 details 里的普通字段段落 */
#customized-answer-content details p:has(strong),
.markdown-body details p:has(strong),
.prose details p:has(strong) {
  padding: 10px 12px !important;
  margin: 9px 14px !important;

  background: linear-gradient(90deg, #f4faff 0%, #ffffff 100%) !important;
  border: 1px solid rgba(29, 140, 255, 0.16) !important;
  border-radius: 12px !important;

  color: #1c3046 !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
  box-shadow: 0 3px 10px rgba(28, 90, 145, 0.05) !important;
}

/* 字段名：时间 / 地点 / 天气 */
#customized-answer-content details p strong,
.markdown-body details p strong,
.prose details p strong {
  display: inline-block !important;
  min-width: 7.2em !important;
  margin: 3px 6px 3px 0 !important;
  padding: 2px 8px !important;

  border-radius: 999px !important;
  background: #e1f1ff !important;
  border: 1px solid rgba(29, 140, 255, 0.22) !important;

  color: #075aa7 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  text-align: center !important;
}

/* 当前篇幅这个模块稍微高级一点 */
#customized-answer-content details:nth-of-type(2),
.markdown-body details:nth-of-type(2),
.prose details:nth-of-type(2) {
  background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%) !important;
  border-color: rgba(29, 140, 255, 0.30) !important;
}

/* 当前篇幅标题 */
#customized-answer-content details:nth-of-type(2) > summary,
.markdown-body details:nth-of-type(2) > summary,
.prose details:nth-of-type(2) > summary {
  background: linear-gradient(90deg, #d8edff 0%, #ffffff 100%) !important;
  color: #073b72 !important;
}

/* 当前篇幅图标 */
#customized-answer-content details:nth-of-type(2) > summary::before,
.markdown-body details:nth-of-type(2) > summary::before,
.prose details:nth-of-type(2) > summary::before {
  content: "📍" !important;
}

/* 手机端压缩 */
@media (max-width: 768px) {
  #customized-answer-content details p:has(strong),
  .markdown-body details p:has(strong),
  .prose details p:has(strong) {
    padding: 8px 9px !important;
    margin: 8px 10px !important;
    font-size: 12.5px !important;
    line-height: 1.75 !important;
  }

  #customized-answer-content details p strong,
  .markdown-body details p strong,
  .prose details p strong {
    min-width: 6.2em !important;
    padding: 1px 6px !important;
    font-size: 12px !important;
  }
}