/* ═══ B平台加载动画适配（自动注入）═══ */
.flex.items-center.justify-center.size-6 { opacity: 1 !important; }
.flex.items-center.justify-center.size-6 > .flex.gap-2 { display: none !important; }
.is-assistant.w-fit { width: 100% !important; }
.is-assistant > .border.border-muted:has(.flex.items-center.justify-center.size-6) {
  width: 100% !important; background: transparent !important;
  border: none !important; padding: 0 !important;
}
.is-assistant .space-y-3:has(.flex.items-center.justify-center.size-6) {
  display: flex; justify-content: center; width: 100%;
}

/* ═══ B平台表格修正（自动注入）═══ */
.rili-markdown-renderer table { display:table!important; table-layout:auto!important; width:100%!important; border-collapse:collapse!important; }
.rili-markdown-renderer table caption { display:table-caption!important; caption-side:top!important; text-align:center!important; padding:8px!important; }
.rili-markdown-renderer thead { display:table-header-group!important; }
.rili-markdown-renderer tbody { display:table-row-group!important; }
.rili-markdown-renderer tr { display:table-row!important; }
.rili-markdown-renderer th, .rili-markdown-renderer td { display:table-cell!important; }

/* ═══ B平台按钮组保护（自动注入 — 防止按钮消失）═══
   原理：B平台消息操作按钮结构为：
   .flex.items-center.gap-1.ml-auto (hover显隐包装)
     └── .bg-muted.rounded.flex.p-0.5 (按钮组容器)
           └── button.rounded-full.size-7 (单个按钮)
   以下规则使用高specificity + !important确保按钮
   不被任何转换后/透传的CSS规则意外隐藏
   ═══════════════════════════════════════════════ */
/* 按钮组容器保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5,
.is-user .bg-muted.rounded.flex.p-0\.5,
.is-assistant .bg-muted.rounded.flex.p-0\.5 {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  clip: auto !important;
  clip-path: none !important;
}
/* 单个按钮保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5 > button,
.is-user .bg-muted.rounded.flex.p-0\.5 > button,
.is-assistant .bg-muted.rounded.flex.p-0\.5 > button {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  clip: auto !important;
  clip-path: none !important;
}
/* hover显隐包装层保护 — 仅保留B平台原生的opacity过渡 */
.flex.items-center.gap-1.ml-auto.md\:opacity-0.group-hover\:opacity-100 {
  visibility: visible !important;
  display: flex !important;
  pointer-events: auto !important;
  overflow: visible !important;
}
/* 操作行保护 */
.flex.w-full.items-center.justify-between.gap-2.px-2 {
  display: flex !important;
  visibility: visible !important;
  overflow: visible !important;
}

/* ============================================
   沈砚清·纯爱向欢乐卡 专属聊天框美化
   设计主题：清冽如刃，微暖于心
   核心原则：极简白底 + 深色锐利文字，绝对可读性优先
   ============================================ */

/* 1. 隐藏顶部颜色装饰条 (固定代码) */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 2. 统一聊天框美化：清冷磨砂玻璃质感
   ★ 仅保留助手（.is-assistant）气泡样式，用户气泡恢复默认 */
.is-assistant > .border.border-muted {
    background: #FFFFFF !important; /* 纯白基底，保证最高可读性 */
    border: 1px solid #E0E4E8 !important; /* 极淡的冷灰边框，如她性格的棱角 */
    border-radius: 12px !important; /* 微圆角，保留一丝柔和 */
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.05) !important;
    position: relative !important;
    overflow: hidden !important; /* 确保伪元素不超出圆角 */
    isolation: isolate !important;
    transition: all 0.2s ease !important;
}

/* 助手气泡的锐利小尾巴 (模拟她说话时微挑的眉峰) */
.is-assistant > .border.border-muted::before {
    content: '';
    position: absolute;
    top: 12px;
    left: -6px;
    width: 12px;
    height: 12px;
    background: #FFFFFF !important;
    border-left: 1px solid #E0E4E8 !important;
    border-bottom: 1px solid #E0E4E8 !important;
    transform: rotate(45deg);
    border-radius: 0 0 0 3px;
    z-index: 0;
}

/* 3. 主要文本内容美化：如刀锋般清晰锐利 (全局，适用于所有消息) */
.rili-markdown-renderer {
    color: #1A1E26 !important; /* 极深的墨色，对比度拉满 */
    font-family: 'Inter', 'SF Pro Text', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
    letter-spacing: 0.01em !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
    text-shadow: none !important; /* 绝对禁止使用文字阴影，确保清晰 */
}

/* 加粗文本：模拟她不容置疑的语气 */
.rili-markdown-renderer strong,
.rili-markdown-renderer b {
    color: #0B0D11 !important;
    font-weight: 700 !important;
}

/* 链接：用她标志性的冷红色点缀（她耳根发红前的预警色） */
.rili-markdown-renderer a {
    color: #C0504D !important;
    text-decoration: none !important;
    border-bottom: 1px dashed #C0504D !important;
    font-weight: 500 !important;
}

/* 4. 底部附加元素：克制、清晰、存在感低 */
/* 操作按钮 (复制, 编辑等) */
.bg-muted.rounded.flex.p-0\.5 > button.rounded-full.size-7{
    color: #5A6273 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

/* 模型名称文本 */
.flex.items-center.gap-2.text-xs.font-mono.text-muted-foreground {
    color: #8E95A3 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

/* 5. 默认加载动画隐藏 (使用您提供的固定代码) */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}

/* 6. 自定义加载动画：砚池墨韵 (内嵌SVG SMIL动画，确保CSP兼容) */
.flex.items-center.justify-center.size-6 {
    position: relative !important;
    width: 60px !important; /* 为动画提供足够空间 */
    height: 24px !important;
    margin: 8px auto !important;
}

/* 动画伪元素：一滴正在下坠研磨的墨滴 */
.flex.items-center.justify-center.size-6::before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 24' width='60' height='24'%3E%3Cg fill='none' stroke='%23A0A8B5' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='16' r='3' fill='%23A0A8B5'%3E%3Canimate attributeName='cy' values='16;4;16' dur='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1.5;3' dur='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.7;0.2;0.7' dur='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='30' cy='16' r='3' fill='%23A0A8B5'%3E%3Canimate attributeName='cy' values='16;4;16' dur='1.2s' begin='0.15s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1.5;3' dur='1.2s' begin='0.15s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.7;0.2;0.7' dur='1.2s' begin='0.15s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='48' cy='16' r='3' fill='%23A0A8B5'%3E%3Canimate attributeName='cy' values='16;4;16' dur='1.2s' begin='0.3s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1.5;3' dur='1.2s' begin='0.3s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.7;0.2;0.7' dur='1.2s' begin='0.3s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}

.flex.items-center.justify-center.size-6::after {
    display: none !important;
}

/* 7. 适配移动端 (仅保留助手美化，用户保持默认) */
@media (max-width: 480px) {
    .is-assistant > .border.border-muted {
        border-radius: 8px !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    }
    
    .rili-markdown-renderer {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }
    
    .flex.items-center.justify-center.size-6 {
        width: 48px !important;
        height: 20px !important;
    }
}

/* 8. 低动效模式适配：降低动画速度但不完全停止 (除非用户要求) */
@media (prefers-reduced-motion: reduce) {
    .flex.items-center.justify-center.size-6::before {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 24' width='60' height='24'%3E%3Cg fill='%23E0E4E8'%3E%3Ccircle cx='30' cy='12' r='3'%3E%3Canimate attributeName='opacity' values='0.8;0.3;0.8' dur='3s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
    }
}

/* ============================================
   沈砚清·世界观状态栏专属美化
   设计主题：清冽如刃，微暖于心
   核心原则：极简白底 + 深色锐利文字，绝对可读性优先
   标签容器：[status]
   ============================================ */

/* --- 1. 容器基础设定 --- */
ai[status] {
    --ink: #1A1E26;       /* 墨色：主文本 */
    --blade: #8E95A3;     /* 刃灰：辅助文本、边框 */
    --blush: #C0504D;     /* 耳红：强调色、链接、高亮 */
    --snow: #F9FAFB;      /* 雪白：卡片背景 */
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.04); /* 极淡阴影 */
    --radius: 8px;        /* 统一微圆角 */

    display: block;
    max-width: 100%;
    margin: 0 auto;
    font-family: 'Inter', 'SF Pro Text', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink);
    background: transparent; /* 继承聊天框背景 */
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

/* --- 2. 头部信息 --- */
ai[status] header {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    padding: 8px 16px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--blade);
    background: var(--snow);
    border-radius: var(--radius) var(--radius) 0 0;
}
ai[status] header t {
    font-weight: 700;
    color: var(--ink);
    font-size: 15px;
    letter-spacing: -0.01em;
}
ai[status] header d {
    color: var(--blade);
    font-size: 13px;
}

/* --- 3. 折叠面板重构 --- */
ai[status] details {
    display: block;
    margin: 4px 0;
    background: var(--snow);
    border: 1px solid #E0E4E8;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: all 0.2s ease;
}
ai[status] details[open] {
    border-color: #CBD0D6;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
}

/* 摘要设计：宽版块状按钮 */
ai[status] summary {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    font-weight: 600;
    color: var(--ink);
    list-style: none; /* 移除默认三角 */
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: background 0.15s ease;
    font-size: 14px;
    letter-spacing: 0.01em;
    position: relative;
}
ai[status] summary::-webkit-details-marker {
    display: none; /* 移除Webkit默认三角 */
}
ai[status] summary:hover {
    background: #FFFFFF;
}

/* 自定义展开标记：左耳银钉 */
ai[status] summary::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--blade);
    margin-right: 12px;
    transition: all 0.25s ease;
    border-radius: 1px;
    transform: rotate(45deg);
    flex-shrink: 0;
}
ai[status] details[open] > summary::before {
    background: var(--blush);
    transform: rotate(225deg);
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(192,80,77,0.2);
}

/* 折叠内容区过渡 */
ai[status] details > :not(summary) {
    padding: 4px 16px 12px;
    border-top: 1px solid #F0F2F5;
}
ai[status] details[open] > :not(summary) {
    animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
    from { opacity: 0.7; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- 4. 内容排版（字段、数据行）--- */
ai[status] f,
ai[status] d {
    display: block;
    padding: 3px 0;
    color: var(--ink);
    font-size: 13px;
    line-height: 1.5;
}

/* 带标签的字段：将 [t] 属性值作为前置标签 */
ai[status] f[t]::before {
    content: attr(t) "：";
    font-weight: 600;
    color: var(--blade);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: inline-block;
    margin-right: 4px;
}

/* 数据行中的强调文本 */
ai[status] f b,
ai[status] d b {
    color: var(--ink);
    font-weight: 650;
}

/* --- 5. 特定模块样式 --- */

/* 别扭日记 */
ai[status] details.diary {
    border-left: 2px solid var(--blush);
    background: #FFFBFA;
}
ai[status] details.diary summary {
    color: var(--blush);
}
ai[status] entry {
    display: block;
    padding: 10px 0;
    border-bottom: 1px dashed #EBD6D5;
    position: relative;
}
ai[status] entry:last-child {
    border-bottom: none;
}
ai[status] entry t {
    display: block;
    font-size: 12px;
    color: var(--blade);
    margin-bottom: 6px;
}
ai[status] entry q {
    display: block;
    font-style: italic;
    color: #4A3B3B;
    padding-left: 16px;
    position: relative;
    quotes: "“" "”" "‘" "’";
}
ai[status] entry q::before {
    content: "“";
    position: absolute;
    left: 0;
    top: -2px;
    font-size: 24px;
    color: var(--blush);
    opacity: 0.5;
    font-style: normal;
    line-height: 1;
}

/* Tsundere指数条 */
ai[status] gauge {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0;
}
ai[status] gauge label {
    font-size: 12px;
    font-weight: 600;
    color: var(--blade);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}
ai[status] bar {
    display: block;
    flex: 1;
    height: 6px;
    background: #EDEEF0;
    border-radius: 3px;
    overflow: hidden;
}
ai[status] fill {
    display: block;
    height: 100%;
    background: var(--blush);
    border-radius: 3px;
    transition: width 0.6s ease;
    width: 0%; /* 默认，由内联style覆盖 */
}

/* 手机讯息模拟 */
ai[status] chat {
    display: block;
    margin: 8px 0;
    padding: 8px 12px;
    background: #FFFFFF;
    border: 1px solid #F0F2F5;
    border-radius: 6px;
}
ai[status] chat[t]::before {
    content: attr(t);
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: var(--blush);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #F0F2F5;
}
ai[status] chat d {
    padding: 4px 0;
    font-size: 13px;
    position: relative;
    padding-left: 16px;
}
ai[status] chat d::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    background: var(--blade);
    border-radius: 50%;
    opacity: 0.5;
}

/* 行动推荐悬停效果 */
ai[status] details:has(summary:contains("行动推荐")) d {
    transition: transform 0.15s ease, color 0.15s ease;
    cursor: pointer;
    padding-left: 20px;
    position: relative;
}
ai[status] details:has(summary:contains("行动推荐")) d::before {
    content: attr(data-n); /* 数字需通过其他方式映射，或保留在文本中 */
    position: absolute;
    left: 4px;
    font-weight: 700;
    color: var(--blush);
    font-size: 12px;
}
ai[status] details:has(summary:contains("行动推荐")) d:hover {
    color: var(--blush);
    transform: translateX(4px);
}

/* 通话记录 */
ai[status] call {
    display: block;
    padding: 4px 8px;
    font-size: 12px;
    color: var(--blade);
    background: #F9FAFB;
    border-radius: 4px;
    margin: 4px 0;
    font-family: monospace;
}

/* --- 6. 响应式微调 --- */
@media (max-width: 480px) {
    ai[status] {
        font-size: 13px;
    }
    ai[status] summary {
        font-size: 13px;
        padding: 10px 12px;
    }
    ai[status] details > :not(summary) {
        padding: 4px 12px 10px;
    }
    ai[status] f,
    ai[status] d {
        font-size: 12px;
    }
    ai[status] header {
        padding: 6px 12px;
    }
}