/* --- 幼化纪元：生存终端 UI 方案 --- */

/* 1. 顶部栏美化：系统监控风格 */
.sticky.w-full.top-0.flex.items-center {
    background: linear-gradient(180deg, #0a0a0a 0%, #1a0a0a 100%) !important;
    border-bottom: 2px solid #e74c3c !important;
    box-shadow: 0 4px 15px rgba(231, 76, 60, 0.2) !important;
}

#ai-model-selector .group.flex.items-center {
    background: rgba(231, 76, 60, 0.1) !important;
    border: 1px solid rgba(231, 76, 60, 0.3) !important;
    border-radius: 4px !important;
    padding: 2px 8px !important;
}

#ai-model-selector .truncate.text-\[13px\] {
    color: #e74c3c !important;
    font-weight: bold !important;
    font-family: 'Courier New', monospace !important;
    letter-spacing: 1px !important;
}

#header-setting-button svg, 
.sticky.w-full.top-0 svg.lucide-clock-8,
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]) {
    color: #e74c3c !important;
    filter: drop-shadow(0 0 2px rgba(231, 76, 60, 0.5)) !important;
}

/* 2. 开场白选择器：战术滑块 */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
    background: #1a1a1a !important;
    border: 1px solid #333 !important;
    transition: all 0.3s ease !important;
}

div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
    border-color: #e74c3c !important;
    box-shadow: 0 0 10px rgba(231, 76, 60, 0.2) !important;
}

/* 3. 按钮栏：功能模块 */
#ai-mod-button2 button.MuiButton-root {
    background: #111 !important;
    border: 1px solid #444 !important;
    color: #d4af37 !important; /* 金色文字 */
    font-size: 12px !important;
    text-transform: uppercase !important;
    transition: 0.2s !important;
}

#ai-mod-button2 button.MuiButton-root:hover {
    border-color: #e74c3c !important;
    color: #e74c3c !important;
    background: rgba(231, 76, 60, 0.05) !important;
}

/* 4. 底部输入栏：指令输入终端 */
.bg-gradient-to-t {
    background: linear-gradient(to top, #0a0a0a, transparent) !important;
}

#ai-chat-bottom-input {
    background: #151515 !important;
    border: 1px solid #e74c3c !important;
    border-radius: 12px !important;
    padding: 4px !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.8) !important;
}

#ai-chat-input {
    color: #e0e0e0 !important;
    font-family: 'Segoe UI', sans-serif !important;
}

#ai-chat-input::placeholder {
    color: #555 !important;
    font-style: italic !important;
}

/* 5. 评论区：深色权力重构 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
    background: #0d0d0d !important;
    border-top: 1px solid #e74c3c !important;
}

div.text-lg.font-bold, p.MuiTypography-body1.text-grey-600 {
    color: #e74c3c !important;
    text-shadow: 0 0 5px rgba(231, 76, 60, 0.3) !important;
}

/* 评分星星美化 */
span.MuiRating-iconFilled svg { color: #e74c3c !important; }
span.MuiRating-iconEmpty svg { color: #333 !important; }
span.text-orange-500 { color: #d4af37 !important; font-weight: bold !important; }

/* 评论输入框 */
textarea.rc-textarea {
    background: #1a1a1a !important;
    border: 1px solid #333 !important;
    color: #eee !important;
}

/* 发送按钮 */
div.cursor-pointer.group.flex.items-center.justify-center {
    background: #e74c3c !important;
    border-radius: 4px !important;
}

/* 评论列表项 */
div.group.ml-0 {
    border-bottom: 1px solid #222 !important;
    padding: 12px 0 !important;
}

div.text-sm.text-grey-600 span.font-bold {
    color: #d4af37 !important; /* 用户名金色 */
}

div.break-all {
    color: #bbb !important;
    line-height: 1.6 !important;
}

/* 分页按钮 */
.MuiPaginationItem-root {
    color: #888 !important;
    border: 1px solid #333 !important;
}

.MuiPaginationItem-root.Mui-selected {
    background: #e74c3c !important;
    color: #fff !important;
}

/* --- 可选：扫描线背景特效 (发散性代码) --- */
/*
div[class*="w-full"][class*="bg-white"][class*="bottom-0"]::before {
    content: " ";
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%), 
                linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
    z-index: 1;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}
*/
/* --- 移除顶部默认装饰条 --- */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* --- 统一聊天框主体美化 --- */
.bg-gray-100\/90.relative.inline-block {
    background-color: #121212 !important;
    border: 1px solid #333 !important;
    border-left: 4px solid #e74c3c !important; /* 延续UI的深红主色 */
    border-radius: 8px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.5), inset 0 0 15px rgba(231,76,60,0.05) !important;
    backdrop-filter: blur(10px) !important;
    margin-bottom: 12px !important;
    isolation: isolate !important;
    overflow: hidden !important;
}

/* --- 背景动态动效 (红色余晖扫描) --- */
.bg-gray-100\/90.relative.inline-block::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at center, rgba(231,76,60,0.03) 0%, transparent 70%) !important;
    z-index: 0 !important;
    pointer-events: none !important;
    /* CSS增强动效 */
    animation: pulseScan 6s infinite ease-in-out !important;
}

@keyframes pulseScan {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.1); }
}

/* --- 文本可读性核心设置 (强制) --- */
.markdown-body {
    color: #F0F0F0 !important; /* 高对比度浅色 */
    font-family: 'Segoe UI', 'PingFang SC', sans-serif !important;
    line-height: 1.7 !important;
    z-index: 1 !important;
    position: relative !important;
    background: transparent !important;
}

.markdown-body strong {
    color: #e74c3c !important; /* 强调文本为深红 */
    font-weight: bold !important;
}

/* --- 底部状态栏与附加元素美化 --- */
/* 模型名称 */
.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
    color: #d4af37 !important; /* 金色，呼应UI */
    font-weight: bold !important;
    letter-spacing: 1px !important;
    opacity: 0.8 !important;
}

/* Token消耗 */
.text-orange-500 {
    color: #e74c3c !important;
    font-size: 11px !important;
}

/* 底部操作按钮 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    color: #EAEAEA !important;
    background: rgba(255,255,255,0.05) !important;
    border-radius: 4px !important;
    margin: 0 4px !important;
    transition: all 0.3s !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    background: rgba(231,76,60,0.2) !important;
    color: #e74c3c !important;
}

/* --- 加载动画重构 (SMIL SVG) --- */
.style_dot-flashing__8L91Q.style_text__zGhNq {
    display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23e74c3c' d='M12,1L12,1L12,1C5.9,1,1,5.9,1,12s4.9,11,11,11s11-4.9,11-11S18.1,1,12,1z M12,21c-5,0-9-4-9-9s4-9,9-9s9,4,9,9S17,21,12,21z'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='1.5s' repeatCount='indefinite'/%3E%3C/path%3E%3Cpath fill='%23e74c3c' d='M12,5L12,5L12,5c-3.9,0-7,3.1-7,7s3.1,7,7,7s7-3.1,7-7S15.9,5,12,5z'%3E%3Canimate attributeName='opacity' values='1;0.3;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    width: 30px !important;
    height: 30px !important;
}

/* 移动端适配 */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        max-width: 95% !important;
    }
}