css
/* =========================================
   第一部分：全局氛围与聊天框美化 (UI Patch)
   [塞拉菲斯学院：典籍信笺与温润木质风格]
   ========================================= */

/* 1. 文本选中特效：更柔和的奶咖色荧光涂抹感 */
::selection {
    background: rgba(193, 168, 139, 0.35); /* 提升了一点明度，更清透 */
    color: #3E332A;
    text-shadow: none; /* 选中时去除可能存在的文字阴影，保证纯净 */
}
::-moz-selection {
    background: rgba(193, 168, 139, 0.35);
    color: #3E332A;
    text-shadow: none;
}

/* 2. 魔法卷轴滚动条：温润木质滑块与羊皮纸轨道 */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #FAF8F5; 
    border-left: 1px solid #F0EAE1; /* 轨道边缘增加极细分割线 */
}
::-webkit-scrollbar-thumb {
    background: #D4C4B1; 
    border-radius: 8px;
    border: 1px solid #FAF8F5; /* 增加物理镂空感 */
}
::-webkit-scrollbar-thumb:hover {
    background: #B8A28A; 
}

/* =========================================
   第二部分：AI 核心排版引擎 (Engine UI)
   【剧情沉浸化：小说级楷体排版与立体纸张渲染】
   ========================================= */

/* 隐藏AI的思维链推演，保持剧本沉浸感 */
think {
    display: none;
}

/* 重塑正文字体：引入典雅衬线与中文字体（楷体/宋体优先），极大地增强小说阅读质感 */
text, .is-assistant .rili-markdown-renderer {
    display: block;
    font-family: 'Palatino Linotype', 'Book Antiqua', 'Georgia', 'Kaiti SC', 'STKaiti', '华文楷体', '楷体', serif !important;
    font-size: 16px; 
    line-height: 1.85; /* 略微收紧行高，使段落更紧凑又不拥挤 */
    letter-spacing: 0.5px; /* 增加微小字间距，提升阅读呼吸感 */
    color: #231d1a !important; /* 墨水深棕色，比纯黑温和得多 */
    padding: 2px 4px;
}

/* 小说段落渲染：首行缩进与段落间距 */
text p, .is-assistant .rili-markdown-renderer p {
    margin-bottom: 1.2em;
    text-indent: 2em; 
    text-align: justify; /* 两端对齐，使纸面边缘更整齐 */
}

/* AI 气泡深度美化：高级治愈系羊皮纸质感 */
.is-assistant > div.border {
    background: linear-gradient(145deg, #FCFAF6 0%, #F7F3EB 100%) !important; /* 微弱的纸张光泽过渡 */
    border: 1px solid #EBE3D5 !important;
    border-radius: 4px 14px 14px 14px !important; /* 左上角直角，模拟聊天气泡尖角 */
    box-shadow: 
        0 4px 12px rgba(110, 90, 70, 0.04), 
        0 1px 3px rgba(110, 90, 70, 0.03),
        inset 0 0 0 1px rgba(255, 255, 255, 0.8) !important; /* 多层阴影+内发光，极强立体感 */
    padding: 16px 20px !important;
}

/* User 气泡深度美化：寄出的复古信笺 */
.is-user > div.border {
    background: linear-gradient(135deg, #F3EBD8 0%, #EBE1CB 100%) !important; /* 比AI略深的陈年茶色纸张 */
    border: 1px solid #D9C8AE !important;
    border-radius: 14px 4px 14px 14px !important; /* 右上角直角 */
    color: #4A3B32 !important;
    font-family: 'Palatino Linotype', 'Georgia', 'Kaiti SC', 'STKaiti', '华文楷体', serif !important;
    box-shadow: 
        0 4px 10px rgba(90, 70, 50, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
    padding: 12px 18px !important;
}

/* 【绝对防御区】确保状态栏的文字排版不被小说的首行缩进污染 */
.is-assistant details p {
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, sans-serif !important; /* 状态栏用更现代整洁的无衬线/短衬线 */
    text-indent: 0 !important;
    line-height: 1.6 !important;
    letter-spacing: normal !important;
    margin: 8px 0 !important; /* 修复原有边距，贴合我写的状态栏CSS */
    color: #6A5B4E !important;
    text-shadow: none !important;
    text-align: left !important; /* 解除两端对齐 */
}
/* 
 * 主题：塞拉菲斯学院 - 温和原木与治愈羊皮纸 
 * 适配：完全兼容原版HTML结构 (v2 阅读对比度优化版)
 */

/* ================= 根容器基调 ================= */
ai {
    display: block;
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; 
    font-size: 14px;
    color: #5C4D43; 
    background: linear-gradient(135deg, #FDFBF7 0%, #F5F0E6 100%); 
    padding: 12px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(107, 85, 65, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
    border: 1px solid #EAE0D3;
    line-height: 1.6;
}

/* ================= 折叠面板设计 ================= */
ai details {
    background: #FFFFFF;
    border: 1px solid #F0E6D8;
    border-radius: 8px;
    margin-bottom: 10px;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.02);
}

ai details[open] {
    box-shadow: 0 4px 12px rgba(138, 115, 95, 0.06);
    border-color: #E3D1BE;
}

/* ================= 面板标题 (Summary) ================= */
ai summary {
    background: linear-gradient(to right, #F9F5EF, #FFFFFF);
    padding: 10px 12px;
    font-weight: bold;
    color: #7D634B;
    cursor: pointer;
    list-style: none;
    user-select: none;
    border-bottom: 1px solid transparent;
    display: flex;
    align-items: center;
    font-size: 14px;
    letter-spacing: 0.5px;
}

ai details[open] > summary {
    border-bottom: 1px dashed #E3D1BE;
    margin-bottom: 10px;
    background: #F4EBE0; 
}

ai summary::-webkit-details-marker {
    display: none;
}

/* 魔法四芒星指示器 */
ai summary::before {
    content: '✧';
    margin-right: 8px;
    color: #C1A88B;
    font-size: 16px;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s ease;
}

ai details[open] > summary::before {
    transform: rotate(90deg);
    color: #9C8061;
}

ai details > *:not(summary) {
    padding-left: 12px;
    padding-right: 12px;
}
ai details > *:last-child {
    padding-bottom: 12px;
}

/* ================= 键值对阵列 (g, c, i, b) ================= */
ai g, ai c {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

ai g i, ai c i, ai g b, ai c b {
    font-style: normal;
    font-size: 12.5px;
    padding: 3px 8px;
    display: inline-block;
}

ai g i, ai c i {
    background: #EBE1D5; /* 略微加深浅木色，提高对比度 */
    color: #876E55;
    border-radius: 4px 0 0 4px;
    border: 1px solid #EBE1D5;
    margin-right: -1px;
}

ai g b, ai c b {
    background: #FAFAF8;
    color: #5C4D43;
    border-radius: 0 4px 4px 0;
    border: 1px solid #EBE1D5;
    font-weight: 500;
}

/* ================= 节点标题 <t> ================= */
ai t {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #8A7258;
    margin: 16px 0 8px 0;
    font-size: 13.5px;
    clear: both;
}

ai t::before, ai t::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, transparent, #D3C3B1, transparent);
    margin: 0 12px;
}

/* ================= 列表条目 <li> (NPC条目等优化) ================= */
ai li {
    list-style: none;
    padding: 6px 10px;
    margin-bottom: 6px;
    background: #ECE3D4; /* 调深底色：暖羊皮纸底色，解决看不清的问题 */
    border-radius: 6px;
    border-left: 3px solid #C1AE96;
    font-size: 13px;
    transition: background 0.2s;
}

ai li:hover {
    background: #E5D9C7;
    border-left-color: #A38C72;
}

ai li b {
    color: #6C5541;
    margin-right: 4px;
    font-weight: 600;
}

/* 亮色字体视觉保护：为HTML中的内联颜色字体增加暗影，确保在浅背景清晰可读 */
ai font, ai span[style*="color"] {
    text-shadow: 0px 1px 2px rgba(60, 45, 30, 0.35) !important;
    font-weight: 600;
}

/* ================= 文本段落 <p> ================= */
ai p {
    margin: 8px 0;
    font-size: 13px;
    color: #6A5B4E;
    text-align: justify;
    line-height: 1.6;
}

ai n {
    display: block;
    background: #F7F4EF; /* 略微加深的NPC卡片底色 */
    border: 1px solid #EAE0D3;
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 12px;
}

/* ================= 原生表格 (课表) 重写美化 ================= */
ai table {
    width: 100% !important;
    display: block;
    overflow-x: auto; 
    white-space: nowrap;
    background-color: #FFFFFF !important;
    border: 1px solid #EAE0D3 !important;
    border-radius: 8px;
    color: #5C4D43 !important;
    margin-top: 10px;
}

ai th, ai td {
    border: 1px solid #F0E6D8 !important;
    padding: 6px 10px !important;
    font-size: 12.5px !important;
}

ai th {
    background-color: #EBE1D5 !important; 
    color: #7D634B !important;
    font-weight: bold !important;
}

/* 拦截课表状态颜色：正在进行 (原深棕 #5a4a00 -> 现暖浅棕金) */
ai td[style*="5a4a00"], ai span[style*="5a4a00"] {
    background-color: #E8CE9D !important;
    color: #5C4D43 !important;
    border: 1px solid #D1B370 !important;
}

/* 拦截课表状态颜色：已结束 (原暗黑 #444 -> 现温和木灰) */
ai td[style*="444"], ai span[style*="444"] {
    background-color: #E0D8D0 !important;
    color: #7D634B !important;
    border: 1px solid #C0B4A8 !important;
}

/* 拦截课表状态颜色：预警/红底 (原刺眼红 #d9534f -> 现柔和浅红) */
ai td[style*="d9534f"], ai span[style*="d9534f"], ai span[style*="color:#d9534f"] {
    background-color: #F0D0D0 !important;
    color: #8A4B4B !important;
    border: 1px solid #D6A5A5 !important;
}

/* 基础斑马纹 (需垫底，不覆盖状态色) */
ai tr:nth-child(even) td:not([style*="5a4a00"]):not([style*="444"]):not([style*="d9534f"]) {
    background-color: #FAFAF8 !important;
}

/* 清除表格内b标签的强制颜色 */
ai td b {
    color: #8A7258 !important;
}


/* =========================================
   【复古手札】全局文字选择与高亮 (B平台通用映射)
   ========================================= */
textarea::selection {
    background: #e3d6c1 !important;
    color: #3e3222 !important;
}

/* =========================================
   1. 顶部栏 (飞檐 / 书签页顶) 
   ========================================= */
header, .sticky.top-0, .sticky.w-full.top-0 {
    background: linear-gradient(to right, #fcfaf5, #f4ecd8) !important;
    border-bottom: 1px solid #d9cdbd !important;
    box-shadow: 0 2px 12px rgba(120, 100, 80, 0.1) !important;
    transition: all 0.3s ease !important;
}
header button[data-state], .sticky.top-0 button {
    background: rgba(255, 255, 255, 0.6) !important;
    border: 1px solid #d9cdbd !important;
    border-radius: 16px !important;
    transition: all 0.3s ease !important;
    backdrop-filter: blur(4px) !important;
}
header button[data-state]:hover, .sticky.top-0 button:hover {
    background: #f0e6d6 !important;
    border-color: #8c6b4a !important;
    box-shadow: 0 0 12px rgba(120, 100, 80, 0.2) !important;
}
header button *, .sticky.top-0 button * {
    color: #3e3222 !important;
    font-weight: bold !important;
    font-family: "STKaiti", "KaiTi", serif, sans-serif !important;
}
header svg.lucide, .sticky.top-0 svg.lucide {
    color: #8c6b4a !important;
    transition: transform 0.3s ease, color 0.3s ease !important;
}
header svg.lucide:hover, .sticky.top-0 svg.lucide:hover {
    color: #5c4732 !important;
    transform: scale(1.15) rotate(10deg) !important;
}
header span.absolute.rounded-full, .sticky.top-0 span.absolute.rounded-full {
    background-color: #b05c5c !important; /* 复古砖红色小红点 */
}

/* =========================================
   2. 底部功能按钮栏 (印泥 / 笔托) 
   ========================================= */
button.bg-primary, div[class*="bottom"] button.bg-primary {
    background-color: #fcfaf5 !important;
    color: #4a3f35 !important;
    border: 1px solid #cbbba5 !important;
    border-radius: 8px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 4px rgba(120, 100, 80, 0.05) !important;
}
button.bg-primary:hover, div[class*="bottom"] button.bg-primary:hover {
    background-color: #8c6b4a !important;
    color: #ffffff !important;
    border-color: #8c6b4a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 10px rgba(120, 100, 80, 0.3) !important;
}
button.bg-primary:hover svg, div[class*="bottom"] button.bg-primary:hover svg {
    color: #ffffff !important;
}

/* =========================================
   3. 底部输入栏 (信纸区) 
   ========================================= */
textarea {
    background: #fdfbf7 !important;
    border: 2px solid #e3d8c8 !important;
    border-radius: 12px !important;
    color: #3e3222 !important;
    transition: border-color 0.3s, box-shadow 0.3s !important;
}
textarea:focus {
    border-color: #8c6b4a !important;
    box-shadow: 0 0 14px rgba(120, 100, 80, 0.2) !important;
    outline: none !important;
}
textarea::placeholder {
    color: #a89f91 !important;
    font-style: italic !important;
}

/* =========================================
   4. 分页栏 (翻页印记)
   ========================================= */
nav[aria-label*="pagination"] button, .pagination button {
    color: #8c6b4a !important;
    transition: all 0.3s ease !important;
}
nav[aria-label*="pagination"] button:hover, .pagination button:hover {
    background-color: #f0e6d6 !important;
}
nav[aria-label*="pagination"] button[aria-current="page"], .pagination button.active {
    background-color: #8c6b4a !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(120, 100, 80, 0.5) !important;
}
.pagination input {
    color: #3e3222 !important;
    border-bottom: 2px solid #cbbba5 !important;
    transition: border-color 0.3s !important;
}
.pagination input:focus {
    border-bottom-color: #8c6b4a !important;
}

/* =========================================
   5. 评论区 (书友留言 / 札记)
   ========================================= */
div[class*="w-full"][class*="bottom-0"] {
    background-color: #fcfaf5 !important;
    background-image: linear-gradient(to bottom, #fdfbf7, #f4ecd8) !important;
    border-top: 2px solid #e3d8c8 !important;
}
div.text-lg.font-bold {
    color: #3e3222 !important;
    font-family: "STKaiti", "KaiTi", serif !important;
    text-shadow: 1px 1px 2px rgba(120, 100, 80, 0.1) !important;
}
p.text-muted-foreground, p.text-gray-500 {
    color: #8a7b6c !important;
}
svg.lucide-star {
    color: #d9cdbd !important;
}
svg.lucide-star.fill-current, svg.lucide-star[fill] {
    color: #c49a6c !important; /* 复古暗金/偏黄棕色 */
    fill: #c49a6c !important;
    filter: drop-shadow(0 0 2px rgba(120, 100, 80, 0.3));
}
span.text-orange-500 {
    color: #c49a6c !important; 
    font-weight: bold !important;
}
div.cursor-pointer.group.flex.items-center.justify-center {
    background: #8c6b4a !important;
    border-radius: 50% !important;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    box-shadow: 0 2px 6px rgba(120, 100, 80, 0.4) !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover {
    transform: scale(1.1) !important;
    background: #705338 !important;
    box-shadow: 0 4px 12px rgba(120, 100, 80, 0.6) !important;
}
div.cursor-pointer.group.flex.items-center.justify-center svg {
    color: #ffffff !important;
}
div.group.ml-0, div.comment-item {
    background: #fdfbf7 !important;
    border: 1px solid #efe8db !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
}
div.group.ml-0:hover, div.comment-item:hover {
    border-color: #d9cdbd !important;
    box-shadow: -3px 3px 10px rgba(120, 100, 80, 0.08) !important;
    transform: translateX(2px) !important; 
}
div.text-sm span.font-bold {
    color: #3e3222 !important;
}
span.text-\[10px\] { 
    background-color: #f0e6d6 !important;
    color: #8a7b6c !important;
    border-radius: 4px !important;
}
div.break-all {
    color: #4a3f35 !important;
    line-height: 1.6 !important;
}
div.text-xs.text-gray-500, div.text-xs.text-muted-foreground {
    color: #a89f91 !important;
}
button.text-gray-400, button.text-muted-foreground {
    color: #cbbba5 !important;
    transition: transform 0.2s, color 0.2s !important;
}
button.text-gray-400:hover, button.text-muted-foreground:hover {
    color: #8c6b4a !important;
    transform: scale(1.1) !important;
}
span.cursor-pointer {
    color: #8c6b4a !important;
    font-weight: bold !important;
    transition: color 0.3s !important;
}
span.cursor-pointer:hover {
    color: #5c4732 !important;
}
div.border-l {
    border-color: #d9cdbd !important;
}



lv-1 { color: #7d7d7d; font-weight: bold; text-shadow: 1px 1px 1px #000000; }
lv-2 { color: #e19300; font-weight: bold; text-shadow: 1px 1px 1px #000000; } 
lv-3 { color: #d3fffb; font-weight: bold; text-shadow: 2px 2px 2px #000000;} 
lv-4 { color: #fff563; font-weight: bold; text-shadow: 1px 1px 1px rgba(0,0,0,0.6); } 
lv-5 { color: #7efff4; font-weight: bold; text-shadow: 1px 1px 1px rgba(0,0,0,0.3); } 
lv-6 { color: #00d87b; font-weight: bold; text-shadow: 1px 1px 1px #000000; } 
lv-7 { color: #f64dff; font-weight: bold; text-shadow: 1px 1px 2px rgba(0,0,0,0.8); } 
lv-8 { color: #3a3a3a; font-weight: bold; text-shadow: 1px 1px 1px rgba(19, 19, 19, 0.735); } 
lv-9 { color: #8803f4; font-weight: bold; text-shadow: 0 0 6px rgba(153, 0, 255, 0.8); } 
lv-10 { color: #FF0000; font-weight: bold; text-shadow: 0 0 6px rgba(255,0,0,0.8); } 


q-1 { color: #545454; font-weight: bold; text-shadow: 1px 1px 1px #000000; }
q-2 { color: #18ff80; font-weight: bold; text-shadow: 1px 1px 1px #000000; } 
q-3 { color: #20deff; font-weight: bold; text-shadow: 2px 2px 2px #000000;} 
q-4 { color: #ff17ff; font-weight: bold; text-shadow: 1px 1px 1px rgba(0,0,0,0.6); } 
q-5 { color: #ffea2b; font-weight: bold; text-shadow: 1px 1px 1px rgba(0,0,0,0.3); } 
q-6 { color: #ea5d00; font-weight: bold; text-shadow: 1px 1px 1px #000000; } 
q-7 { color: #FF0000; font-weight: bold; text-shadow: 0 0 6px rgba(255,0,0,0.8); } 


impact {
  font-weight: bold; 
}