/* =============================================
   风月AI游戏平台 - 科技浅色主题
   base-hue:220  base-sat:15%  is-dark:0  accent-hue:260  accent-sat:70%

   bg-deep:hsl(220,15%,96%)   bg-default:hsl(220,15%,93%)   bg-paper:hsl(220,15%,100%)   bg-raised:hsl(220,15%,88%)
   bg-hover:hsl(220,15%,82%)  text-main:hsl(220,8%,7%)      text-sub:hsl(220,6%,35%)     text-muted:hsl(220,5%,56%)
   border:hsl(220,15%,80%)    accent:hsl(260,70%,42%)       accent-dim:hsl(260,24.5%,90%) accent-text:hsl(260,56%,30%)
   glow: 0 0 14px hsla(260,70%,55%,0.4)   glow-soft: 0 0 6px hsla(260,70%,55%,0.2)

   亮点① blockquote → 左侧发光边框 + 斜纹科技背景
   亮点② 加载动画  → SVG脉冲光晕，中心向外扩散
   亮点③ details符号 → ◆菱形替代三角，游戏UI几何感
   ============================================= */

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

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

details { 
    background: hsl(220,15%,100%) !important; 
    border: 1px solid hsl(220,15%,80%) !important; 
    border-radius: 6px !important; 
    margin: 8px 0 !important; 
    overflow: hidden !important; 
    transition: border-color 0.15s !important; 
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
details[open] { 
    border-color: hsl(260,70%,42%) !important; 
    box-shadow: 0 0 12px hsla(260,70%,55%,0.15) !important;
}
details summary { 
    background: hsl(260,24.5%,90%) !important; 
    color: hsl(260,56%,30%) !important; 
    padding: 8px 12px 8px 32px !important; 
    display: block !important; 
    position: relative !important; 
    border-bottom: 1px solid hsl(220,15%,80%) !important; 
    cursor: pointer !important; 
    font-weight: 600 !important; 
    list-style: none !important; 
    user-select: none !important; 
}
details summary::before { 
    content: '◆' !important; 
    position: absolute !important; 
    left: 12px !important; 
    top: 50% !important; 
    transform: translateY(-50%) !important; 
    color: hsl(260,70%,42%) !important; 
    font-size: 11px !important; 
    transition: transform 0.2s ease !important; 
}
details[open] summary::before { 
    transform: translateY(-50%) rotate(90deg) !important; 
}
details summary::-webkit-details-marker { 
    display: none !important; 
}

::-webkit-scrollbar { 
    width: 8px !important; 
    height: 8px !important; 
}
::-webkit-scrollbar-track { 
    background: hsl(220,15%,96%) !important; 
}
::-webkit-scrollbar-thumb { 
    background: hsl(220,15%,80%) !important; 
    border-radius: 3px !important; 
}
::-webkit-scrollbar-thumb:hover { 
    background: hsl(260,70%,42%) !important; 
}

::placeholder { 
    color: hsl(220,5%,56%) !important; 
    opacity: 1 !important; 
}
::selection { 
    background: hsl(260,24.5%,90%) !important; 
    color: hsl(260,56%,30%) !important; 
}

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

/* ===== 全局 ===== */
body, #root, .h-screen { 
    background: hsl(220,15%,93%) !important; 
    color: hsl(220,8%,7%) !important; 
}

/* ===== 顶部导航 ===== */
.sticky.w-full.top-0.flex.items-center { 
    background: hsla(220,15%,100%,0.95) !important; 
    backdrop-filter: blur(10px) !important; 
    border-bottom: 1px solid hsl(220,15%,80%) !important; 
    box-shadow: 0 2px 12px rgba(0,0,0,0.05) !important;
}

#ai-model-selector .group.flex.items-center { 
    color: hsl(220,8%,7%) !important; 
    transition: color 0.2s !important;
}
#ai-model-selector .group.flex.items-center:hover { 
    color: hsl(260,70%,42%) !important; 
}

#ai-model-selector .truncate.text-[13px] { 
    color: hsl(220,8%,7%) !important; 
}

#ai-model-selector .shrink-0.flex.items-center svg { 
    color: hsl(220,6%,35%) !important; 
}

#header-setting-button { 
    color: hsl(220,8%,7%) !important; 
    transition: color 0.2s !important;
}
#header-setting-button:hover { 
    color: hsl(260,70%,42%) !important; 
}

/* ===== 开场白区域 ===== */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] { 
    background: hsl(220,15%,100%) !important; 
    border-color: hsl(220,15%,80%) !important; 
    transition: border-color 0.2s, box-shadow 0.2s !important;
}
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover { 
    border-color: hsl(260,70%,42%) !important; 
    box-shadow: 0 0 8px hsla(260,70%,55%,0.2) !important;
}

div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"] { 
    color: hsl(220,6%,35%) !important; 
}

div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] { 
    color: hsl(220,6%,35%) !important; 
}

/* ===== 侧边栏 ===== */
.shadow-lg.border-r.border-gray-200 { 
    background: hsl(220,15%,100%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}

.MuiList-root { 
    background: transparent !important; 
}

.conversation-text { 
    color: hsl(220,8%,7%) !important; 
}

/* ===== 功能按钮 ===== */
#ai-mod-button2 { 
    background: hsl(220,15%,100%) !important; 
}

#ai-mod-button2 button.MuiButton-root { 
    color: hsl(220,8%,7%) !important; 
    border-color: hsl(220,15%,80%) !important; 
    transition: all 0.2s !important;
}
#ai-mod-button2 button.MuiButton-root:hover { 
    background: hsl(260,24.5%,90%) !important; 
    border-color: hsl(260,70%,42%) !important; 
    box-shadow: 0 0 8px hsla(260,70%,55%,0.2) !important;
}

#ai-mod-button2 button.MuiButton-root svg { 
    color: hsl(220,6%,35%) !important; 
}

/* ===== 聊天气泡 ===== */
.bg-gray-100\/90.relative.inline-block { 
    background: hsl(220,15%,100%) !important; 
    border: 1px solid hsl(220,15%,80%) !important; 
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}

.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) { 
    background: hsl(220,15%,100%) !important; 
}

.markdown-body { 
    color: hsl(220,8%,7%) !important; 
}

.markdown-body h1, .markdown-body h2, .markdown-body h3 { 
    color: hsl(260,56%,30%) !important; 
    border-bottom-color: hsl(220,15%,80%) !important;
}

.markdown-body ul, .markdown-body ol { 
    color: hsl(220,8%,7%) !important; 
}

.markdown-body li { 
    color: hsl(220,8%,7%) !important; 
}

.markdown-body blockquote { 
    background: linear-gradient(135deg, hsl(260,24.5%,90%) 0%, hsl(220,15%,100%) 100%) !important; 
    border-left: 3px solid hsl(260,70%,42%) !important; 
    box-shadow: -3px 0 12px hsla(260,70%,55%,0.3) !important; 
    padding: 12px 16px !important; 
    margin: 16px 0 !important; 
    font-style: italic !important; 
    color: hsl(260,56%,30%) !important; 
    position: relative !important;
}
.markdown-body blockquote::before { 
    content: '' !important; 
    position: absolute !important; 
    left: 0 !important; 
    top: 0 !important; 
    width: 100% !important; 
    height: 100% !important; 
    background: repeating-linear-gradient(45deg, transparent, transparent 10px, hsla(260,70%,42%,0.03) 10px, hsla(260,70%,42%,0.03) 20px) !important; 
    pointer-events: none !important;
}

.markdown-body table { 
    border-color: hsl(220,15%,80%) !important; 
}

.markdown-body th { 
    background: hsl(260,24.5%,90%) !important; 
    color: hsl(260,56%,30%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}

.markdown-body td { 
    border-color: hsl(220,15%,80%) !important; 
}

.markdown-body strong { 
    color: hsl(260,56%,30%) !important; 
}

.markdown-body em { 
    color: hsl(220,6%,35%) !important; 
}

.markdown-body a { 
    color: hsl(260,70%,42%) !important; 
    text-decoration: none !important; 
    transition: color 0.2s !important;
}
.markdown-body a:hover { 
    color: hsl(260,70%,52%) !important; 
    text-shadow: 0 0 8px hsla(260,70%,55%,0.3) !important;
}

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

.flex.items-center.justify-center.w-6.h-5 { 
    position: relative !important; 
}

.flex.items-center.justify-center.w-6.h-5::before { 
    content: '' !important; 
    display: block !important; 
    width: 100% !important; 
    height: 100% !important; 
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8" fill="none" stroke="hsl(260,70%,42%)" stroke-width="2"><animate attributeName="r" from="4" to="10" dur="1.2s" repeatCount="indefinite"/><animate attributeName="opacity" from="1" to="0" dur="1.2s" repeatCount="indefinite"/></circle><circle cx="12" cy="12" r="4" fill="hsl(260,70%,42%)"><animate attributeName="r" from="2" to="4" dur="1.2s" repeatCount="indefinite"/></circle></svg>') !important; 
    background-size: contain !important; 
    background-repeat: no-repeat !important; 
    background-position: center !important;
}

.flex.items-center.justify-center.w-6.h-5::after { 
    content: '' !important; 
    position: absolute !important; 
    width: 120% !important; 
    height: 120% !important; 
    border-radius: 50% !important; 
    box-shadow: 0 0 14px hsla(260,70%,55%,0.4) !important; 
    animation: pulse-glow 1.2s ease-in-out infinite !important;
}

@keyframes pulse-glow { 
    0%, 100% { 
        box-shadow: 0 0 14px hsla(260,70%,55%,0.4) !important; 
        transform: scale(1) !important; 
    } 
    50% { 
        box-shadow: 0 0 24px hsla(260,70%,55%,0.6) !important; 
        transform: scale(1.1) !important; 
    } 
}

/* ===== 底部输入区 ===== */
.bg-gradient-to-t { 
    background: linear-gradient(to top, hsl(220,15%,93%), transparent) !important; 
}

#ai-chat-bottom-input { 
    background: hsl(220,15%,100%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}

#ai-chat-input { 
    background: hsl(220,15%,100%) !important; 
    color: hsl(220,8%,7%) !important; 
    caret-color: hsl(260,70%,42%) !important; 
}

#ai-chat-input::placeholder { 
    color: hsl(220,5%,56%) !important; 
}

#ai-chat-input::selection { 
    background: hsl(260,24.5%,90%) !important; 
    color: hsl(260,56%,30%) !important; 
}

#ai-send-button { 
    background: hsl(260,70%,42%) !important; 
    color: hsl(220,15%,100%) !important; 
    transition: all 0.2s !important;
}
#ai-send-button:hover { 
    background: hsl(260,70%,52%) !important; 
    box-shadow: 0 0 12px hsla(260,70%,55%,0.4) !important;
}

/* ===== 评论区 ===== */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] { 
    background: hsl(220,15%,100%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}

div.text-lg.font-bold { 
    color: hsl(260,56%,30%) !important; 
}

p.MuiTypography-body1.text-grey-600 { 
    color: hsl(220,6%,35%) !important; 
}

span.MuiRating-root { 
    color: hsl(260,70%,42%) !important; 
}

span.MuiRating-iconEmpty svg { 
    color: hsl(220,5%,56%) !important; 
}

span.MuiRating-iconFilled svg { 
    color: hsl(260,70%,42%) !important; 
}

span.text-orange-500 { 
    color: hsl(260,70%,42%) !important; 
}

div.flex.flex-col.border-gray-200 { 
    border-color: hsl(220,15%,80%) !important; 
}

textarea.rc-textarea { 
    background: hsl(220,15%,100%) !important; 
    color: hsl(220,8%,7%) !important; 
    border: 1px solid hsl(220,15%,80%) !important; 
}

div.bg-gray-100.text-gray-500 { 
    background: hsl(220,15%,96%) !important; 
    color: hsl(220,5%,56%) !important; 
}

div.cursor-pointer.group.flex.items-center.justify-center { 
    transition: all 0.2s !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover { 
    background: hsl(260,24.5%,90%) !important; 
}

div[data-state="closed"] svg[data-icon="Send03"] { 
    color: hsl(260,70%,42%) !important; 
}

div.style_divider__mW0YX { 
    background: linear-gradient(90deg, transparent, hsl(260,70%,42%), transparent) !important; 
    height: 2px !important; 
    box-shadow: 0 0 8px hsla(260,70%,55%,0.3) !important;
}

.MuiStack-root.css-1dmzxoz { 
    background: hsl(220,15%,100%) !important; 
}

button.MuiButton-containedPrimary { 
    background: hsl(260,70%,42%) !important; 
    color: hsl(220,15%,100%) !important; 
    transition: all 0.2s !important;
}
button.MuiButton-containedPrimary:hover { 
    background: hsl(260,70%,52%) !important; 
    box-shadow: 0 0 12px hsla(260,70%,55%,0.4) !important;
}

button.MuiButton-outlinedPrimary { 
    border-color: hsl(260,70%,42%) !important; 
    color: hsl(260,70%,42%) !important; 
    transition: all 0.2s !important;
}
button.MuiButton-outlinedPrimary:hover { 
    background: hsl(260,24.5%,90%) !important; 
    border-color: hsl(260,70%,52%) !important; 
}

div.p-3.overflow-y-auto { 
    background: hsl(220,15%,100%) !important; 
}

div.group.ml-0 { 
    transition: background 0.2s !important;
}
div.group.ml-0:hover { 
    background: hsl(220,15%,96%) !important; 
}

div.group img.rounded-full { 
    border: 2px solid hsl(220,15%,80%) !important; 
}

div.text-sm.text-grey-600 span.font-bold { 
    color: hsl(260,56%,30%) !important; 
}

span.text-[10px] { 
    color: hsl(220,5%,56%) !important; 
}

div.break-all { 
    color: hsl(220,8%,7%) !important; 
}

div.text-xs.text-grey-600 { 
    color: hsl(220,6%,35%) !important; 
}

button.text-gray-400 { 
    color: hsl(220,5%,56%) !important; 
    transition: color 0.2s !important;
}
button.text-gray-400:hover { 
    color: hsl(260,70%,42%) !important; 
}

button.text-gray-400 svg { 
    color: inherit !important; 
}

span.cursor-pointer { 
    color: hsl(260,70%,42%) !important; 
    transition: color 0.2s !important;
}
span.cursor-pointer:hover { 
    color: hsl(260,70%,52%) !important; 
}

div.ml-8.border-l { 
    border-color: hsl(220,15%,80%) !important; 
}

/* ===== 分页 ===== */
.MuiPaginationItem-root { 
    color: hsl(220,8%,7%) !important; 
    border-color: hsl(220,15%,80%) !important; 
    transition: all 0.2s !important;
}
.MuiPaginationItem-root:hover { 
    background: hsl(260,24.5%,90%) !important; 
    border-color: hsl(260,70%,42%) !important; 
}

.MuiPaginationItem-root.Mui-selected { 
    background: hsl(260,70%,42%) !important; 
    color: hsl(220,15%,100%) !important; 
    border-color: hsl(260,70%,42%) !important; 
}

.MuiPaginationItem-root.Mui-disabled { 
    color: hsl(220,5%,56%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}

.MuiPaginationItem-icon { 
    color: hsl(220,6%,35%) !important; 
}

.MuiStack-root.css-1uwir8f { 
    background: hsl(220,15%,100%) !important; 
}

.MuiInputBase-input { 
    color: hsl(220,8%,7%) !important; 
}

/* ===== MUI 全局 ===== */
.MuiButton-root { 
    color: hsl(220,8%,7%) !important; 
    transition: all 0.2s !important;
}

.MuiButton-contained { 
    background: hsl(260,70%,42%) !important; 
    color: hsl(220,15%,100%) !important; 
}
.MuiButton-contained:hover { 
    background: hsl(260,70%,52%) !important; 
    box-shadow: 0 0 12px hsla(260,70%,55%,0.4) !important;
}

.MuiButton-outlined { 
    border-color: hsl(220,15%,80%) !important; 
    color: hsl(220,8%,7%) !important; 
}
.MuiButton-outlined:hover { 
    background: hsl(260,24.5%,90%) !important; 
    border-color: hsl(260,70%,42%) !important; 
}

.MuiIconButton-root { 
    color: hsl(220,6%,35%) !important; 
    transition: color 0.2s !important;
}
.MuiIconButton-root:hover { 
    color: hsl(260,70%,42%) !important; 
}

.MuiDialog-paper { 
    background: hsl(220,15%,100%) !important; 
    border: 1px solid hsl(220,15%,80%) !important; 
    box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;
}

.MuiDrawer-paper { 
    background: hsl(220,15%,100%) !important; 
    border-color: hsl(220,15%,80%) !important; 
}