公开统计
14,424热度分
3,585消息量
8,558世界书字符
9,083固定设定字符
以下状态来自本地公开导出字段;样式与模板仅提供安全预览/下载,不在本站自动执行。
cover: nyhiuruo5ladm5t2rn86ln2h.webpbackground: axboag01qhrysvyz2mwpudbq.webp导出中只有文件名引用,未包含实际图片二进制资源。
共 11,054 字符;仅作为文本显示,不会在本站执行。
/* ==================================================
古风宣纸·古籍风格聊天界面美化(修复网页端透明问题)
米黄纸质 | 墨色笔触 | 古典雅韵
(已替换为系统原生通用字体,字号优化更易读)
================================================== */
/* -------- 强制网页端淡色背景(消除透明bug) -------- */
/* 所有AI对话气泡强制不透明宣纸色 */
.group .bg-gray-100\/90,
[class*="bg-gray-100"][class*="\/"],
.message .bg-gray-100\/90,
div[class*="bg-gray-100/"] {
background: #f5f1e8 !important;
background: linear-gradient(145deg, #faf8f3 0%, #f5f1e8 45%, #f0ebe0 100%) !important;
backdrop-filter: none !important;
opacity: 1 !important;
}
/* 聊天主容器淡色宣纸底 */
.chat-container,
.message-list,
[class*="flex-1"][class*="overflow-y"],
#__next > div > div > div > div:first-child,
main,
[class*="chat"] {
background-color: #faf8f3 !important;
background-image:
repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(212, 196, 168, 0.04) 2px, rgba(212, 196, 168, 0.04) 4px),
repeating-linear-gradient(90deg, transparent, transparent 2px, rgba(212, 196, 168, 0.04) 2px, rgba(212, 196, 168, 0.04) 4px) !important;
backdrop-filter: none !important;
}
/* body底色补全 */
body {
background-color: #faf8f3 !important;
}
/* 深色模式下仍然保持气泡为淡色宣纸(如果需要深色背景可自行调整) */
@media (prefers-color-scheme: dark) {
.group .bg-gray-100\/90,
.message .bg-gray-100\/90 {
background: #f5f1e8 !important;
color: #2d2416 !important;
opacity: 1 !important;
}
.chat-container,
.message-list {
background-color: #faf8f3 !important; /* 保持淡色,如果需要暗色底可改为 #2d2416 */
}
body {
background-color: #faf8f3 !important;
}
}
/* ========== 状态栏角色立绘 ========== */
.cg-portrait {
display: block;
width: 180px;
height: 240px;
object-fit: cover;
border-radius: 8px;
margin: 12px auto;
border: 2px solid #d4c4a8;
box-shadow: 0 4px 12px rgba(61, 47, 25, 0.25);
}
/* ========== 全局字体 ========== */
body {
font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial,
"PingFang SC", "Microsoft YaHei", "Hiragino Sans GB",
"Noto Sans CJK SC", sans-serif;
font-size: 17px;
}
/* ========== 对话气泡美化 (AI侧) ========== */
.group .bg-gray-100\/90 {
background: linear-gradient(145deg, #faf8f3 0%, #f5f1e8 45%, #f0ebe0 100%) !important;
border: 2px solid #d4c4a8 !important;
border-radius: 4px 18px 18px 4px !important;
box-shadow:
0 4px 16px rgba(61, 47, 25, 0.12),
0 2px 6px rgba(89, 70, 45, 0.08),
inset 0 1px 0 rgba(255, 252, 245, 0.9),
0 0 0 1px rgba(212, 196, 168, 0.3) !important;
color: #2d2416 !important;
padding: 20px 18px !important;
position: relative !important;
font-size: 18px !important;
line-height: 1.8 !important;
transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
background-image:
repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(212, 196, 168, 0.03) 2px, rgba(212, 196, 168, 0.03) 4px),
repeating-linear-gradient(90deg, transparent, transparent 2px, rgba(212, 196, 168, 0.03) 2px, rgba(212, 196, 168, 0.03) 4px) !important;
}
/* 纸张边缘做旧 */
.group .bg-gray-100\/90::before {
content: '';
position: absolute;
top: -2px;
left: -2px;
right: -2px;
bottom: -2px;
border-radius: 6px 20px 20px 6px;
background: linear-gradient(135deg,
rgba(180, 150, 100, 0.15) 0%,
rgba(160, 130, 80, 0.08) 25%,
rgba(140, 110, 60, 0.05) 50%,
rgba(120, 90, 40, 0.08) 75%,
rgba(100, 70, 30, 0.15) 100%);
z-index: -1;
pointer-events: none;
opacity: 0.6;
}
/* 古典印章 */
.group .bg-gray-100\/90::after {
content: '◈';
position: absolute;
bottom: 8px;
right: 12px;
color: #a67c52;
font-size: 14px;
opacity: 0.5;
text-shadow: 0 1px 2px rgba(89, 70, 45, 0.3);
}
/* ========== 平台按钮美化 ========== */
.flex.items-center.gap-2.pb-2 > button {
background: linear-gradient(135deg, #f9f6f0 0%, #f3ede0 50%, #ede5d5 100%) !important;
color: #5d4a2f !important;
border: 2px solid #c9b896 !important;
border-radius: 8px !important;
box-shadow:
0 3px 10px rgba(89, 70, 45, 0.15),
0 1px 3px rgba(61, 47, 25, 0.12),
inset 0 1px 0 rgba(255, 252, 245, 0.8) !important;
font-weight: 500 !important;
transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
padding: 10px 20px !important;
font-size: 15.5px !important;
position: relative !important;
}
.flex.items-center.gap-2.pb-2 > button::before {
content: '〔';
position: absolute;
left: 6px;
color: #a67c52;
opacity: 0.6;
}
.flex.items-center.gap-2.pb-2 > button::after {
content: '〕';
position: absolute;
right: 6px;
color: #a67c52;
opacity: 0.6;
}
.flex.items-center.gap-2.pb-2 > button:hover {
background: linear-gradient(135deg, #f5f0e5 0%, #efe8d8 50%, #e9e0cc 100%) !important;
color: #4a3820 !important;
transform: translateY(-2px) scale(1.02) !important;
box-shadow:
0 6px 16px rgba(89, 70, 45, 0.22),
0 3px 8px rgba(61, 47, 25, 0.18),
inset 0 1px 0 rgba(255, 252, 245, 0.9) !important;
border-color: #b5a485 !important;
}
.flex.items-center.gap-2.pb-2 > button:active {
transform: translateY(0) scale(0.98) !important;
box-shadow:
0 2px 6px rgba(89, 70, 45, 0.18),
inset 0 1px 2px rgba(61, 47, 25, 0.1) !important;
}
/* ========== 输入栏美化 ========== */
#ai-chat-input {
background: linear-gradient(135deg, #fffcf7 0%, #faf8f3 50%, #f5f1e8 100%) !important;
border: 2px solid #d9cdb5 !important;
border-radius: 12px !important;
color: #2d2416 !important;
box-shadow:
inset 0 2px 6px rgba(89, 70, 45, 0.08),
0 2px 10px rgba(61, 47, 25, 0.1),
0 0 0 1px rgba(255, 252, 245, 0.5) !important;
font-size: 17px !important;
padding: 16px 20px !important;
transition: all 0.3s ease !important;
resize: none !important;
background-image:
repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(212, 196, 168, 0.02) 2px, rgba(212, 196, 168, 0.02) 4px) !important;
}
#ai-chat-input:focus {
background: linear-gradient(135deg, #fffefb 0%, #faf9f5 50%, #f5f3ed 100%) !important;
border-color: #c9b896 !important;
box-shadow:
inset 0 2px 8px rgba(89, 70, 45, 0.12),
0 4px 16px rgba(89, 70, 45, 0.15),
0 0 0 2px rgba(166, 124, 82, 0.1) !important;
outline: none !important;
}
#ai-chat-bottom-input {
background: transparent !important;
backdrop-filter: none !important;
padding: 20px 0 !important;
}
/* ========== 移动端适配 ========== */
@media (max-width: 768px) {
.group .bg-gray-100\/90 {
border-radius: 4px 16px 16px 4px !important;
padding: 16px 14px !important;
font-size: 16.5px !important;
margin: 8px 12px !important;
}
.flex.items-center.gap-2.pb-2 > button {
padding: 8px 16px !important;
font-size: 14.5px !important;
border-radius: 6px !important;
}
#ai-chat-input {
border-radius: 10px !important;
padding: 14px 16px !important;
font-size: 16px !important;
margin: 0 12px !important;
}
}
/* ========== 大屏优化 ========== */
@media (min-width: 1200px) {
.group .bg-gray-100\/90 {
border-radius: 6px 20px 20px 6px !important;
padding: 24px 22px !important;
font-size: 19px !important;
max-width: 85% !important;
}
}
/* ========== 滚动条美化 ========== */
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: rgba(245, 241, 232, 0.6);
border-radius: 5px;
border: 1px solid rgba(201, 184, 150, 0.3);
}
::-webkit-scrollbar-thumb {
background: linear-gradient(135deg, #c9b896 0%, #b5a485 100%);
border-radius: 5px;
border: 1px solid rgba(166, 124, 82, 0.4);
}
::-webkit-scrollbar-thumb:hover {
background: linear-gradient(135deg, #b5a485 0%, #a69474 100%);
}
/* ========== 动画增强 ========== */
@keyframes paperGlow {
0% { box-shadow: 0 4px 16px rgba(61, 47, 25, 0.12), 0 2px 6px rgba(89, 70, 45, 0.08); }
50% { box-shadow: 0 4px 20px rgba(61, 47, 25, 0.16), 0 2px 8px rgba(89, 70, 45, 0.12); }
100% { box-shadow: 0 4px 16px rgba(61, 47, 25, 0.12), 0 2px 6px rgba(89, 70, 45, 0.08); }
}
.group .bg-gray-100\/90:hover {
animation: paperGlow 3s ease-in-out infinite;
}
/* ========== 折叠状态栏 ========== */
details {
background: linear-gradient(135deg, #faf8f3 0%, #f5f1e8 50%, #f0ebe0 100%);
border: 2px solid #d4c4a8;
border-radius: 8px;
padding: 16px 20px;
margin: 16px 0;
box-shadow:
0 2px 8px rgba(61, 47, 25, 0.1),
0 1px 3px rgba(89, 70, 45, 0.08),
inset 0 1px 0 rgba(255, 252, 245, 0.9);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
background-image:
repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(212, 196, 168, 0.03) 2px, rgba(212, 196, 168, 0.03) 4px);
}
details:hover {
border-color: #c9b896;
box-shadow:
0 4px 12px rgba(61, 47, 25, 0.14),
0 2px 6px rgba(89, 70, 45, 0.12),
inset 0 1px 0 rgba(255, 252, 245, 0.95);
transform: translateY(-1px);
}
details[open] {
background: linear-gradient(135deg, #fffcf7 0%, #faf8f3 50%, #f5f1e8 100%);
border-color: #b5a485;
box-shadow:
0 6px 16px rgba(61, 47, 25, 0.16),
0 3px 8px rgba(89, 70, 45, 0.14),
inset 0 1px 0 rgba(255, 252, 245, 1);
}
details summary {
cursor: pointer;
font-weight: 500;
color: #3a3226;
padding: 8px 12px 8px 36px;
border-radius: 6px;
background: linear-gradient(90deg, rgba(166, 124, 82, 0.08) 0%, transparent 100%);
transition: all 0.25s ease;
list-style: none;
user-select: none;
position: relative;
}
details summary::-webkit-details-marker {
display: none;
}
details summary::before {
content: '▸';
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
color: #a67c52;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
font-size: 16px;
}
details[open] summary::before {
transform: translateY(-50%) rotate(90deg);
color: #8b6239;
}
details summary:hover {
background: linear-gradient(90deg, rgba(166, 124, 82, 0.12) 0%, rgba(166, 124, 82, 0.03) 100%);
color: #2d2416;
}
details > *:not(summary) {
margin-top: 16px;
padding-top: 16px;
border-top: 1px solid #e5dcc8;
color: #3a3226;
line-height: 1.8;
animation: fadeInContent 0.3s ease-out;
}
@keyframes fadeInContent {
from {
opacity: 0;
transform: translateY(-8px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* 深色模式下的细节调整(细节保持暖色调) */
@media (prefers-color-scheme: dark) {
details {
background: linear-gradient(135deg, #faf8f3 0%, #f5f1e8 50%, #f0ebe0 100%);
border-color: #c9b896;
box-shadow:
0 2px 8px rgba(61, 47, 25, 0.15),
0 1px 3px rgba(89, 70, 45, 0.1),
inset 0 1px 0 rgba(255, 252, 245, 0.95);
}
details:hover {
border-color: #b5a485;
}
details[open] {
background: linear-gradient(135deg, #fffcf7 0%, #faf8f3 50%, #f5f1e8 100%);
border-color: #a67c52;
}
details summary {
color: #2d2416;
background: linear-gradient(90deg, rgba(166, 124, 82, 0.15) 0%, transparent 100%);
}
details summary:hover {
background: linear-gradient(90deg, rgba(166, 124, 82, 0.2) 0%, rgba(166, 124, 82, 0.05) 100%);
color: #000;
}
details > *:not(summary) {
border-top-color: #d4c4a8;
color: #2d2416;
}
}{
"renderTemplate": null,
"assistantRegexReplace": null,
"enableMemorySchema": false,
"memorySchema": null,
"introPage": "lbc5a4rz65hyercysh6htix4.html",
"options": {
"items": []
},
"defaultModelSettings": null,
"cover": "nyhiuruo5ladm5t2rn86ln2h.webp",
"background": "axboag01qhrysvyz2mwpudbq.webp"
}本页只展示本地导出中可核验的公开字段。下载 JSON 可查看完整原始记录。