/* ===== 顶部颜色装饰条 - 隐藏 ===== */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e9]"] {
    display: none !important;
}

/* ===== 统一聊天框 - 清新浅色背景 ===== */
.bg-gray-100\/90.relative.inline-block {
    background: linear-gradient(135deg, #e8f5e9 0%, #e0f2f1 35%, #e3f2fd 70%, #f3e5f5 100%) !important;
    border-radius: 18px !important;
    border: 1px solid rgba(129, 199, 132, 0.35) !important;
    box-shadow:
        0 2px 12px rgba(100, 181, 146, 0.12),
        0 1px 4px rgba(0, 0, 0, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
    padding: 18px 20px !important;
    transition: box-shadow 0.3s ease, transform 0.2s ease !important;
    isolation: isolate !important;
    position: relative !important;
    overflow: visible !important;
}

.bg-gray-100\/90.relative.inline-block:hover {
    box-shadow:
        0 4px 20px rgba(100, 181, 146, 0.2),
        0 2px 8px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

/* ===== 输入聊天框 - 微区分 ===== */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
    background: linear-gradient(135deg, #fce4ec 0%, #fff3e0 50%, #fff8e1 100%) !important;
    border: 1px solid rgba(239, 154, 154, 0.35) !important;
    box-shadow:
        0 2px 12px rgba(239, 154, 154, 0.12),
        0 1px 4px rgba(0, 0, 0, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
}

/* ===== 主体文本 - 深色高对比 ===== */
.markdown-body {
    color: #2e3c43 !important;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
    letter-spacing: 0.02em !important;
    z-index: 1 !important;
    background: transparent !important;
    position: relative !important;
}

/* ===== <think> 标签 - 完全隐藏 ===== */
.markdown-body think,
.markdown-body [data-tag="think"] {
    display: none !important;
}

/* ===== <q> 标签 - 对话突出 (加深色+斜体) ===== */
.markdown-body q {
    font-style: italic !important;
    color: #37474f !important;
    background: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(200,230,220,0.3) 100%) !important;
    padding: 3px 10px !important;
    border-radius: 6px !important;
    border-left: 3px solid rgba(77, 150, 120, 0.55) !important;
    display: inline !important;
    font-weight: 500 !important;
    quotes: """ """ "'" "'" !important;
}

.markdown-body q::before,
.markdown-body q::after {
    color: #66bb6a !important;
    font-weight: bold !important;
    font-size: 1.1em !important;
}

/* ===== douluo-header - 节点信息栏 ===== */
.markdown-body .douluo-header {
    background: linear-gradient(135deg, rgba(178, 223, 219, 0.5) 0%, rgba(165, 214, 167, 0.4) 100%) !important;
    border: 1px solid rgba(129, 199, 132, 0.4) !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    margin-bottom: 16px !important;
    box-shadow: 0 1px 6px rgba(100, 181, 146, 0.1) !important;
}

.markdown-body .douluo-header p {
    margin: 6px 0 !important;
    padding: 0 !important;
    line-height: 1.8 !important;
    color: #2e7d56 !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    display: block !important;
    white-space: normal !important;
    word-break: break-word !important;
}

/* ===== <text> 正文区域 ===== */
.markdown-body text {
    display: block !important;
}

.markdown-body text p {
    margin: 12px 0 !important;
    text-indent: 2em !important;
    line-height: 1.95 !important;
    color: #2e3c43 !important;
}

/* ===== <details> 折叠面板 - 差异化设计 ===== */
.markdown-body details {
    border-radius: 12px !important;
    margin: 14px 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    transition: box-shadow 0.25s ease !important;
}

.markdown-body details[open] {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

.markdown-body details summary {
    padding: 12px 18px !important;
    font-weight: 600 !important;
    font-size: 14.5px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    border-radius: 12px !important;
    user-select: none !important;
}

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

.markdown-body details summary::before {
    content: "▸" !important;
    display: inline-block !important;
    transition: transform 0.25s ease !important;
    font-size: 12px !important;
    margin-right: 4px !important;
}

.markdown-body details[open] > summary::before {
    transform: rotate(90deg) !important;
}

/* --- 📋 主角信息面板 (第1个details) --- */
.markdown-body details:nth-of-type(1) {
    background: linear-gradient(180deg, rgba(225, 245, 254, 0.6) 0%, rgba(227, 242, 253, 0.35) 100%) !important;
    border-color: rgba(79, 195, 247, 0.3) !important;
}

.markdown-body details:nth-of-type(1) summary {
    background: linear-gradient(135deg, rgba(79, 195, 247, 0.2) 0%, rgba(129, 212, 250, 0.15) 100%) !important;
    color: #0277bd !important;
}

.markdown-body details:nth-of-type(1) summary:hover {
    background: linear-gradient(135deg, rgba(79, 195, 247, 0.3) 0%, rgba(129, 212, 250, 0.25) 100%) !important;
}

/* --- 👥 队伍与NPC面板 (第2个details) --- */
.markdown-body details:nth-of-type(2) {
    background: linear-gradient(180deg, rgba(232, 245, 233, 0.6) 0%, rgba(200, 230, 201, 0.3) 100%) !important;
    border-color: rgba(102, 187, 106, 0.3) !important;
}

.markdown-body details:nth-of-type(2) summary {
    background: linear-gradient(135deg, rgba(102, 187, 106, 0.2) 0%, rgba(165, 214, 167, 0.15) 100%) !important;
    color: #2e7d32 !important;
}

.markdown-body details:nth-of-type(2) summary:hover {
    background: linear-gradient(135deg, rgba(102, 187, 106, 0.3) 0%, rgba(165, 214, 167, 0.25) 100%) !important;
}

/* --- 工作记忆面板 (第3个details) --- */
.markdown-body details:nth-of-type(3) {
    background: linear-gradient(180deg, rgba(255, 243, 224, 0.6) 0%, rgba(255, 236, 179, 0.3) 100%) !important;
    border-color: rgba(255, 183, 77, 0.3) !important;
}

.markdown-body details:nth-of-type(3) summary {
    background: linear-gradient(135deg, rgba(255, 183, 77, 0.2) 0%, rgba(255, 204, 128, 0.15) 100%) !important;
    color: #e65100 !important;
}

.markdown-body details:nth-of-type(3) summary:hover {
    background: linear-gradient(135deg, rgba(255, 183, 77, 0.3) 0%, rgba(255, 204, 128, 0.25) 100%) !important;
}

/* --- 历史档案面板 (第4个details) --- */
.markdown-body details:nth-of-type(4) {
    background: linear-gradient(180deg, rgba(237, 231, 246, 0.6) 0%, rgba(209, 196, 233, 0.3) 100%) !important;
    border-color: rgba(149, 117, 205, 0.3) !important;
}

.markdown-body details:nth-of-type(4) summary {
    background: linear-gradient(135deg, rgba(149, 117, 205, 0.2) 0%, rgba(179, 157, 219, 0.15) 100%) !important;
    color: #5e35b1 !important;
}

.markdown-body details:nth-of-type(4) summary:hover {
    background: linear-gradient(135deg, rgba(149, 117, 205, 0.3) 0%, rgba(179, 157, 219, 0.25) 100%) !important;
}

/* --- 🎯 行动推荐面板 (第5个details) --- */
.markdown-body details:nth-of-type(5) {
    background: linear-gradient(180deg, rgba(255, 235, 238, 0.6) 0%, rgba(255, 205, 210, 0.3) 100%) !important;
    border-color: rgba(239, 83, 80, 0.25) !important;
}

.markdown-body details:nth-of-type(5) summary {
    background: linear-gradient(135deg, rgba(239, 83, 80, 0.15) 0%, rgba(239, 154, 154, 0.12) 100%) !important;
    color: #c62828 !important;
}

.markdown-body details:nth-of-type(5) summary:hover {
    background: linear-gradient(135deg, rgba(239, 83, 80, 0.25) 0%, rgba(239, 154, 154, 0.2) 100%) !important;
}

/* ===== details 内部列表 - 每项一行 ===== */
.markdown-body details ul,
.markdown-body details ol {
    padding-left: 20px !important;
    margin: 10px 14px !important;
}

.markdown-body details li {
    margin: 7px 0 !important;
    line-height: 1.75 !important;
    padding: 4px 0 !important;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.06) !important;
    color: #37474f !important;
    font-size: 13.5px !important;
    display: list-item !important;
    white-space: normal !important;
    word-break: break-word !important;
}

.markdown-body details li:last-child {
    border-bottom: none !important;
}

/* ===== details 内部 <p> 标签 - 每段换行 ===== */
.markdown-body details p {
    margin: 8px 14px !important;
    line-height: 1.75 !important;
    color: #37474f !important;
    font-size: 13.5px !important;
    display: block !important;
    word-break: break-word !important;
}

/* ===== details 内部代码块 (记忆区) ===== */
.markdown-body details pre {
    background: rgba(255, 255, 255, 0.55) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
    margin: 10px 14px !important;
    font-size: 13px !important;
    line-height: 1.8 !important;
    overflow-x: auto !important;
}

.markdown-body details pre code {
    color: #455a64 !important;
    font-family: "JetBrains Mono", "Fira Code", "Consolas", monospace !important;
    font-size: 13px !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
}

/* ===== details 内部粗体标题 ===== */
.markdown-body details strong {
    color: #263238 !important;
    font-weight: 700 !important;
    display: block !important;
    margin: 12px 14px 6px !important;
    font-size: 14px !important;
    padding-bottom: 4px !important;
    border-bottom: 1.5px solid rgba(0, 0, 0, 0.08) !important;
}

/* ===== H2 标题 (## 记忆结构等) ===== */
.markdown-body h2 {
    color: #1b5e20 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    margin: 20px 0 10px !important;
    padding-bottom: 8px !important;
    border-bottom: 2px solid rgba(76, 175, 80, 0.3) !important;
}

.markdown-body h3 {
    color: #2e7d32 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin: 14px 0 8px !important;
}

/* ===== 表格样式 ===== */
.markdown-body table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    margin: 14px 0 !important;
    font-size: 13px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.markdown-body thead th {
    background: linear-gradient(135deg, rgba(165, 214, 167, 0.35) 0%, rgba(129, 199, 132, 0.25) 100%) !important;
    color: #1b5e20 !important;
    font-weight: 600 !important;
    padding: 10px 14px !important;
    text-align: left !important;
    border-bottom: 2px solid rgba(76, 175, 80, 0.3) !important;
}

.markdown-body tbody td {
    padding: 9px 14px !important;
    color: #37474f !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    line-height: 1.65 !important;
}

.markdown-body tbody tr:nth-child(even) {
    background: rgba(232, 245, 233, 0.25) !important;
}

.markdown-body tbody tr:hover {
    background: rgba(200, 230, 201, 0.3) !important;
}

/* ===== 底部按钮 ===== */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    color: #558b6e !important;
    font-size: 12px !important;
    border-radius: 8px !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    background: rgba(165, 214, 167, 0.2) !important;
    color: #2e7d32 !important;
}

/* ===== 模型名称文本 ===== */
.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
    color: #90a4ae !important;
    font-size: 11.5px !important;
    font-style: italic !important;
}

/* ===== Token消耗文本 ===== */
.text-orange-500 {
    color: #a5d6a7 !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
}

/* ===== 加载动画 ===== */
.style_dot-flashing__8L91Q.style_text__zGhNq {
    display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    width: 60px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    position: absolute !important;
    width: 48px !important;
    height: 16px !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    /* CSP-compatible inline SVG with SMIL animation - 3 bouncing leaf dots */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 16'%3E%3Ccircle cx='8' cy='8' r='4' fill='%2381c784'%3E%3Canimate attributeName='cy' values='8;3;8' dur='0.6s' repeatCount='indefinite' begin='0s'/%3E%3Canimate attributeName='opacity' values='1;0.5;1' dur='0.6s' repeatCount='indefinite' begin='0s'/%3E%3C/circle%3E%3Ccircle cx='24' cy='8' r='4' fill='%2366bb6a'%3E%3Canimate attributeName='cy' values='8;3;8' dur='0.6s' repeatCount='indefinite' begin='0.15s'/%3E%3Canimate attributeName='opacity' values='1;0.5;1' dur='0.6s' repeatCount='indefinite' begin='0.15s'/%3E%3C/circle%3E%3Ccircle cx='40' cy='8' r='4' fill='%234caf50'%3E%3Canimate attributeName='cy' values='8;3;8' dur='0.6s' repeatCount='indefinite' begin='0.3s'/%3E%3Canimate attributeName='opacity' values='1;0.5;1' dur='0.6s' repeatCount='indefinite' begin='0.3s'/%3E%3C/circle%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

/* ===== 背景装饰 - 浮动光斑 (SMIL SVG) ===== */
.bg-gray-100\/90.relative.inline-block::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.35 !important;
    border-radius: 18px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 200'%3E%3Ccircle cx='50' cy='40' r='25' fill='%23a5d6a7' opacity='0.3'%3E%3Canimate attributeName='cx' values='50;80;50' dur='8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='40;60;40' dur='6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='320' cy='150' r='18' fill='%2381d4fa' opacity='0.25'%3E%3Canimate attributeName='cx' values='320;290;320' dur='10s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='150;130;150' dur='7s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='200' cy='90' r='12' fill='%23ce93d8' opacity='0.2'%3E%3Canimate attributeName='cx' values='200;220;200' dur='9s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='12;16;12' dur='5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

/* ===== 移动端适配 ===== */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        padding: 14px 14px !important;
        border-radius: 14px !important;
    }

    .markdown-body {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }

    .markdown-body details summary {
        padding: 10px 14px !important;
        font-size: 13.5px !important;
    }

    .markdown-body details li {
        font-size: 12.5px !important;
    }

    .markdown-body table {
        font-size: 12px !important;
    }

    .flex.items-center.justify-center.w-6.h-5 {
        width: 48px !important;
        height: 24px !important;
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        width: 40px !important;
        height: 14px !important;
    }
}

/* ===== 低动效偏好 ===== */
@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before {
        opacity: 0.15 !important;
        /* SMIL animations still run but reduced visual impact via opacity */
    }

    .flex.items-center.justify-center.w-6.h-5::before {
        /* Dots still animate via SMIL but at reduced opacity */
        opacity: 0.6 !important;
    }

    .bg-gray-100\/90.relative.inline-block,
    .bg-gray-100\/90.relative.inline-block:hover {
        transition: none !important;
    }
}