/*
 * 性爱都市 - 暗色暧昧风格 · 精修版
 * 配色与提示词输出结构保持一致
 * 主色：#ff6b9d（暧昧粉） 强调色：#e91e8c（欲望红） 背景：#1a0a1a（暗夜深紫）
 */

/* ============================================
   0. 字体：霞鹜文楷（CDN加载）+ 降级栈
   ============================================ */
@import url('https://cdn.jsdelivr.net/npm/lxgw-wenkai-webfont@1.7.0/style.css');

/* ─────────────────────────────────────────────
   1. 基础防污染：不再改 main/section/group
───────────────────────────────────────────── */
.separator,
hr {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================
   2. 全局暗色背景与字体
   ========================================= */
body, #__next, .bg-gray-50, .bg-white {
  background-color: #1a0a1a !important;
  font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
  color: #fce4ec !important;
}

/* =========================================
   3. 顶部控制栏 (暗色毛玻璃)
   ========================================= */
.sticky.w-full.top-0.flex.items-center {
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 107, 157, 0.04), transparent 50%),
        linear-gradient(180deg, rgba(240, 230, 240, 0.96), rgba(235, 220, 235, 0.72)) !important;
    backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(255, 107, 157, 0.15) !important;
    box-shadow: 0 4px 18px rgba(80, 30, 50, 0.07) !important;
}
.sticky.w-full.top-0 svg,
#header-setting-button svg,
#ai-model-selector svg {
    color: #2a0a1a !important;
}
.sticky.w-full.top-0 button:hover svg,
#header-setting-button:hover svg,
#ai-model-selector .group.flex.items-center:hover svg {
    color: rgba(255, 107, 157, 0.8) !important;
}
#ai-model-selector .group.flex.items-center {
    border: 1px solid rgba(255, 107, 157, 0.28) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.72) !important;
    box-shadow: 0 2px 9px rgba(80, 30, 50, 0.07) !important;
}
#ai-model-selector .group.flex.items-center:hover {
    background: rgba(240, 230, 240, 0.6) !important;
    border-color: rgba(255, 107, 157, 0.48) !important;
}
#ai-model-selector .truncate.text-\[13px\] {
    color: rgba(200, 60, 100, 0.9) !important;
    font-weight: 700 !important;
}

/* =========================================
   4. 消息气泡区 (白底)
   ========================================= */
.chat-answer-container .bg-gray-100\/90 {
  background: #ffffff !important;
}
.group.flex.mb-2 .bg-gray-100\/90 {
  background: #ffffff !important;
}

/* =========================================
   5. 底部输入栏大框：暗紫暧昧风格
   ========================================= */
div[data-slot="input-group"][role="group"],
#ai-chat-bottom-input {
    background:
        radial-gradient(ellipse at 50% 0%, rgba(255, 107, 157, 0.05), transparent 55%),
        linear-gradient(180deg,
            rgba(26, 10, 26, 0.97) 0%,
            rgba(30, 15, 30, 0.98) 50%,
            rgba(20, 8, 20, 0.99) 100%) !important;
    border: 1px solid rgba(255, 107, 157, 0.28) !important;
    border-bottom: 1px solid rgba(233, 30, 140, 0.32) !important;
    border-radius: 14px !important;
    box-shadow:
        0 -3px 20px rgba(20, 10, 20, 0.2),
        0 -1px 4px rgba(255, 107, 157, 0.08),
        0 0 30px rgba(255, 107, 157, 0.04) inset,
        0 0 1px rgba(255, 107, 157, 0.08) inset !important;
    padding: 10px 12px 8px 12px !important;
}
div[data-slot="input-group"][role="group"]:focus-within,
#ai-chat-bottom-input:focus-within {
    border-color: rgba(255, 107, 157, 0.48) !important;
    border-bottom-color: rgba(233, 30, 140, 0.42) !important;
    box-shadow:
        0 -4px 24px rgba(255, 107, 157, 0.15),
        0 -1px 6px rgba(255, 107, 157, 0.1),
        0 0 40px rgba(255, 107, 157, 0.06) inset,
        0 0 1px rgba(255, 107, 157, 0.15) inset !important;
}
div[data-slot="input-group"][role="group"] textarea,
div[data-slot="input-group"][role="group"] #ai-chat-input,
#ai-chat-input {
    background: transparent !important;
    color: #d6ccea !important;
    caret-color: rgba(255, 107, 157, 0.85) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
    line-height: 1.65 !important;
    letter-spacing: 0.2px !important;
    transition: all 0.25s ease !important;
}
#prompt-input-body {
    padding: 6px 10px !important;
    background: rgba(40, 18, 35, 0.6) !important;
    border: 1px solid rgba(255, 107, 157, 0.22) !important;
    border-radius: 11px !important;
    transition: all 0.28s ease !important;
}
#prompt-input-body:focus-within {
    background: rgba(50, 22, 42, 0.72) !important;
    border-color: rgba(255, 107, 157, 0.4) !important;
    box-shadow:
        0 0 0 3px rgba(255, 107, 157, 0.1),
        0 2px 14px rgba(255, 107, 157, 0.1) inset !important;
}
#prompt-input-body textarea {
    min-height: 36px !important;
    max-height: 180px !important;
    resize: none !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
    line-height: 1.65 !important;
    letter-spacing: 0.2px !important;
    color: #d6ccea !important;
}
#prompt-input-body textarea::placeholder {
    color: rgba(180, 120, 150, 0.45) !important;
}

/* ─────────────────────────────────────────────
   5b. 顶部按钮行：暗紫暧昧风格
───────────────────────────────────────────── */
#prompt-input-header {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 2px 6px 2px !important;
    border-bottom: 1px solid rgba(255, 107, 157, 0.12) !important;
    margin-bottom: 4px !important;
}
#prompt-input-header button,
#prompt-input-header .MuiIconButton-root,
#prompt-input-header [class*="MuiButton"] {
    border-radius: 8px !important;
    border: 1px solid rgba(255, 107, 157, 0.18) !important;
    background:
        linear-gradient(180deg, rgba(40, 18, 35, 0.75), rgba(30, 12, 25, 0.7)) !important;
    color: rgba(255, 150, 180, 0.7) !important;
    min-width: 32px !important;
    height: 30px !important;
    padding: 3px 8px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
    box-shadow:
        0 1px 4px rgba(20, 10, 15, 0.15),
        0 0 0 1px rgba(255,255,255,0.04) inset !important;
    transition: all 0.2s ease !important;
}
#prompt-input-header button:hover,
#prompt-input-header .MuiIconButton-root:hover,
#prompt-input-header [class*="MuiButton"]:hover {
    background:
        linear-gradient(180deg, rgba(55, 25, 45, 0.82), rgba(40, 18, 32, 0.78)) !important;
    color: rgba(255, 180, 210, 0.9) !important;
    border-color: rgba(255, 107, 157, 0.36) !important;
    box-shadow:
        0 2px 10px rgba(255, 107, 157, 0.15),
        0 0 0 1px rgba(255, 107, 157, 0.12) inset !important;
    transform: translateY(-1px) !important;
}
#prompt-input-header svg {
    color: inherit !important;
    transition: all 0.2s ease !important;
}
#prompt-input-header button:hover svg,
#prompt-input-header .MuiIconButton-root:hover svg {
    transform: scale(1.08) !important;
}

/* ─────────────────────────────────────────────
   5c. 底部按钮行：暗紫暧昧风格
───────────────────────────────────────────── */
#prompt-input-footer {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px 2px 2px 2px !important;
    border-top: 1px solid rgba(255, 107, 157, 0.12) !important;
    margin-top: 4px !important;
    flex-wrap: wrap !important;
}
#prompt-input-footer button,
#prompt-input-footer .MuiButton-root,
#prompt-input-footer .MuiIconButton-root,
#prompt-input-footer [class*="MuiButton"] {
    border-radius: 8px !important;
    border: 1px solid rgba(255, 107, 157, 0.18) !important;
    background:
        linear-gradient(180deg, rgba(40, 18, 35, 0.7), rgba(30, 12, 25, 0.66)) !important;
    color: rgba(255, 150, 180, 0.7) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    padding: 4px 9px !important;
    height: 28px !important;
    font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
    box-shadow:
        0 1px 5px rgba(20, 10, 15, 0.12),
        0 0 0 1px rgba(255,255,255,0.03) inset !important;
    transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
#prompt-input-footer button:hover,
#prompt-input-footer .MuiButton-root:hover,
#prompt-input-footer .MuiIconButton-root:hover,
#prompt-input-footer [class*="MuiButton"]:hover {
    background:
        linear-gradient(180deg, rgba(55, 25, 45, 0.78), rgba(40, 18, 32, 0.74)) !important;
    color: rgba(255, 200, 225, 0.92) !important;
    border-color: rgba(255, 107, 157, 0.38) !important;
    box-shadow:
        0 2px 12px rgba(255, 107, 157, 0.16),
        0 0 0 1px rgba(255, 107, 157, 0.12) inset !important;
    transform: translateY(-1px) !important;
}

/* =========================================
   6. 评论区美化 (暗色暧昧风格)
   ========================================= */
.absolute.inset-x-0.bottom-0.z-20.bg-white {
  background: linear-gradient(135deg, rgba(45,21,53,0.98) 0%, rgba(26,10,26,0.98) 100%) !important;
  border-top-left-radius: 32px !important;
  border-top-right-radius: 32px !important;
  box-shadow: 0 -10px 40px rgba(233, 30, 140, 0.3), 0 -2px 10px rgba(255, 107, 157, 0.1) !important;
  border-top: 1px solid rgba(255, 107, 157, 0.15) !important;
}
.flex.flex-col.border-\[1\.5px\].border-gray-200 {
  border-radius: 20px !important;
  border-color: rgba(255, 107, 157, 0.15) !important;
  background-color: rgba(26, 10, 26, 0.6) !important;
  transition: border-color 0.3s ease !important;
}
.flex.flex-col.border-\[1\.5px\].border-gray-200:focus-within {
  border-color: #ff6b9d !important;
  background-color: rgba(26, 10, 26, 0.8) !important;
}
textarea[placeholder="发表评论"] {
  border-radius: 16px !important;
  color: #fce4ec !important;
}
.p-3.overflow-y-auto.h-full > div {
  background: linear-gradient(135deg, rgba(45,21,53,0.6) 0%, rgba(26,10,26,0.6) 100%) !important;
  border-radius: 16px !important;
  padding: 12px !important;
  margin-bottom: 12px !important;
  box-shadow: 0 2px 8px rgba(233, 30, 140, 0.2) !important;
  border: 1px solid rgba(255, 107, 157, 0.1) !important;
}
.MuiRating-iconFilled {
  color: #ff6b9d !important;
  filter: drop-shadow(0 2px 6px rgba(255, 107, 157, 0.5)) !important;
}

/* =========================================
   7. 滚动条美化 (暗色暧昧)
   ========================================= */
::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}
::-webkit-scrollbar-track {
  background: rgba(26, 10, 26, 0.5) !important;
}
::-webkit-scrollbar-thumb {
  background: rgba(255, 107, 157, 0.3) !important;
  border-radius: 10px !important;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 107, 157, 0.5) !important;
}

/* =========================================
   8. 状态面板文字高亮 (匹配提示词输出)
   ========================================= */
.markdown-body h3,
.markdown-body h4 {
  color: #ff6b9d !important;
  border-color: rgba(255, 107, 157, 0.2) !important;
  text-shadow: 0 0 10px rgba(255, 107, 157, 0.3) !important;
}
.markdown-body strong {
  color: #e91e8c !important;
  text-shadow: 0 0 5px rgba(233, 30, 140, 0.3) !important;
}
.markdown-body code {
  background-color: rgba(255, 107, 157, 0.1) !important;
  color: #ff6b9d !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
}
.markdown-body blockquote {
  border-left-color: #e91e8c !important;
  background: linear-gradient(135deg, rgba(233,30,140,0.08) 0%, rgba(255,107,157,0.05) 100%) !important;
}
.markdown-body hr {
  border: none !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, rgba(255, 107, 157, 0.4), rgba(233, 30, 140, 0.4), transparent) !important;
  margin: 24px 0 !important;
}

/* =========================================
   9. 折叠面板 details/summary (暧昧暗色)
   ========================================= */
.markdown-body details {
  background: linear-gradient(135deg, rgba(45,21,53,0.8) 0%, rgba(26,10,26,0.8) 100%) !important;
  border: 1px solid rgba(255, 107, 157, 0.15) !important;
  border-radius: 12px !important;
  margin: 8px 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.markdown-body details:hover {
  border-color: rgba(255, 107, 157, 0.3) !important;
  box-shadow: 0 2px 16px rgba(233, 30, 140, 0.15) !important;
}
.markdown-body details[open] {
  border-color: rgba(255, 107, 157, 0.25) !important;
  box-shadow: 0 4px 20px rgba(233, 30, 140, 0.2) !important;
}
.markdown-body details summary {
  padding: 10px 16px !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: #ff6b9d !important;
  background: linear-gradient(135deg, rgba(255,107,157,0.08) 0%, rgba(233,30,140,0.06) 100%) !important;
  border-bottom: 1px solid transparent !important;
  list-style: none !important;
  user-select: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
}
.markdown-body details summary::-webkit-details-marker {
  display: none !important;
}
.markdown-body details summary::before {
  content: '▸' !important;
  display: inline-block !important;
  font-size: 12px !important;
  color: #e91e8c !important;
  transition: transform 0.25s ease !important;
  flex-shrink: 0 !important;
}
.markdown-body details[open] > summary::before {
  transform: rotate(90deg) !important;
}
.markdown-body details summary:hover {
  background: linear-gradient(135deg, rgba(255,107,157,0.12) 0%, rgba(233,30,140,0.1) 100%) !important;
  color: #ff8ab4 !important;
}
.markdown-body details[open] > summary {
  border-bottom-color: rgba(255, 107, 157, 0.15) !important;
}
.markdown-body details > :not(summary) {
  padding: 12px 16px !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  color: #ce93d8 !important;
}
.markdown-body details > p,
.markdown-body details > div,
.markdown-body details > ul,
.markdown-body details > ol,
.markdown-body details > pre,
.markdown-body details > table {
  margin: 4px 0 !important;
}
.markdown-body details + details {
  margin-top: -1px !important;
}

/* =========================================
   10. 对话文字按角色区分颜色
   ========================================= */
.markdown-body .dialogue {
  font-weight: 600 !important;
  position: relative !important;
  padding: 1px 4px !important;
  border-radius: 4px !important;
  display: inline !important;
}
.markdown-body .dialogue::before {
  content: '「' !important;
}
.markdown-body .dialogue::after {
  content: '」' !important;
}
.markdown-body .d-player {
  color: #2196f3 !important;
  text-shadow: 0 0 8px rgba(33, 150, 243, 0.4) !important;
  background: rgba(33, 150, 243, 0.1) !important;
}
.markdown-body .d-player::before,
.markdown-body .d-player::after {
  color: #2196f3 !important;
}
.markdown-body .d-female,
.markdown-body .d-female-npc {
  color: #9c27b0 !important;
  text-shadow: 0 0 8px rgba(156, 39, 176, 0.4) !important;
  background: rgba(156, 39, 176, 0.1) !important;
}
.markdown-body .d-female::before,
.markdown-body .d-female::after,
.markdown-body .d-female-npc::before,
.markdown-body .d-female-npc::after {
  color: #9c27b0 !important;
}
.markdown-body .d-male,
.markdown-body .d-male-npc,
.markdown-body .d-npc {
  color: #4caf50 !important;
  text-shadow: 0 0 8px rgba(76, 175, 80, 0.4) !important;
  background: rgba(76, 175, 80, 0.1) !important;
}
.markdown-body .d-male::before,
.markdown-body .d-male::after,
.markdown-body .d-male-npc::before,
.markdown-body .d-male-npc::after,
.markdown-body .d-npc::before,
.markdown-body .d-npc::after {
  color: #4caf50 !important;
}
.markdown-body .d-erotic,
.markdown-body .d-mnx {
  color: #ff6b9d !important;
  text-shadow: 0 0 8px rgba(255, 107, 157, 0.4) !important;
  background: rgba(255, 107, 157, 0.1) !important;
}
.markdown-body .d-erotic::before,
.markdown-body .d-erotic::after,
.markdown-body .d-mnx::before,
.markdown-body .d-mnx::after {
  color: #ff6b9d !important;
}
.markdown-body .d-thought {
  color: #b0b0b0 !important;
  font-style: italic !important;
  text-shadow: 0 0 6px rgba(176, 176, 176, 0.3) !important;
  background: rgba(176, 176, 176, 0.08) !important;
}
.markdown-body .d-thought::before,
.markdown-body .d-thought::after {
  color: #909090 !important;
}

/* =========================================
   11. 重点强调样式
   ========================================= */
.markdown-body .highlight {
  color: #ff6b9d !important;
  font-weight: bold !important;
  text-shadow: 0 0 10px rgba(255, 107, 157, 0.5) !important;
}
.markdown-body .warning {
  color: #e91e8c !important;
  font-weight: bold !important;
  text-shadow: 0 0 10px rgba(233, 30, 140, 0.5) !important;
  background: rgba(233, 30, 140, 0.1) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
}

/* =========================================
   12. 特殊标签样式
   ========================================= */
.markdown-body .tag-pink {
  background: linear-gradient(135deg, rgba(255,107,157,0.3) 0%, rgba(233,30,140,0.3) 100%) !important;
  color: #ff6b9d !important;
  border: 1px solid rgba(255, 107, 157, 0.5) !important;
  box-shadow: 0 0 10px rgba(255, 107, 157, 0.2) !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: bold !important;
}
.markdown-body .tag-gold {
  background: linear-gradient(135deg, rgba(255,171,64,0.3) 0%, rgba(255,152,0,0.3) 100%) !important;
  color: #ffab40 !important;
  border: 1px solid rgba(255, 171, 64, 0.5) !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: bold !important;
}
.markdown-body .tag-green {
  background: linear-gradient(135deg, rgba(105,240,174,0.3) 0%, rgba(0,230,118,0.3) 100%) !important;
  color: #69f0ae !important;
  border: 1px solid rgba(105, 240, 174, 0.5) !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: bold !important;
}
.markdown-body .tag-blue {
  background: linear-gradient(135deg, rgba(213,0,249,0.3) 0%, rgba(156,39,176,0.3) 100%) !important;
  color: #d500f9 !important;
  border: 1px solid rgba(213, 0, 249, 0.5) !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: bold !important;
}

/* =========================================
   13. 引用框样式
   ========================================= */
.markdown-body .quote {
  background: linear-gradient(135deg, rgba(255,23,68,0.15) 0%, rgba(233,30,140,0.1) 100%) !important;
  border-left: 3px solid #ff1744 !important;
  padding: 8px 16px !important;
  margin: 16px 0 !important;
  border-radius: 0 8px 8px 0 !important;
  color: #ff8a80 !important;
  font-style: italic !important;
}

/* =========================================
   14. 信息网格样式
   ========================================= */
.markdown-body .info-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 8px !important;
  margin: 8px 0 !important;
}
.markdown-body .info-item {
  background: rgba(26, 10, 26, 0.6) !important;
  padding: 8px 12px !important;
  border-radius: 4px !important;
  border-left: 3px solid #e91e8c !important;
  box-shadow: 0 0 10px rgba(233, 30, 140, 0.1) !important;
}
.markdown-body .info-item .label {
  color: #ce93d8 !important;
  font-size: 12px !important;
}
.markdown-body .info-item .value {
  color: #fce4ec !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* =========================================
   15. 状态面板内列表逐行分隔
   ========================================= */
.markdown-body details ul,
.markdown-body details ol {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.markdown-body details li {
  padding: 6px 10px !important;
  margin: 2px 0 !important;
  border-radius: 6px !important;
  background: rgba(255, 107, 157, 0.05) !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.08) !important;
  line-height: 1.7 !important;
  font-size: 13px !important;
  color: #ce93d8 !important;
  transition: background 0.2s ease !important;
}
.markdown-body details li:hover {
  background: rgba(255, 107, 157, 0.1) !important;
}
.markdown-body details li:last-child {
  border-bottom: none !important;
}
.markdown-body details li strong {
  color: #ff6b9d !important;
  font-weight: 600 !important;
  text-shadow: 0 0 5px rgba(255, 107, 157, 0.3) !important;
}
.markdown-body details p {
  margin: 4px 0 !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
  background: rgba(255, 107, 157, 0.05) !important;
  line-height: 1.7 !important;
  font-size: 13px !important;
  color: #ce93d8 !important;
}
.markdown-body details > :not(summary) br {
  display: block !important;
  content: "" !important;
  margin-top: 4px !important;
}
.markdown-body details > :not(summary) {
  white-space: pre-line !important;
  word-break: break-all !important;
}

/* =========================================
   16. 发光动画效果
   ========================================= */
@keyframes pulse-glow {
  0%, 100% {
    filter: drop-shadow(0 0 20px rgba(255, 107, 157, 0.6));
  }
  50% {
    filter: drop-shadow(0 0 40px rgba(233, 30, 140, 0.8));
  }
}
.markdown-body h1,
.markdown-body h2 {
  animation: pulse-glow 3s ease-in-out infinite !important;
}

/* =========================================
   17. 表格样式
   ========================================= */
.markdown-body table {
  border-collapse: collapse !important;
  width: 100% !important;
  margin: 12px 0 !important;
  background: rgba(26, 10, 26, 0.6) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 107, 157, 0.15) !important;
}
.markdown-body table th {
  background: linear-gradient(135deg, rgba(255,107,157,0.2) 0%, rgba(233,30,140,0.15) 100%) !important;
  color: #ff6b9d !important;
  font-weight: 600 !important;
  padding: 10px 12px !important;
  text-align: left !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.2) !important;
}
.markdown-body table td {
  padding: 8px 12px !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.08) !important;
  color: #fce4ec !important;
}
.markdown-body table tr:last-child td {
  border-bottom: none !important;
}
.markdown-body table tr:hover td {
  background: rgba(255, 107, 157, 0.05) !important;
}

/* =========================================
   18. 警告框样式
   ========================================= */
.markdown-body .warning-box {
  background: rgba(255, 107, 157, 0.15) !important;
  border: 1px solid rgba(255, 107, 157, 0.4) !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  margin: 12px 0 !important;
}
.markdown-body .warning-box h4 {
  color: #ff6b9d !important;
  margin-bottom: 8px !important;
}
.markdown-body .warning-box p {
  color: #fce4ec !important;
  margin: 0 !important;
}

/* =========================================
   19. 正文框 story-main
   ========================================= */
article.story-main {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 10px 0 12px 0 !important;
  padding: 16px 15px !important;
  text-align: left !important;
  background:
    radial-gradient(circle at 20% 30%, rgba(255, 107, 157, 0.08), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(255, 107, 157, 0.08), transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.04), transparent 60%),
    linear-gradient(180deg, rgba(26, 10, 26, 0.96), rgba(30, 15, 30, 0.98)) !important;
  border: 1px solid rgba(255, 107, 157, 0.35) !important;
  border-left: 4px solid rgba(233, 30, 140, 0.6) !important;
  border-right: 4px solid rgba(233, 30, 140, 0.6) !important;
  border-radius: 10px !important;
  color: #fce4ec !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
  line-height: 1.9 !important;
  letter-spacing: 0.4px !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.06) inset,
    0 8px 22px rgba(40, 20, 30, 0.15) !important;
}
article.story-main p {
  margin: 0 0 0.9em 0 !important;
  color: #fce4ec !important;
}
article.story-main b,
article.story-main strong {
  color: #ff8ab4 !important;
  font-weight: 800 !important;
  text-shadow: 0 0 7px rgba(255, 107, 157, 0.35) !important;
}
article.story-main::after {
  content: "✦";
  display: block;
  text-align: right;
  color: rgba(255, 107, 157, 0.7);
  opacity: 0.72;
  font-size: 15px;
  margin-top: 6px;
}

/* =========================================
   20. 状态栏 sys-panel
   ========================================= */
details.sys-panel {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 9px 0 !important;
  padding: 0 !important;
  text-align: left !important;
  border: 1px solid rgba(255, 107, 157, 0.45) !important;
  border-radius: 11px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  background:
    radial-gradient(circle at 30% 40%, rgba(255, 107, 157, 0.06), transparent 35%),
    radial-gradient(circle at 70% 60%, rgba(255, 107, 157, 0.06), transparent 35%),
    linear-gradient(180deg, rgba(26, 10, 26, 0.96), rgba(20, 8, 18, 0.98)) !important;
  color: #d6ccea !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.06) inset,
    0 5px 16px rgba(40, 20, 30, 0.15) !important;
}
details.sys-panel[open] {
  border-color: rgba(255, 107, 157, 0.75) !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.1) inset,
    0 0 15px rgba(255, 107, 157, 0.18),
    0 8px 22px rgba(40, 20, 30, 0.18) !important;
}
details.sys-panel > summary {
  display: block !important;
  box-sizing: border-box !important;
  padding: 8px 14px !important;
  text-align: center !important;
  list-style: none !important;
  cursor: pointer !important;
  color: #fce4ec !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
  letter-spacing: 1.5px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 107, 157, 0.08), transparent 50%),
    linear-gradient(90deg, rgba(26, 10, 26, 0.96), rgba(35, 18, 30, 0.92), rgba(26, 10, 26, 0.96)) !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.3) !important;
}
details.sys-panel > summary::-webkit-details-marker {
  display: none !important;
}
details.sys-panel > summary::before {
  content: "◆";
  color: rgba(255, 107, 157, 0.7);
  margin-right: 8px;
  text-shadow: 0 0 6px rgba(255, 107, 157, 0.45);
}
details.sys-panel > summary::after {
  content: "◆";
  color: rgba(255, 107, 157, 0.7);
  margin-left: 8px;
  text-shadow: 0 0 6px rgba(255, 107, 157, 0.45);
}
details.sys-panel > summary b {
  color: #fce4ec !important;
  font-weight: 900 !important;
  text-shadow: 0 0 7px rgba(255, 107, 157, 0.38) !important;
}
details.sys-panel p,
details.sys-panel li,
details.sys-panel ul,
details.sys-panel ol {
  color: #d6ccea !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  font-weight: 500 !important;
  font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
}
details.sys-panel p {
  margin: 6px 13px !important;
}
details.sys-panel ul,
details.sys-panel ol {
  margin: 7px 14px 9px 28px !important;
  padding: 0 !important;
}
details.sys-panel li {
  margin: 3px 0 !important;
}
details.sys-panel h1,
details.sys-panel h2,
details.sys-panel h3,
details.sys-panel h4 {
  color: #ff8ab4 !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  margin: 13px 12px 7px 12px !important;
  padding: 5px 8px 5px 10px !important;
  line-height: 1.35 !important;
  border-left: 4px solid rgba(255, 107, 157, 0.6) !important;
  background: linear-gradient(90deg, rgba(255, 107, 157, 0.14), rgba(255, 107, 157, 0.02)) !important;
  border-radius: 6px !important;
}
details.sys-panel h3 {
  font-size: 14px !important;
}
details.sys-panel b,
details.sys-panel strong {
  color: #ff8ab4 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 5px rgba(255, 107, 157, 0.28) !important;
}
details.sys-panel {
  color: #d6ccea !important;
}

/* =========================================
   21. 代码块（sys-panel内）
   ========================================= */
details.sys-panel pre,
details.sys-panel code {
  box-sizing: border-box !important;
  background: rgba(26, 10, 26, 0.88) !important;
  color: #ff8ab4 !important;
  border: 1px solid rgba(255, 107, 157, 0.38) !important;
  border-radius: 7px !important;
  font-size: 14px !important;
  font-family: 'LXGW WenKai', 'Microsoft YaHei', 'PingFang SC', system-ui, sans-serif !important;
  line-height: 1.55 !important;
}

/* =========================================
   22. 表格（sys-panel/star-memory内）
   ========================================= */
details.sys-panel table,
details.star-memory table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 8px 0 !important;
  background: rgba(26, 10, 26, 0.75) !important;
  border-radius: 7px !important;
  overflow-x: auto !important;
  display: block !important;
}
details.sys-panel th,
details.star-memory th {
  padding: 7px 9px !important;
  color: rgba(255, 200, 220, 0.92) !important;
  background: rgba(50, 20, 40, 0.82) !important;
  border: 1px solid rgba(255, 107, 157, 0.3) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
details.sys-panel td,
details.star-memory td {
  padding: 6px 9px !important;
  color: #fce4ec !important;
  background: rgba(26, 10, 26, 0.65) !important;
  border: 1px solid rgba(255, 107, 157, 0.22) !important;
  font-size: 12.5px !important;
}
details.sys-panel tr:hover td,
details.star-memory tr:hover td {
  background: rgba(60, 20, 40, 0.72) !important;
}

/* =========================================
   23. 星记忆回廊：嵌套面板
   ========================================= */
details.star-memory {
  margin: 7px 12px 10px 12px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 107, 157, 0.45) !important;
  border-radius: 8px !important;
  background: rgba(26, 10, 26, 0.9) !important;
  overflow-x: auto !important;
}
details.star-memory > summary {
  padding: 7px 12px !important;
  background: rgba(30, 15, 25, 0.92) !important;
  color: #fce4ec !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.3) !important;
  text-align: center !important;
}

/* =========================================
   24. 思维链 think-panel
   ========================================= */
details.think-panel {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 8px 0 10px 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255, 107, 157, 0.5) !important;
  background:
    radial-gradient(circle at top left, rgba(255, 107, 157, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(35, 18, 30, 0.97), rgba(26, 10, 26, 0.98)) !important;
  color: #fce4ec !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06) inset,
    0 8px 22px rgba(40, 20, 30, 0.18) !important;
}
details.think-panel[open] {
  border-color: rgba(255, 107, 157, 0.75) !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.12) inset,
    0 0 18px rgba(255, 107, 157, 0.22),
    0 10px 26px rgba(40, 20, 30, 0.2) !important;
}
details.think-panel > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  min-height: 38px !important;
  padding: 9px 13px !important;
  cursor: pointer !important;
  list-style: none !important;
  user-select: none !important;
  background:
    linear-gradient(90deg, rgba(50, 20, 35, 0.98), rgba(233, 30, 140, 0.94), rgba(50, 20, 35, 0.98)) !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.25) !important;
  color: #fce4ec !important;
  font-size: 13.5px !important;
  line-height: 1.35 !important;
  letter-spacing: 0.8px !important;
}
details.think-panel > summary::-webkit-details-marker {
  display: none !important;
}
details.think-panel > summary::before {
  content: "✦";
  flex: 0 0 auto !important;
  color: rgba(255, 107, 157, 0.8) !important;
  font-size: 13px !important;
  text-shadow: 0 0 8px rgba(255, 107, 157, 0.6) !important;
  transform: rotate(0deg) !important;
  transition: transform 0.25s ease, color 0.25s ease !important;
}
details.think-panel[open] > summary::before {
  transform: rotate(90deg) !important;
  color: rgba(255, 107, 157, 0.9) !important;
}
details.think-panel > summary b {
  flex: 1 1 auto !important;
  display: inline-block !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  text-shadow:
    0 0 6px rgba(255, 107, 157, 0.4),
    0 0 12px rgba(233, 30, 140, 0.22) !important;
}
details.think-panel > summary span {
  flex: 0 1 auto !important;
  display: inline-block !important;
  max-width: 52% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: rgba(255, 150, 180, 0.8) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  opacity: 0.92 !important;
}
details.think-panel .think-inner {
  box-sizing: border-box !important;
  padding: 10px 13px 12px 13px !important;
  background:
    linear-gradient(180deg, rgba(30, 15, 25, 0.72), rgba(26, 10, 26, 0.76)) !important;
}
details.think-panel p,
details.think-panel li,
details.think-panel ul,
details.think-panel ol {
  color: #d6ccea !important;
  font-size: 13px !important;
  line-height: 1.72 !important;
}
details.think-panel p {
  margin: 6px 0 !important;
}
details.think-panel ul,
details.think-panel ol {
  margin: 7px 0 8px 21px !important;
  padding: 0 !important;
}
details.think-panel li {
  margin: 4px 0 !important;
  padding-left: 2px !important;
}
details.think-panel li::marker {
  color: rgba(255, 107, 157, 0.8) !important;
  font-weight: 800 !important;
}
details.think-panel strong,
details.think-panel b {
  color: #ff8ab4 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 5px rgba(255, 107, 157, 0.3) !important;
}
details.think-panel code {
  display: inline-block !important;
  padding: 1px 5px !important;
  margin: 0 2px !important;
  border-radius: 5px !important;
  background: rgba(233, 30, 140, 0.35) !important;
  color: #fce4ec !important;
  border: 1px solid rgba(255, 107, 157, 0.2) !important;
  font-size: 12px !important;
}
details.think-panel h1,
details.think-panel h2,
details.think-panel h3,
details.think-panel h4 {
  margin: 10px 0 6px 0 !important;
  padding: 5px 8px !important;
  color: #ff8ab4 !important;
  font-size: 13.5px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  border-left: 4px solid rgba(255, 107, 157, 0.8) !important;
  border-radius: 6px !important;
  background:
    linear-gradient(90deg, rgba(255, 107, 157, 0.18), rgba(255, 107, 157, 0.04)) !important;
}
details.think-panel blockquote {
  margin: 8px 0 !important;
  padding: 7px 9px !important;
  border-left: 3px solid rgba(255, 107, 157, 0.6) !important;
  border-radius: 7px !important;
  background: rgba(233, 30, 140, 0.18) !important;
  color: #fce4ec !important;
}
details.think-panel:hover {
  border-color: rgba(255, 107, 157, 0.7) !important;
}

/* =========================================
   25. 思维链 <q> 项目卡片
   ========================================= */
details.think-panel .think-inner q {
  quotes: none !important;
  display: block !important;
  position: relative !important;
  box-sizing: border-box !important;
  margin: 0 0 9px 0 !important;
  padding: 34px 10px 9px 10px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 107, 157, 0.3) !important;
  transform: translateY(0) !important;
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    background 0.22s ease,
    box-shadow 0.22s ease !important;
  background:
    radial-gradient(circle at top right, rgba(255, 107, 157, 0.1), transparent 30%),
    linear-gradient(180deg, rgba(35, 18, 30, 0.82), rgba(26, 10, 22, 0.86)) !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.04) inset,
    0 3px 10px rgba(20, 10, 15, 0.12) !important;
}
details.think-panel .think-inner q::before {
  content: "Step " attr(data-step) " · " attr(data-title) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  min-height: 25px !important;
  box-sizing: border-box !important;
  padding: 5px 9px !important;
  border-radius: 9px 9px 0 0 !important;
  border-bottom: 1px solid rgba(255, 107, 157, 0.2) !important;
  background:
    linear-gradient(90deg, rgba(233, 30, 140, 0.7), rgba(255, 107, 157, 0.5), rgba(233, 30, 140, 0.2)) !important;
  color: #fce4ec !important;
  font-size: 11.5px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.7px !important;
  text-shadow: 0 0 6px rgba(255, 107, 157, 0.4) !important;
}
details.think-panel .think-inner q::after {
  content: none !important;
}
details.think-panel .think-inner q:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(255, 107, 157, 0.6) !important;
  background:
    radial-gradient(circle at top right, rgba(255, 107, 157, 0.15), transparent 36%),
    linear-gradient(180deg, rgba(45, 22, 38, 0.82), rgba(30, 15, 25, 0.86)) !important;
  box-shadow:
    0 0 0 1px rgba(255, 107, 157, 0.08) inset,
    0 0 14px rgba(255, 107, 157, 0.15),
    0 6px 15px rgba(20, 10, 20, 0.18) !important;
}
details.think-panel .think-inner q:last-child {
  margin-bottom: 0 !important;
}
details.think-panel .think-inner q > b:first-child {
  display: block !important;
  width: fit-content !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 7px 0 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 107, 157, 0.25) !important;
  background: rgba(233, 30, 140, 0.22) !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.5px !important;
  text-shadow:
    0 0 6px rgba(255, 107, 157, 0.4),
    0 0 12px rgba(233, 30, 140, 0.2) !important;
}
details.think-panel .think-inner q p {
  margin: 5px 0 !important;
  padding: 0 !important;
  color: #fce4ec !important;
  font-size: 12.9px !important;
  line-height: 1.72 !important;
}
details.think-panel .think-inner q p::before {
  content: "•" !important;
  display: inline-block !important;
  margin-right: 6px !important;
  color: rgba(255, 107, 157, 0.8) !important;
  font-weight: 900 !important;
  text-shadow: 0 0 5px rgba(255, 107, 157, 0.4) !important;
}
details.think-panel .think-inner q code {
  display: inline-block !important;
  padding: 1px 5px !important;
  margin: 0 2px !important;
  border-radius: 5px !important;
  border: 1px solid rgba(255, 107, 157, 0.2) !important;
  background: rgba(233, 30, 140, 0.35) !important;
  color: #fce4ec !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
details.think-panel .think-inner q strong,
details.think-panel .think-inner q b {
  color: #ff8ab4 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 5px rgba(255, 107, 157, 0.3) !important;
}
details.think-panel .think-inner q:nth-of-type(1) {
  border-left: 3px solid rgba(255, 107, 157, 0.8) !important;
}
details.think-panel .think-inner q:nth-of-type(2) {
  border-left: 3px solid rgba(233, 30, 140, 0.7) !important;
}
details.think-panel .think-inner q:nth-of-type(3) {
  border-left: 3px solid rgba(255, 107, 157, 0.6) !important;
}
details.think-panel .think-inner q:nth-of-type(4) {
  border-left: 3px solid rgba(233, 30, 140, 0.5) !important;
}
details.think-panel .think-inner q:nth-of-type(5) {
  border-left: 3px solid rgba(255, 107, 157, 0.7) !important;
}
details.think-panel .think-inner q:nth-of-type(6) {
  border-left: 3px solid rgba(233, 30, 140, 0.6) !important;
}
details.think-panel .think-inner q:nth-of-type(7) {
  border-left: 3px solid rgba(255, 107, 157, 0.5) !important;
}

/* =========================================
   26. 移动端微调
   ========================================= */
@media (max-width: 768px) {
  article.story-main {
    padding: 14px 12px !important;
    font-size: 14.5px !important;
    line-height: 1.85 !important;
  }
  details.sys-panel > summary {
    padding: 7px 10px !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
  }
  details.sys-panel p,
  details.sys-panel li {
    font-size: 13px !important;
    line-height: 1.72 !important;
  }
  details.sys-panel h3 {
    font-size: 13.5px !important;
  }
  details.sys-panel,
  details.star-memory {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  details.sys-panel table,
  details.star-memory table {
    min-width: 600px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  details.think-panel {
    margin: 7px 0 9px 0 !important;
    border-radius: 10px !important;
  }
  details.think-panel > summary {
    padding: 8px 10px !important;
    min-height: 36px !important;
    font-size: 13px !important;
  }
  details.think-panel > summary b {
    font-size: 13.5px !important;
  }
  details.think-panel > summary span {
    max-width: 45% !important;
    font-size: 10.5px !important;
  }
  details.think-panel .think-inner {
    padding: 9px 10px 10px 10px !important;
  }
  details.think-panel p,
  details.think-panel li {
    font-size: 12.5px !important;
    line-height: 1.68 !important;
  }
  details.think-panel .think-inner q {
    margin: 0 0 8px 0 !important;
    padding: 32px 8px 8px 8px !important;
    border-radius: 9px !important;
  }
  details.think-panel .think-inner q::before {
    min-height: 24px !important;
    padding: 5px 8px !important;
    font-size: 10.8px !important;
    letter-spacing: 0.45px !important;
  }
  details.think-panel .think-inner q > b:first-child {
    font-size: 12px !important;
    padding: 2px 7px !important;
  }
  details.think-panel .think-inner q p {
    font-size: 12px !important;
    line-height: 1.65 !important;
  }
}

/* =========================================
   27. 跨平台兼容：宽度扩展
   ========================================= */
.markdown-body {
  max-width: 100% !important;
}
.markdown-body .sys-panel,
.markdown-body .think-panel,
.markdown-body .star-memory,
.markdown-body article.story-main {
  max-width: 100% !important;
  box-sizing: border-box !important;
}