/* ====================================================================
 * OCCULT THEME (秘境灰阶 - 仪式感对话系统)
 * Minimalist Pale Slate & Monochrome Occult Aesthetic
 * Zero aggressive flickering / Stable reading experience with ritual micro-motions.
 * ================================================================== */

html[data-cow-theme="occult"] {
    --cow-accent: #27272a;
    --cow-accent-soft: rgba(0, 0, 0, 0.05);
    --cow-page: #f9fafb;
    --cow-surface: #ffffff;
    --cow-surface-soft: #f1f3f5;
    --cow-sidebar: #f4f5f7;
    --cow-border: rgba(0, 0, 0, 0.08);
    --cow-border-strong: rgba(0, 0, 0, 0.16);
    --cow-radius: 8px;
    --cow-radius-lg: 12px;
    --cow-shadow-soft: 0 4px 16px rgba(0, 0, 0, 0.03);
    --cow-shadow-float: 0 12px 36px rgba(0, 0, 0, 0.06);
    --cow-text: #18181b;
    --cow-text-muted: #71717a;
    --cow-control-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

html[data-cow-theme="occult"] body {
    color: #18181b !important;
    font-family: -apple-system, BlinkMacSystemFont, "Cinzel", "Didot", "Georgia", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", serif !important;
    letter-spacing: 0.015em;
    background: #f4f5f7 !important;
}

html[data-cow-theme="occult"] #app,
html[data-cow-theme="occult"] #main-content,
html[data-cow-theme="occult"] #content-area,
html[data-cow-theme="occult"] #view-chat,
html[data-cow-theme="occult"] .chat-main {
    background: transparent !important;
}

html[data-cow-theme="occult"] #main-content {
    background: #f9fafb !important;
    position: relative;
    overflow: hidden;
}

/* ====================================================================
 * 对话主舞台：神秘古代文字星阵背景与微光栅线
 * ================================================================== */

html[data-cow-theme="occult"] #view-chat {
    position: relative;
}

html[data-cow-theme="occult"] #view-chat::before {
    content: "𐡀 𐡁 𐡂 𐡃 𐡄 𐡅 𐡆 𐡇 𐡈 𐡉 𐡊 𐡋 𐡌 𐡍 𐡎 𐡏 𐡐 𐡑 𐡒 𐡓 𐡔 𐡕 𐍈 𐑘 𐒡 𐠀 𐀀 𐀁 𐀂 𐀃 𐀄 𐀅 𐀆 𐀇 𐀈 𐀉 𐀊 𐀋 𐀌 𐀍 𐀎 𐀏 𐀐 𐀑 𐀒 𐀓 𐀔 𐀕 𐀖 𐀗 𐀘 𐀙 𐀚 𐀛 𐀜 𐀝 𐀞 𐀟 𐀠 𐀡 𐀢 𐀣 𐀤 𐀥 𐀦 𐀧 𐀨 𐀩 𐀪 𐀫 𐀬 𐀭 𐀮 𐀯 𐀰 𐀱 𐀲 𐀳 𐀴 𐀵 𐀶 𐀷 𐀸 𐀹 𐀺 𐀻 𐀼 𐀽 𐀾 𐀿";
    position: absolute;
    inset: -30%;
    font-size: 15px;
    line-height: 2.8;
    letter-spacing: 14px;
    color: rgba(0, 0, 0, 0.024);
    word-break: break-all;
    pointer-events: none;
    user-select: none;
    transform: rotate(-6deg);
    z-index: 0;
}

/* 极其细微的经纬度扫描细线，无频闪 */
html[data-cow-theme="occult"] #view-chat::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.012) 0px, rgba(0, 0, 0, 0.012) 1px, transparent 1px, transparent 4px);
    pointer-events: none;
    z-index: 0;
}

/* ====================================================================
 * 侧边栏（Sidebar）
 * ================================================================== */

html[data-cow-theme="occult"] #sidebar {
    color: #3f3f46 !important;
    border-right: 1px solid rgba(0, 0, 0, 0.07) !important;
    background: #f4f5f7 !important;
    box-shadow: none !important;
}

html[data-cow-theme="occult"] #sidebar > div:first-child {
    border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

html[data-cow-theme="occult"] #sidebar .text-white { 
    color: #18181b !important; 
    font-weight: 500;
}

html[data-cow-theme="occult"] #sidebar .text-neutral-500,
html[data-cow-theme="occult"] #sidebar .text-neutral-600,
html[data-cow-theme="occult"] .menu-group > button { 
    color: #71717a !important; 
}

html[data-cow-theme="occult"] .sidebar-item { 
    color: #52525b !important;
    border-radius: 6px;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

html[data-cow-theme="occult"] .sidebar-item:hover,
html[data-cow-theme="occult"] .menu-group > button:hover {
    color: #09090b !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

html[data-cow-theme="occult"] .sidebar-item.active {
    color: #09090b !important;
    background: rgba(0, 0, 0, 0.06) !important;
    font-weight: 600;
    box-shadow: inset 2px 0 0 #18181b !important;
}

html[data-cow-theme="occult"] .sidebar-item.active .item-icon { 
    color: #18181b !important; 
}

html[data-cow-theme="occult"] .sidebar-recent-session {
    color: #52525b;
    border-radius: 6px;
    font-size: 13px;
}

html[data-cow-theme="occult"] .sidebar-recent-session i { 
    color: #a1a1aa; 
}

html[data-cow-theme="occult"] .sidebar-recent-session:hover {
    color: #18181b;
    background: rgba(0, 0, 0, 0.04);
}

html[data-cow-theme="occult"] .sidebar-recent-session.active {
    color: #09090b;
    background: rgba(0, 0, 0, 0.06);
    font-weight: 600;
}

html[data-cow-theme="occult"] .sidebar-recent-session.active i { 
    color: #18181b; 
}

html[data-cow-theme="occult"] .sidebar-analytics-btn {
    border-color: rgba(56, 189, 248, 0.28) !important;
    background: rgba(56, 189, 248, 0.08) !important;
    color: #0284c7 !important;
}
html[data-cow-theme="occult"] .sidebar-analytics-btn:hover {
    background: rgba(56, 189, 248, 0.16) !important;
    color: #0369a1 !important;
    border-color: rgba(56, 189, 248, 0.45) !important;
}
html[data-cow-theme="occult"] .sidebar-analytics-btn.active {
    background: rgba(56, 189, 248, 0.22) !important;
    color: #075985 !important;
    border-color: rgba(56, 189, 248, 0.6) !important;
}

/* Occult 侧边栏项目对话与会话列表极简高对比适配（浅白灰底） */
html[data-cow-theme="occult"] #sidebar .session-item .session-icon {
    display: none !important;
}
html[data-cow-theme="occult"] #sidebar .session-item.replying .session-icon,
html[data-cow-theme="occult"] #sidebar .session-item.pinned .session-icon {
    display: inline-block !important;
}
html[data-cow-theme="occult"] #sidebar .session-item {
    color: #3f3f46 !important;
}
html[data-cow-theme="occult"] #sidebar .session-item:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #09090b !important;
}
html[data-cow-theme="occult"] #sidebar .session-item.active {
    background: rgba(0, 0, 0, 0.08) !important;
    color: #09090b !important;
    font-weight: 600 !important;
}
/* 时间深度淡化 */
html[data-cow-theme="occult"] #sidebar .session-item .session-time {
    color: #a1a1aa !important;
    opacity: 0.65 !important;
    font-size: 9.5px !important;
}
html[data-cow-theme="occult"] #sidebar .session-project-latest {
    color: #a1a1aa !important;
    opacity: 0.6 !important;
    font-size: 9px !important;
}
/* 卡片边框与标题 */
html[data-cow-theme="occult"] #sidebar .session-project-card {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    background: rgba(0, 0, 0, 0.015) !important;
}
html[data-cow-theme="occult"] #sidebar .session-project-card:hover {
    border-color: rgba(0, 0, 0, 0.11) !important;
    background: rgba(0, 0, 0, 0.03) !important;
}
html[data-cow-theme="occult"] #sidebar .session-project-meta .session-group-name {
    color: #18181b !important;
}
/* “加载更多”与“全部”按钮高对比暗色设计，杜绝发白 */
html[data-cow-theme="occult"] #sidebar .session-project-controls button,
html[data-cow-theme="occult"] #sidebar .session-project-controls .session-view-all {
    background: rgba(0, 0, 0, 0.04) !important;
    color: #52525b !important;
    border: 1px solid rgba(0, 0, 0, 0.09) !important;
}
html[data-cow-theme="occult"] #sidebar .session-project-controls button:hover,
html[data-cow-theme="occult"] #sidebar .session-project-controls .session-view-all:hover {
    background: rgba(0, 0, 0, 0.09) !important;
    color: #09090b !important;
    border-color: rgba(0, 0, 0, 0.22) !important;
}
html[data-cow-theme="occult"] .sidebar-view-all-link {
    color: #71717a !important;
}
html[data-cow-theme="occult"] .sidebar-view-all-link:hover {
    color: #18181b !important;
    background: rgba(0, 0, 0, 0.05) !important;
}

/* ====================================================================
 * 顶部导航栏（Header）
 * ================================================================== */

html[data-cow-theme="occult"] #main-content > header {
    min-height: var(--cow-topbar-height) !important;
    height: var(--cow-topbar-height) !important;
    color: #18181b !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    background: rgba(249, 250, 251, 0.94) !important;
    backdrop-filter: blur(12px);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

html[data-cow-theme="occult"] #main-content > header .font-medium { 
    color: #18181b !important; 
    letter-spacing: 0.04em;
    font-family: monospace;
    font-size: 13px;
}

html[data-cow-theme="occult"] #main-content > header button,
html[data-cow-theme="occult"] #main-content > header a { 
    color: #71717a !important; 
}

html[data-cow-theme="occult"] #main-content > header button:hover,
html[data-cow-theme="occult"] #main-content > header a:hover {
    color: #18181b !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

/* ====================================================================
 * 欢迎屏（Welcome Screen）- 仪式感雕塑
 * ================================================================== */

html[data-cow-theme="occult"] #welcome-screen {
    position: relative;
    z-index: 1;
}

/* 头像微缩缓慢呼吸 */
html[data-cow-theme="occult"] #welcome-screen > img {
    border-radius: 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06) !important;
    animation: occult-totem-float 6s infinite ease-in-out;
}

@keyframes occult-totem-float {
    0%, 100% { transform: translateY(0) scale(1); filter: drop-shadow(0 4px 12px rgba(0,0,0,0.04)); }
    50% { transform: translateY(-4px) scale(1.02); filter: drop-shadow(0 12px 24px rgba(0,0,0,0.08)); }
}

html[data-cow-theme="occult"] #welcome-title {
    color: #09090b !important;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    font-weight: 300;
    position: relative;
    display: inline-block;
    padding-bottom: 6px;
}

html[data-cow-theme="occult"] #welcome-title::after {
    content: "᚛ 0x00 • ORACLE ᚜";
    display: block;
    font-size: 10px;
    letter-spacing: 0.35em;
    color: #a1a1aa;
    font-family: monospace;
    font-weight: normal;
    margin-top: 6px;
}

html[data-cow-theme="occult"] #welcome-subtitle { 
    color: #71717a !important; 
    font-size: 12px;
    letter-spacing: 0.08em;
    line-height: 1.8;
}

/* 推荐卡片：如同微缩石板石碑 */
html[data-cow-theme="occult"] .example-card {
    background: rgba(255, 255, 255, 0.82) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 8px !important;
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

html[data-cow-theme="occult"] .example-card::before {
    content: "◆";
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 8px;
    color: rgba(0, 0, 0, 0.15);
    transition: color 0.3s;
}

html[data-cow-theme="occult"] .example-card:hover {
    border-color: rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important;
    transform: translateY(-2px);
    background: #ffffff !important;
}

html[data-cow-theme="occult"] .example-card:hover::before {
    color: #18181b;
}

html[data-cow-theme="occult"] .example-card .font-medium { 
    color: #18181b !important; 
    font-size: 13px;
    letter-spacing: 0.04em;
}

html[data-cow-theme="occult"] .example-card > p { 
    color: #71717a !important; 
    font-size: 12px;
}

/* ====================================================================
 * 对话消息区（Message Bubbles）- 最核心
 * ================================================================== */

html[data-cow-theme="occult"] #chat-messages {
    position: relative;
    z-index: 1;
    padding-top: 56px;
}

/* AI 头像带有仪式微光轮廓 */
html[data-cow-theme="occult"] .bot-message-group > img {
    border-radius: 10px !important;
    border: 1px solid rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    background: #ffffff;
    transition: transform 0.3s;
}

html[data-cow-theme="occult"] .bot-message-group:hover > img {
    transform: scale(1.04);
}

/* AI 气泡：冷白石板质感，左侧微带有神秘欧甘铭刻指示线 */
html[data-cow-theme="occult"] .bot-message-group > div > .msg-content {
    background: #ffffff !important;
    color: #18181b !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 6px 12px 12px 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03), inset 2px 0 0 #27272a !important;
    line-height: 1.8;
    position: relative;
    transition: border-color 0.25s, box-shadow 0.25s;
}

html[data-cow-theme="occult"] .bot-message-group > div > .msg-content:hover {
    border-color: rgba(0, 0, 0, 0.18) !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.05), inset 3px 0 0 #09090b !important;
}

/* 用户气泡：高级烟熏曜石灰 + 微细内边线 + 柔和光影 (比原纯黑更具灰度与通透感) */
html[data-cow-theme="occult"] .user-bubble {
    background: #27272a !important;
    color: #f4f4f5 !important;
    border: 1px solid #3f3f46 !important;
    border-radius: 12px 6px 12px 12px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), inset 0 1px 1px rgba(255, 255, 255, 0.08) !important;
    line-height: 1.7;
    transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s, background 0.2s;
}

html[data-cow-theme="occult"] .user-bubble:hover {
    background: #313136 !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), inset 0 1px 1px rgba(255, 255, 255, 0.12) !important;
}

html[data-cow-theme="occult"] .user-bubble * {
    color: #f4f4f5 !important;
}

/* 引用块：符文风格竖线 */
html[data-cow-theme="occult"] .msg-content blockquote {
    border-left: 2px solid #27272a !important;
    background: rgba(0, 0, 0, 0.025) !important;
    color: #52525b !important;
    border-radius: 0 4px 4px 0;
    padding: 8px 14px;
}

/* 行内代码 */
html[data-cow-theme="occult"] .msg-content :not(pre) > code {
    font-family: monospace;
    background: #f1f3f5 !important;
    color: #18181b !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.9em;
}

/* 代码高亮块 */
html[data-cow-theme="occult"] .msg-content pre {
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.02) !important;
}

/* ====================================================================
 * AI思考与生成过程状态动效（Thinking Indicator）
 * ================================================================== */

/* 正在思考时的加载点：黑灰微脉冲呼吸 */
html[data-cow-theme="occult"] .thinking-indicator,
html[data-cow-theme="occult"] .typing-dot {
    background: #27272a !important;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.3) !important;
}

/* 工具调用展开面板卡片 */
html[data-cow-theme="occult"] .tool-call-card,
html[data-cow-theme="occult"] .tool-result-card {
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    background: #fcfdfe !important;
    border-radius: 6px !important;
}

/* ====================================================================
 * 底部输入框（Composer Card）- 仪式交互核心
 * ================================================================== */

html[data-cow-theme="occult"] .chat-main > .flex-shrink-0 {
    background: transparent !important;
    border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}

html[data-cow-theme="occult"] #composer-card {
    border: 1px solid rgba(255, 255, 255, 0.90) !important;
    border-radius: 16px !important;
    background: rgba(255, 255, 255, 0.86) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    transition: box-shadow .2s ease, border-color .2s ease;
    position: relative;
}

/* 聚焦输入框时，有如启封的微光边界与极细呼吸线 */
html[data-cow-theme="occult"] #composer-card:focus-within {
    border-color: rgba(24, 24, 27, 0.40) !important;
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transform: translateY(-1px);
}
html[data-cow-theme="occult"] #chat-input {
    color: #18181b !important;
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    line-height: 1.6;
    letter-spacing: 0.015em;
}

html[data-cow-theme="occult"] #chat-input:focus {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

html[data-cow-theme="occult"] #chat-input::placeholder {
    color: #a1a1aa !important;
    font-family: monospace;
    font-size: 12px;
    letter-spacing: 0.12em;
}

/* 发送按钮：曜石按钮与激活微光动效 */
html[data-cow-theme="occult"] #send-btn {
    background: #18181b !important;
    color: #fafafa !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

html[data-cow-theme="occult"] #send-btn:hover:not(:disabled) {
    background: #27272a !important;
    transform: scale(1.05);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22) !important;
}

html[data-cow-theme="occult"] #send-btn:active:not(:disabled) {
    transform: scale(0.96);
}

/* 侧边栏底部操作区 */
html[data-cow-theme="occult"] .sidebar-footer-action {
    color: #71717a !important;
    border-radius: 6px !important;
}

html[data-cow-theme="occult"] .sidebar-footer-action:hover {
    color: #18181b !important;
    background: rgba(0, 0, 0, 0.04) !important;
}

/* 优雅冷墨细滚动条 */
html[data-cow-theme="occult"] * {
    scrollbar-color: rgba(0, 0, 0, 0.14) transparent;
}

html[data-cow-theme="occult"] ::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.14);
    border-radius: 4px;
}

html[data-cow-theme="occult"] ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.26);
}

/* ====================================================================
 * 登录页与认证弹窗（Login Stage & Sanctum Gate）
 * Monochrome Occult Aesthetic: 冷灰石板、古文字阵列、仪式图腾与曜石按键
 * ================================================================== */

html[data-cow-theme="occult"] .login-stage {
    background: radial-gradient(circle at 50% 40%, #ffffff 0%, #f5f6f8 60%, #eceef1 100%) !important;
    position: fixed;
    inset: 0;
    overflow: hidden;
}

/* 隐藏高饱和彩色渐变光球，保持纯净黑白灰神秘质感 */
html[data-cow-theme="occult"] .login-orb {
    display: none !important;
}

/* 登录全屏背景水印：古代文字星阵 */
html[data-cow-theme="occult"] .login-backdrop-decorations {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

html[data-cow-theme="occult"] .login-backdrop-decorations::before {
    content: "𐡀 𐡁 𐡂 𐡃 𐡄 𐡅 𐡆 𐡇 𐡈 𐡉 𐡊 𐡋 𐡌 𐡍 𐡎 𐡏 𐡐 𐡑 𐡒 𐡓 𐡔 𐡕 𐍈 𐑘 𐒡 𐠀 𐀀 𐀁 𐀂 𐀃 𐀄 𐀅 𐀆 𐀇 𐀈 𐀉 𐀊 𐀋 𐀌 𐀍 𐀎 𐀏 𐀐 𐀑 𐀒 𐀓 𐀔 𐀕 𐀖 𐀗 𐀘 𐀙 𐀚 𐀛 𐀜 𐀝 𐀞 𐀟 𐀠 𐀡 𐀢 𐀣 𐀤 𐀥 𐀦 𐀧 𐀨 𐀩 𐀪 𐀫 𐀬 𐀭 𐀮 𐀯 𐀰 𐀱 𐀲 𐀳 𐀴 𐀵 𐀶 𐀷 𐀸 𐀹 𐀺 𐀻 𐀼 𐀽 𐀾 𐀿";
    position: absolute;
    inset: -35%;
    font-size: 15px;
    line-height: 2.8;
    letter-spacing: 13px;
    color: rgba(0, 0, 0, 0.028);
    word-break: break-all;
    pointer-events: none;
    user-select: none;
    transform: rotate(-6deg);
}

/* 经纬度扫描微光栅线 */
html[data-cow-theme="occult"] .login-grid-mask {
    background-image: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.012) 0px, rgba(0, 0, 0, 0.012) 1px, transparent 1px, transparent 4px) !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
}

/* 登录悬浮石板卡片 */
html[data-cow-theme="occult"] .login-glass-card {
    background: rgba(255, 255, 255, 0.94) !important;
    border: 1px solid rgba(0, 0, 0, 0.09) !important;
    border-radius: 16px !important;
    box-shadow:
        0 2px 4px rgba(0, 0, 0, 0.02),
        0 14px 38px rgba(0, 0, 0, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    position: relative;
    padding: 36px 32px 32px !important;
}

/* 顶部神秘印记 */
html[data-cow-theme="occult"] .login-glass-card::before {
    content: "᚛ 0x00 • SANCTUM GATE ᚜";
    display: block;
    font-size: 10px;
    letter-spacing: 0.32em;
    color: #a1a1aa;
    font-family: monospace;
    margin-bottom: 20px;
    text-transform: uppercase;
}

/* 图腾与徽标：沉静仪式感 */
html[data-cow-theme="occult"] .login-logo-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 84px;
    height: 84px;
    background: radial-gradient(circle, rgba(0, 0, 0, 0.08) 0%, transparent 70%) !important;
    border-radius: 50%;
    filter: blur(10px) !important;
    animation: occult-totem-float 6s ease-in-out infinite alternate !important;
}

html[data-cow-theme="occult"] .login-logo {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 16px !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    animation: occult-totem-float 6s infinite ease-in-out;
}

html[data-cow-theme="occult"] .login-logo:hover {
    transform: translateY(-2px) scale(1.03) !important;
}

/* 标题排印：典雅仪式空灵感 */
html[data-cow-theme="occult"] .login-glass-card h1 {
    color: #09090b !important;
    font-family: -apple-system, BlinkMacSystemFont, "Cinzel", "Didot", "Georgia", serif !important;
    font-size: 22px !important;
    font-weight: 300 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase;
}

html[data-cow-theme="occult"] #login-subtitle,
html[data-cow-theme="occult"] .login-glass-card p:not(#login-error):not(#async-error) {
    color: #71717a !important;
    font-size: 12px !important;
    letter-spacing: 0.08em !important;
}

/* 石板冷墨输入框 */
html[data-cow-theme="occult"] .login-input {
    background: #f7f8fa !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 10px !important;
    color: #18181b !important;
    font-size: 14px !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html[data-cow-theme="occult"] .login-input::placeholder {
    color: #a1a1aa !important;
    font-family: monospace;
    letter-spacing: 0.12em;
    font-size: 12px;
}

html[data-cow-theme="occult"] .login-input-wrap:focus-within .login-input {
    border-color: #18181b !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 1px #18181b, 0 4px 18px rgba(0, 0, 0, 0.04) !important;
}

html[data-cow-theme="occult"] .login-input-wrap .fa-lock {
    color: #a1a1aa !important;
}

html[data-cow-theme="occult"] #login-toggle-pwd,
html[data-cow-theme="occult"] button[onclick="togglePwdVisibility()"] {
    color: #a1a1aa !important;
}

html[data-cow-theme="occult"] #login-toggle-pwd:hover,
html[data-cow-theme="occult"] button[onclick="togglePwdVisibility()"]:hover {
    color: #18181b !important;
}

/* 曜石深黑登录按键 */
html[data-cow-theme="occult"] #login-btn,
html[data-cow-theme="occult"] .login-submit-btn {
    background: #18181b !important;
    color: #f4f4f5 !important;
    border: 1px solid #27272a !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.18em !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html[data-cow-theme="occult"] #login-btn:hover,
html[data-cow-theme="occult"] .login-submit-btn:hover {
    background: #27272a !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18) !important;
}

html[data-cow-theme="occult"] #login-btn:active,
html[data-cow-theme="occult"] .login-submit-btn:active {
    transform: translateY(0.5px);
}

/* 错误提示条 */
html[data-cow-theme="occult"] #login-error,
html[data-cow-theme="occult"] #async-error {
    background: rgba(220, 38, 38, 0.06) !important;
    border: 1px solid rgba(220, 38, 38, 0.16) !important;
    color: #dc2626 !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    letter-spacing: 0.03em;
}

/* 移动端细化适配 */
@media (max-width: 768px) {
    html[data-cow-theme="occult"] #view-chat::before {
        font-size: 11px;
        line-height: 2.2;
        letter-spacing: 9px;
        inset: -10%;
    }

    html[data-cow-theme="occult"] #chat-input {
        font-size: 16px !important;
    }

    html[data-cow-theme="occult"] .bot-message-group > div > .msg-content {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03), inset 2px 0 0 #27272a !important;
    }

    html[data-cow-theme="occult"] .login-glass-card {
        padding: 28px 22px 24px !important;
    }

    html[data-cow-theme="occult"] .login-backdrop-decorations::before {
        font-size: 11px;
        line-height: 2.2;
        letter-spacing: 9px;
        inset: -10%;
    }
}
/* ====================================================================
 * OCCULT 控制台各视图按钮与文字可读性强化 (高对比黑白灰极简)
 * ================================================================== */
html[data-cow-theme="occult"] .analytics-stat-card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

html[data-cow-theme="occult"] .analytics-stat-card span[data-i18n] {
    color: #52525b !important;
    font-weight: 600 !important;
}

html[data-cow-theme="occult"] #stat-total-sessions,
html[data-cow-theme="occult"] #stat-total-messages,
html[data-cow-theme="occult"] #stat-today-messages,
html[data-cow-theme="occult"] #stat-avg-duration {
    color: #18181b !important;
}

/* 次级操作按钮与刷新按钮：深黑灰文字与清晰轮廓，杜绝发灰发虚 */
html[data-cow-theme="occult"] .analytics-refresh-btn,
html[data-cow-theme="occult"] button[onclick="exitChannelReadonlyMode()"],
html[data-cow-theme="occult"] .confirm-btn-cancel,
html[data-cow-theme="occult"] #knowledge-dialog-cancel,
html[data-cow-theme="occult"] button[onclick="closeMcpEditor()"],
html[data-cow-theme="occult"] button[onclick="closeAddChannelPanel()"],
html[data-cow-theme="occult"] .task-action-btn,
html[data-cow-theme="occult"] .mcp-prompt-cancel {
    background: #ffffff !important;
    color: #27272a !important;
    border: 1px solid rgba(0, 0, 0, 0.16) !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

html[data-cow-theme="occult"] .analytics-refresh-btn:hover,
html[data-cow-theme="occult"] button[onclick="exitChannelReadonlyMode()"]:hover,
html[data-cow-theme="occult"] .confirm-btn-cancel:hover,
html[data-cow-theme="occult"] #knowledge-dialog-cancel:hover,
html[data-cow-theme="occult"] button[onclick="closeMcpEditor()"]:hover,
html[data-cow-theme="occult"] button[onclick="closeAddChannelPanel()"]:hover {
    background: #f4f5f7 !important;
    color: #09090b !important;
    border-color: rgba(0, 0, 0, 0.3) !important;
}

/* 主提交按钮（保存配置、添加、保存服务、确定等）：深邃黑金质感，纯白字纯正高对比 */
html[data-cow-theme="occult"] #cfg-model-save,
html[data-cow-theme="occult"] #cfg-agent-save,
html[data-cow-theme="occult"] #cfg-password-save,
html[data-cow-theme="occult"] #mcp-add-btn,
html[data-cow-theme="occult"] button[onclick="saveMcpServer()"],
html[data-cow-theme="occult"] #knowledge-dialog-submit,
html[data-cow-theme="occult"] #add-channel-btn,
html[data-cow-theme="occult"] .mcp-prompt-submit,
html[data-cow-theme="occult"] #vendor-modal-save,
html[data-cow-theme="occult"] .confirm-btn-ok {
    background: #18181b !important;
    color: #ffffff !important;
    border: 1px solid #18181b !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

html[data-cow-theme="occult"] #cfg-model-save:hover,
html[data-cow-theme="occult"] #cfg-agent-save:hover,
html[data-cow-theme="occult"] #cfg-password-save:hover,
html[data-cow-theme="occult"] #mcp-add-btn:hover,
html[data-cow-theme="occult"] button[onclick="saveMcpServer()"]:hover,
html[data-cow-theme="occult"] #knowledge-dialog-submit:hover,
html[data-cow-theme="occult"] #add-channel-btn:hover,
html[data-cow-theme="occult"] .mcp-prompt-submit:hover,
html[data-cow-theme="occult"] #vendor-modal-save:hover,
html[data-cow-theme="occult"] .confirm-btn-ok:hover {
    background: #27272a !important;
    border-color: #27272a !important;
    color: #ffffff !important;
}

/* 选项卡 Tab 切换按钮清晰度 */
html[data-cow-theme="occult"] .config-tab-btn,
html[data-cow-theme="occult"] .memory-tab-btn,
html[data-cow-theme="occult"] .knowledge-tab-btn {
    color: #52525b !important;
    font-weight: 500 !important;
}

html[data-cow-theme="occult"] .config-tab-btn.active,
html[data-cow-theme="occult"] .memory-tab-btn.active,
html[data-cow-theme="occult"] .knowledge-tab-btn.active {
    color: #09090b !important;
    font-weight: 600 !important;
    border-bottom-color: #18181b !important;
}

/* ====================================================================
 * OCCULT Webhook 模块与模态框定制
 * ================================================================== */
html[data-cow-theme="occult"] #webhook-test-submit-btn,
html[data-cow-theme="occult"] button[onclick="saveWebhookEndpoint()"] {
    background: #18181b !important;
    color: #ffffff !important;
    border: 1px solid #18181b !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

html[data-cow-theme="occult"] #webhook-test-submit-btn:hover,
html[data-cow-theme="occult"] button[onclick="saveWebhookEndpoint()"]:hover {
    background: #27272a !important;
    border-color: #27272a !important;
}

html[data-cow-theme="occult"] #webhook-test-modal-overlay .bg-white,
html[data-cow-theme="occult"] #webhook-runs-modal-overlay .bg-white,
html[data-cow-theme="occult"] #webhook-confirm-modal-overlay .bg-white,
html[data-cow-theme="occult"] #webhook-secret-modal-overlay .bg-white {
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.12) !important;
}

.dark html[data-cow-theme="occult"] #webhook-test-modal-overlay .dark\:bg-\[\#1A1A1A\],
.dark html[data-cow-theme="occult"] #webhook-runs-modal-overlay .dark\:bg-\[\#1A1A1A\],
.dark html[data-cow-theme="occult"] #webhook-confirm-modal-overlay .dark\:bg-\[\#1A1A1A\],
.dark html[data-cow-theme="occult"] #webhook-secret-modal-overlay .dark\:bg-\[\#1A1A1A\] {
    background: #161618 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5) !important;
}

html[data-cow-theme="occult"] .webhook-step-item,
html[data-cow-theme="occult"] .webhook-note-card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
}

.dark html[data-cow-theme="occult"] .webhook-step-item,
.dark html[data-cow-theme="occult"] .webhook-note-card {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    box-shadow: none !important;
}

html[data-cow-theme="occult"] .webhook-step-num {
    background: #18181b !important;
    color: #ffffff !important;
}