公开统计
445热度分
71消息量
377世界书字符
7,388固定设定字符
以下状态来自本地公开导出字段;样式与模板仅提供安全预览/下载,不在本站自动执行。
cover: fgph9edv74ub07tjcn0r9zq8.webpbackground: hygdau2btcxv8j7xuu6wnzmn.webp导出中只有文件名引用,未包含实际图片二进制资源。
共 16,781 字符;仅作为文本显示,不会在本站执行。
/* =========================================
青春网格本 - 观察日记 UI (标准折叠版)
========================================= */
/* 核心容器:笔记本纸张与纸胶带 */
ai {
display: block;
position: relative;
background-color: #fdfbf7;
margin: 18px 2px 5px 2px;
padding: 12px 10px;
border-radius: 2px 8px 8px 2px;
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.08),
-1px 0 2px rgba(0, 0, 0, 0.03);
font-family: 'Segoe UI', system-ui, sans-serif;
font-size: 13.5px;
color: #2c3e50;
border-left: 2px solid #e0d8c8;
}
/* 顶部半透明和纸胶带装饰 */
ai::before {
content: "";
position: absolute;
top: -10px;
left: 50%;
transform: translateX(-50%) rotate(-2deg);
width: 110px;
height: 24px;
background: rgba(244, 218, 160, 0.65);
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
border-left: 3px dotted rgba(253, 251, 247, 0.8);
border-right: 3px dotted rgba(253, 251, 247, 0.8);
z-index: 10;
pointer-events: none;
}
/* 折叠区块基础 */
ai details {
display: block;
margin-bottom: 12px;
}
ai details[open] {
margin-bottom: 16px;
}
/* 标题:彩色便利贴/索引标签风格 */
ai summary {
display: flex;
align-items: center;
background: #e3f2fd;
padding: 6px 10px;
margin: 0 -4px 6px -4px;
border-left: 4px solid #42a5f5;
border-radius: 0 4px 4px 0;
font-weight: 600;
color: #1565c0;
cursor: pointer;
box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.06);
user-select: none;
transition: all 0.2s ease;
list-style: none; /* 隐藏部分浏览器的默认三角 */
}
/* 标题 Hover 交互与不同面板的颜色变体 */
ai summary:hover {
filter: brightness(0.95);
transform: translateX(2px);
}
ai details:nth-of-type(2) summary { background: #fbe9e7; border-left-color: #ff8a65; color: #d84315; }
ai details:nth-of-type(3) summary { background: #fce4ec; border-left-color: #f06292; color: #c2185b; }
ai details:nth-of-type(4) summary { background: #f3e5f5; border-left-color: #ba68c8; color: #6a1b9a; }
/* 自定义折叠三角动画 */
ai summary::-webkit-details-marker { display: none; }
ai summary::before {
content: "▼";
font-size: 0.8em;
margin-right: 6px;
transition: transform 0.3s;
}
ai details:not([open]) summary::before {
transform: rotate(-90deg);
}
/* 数据行:笔记本横线效果 */
ai r {
display: block;
padding: 5px 4px;
border-bottom: 1px solid #e0e6ed;
line-height: 1.6;
position: relative;
}
ai r:hover {
background: rgba(240, 248, 255, 0.4);
}
/* 键 (属性名):印刷体灰色 */
ai k {
color: #78909c;
font-size: 0.9em;
font-weight: 500;
margin-right: 2px;
}
ai k::after {
content: ":";
margin-right: 4px;
}
/* 值 (属性内容):钢笔墨水蓝 */
ai v {
color: #1a365d;
}
/* 重点强调 <b>:荧光笔与红笔批改效果 */
ai b {
color: #c62828;
font-weight: 500;
background: linear-gradient(transparent 60%, rgba(255, 128, 171, 0.35) 60%);
padding: 0 2px;
border-radius: 2px;
}
/* =========================================
全局字体设定 (优先调用系统自带的手写/圆体字,保证可读性)
========================================= */
textarea, input, p, div, span, button {
font-family: 'Comic Sans MS', 'Chalkboard SE', 'STKaiti', 'Nunito', sans-serif !important;
}
/* =========================================
1. 顶部栏 (网格纸背景 + 回形针点缀)
========================================= */
.sticky.w-full.top-0.flex.items-center {
background-color: #fdfbf7 !important; /* 暖白纸张底色 */
background-image:
linear-gradient(#e5e7eb 1px, transparent 1px),
linear-gradient(90deg, #e5e7eb 1px, transparent 1px) !important;
background-size: 20px 20px !important;
border-bottom: 2px dashed #cbd5e1 !important; /* 手撕虚线边缘 */
box-shadow: 0 4px 10px -2px rgba(0,0,0,0.05) !important;
}
/* 顶部栏左上角添加回形针文具立绘 */
.sticky.w-full.top-0.flex.items-center::before {
content: "📎";
position: absolute;
left: 15px;
top: 5px;
font-size: 22px;
transform: rotate(-20deg);
pointer-events: none;
opacity: 0.9;
}
/* 模型选择器 - 黄色便利贴风格 */
#ai-model-selector .group.flex.items-center {
background-color: #fef08a !important; /* 便利贴黄 */
border: 1px solid #facc15 !important;
border-radius: 2px 10px 10px 2px !important;
box-shadow: 2px 2px 4px rgba(0,0,0,0.1) !important;
transform: rotate(-1deg);
transition: all 0.3s ease !important;
}
#ai-model-selector .group.flex.items-center:hover {
transform: rotate(1deg) scale(1.05);
background-color: #fde047 !important;
box-shadow: 3px 3px 6px rgba(0,0,0,0.15) !important;
}
#ai-model-selector .truncate.text-\[13px\] {
color: #334155 !important;
font-weight: bold !important;
}
/* 顶部各类图标颜色改为圆珠笔蓝 */
.sticky.w-full.top-0 svg.lucide-clock-8,
.sticky.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2,
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]),
#header-setting-button svg {
color: #2563eb !important;
transition: transform 0.2s !important;
}
.sticky.w-full.top-0 svg:hover {
transform: scale(1.1) rotate(5deg) !important;
}
/* =========================================
2. 开场白选择器 (手账纸胶带风格)
========================================= */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
background-color: #e0f2fe !important; /* 浅蓝胶带 */
border: 2px dashed #7dd3fc !important;
border-radius: 4px !important;
box-shadow: inset 0 0 0 2px #ffffff !important;
transition: all 0.2s !important;
}
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
background-color: #bae6fd !important;
transform: translateY(-1px);
}
/* 添加标签小图标 */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]::after {
content: "🏷️";
margin-left: auto;
padding-right: 8px;
font-size: 14px;
}
/* =========================================
3. 按钮栏 (手绘线框 + 马克笔高亮悬浮)
========================================= */
#ai-mod-button2 button.MuiButton-root {
background-color: #ffffff !important;
border: 2px solid #94a3b8 !important;
border-radius: 10px 3px 10px 3px !important; /* 模拟手绘的不规则方框 */
color: #475569 !important;
font-weight: bold !important;
transition: all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
background-color: #bbf7d0 !important; /* 荧光绿马克笔效果 */
border-color: #22c55e !important;
color: #166534 !important;
transform: translateY(-2px) rotate(1deg);
box-shadow: 3px 3px 0px #22c55e !important; /* 硬阴影增强立体感 */
}
#ai-mod-button2 button.MuiButton-root svg {
color: inherit !important;
}
/* =========================================
4. 底部栏及输入框 (网格纸 + 铅笔点缀)
========================================= */
#ai-chat-bottom-input {
background-color: #fdfbf7 !important;
background-image:
linear-gradient(#e5e7eb 1px, transparent 1px),
linear-gradient(90deg, #e5e7eb 1px, transparent 1px) !important;
background-size: 20px 20px !important;
border-top: 3px solid #f87171 !important; /* 红色装订线 */
position: relative;
}
/* 底部输入区右上角悬浮一支铅笔 */
#ai-chat-bottom-input::before {
content: "✏️";
position: absolute;
right: 20px;
top: -25px;
font-size: 24px;
transform: rotate(135deg);
pointer-events: none;
filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.1));
}
#ai-chat-input {
background-color: rgba(255, 255, 255, 0.9) !important;
border: 2px dashed #cbd5e1 !important;
border-radius: 8px !important;
color: #1e293b !important;
}
#ai-chat-input:focus {
border-color: #3b82f6 !important; /* 聚焦时变成蓝色圆珠笔墨水色 */
background-color: #ffffff !important;
outline: none !important;
}
#ai-chat-input::placeholder {
color: #94a3b8 !important;
font-style: italic !important;
}
/* 文本选中时的马克笔高亮粉色 */
#ai-chat-input::selection {
background-color: #fbcfe8 !important;
color: #000000 !important;
}
/* =========================================
5. 分页栏 (彩色小圆贴纸风格)
========================================= */
.MuiPaginationItem-root {
border: 1px solid #cbd5e1 !important;
border-radius: 50% !important;
background-color: #ffffff !important;
color: #475569 !important;
font-weight: bold !important;
transition: all 0.2s !important;
}
.MuiPaginationItem-root:hover {
background-color: #fef08a !important; /* 悬浮荧光黄 */
transform: scale(1.1);
}
.MuiPaginationItem-root.Mui-selected {
background-color: #3b82f6 !important; /* 选中的贴纸为蓝色 */
color: #ffffff !important;
border-color: #2563eb !important;
box-shadow: 2px 2px 0px #1e3a8a !important;
}
.MuiStack-root.css-1uwir8f .MuiInputBase-input {
border-bottom: 2px dashed #94a3b8 !important;
text-align: center !important;
}
/* =========================================
6. 评论区 (经典横线笔记本 + 图钉便签)
========================================= */
/* 评论区背景:红线+横线笔记本纸张 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
background-color: #fdfbf7 !important;
background-image:
linear-gradient(90deg, transparent 39px, #ef4444 39px, #ef4444 41px, transparent 41px), /* 左侧红色警戒线 */
linear-gradient(#e5e7eb 1px, transparent 1px) !important; /* 横线 */
background-size: 100% 28px !important; /* 横线间距 */
background-position: 0 0 !important;
}
/* 顶部标题:日记本图标 + 下半部分高亮 */
div.text-lg.font-bold {
background: linear-gradient(180deg, transparent 55%, #fef08a 45%) !important;
display: inline-block !important;
color: #1e293b !important;
padding-right: 5px !important;
}
div.text-lg.font-bold::before {
content: "📓 ";
}
/* 评分星星颜色改为亮眼的荧光橙 */
span.MuiRating-iconFilled svg {
color: #fb923c !important;
filter: drop-shadow(1px 1px 1px rgba(251, 146, 60, 0.3)) !important;
}
span.text-orange-500 {
color: #ea580c !important;
font-weight: bold !important;
}
/* 评论输入框 */
textarea.rc-textarea {
background-color: rgba(255, 255, 255, 0.85) !important;
border: 2px dashed #94a3b8 !important;
border-radius: 8px !important;
color: #1e293b !important;
}
textarea.rc-textarea:focus {
border-color: #8b5cf6 !important; /* 紫色水笔印 */
background-color: #ffffff !important;
}
/* 发送评论按钮 - 橡皮擦质感 */
div.cursor-pointer.group.flex.items-center.justify-center {
background-color: #3b82f6 !important;
border-radius: 12px !important;
box-shadow: 3px 3px 0px #1d4ed8 !important;
transition: all 0.1s !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:active {
transform: translate(3px, 3px) !important;
box-shadow: 0px 0px 0px #1d4ed8 !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
color: #ffffff !important;
}
/* 排序按钮 */
button.MuiButton-containedPrimary {
background-color: #3b82f6 !important;
border-radius: 20px !important;
box-shadow: 2px 2px 0px #1e3a8a !important;
}
button.MuiButton-outlinedPrimary {
border: 2px dashed #94a3b8 !important;
color: #64748b !important;
border-radius: 20px !important;
}
/* 评论项 - 贴在横线本上的小纸条 */
div.group.ml-0 {
background-color: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-left: 4px solid #10b981 !important; /* 绿色侧边胶带 */
border-radius: 2px 8px 8px 2px !important;
box-shadow: 2px 3px 6px rgba(0,0,0,0.06) !important;
position: relative;
transition: transform 0.2s !important;
}
div.group.ml-0:hover {
transform: rotate(0.5deg) scale(1.01);
border-left-color: #f59e0b !important; /* 悬浮时侧边胶带变黄 */
}
/* 评论右上角图钉文具装饰 */
div.group.ml-0::before {
content: "📌";
position: absolute;
top: -12px;
right: 10px;
font-size: 18px;
pointer-events: none;
filter: drop-shadow(1px 2px 2px rgba(0,0,0,0.2));
}
/* 用户名与内容高对比度确保可读 */
div.text-sm.text-grey-600 span.font-bold {
color: #0f172a !important;
font-size: 15px !important;
}
div.break-all {
color: #334155 !important;
line-height: 1.6 !important;
}
/* 评论分割线 - 手绘波浪虚线感 */
div.style_divider__mW0YX {
border-top: 2px dashed #cbd5e1 !important;
background: none !important;
margin: 15px 0 !important;
}
/* 点赞与回复互动按钮 */
button.text-gray-400:hover svg {
color: #ef4444 !important; /* 点赞红笔标注 */
transform: scale(1.2) !important;
/* 预览已截断;下载 CSS 可查看完整内容。 */{
"renderTemplate": null,
"assistantRegexReplace": null,
"enableMemorySchema": false,
"memorySchema": null,
"introPage": "ubh3gc7oizshut8h89zi5e4j.html",
"options": {
"items": []
},
"defaultModelSettings": null,
"cover": "fgph9edv74ub07tjcn0r9zq8.webp",
"background": "hygdau2btcxv8j7xuu6wnzmn.webp"
}本页只展示本地导出中可核验的公开字段。下载 JSON 可查看完整原始记录。