/* =============================================
   秦诗诗 · builtInCss
   核心意象：午后窗边，半杯玫瑰红茶旁摊着一本翻旧的小说
   base-hue:35  base-sat:15%  is-dark:0  accent-hue:345  accent-sat:35%
   bg-deep:hsl(35,15%,96%)    bg-default:hsl(35,15%,93%)   bg-paper:hsl(35,15%,100%)
   bg-raised:hsl(35,15%,88%)  bg-hover:hsl(35,15%,82%)    text-main:hsl(35,8%,7%)
   text-sub:hsl(35,6%,35%)    text-muted:hsl(35,5%,56%)   border:hsl(35,15%,80%)
   accent:hsl(345,35%,42%)    accent-dim:hsl(345,12%,90%) accent-text:hsl(345,28%,30%)
   glow:0 0 14px hsla(345,35%,55%,0.4)  glow-soft:0 0 6px hsla(345,35%,55%,0.2)
   ============================================= */

/* ===== §0 危险区域 ===== */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
  display: none !important;
}

.markdown-body pre {
  background: hsl(35,15%,100%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  border-left: 3px solid hsl(345,35%,42%) !important;
  border-radius: 6px !important;
  padding: 1em 1.2em !important;
  overflow-x: auto !important;
}
.markdown-body pre code {
  background: transparent !important;
  color: hsl(35,8%,7%) !important;
}
.markdown-body :not(pre) > code {
  background: hsl(345,12%,90%) !important;
  color: hsl(345,28%,30%) !important;
  padding: 0.15em 0.45em !important;
  border-radius: 4px !important;
}

.markdown-body details {
  display: block !important;
  width: 100% !important;
  background: hsl(35,15%,100%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  border-radius: 8px !important;
  margin: 8px 0 !important;
  overflow: hidden !important;
  transition: border-color 0.15s !important;
}
.markdown-body details[open] {
  border-color: hsl(345,35%,42%) !important;
}
.markdown-body details summary {
  background: hsl(35,15%,88%) !important;
  color: hsl(35,8%,7%) !important;
  padding: 10px 14px 10px 34px !important;
  display: block !important;
  position: relative !important;
  border-bottom: 1px solid hsl(35,15%,80%) !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  list-style: none !important;
  user-select: none !important;
  font-size: 0.95em !important;
}
.markdown-body details summary::before {
  content: '▶' !important;
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: hsl(345,35%,42%) !important;
  font-size: 10px !important;
  transition: transform 0.15s ease !important;
}
.markdown-body details[open] summary::before {
  transform: translateY(-50%) rotate(90deg) !important;
}
.markdown-body details summary::-webkit-details-marker {
  display: none !important;
}

::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
::-webkit-scrollbar-track { background: hsl(35,15%,96%) !important; }
::-webkit-scrollbar-thumb {
  background: hsl(345,12%,90%) !important;
  border-radius: 3px !important;
}
::-webkit-scrollbar-thumb:hover { background: hsl(345,35%,42%) !important; }

::placeholder { color: hsl(35,5%,56%) !important; opacity: 1 !important; }
::selection {
  background: hsl(345,12%,90%) !important;
  color: hsl(345,28%,30%) !important;
}

#ai-chat-input {
  background: hsl(35,15%,100%) !important;
  color: hsl(35,8%,7%) !important;
  caret-color: hsl(345,35%,42%) !important;
}
textarea.rc-textarea {
  background: hsl(35,15%,100%) !important;
  color: hsl(35,8%,7%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
}

/* ===== §1 全局与布局 ===== */
#root,
.h-screen {
  background: hsl(35,15%,93%) !important;
  color: hsl(35,8%,7%) !important;
}
.sticky.w-full.top-0.flex.items-center {
  background: hsl(35,15%,100%) !important;
  border-bottom: 1px solid hsl(35,15%,80%) !important;
}

/* ===== §2 模型选择器 ===== */
#ai-model-selector .group.flex.items-center {
  color: hsl(35,6%,35%) !important;
}
#ai-model-selector .group.flex.items-center:hover {
  color: hsl(345,35%,42%) !important;
}
#ai-model-selector .truncate.text-\[13px\] {
  color: hsl(35,6%,35%) !important;
}
#ai-model-selector .shrink-0.flex.items-center svg {
  fill: hsl(35,5%,56%) !important;
}
#ai-model-selector .shrink-0.flex.items-center:hover svg {
  fill: hsl(345,35%,42%) !important;
}
#header-setting-button {
  color: hsl(35,5%,56%) !important;
}
#header-setting-button:hover {
  color: hsl(345,35%,42%) !important;
}

/* ===== §3 开场白区域 ===== */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
  background: hsl(35,15%,88%) !important;
  border-color: hsl(35,15%,80%) !important;
  color: hsl(35,8%,7%) !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"],
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
  fill: hsl(35,5%,56%) !important;
}

/* ===== §4 侧边栏 ===== */
.shadow-lg.border-r.border-gray-200 {
  background: hsl(35,15%,100%) !important;
  border-color: hsl(35,15%,80%) !important;
}
.MuiList-root { background: transparent !important; color: hsl(35,8%,7%) !important; }
.conversation-text { color: hsl(35,6%,35%) !important; }

/* ===== §5 功能按钮 ===== */
#ai-mod-button2 button.MuiButton-root {
  background: hsl(35,15%,88%) !important;
  color: hsl(35,8%,7%) !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
  background: hsl(35,15%,82%) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  fill: hsl(35,5%,56%) !important;
}

/* ===== §6 聊天气泡 ===== */
.bg-gray-100\/90.relative.inline-block {
  background: hsl(35,15%,100%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  border-radius: 16px !important;
  padding: 12px !important;
}
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
  background: hsl(35,15%,88%) !important;
}

.markdown-body {
  color: hsl(35,8%,7%) !important;
  line-height: 1.8 !important;
  font-size: 15px !important;
  text-shadow: none !important;
  z-index: 1 !important;
  background: transparent !important;
}
.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
  color: hsl(35,8%,7%) !important;
  border-bottom: 1px solid hsl(35,15%,80%) !important;
  padding-bottom: 6px !important;
  margin-top: 16px !important;
  margin-bottom: 10px !important;
}
.markdown-body strong,
.markdown-body b {
  color: hsl(345,28%,30%) !important;
}
.markdown-body em,
.markdown-body i {
  color: hsl(345,28%,30%) !important;
}
.markdown-body a {
  color: hsl(345,35%,42%) !important;
  text-decoration: underline !important;
}
.markdown-body blockquote {
  border-left: 3px solid hsl(345,35%,42%) !important;
  background: hsl(345,12%,90%) !important;
  color: hsl(345,28%,30%) !important;
  padding: 8px 14px !important;
  margin: 12px 0 !important;
  border-radius: 0 6px 6px 0 !important;
  font-style: italic !important;
}
.markdown-body table {
  border-collapse: collapse !important;
  width: 100% !important;
  margin: 10px 0 !important;
}
.markdown-body th {
  background: hsl(35,15%,88%) !important;
  color: hsl(35,8%,7%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  padding: 7px 10px !important;
  font-weight: 600 !important;
  font-size: 0.9em !important;
}
.markdown-body td {
  border: 1px solid hsl(35,15%,80%) !important;
  padding: 7px 10px !important;
  color: hsl(35,6%,35%) !important;
  font-size: 0.9em !important;
}
.markdown-body hr {
  border: none !important;
  border-top: 1px solid hsl(35,15%,80%) !important;
  margin: 16px 0 !important;
}
.markdown-body ul,
.markdown-body ol {
  padding-left: 1.5em !important;
  color: hsl(35,6%,35%) !important;
}
.markdown-body li { margin: 3px 0 !important; }

/* ===== §7 加载动画 ===== */
#loading-anim,
#customized-answer-content-loading-anim-container,
#customized-answer-avatar-loading-anim-container { display: none !important; }

/* ===== §8 底部输入区 ===== */
.bg-gradient-to-t { background: hsl(35,15%,93%) !important; }
#ai-chat-bottom-input {
  background: hsl(35,15%,100%) !important;
  color: hsl(35,8%,7%) !important;
  caret-color: hsl(345,35%,42%) !important;
}
#ai-chat-input::placeholder { color: hsl(35,5%,56%) !important; }
#ai-chat-input::selection {
  background: hsl(345,12%,90%) !important;
  color: hsl(345,28%,30%) !important;
}
#ai-send-button {
  background: hsl(345,35%,42%) !important;
  color: #fff !important;
}
#ai-send-button:hover { background: hsl(345,40%,35%) !important; }

/* ===== §9 评论区与评分 ===== */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: hsl(35,15%,100%) !important;
  border-top: 1px solid hsl(35,15%,80%) !important;
}
div.text-lg.font-bold { color: hsl(35,8%,7%) !important; }
p.MuiTypography-body1.text-grey-600 { color: hsl(35,6%,35%) !important; }
span.MuiRating-iconEmpty svg { fill: hsl(35,5%,56%) !important; }
span.MuiRating-iconFilled svg { fill: hsl(345,35%,42%) !important; }
span.text-orange-500 { color: hsl(345,35%,42%) !important; }
div.flex.flex-col.border-gray-200 { border-color: hsl(35,15%,80%) !important; }
div.bg-gray-100.text-gray-500 {
  background: hsl(35,15%,88%) !important;
  color: hsl(35,5%,56%) !important;
}
div.cursor-pointer.group.flex.items-center.justify-center {
  background: transparent !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover {
  background: hsl(35,15%,82%) !important;
}
div[data-state="closed"] svg[data-icon="Send03"] { fill: hsl(35,5%,56%) !important; }
button.MuiButton-containedPrimary {
  background: hsl(345,35%,42%) !important;
  color: #fff !important;
}
button.MuiButton-containedPrimary:hover { background: hsl(345,40%,35%) !important; }
button.MuiButton-outlinedPrimary {
  border-color: hsl(345,35%,42%) !important;
  color: hsl(345,35%,42%) !important;
}
button.MuiButton-outlinedPrimary:hover {
  background: hsl(345,12%,90%) !important;
}
div.text-sm.text-grey-600 span.font-bold { color: hsl(35,8%,7%) !important; }
span.text-\[10px\] { color: hsl(35,5%,56%) !important; }
div.text-xs.text-grey-600 { color: hsl(35,6%,35%) !important; }
button.text-gray-400 { color: hsl(35,5%,56%) !important; }
button.text-gray-400:hover { color: hsl(345,35%,42%) !important; }
button.text-gray-400 svg { fill: currentColor !important; }
span.cursor-pointer { color: hsl(35,6%,35%) !important; }
span.cursor-pointer:hover { color: hsl(345,35%,42%) !important; }
div.ml-8.border-l { border-color: hsl(35,15%,80%) !important; }

/* ===== §10 分页 ===== */
.MuiPaginationItem-root {
  background: transparent !important;
  color: hsl(35,6%,35%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
}
.MuiPaginationItem-root.Mui-selected {
  background: hsl(345,35%,42%) !important;
  color: #fff !important;
}
.MuiPaginationItem-root.Mui-disabled { opacity: 0.5 !important; }
.MuiPaginationItem-icon { fill: hsl(35,5%,56%) !important; }
.MuiInputBase-input {
  background: hsl(35,15%,100%) !important;
  color: hsl(35,8%,7%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
}

/* ===== §11 MUI全局组件 ===== */
.MuiButton-root { border-radius: 6px !important; transition: all 0.15s !important; }
.MuiIconButton-root { background: transparent !important; }
.MuiIconButton-root:hover { background: hsl(35,15%,82%) !important; }
.MuiDialog-paper,
.MuiDrawer-paper { background: hsl(35,15%,100%) !important; }
.MuiBackdrop-root { background: rgba(0,0,0,0.3) !important; }
.MuiDivider-root { background: hsl(35,15%,80%) !important; }
.MuiOutlinedInput-root { border-color: hsl(35,15%,80%) !important; }
.MuiOutlinedInput-root:hover { border-color: hsl(345,35%,42%) !important; }
.MuiTouchRipple-root { color: hsl(345,35%,42%) !important; }
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary { color: hsl(345,35%,42%) !important; }
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  background: hsl(345,12%,90%) !important;
}

/* ===== §12 响应式 ===== */
@media (max-width: 480px) {
  .markdown-body { font-size: 14px !important; }
  .markdown-body details summary {
    padding: 8px 10px 8px 28px !important;
    font-size: 0.9em !important;
  }
}

/* ===== §13 降速 ===== */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ═══════════════════════════════════════════
   第二层：作品组件层
   ═══════════════════════════════════════════ */

/* ===== §A 叙事正文区 ===== */
/* 正文自然流，不额外设类。仅确保行宽舒适 */
.markdown-body p {
  max-width: 72ch !important;
}

/* ===== §B 对话标签 ===== */
/* pre_prompt 规定角色话语用 <p style="color:#2957a2ff">"..."</p> */
.markdown-body p[style*="color: #2957a2ff"] {
  color: hsl(345,28%,30%) !important;
  padding-left: 8px !important;
  border-left: 2px solid hsl(345,35%,42%) !important;
  margin: 8px 0 8px 4px !important;
  font-style: italic !important;
}

/* ===== §C 社交APP界面（模式B 触发） ===== */
/* --- C1 主容器 --- */
.markdown-body .social-container {
  width: 100% !important;
  max-width: 420px !important;
  margin: 12px auto !important;
  background: hsl(35,15%,100%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  font-family: 'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif !important;
  font-size: 14px !important;
  box-shadow: 0 2px 8px hsla(35,10%,10%,0.08) !important;
}

/* --- C2 顶部导航 --- */
.markdown-body .social-topbar {
  background: hsl(35,15%,96%) !important;
  padding: 10px 14px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-bottom: 1px solid hsl(35,15%,80%) !important;
}
.markdown-body .social-back {
  color: hsl(345,35%,42%) !important;
  font-size: 18px !important;
}
.markdown-body .social-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: hsl(35,8%,7%) !important;
}
.markdown-body .social-menu {
  color: hsl(35,5%,56%) !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
}

/* --- C3 用户信息条 --- */
.markdown-body .social-profile {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 14px !important;
  border-bottom: 1px solid hsl(35,15%,88%) !important;
}
.markdown-body .social-avatar {
  width: 44px !important;
  height: 44px !important;
  background: hsl(345,12%,90%) !important;
  border-radius: 50% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  font-size: 20px !important;
  flex-shrink: 0 !important;
  color: hsl(345,35%,42%) !important;
}
.markdown-body .social-name {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: hsl(35,8%,7%) !important;
}
.markdown-body .social-meta {
  font-size: 12px !important;
  color: hsl(35,5%,56%) !important;
  margin-top: 2px !important;
}
.markdown-body .social-follow-btn {
  margin-left: auto !important;
  background: transparent !important;
  border: 1px solid hsl(345,35%,42%) !important;
  color: hsl(345,35%,42%) !important;
  padding: 4px 14px !important;
  border-radius: 14px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

/* --- C4 动态正文 --- */
.markdown-body .social-post {
  padding: 18px 14px !important;
  border-bottom: 1px solid hsl(35,15%,88%) !important;
}
.markdown-body .social-post-time {
  font-size: 12px !important;
  color: hsl(35,5%,56%) !important;
  margin-bottom: 12px !important;
}
.markdown-body .social-post-text {
  font-size: 15px !important;
  line-height: 1.9 !important;
  color: hsl(35,8%,7%) !important;
  white-space: pre-line !important;
}

/* --- C5 照片区 --- */
.markdown-body .social-post-image {
  margin-top: 14px !important;
  background: hsl(35,15%,96%) !important;
  border: 1px solid hsl(35,15%,88%) !important;
  border-radius: 6px !important;
  padding: 8px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}
.markdown-body .social-photo {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 4px !important;
  display: block !important;
  margin: 0 auto !important;
}
.markdown-body .social-image-label {
  position: absolute !important;
  top: 8px !important;
  right: 12px !important;
  font-size: 11px !important;
  color: hsl(35,5%,56%) !important;
  background: hsl(35,15%,100%) !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
}

/* --- C6 互动数据 --- */
.markdown-body .social-stats {
  display: flex !important;
  gap: 20px !important;
  margin-top: 14px !important;
  padding-top: 10px !important;
  border-top: 1px solid hsl(35,15%,88%) !important;
  font-size: 13px !important;
  color: hsl(35,5%,56%) !important;
}

/* --- C7 评论区 --- */
.markdown-body .social-comments {
  padding: 12px 14px !important;
  background: hsl(35,15%,98%) !important;
}
.markdown-body .social-comment {
  font-size: 13px !important;
  color: hsl(35,6%,35%) !important;
  padding: 6px 0 !important;
  border-bottom: 1px solid hsl(35,15%,93%) !important;
}
.markdown-body .social-comment:last-child {
  border-bottom: none !important;
}
.markdown-body .comment-user {
  color: hsl(345,28%,30%) !important;
  font-weight: 500 !important;
}

/* --- C8 浏览导航 --- */
.markdown-body .social-actions {
  display: flex !important;
  justify-content: space-between !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  color: hsl(35,5%,56%) !important;
  border-top: 1px solid hsl(35,15%,88%) !important;
  background: hsl(35,15%,98%) !important;
}

/* ===== §D 场景/角色面板 ===== */
/* 通过 summary 中的 🎬 图标定位——该面板为第一个 details */
/* 面板内的 markdown 代码块淡化处理 */
.markdown-body details:has(summary) .markdown-body pre {
  border-left: none !important;
  padding: 4px 0 !important;
  background: transparent !important;
}
.markdown-body details .markdown-body pre code {
  font-size: 13px !important;
  color: hsl(35,6%,35%) !important;
  line-height: 1.8 !important;
}

/* ===== §E 记忆/情报面板 ===== */
/* 表格在 §6 已全局覆盖，面板内微调 */
.markdown-body details .markdown-body table {
  font-size: 13px !important;
}

/* ===== §F 剧情分支面板 ===== */
/* 选项使用 <p t="选项"><d> 格式 */
.markdown-body p[t="选项"] {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--s-sm) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.markdown-body d {
  display: block !important;
  padding: 10px 14px !important;
  background: hsl(35,15%,96%) !important;
  border: 1px solid hsl(35,15%,80%) !important;
  border-radius: 6px !important;
  font-size: var(--t-sm) !important;
  color: hsl(35,8%,7%) !important;
  line-height: 1.7 !important;
  cursor: pointer !important;
  transition: background 0.15s, border-color 0.15s !important;
}
.markdown-body d:hover {
  background: hsl(345,12%,90%) !important;
  border-color: hsl(345,35%,42%) !important;
}

/* ===== §G 新标签：ai / hd / article ===== */
.markdown-body ai {
  display: block !important;
}
.markdown-body hd {
  display: block !important;
  padding: 6px 0 !important;
  font-size: var(--t-xs) !important;
  color: hsl(35,5%,56%) !important;
  letter-spacing: 0.06em !important;
  border-bottom: 1px solid hsl(35,15%,80%) !important;
  margin-bottom: var(--s-md) !important;
}
.markdown-body article {
  display: block !important;
  font-size: var(--t-base) !important;
  line-height: 2 !important;
  color: hsl(35,8%,7%) !important;
  max-width: 72ch !important;
}

/* ===== §Z 组件层响应式 ===== */
@media (max-width: 480px) {
  .markdown-body .social-container {
    max-width: 100% !important;
    border-radius: 8px !important;
  }
  .markdown-body .social-post-text {
    font-size: 14px !important;
  }
  .markdown-body .social-post {
    padding: 14px 12px !important;
  }
}