css
/* 定义在最外层容器上的变量与基础手账底纹，绝不污染全局 */
ai {
  display: block;
  --sakura: #ffb7c5;
  --sky: #87ceeb;
  --text-main: #333333;
  --text-sub: #666666;
  --card-bg: rgba(255, 255, 255, 0.85);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--text-main);
  background-color: #fdfbf7;
  /* 手账网格背景 */
  background-image: 
    linear-gradient(rgba(135, 206, 235, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(135, 206, 235, 0.1) 1px, transparent 1px);
  background-size: 20px 20px;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.05);
  font-size: 14px;
  line-height: 1.6;
}

/* 顶部信息栏：时间地点天气 */
ai hd {
  display: block;
  text-align: center;
  font-size: 12px;
  color: #fff;
  background: linear-gradient(135deg, var(--sakura), var(--sky));
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
  letter-spacing: 1px;
  box-shadow: 0 2px 5px rgba(255, 183, 197, 0.4);
}

/* 剧本正文区 */
ai article {
  display: block;
  margin-bottom: 16px;
  padding: 0 4px;
}
ai article p {
  margin: 8px 0;
  text-indent: 2em; /* 首行缩进增强轻小说感 */
}
/* 对话自动高亮(假设AI输出带有「」符号的内容) */
ai article p:contains("「") {
  color: #4a69bd;
  text-indent: 0;
  font-weight: 500;
}

/* 状态栏折叠面板 */
ai details {
  background: transparent;
}
ai summary {
  list-style: none;
  font-weight: bold;
  color: var(--text-main);
  background: #fff;
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
  border-left: 4px solid var(--sakura);
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  margin-bottom: 10px;
  user-select: none;
}
ai summary::-webkit-details-marker {
  display: none;
}

/* 分类卡片(便利贴风格) */
ai c {
  display: flex;
  flex-direction: column;
  background: var(--card-bg);
  border: 1px solid rgba(255, 183, 197, 0.3);
  border-radius: 8px;
  padding: 12px 10px 8px 10px;
  margin-bottom: 10px;
  position: relative;
  box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
/* 读取t属性作为卡片标签 */
ai c::before {
  content: attr(t);
  position: absolute;
  top: -10px;
  left: 10px;
  background: var(--sky);
  color: #fff;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 4px;
  box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
}
/* 给女主角标签换色 */
ai c[t="女主角"]::before {
  background: var(--sakura);
}

/* 角色名与好感度动态映射 */
ai f {
  display: inline-block;
  font-weight: bold;
  font-size: 15px;
  margin-bottom: 4px;
  color: #d63031;
}
ai f::after {
  content: " 🤍"; /* 默认心形 */
  font-size: 12px;
}
/* 利用CSS选择器捕获lv属性进行视觉映射，无需额外token */
ai f[lv="1"]::after { content: " 🤍"; }
ai f[lv="2"]::after { content: " 🩷"; }
ai f[lv="3"]::after { content: " 💖"; }
ai f[lv="4"]::after { content: " 💘"; }
ai f[lv="5"]::after { 
  content: " ❤️‍🔥"; 
  animation: ai-heartbeat 1s infinite;
  display: inline-block;
}

/* 心跳动画 */
@keyframes ai-heartbeat {
  0% { transform: scale(1); }
  15% { transform: scale(1.2); }
  30% { transform: scale(1); }
  45% { transform: scale(1.2); }
  60% { transform: scale(1); }
}

/* 基础数据行 */
ai d {
  display: block;
  font-size: 13px;
  color: var(--text-sub);
  margin-bottom: 2px;
  border-bottom: 1px dashed rgba(0,0,0,0.05);
  padding-bottom: 2px;
}
ai d:last-child {
  border-bottom: none;
}

/* 心声区(私密笔记风格) */
ai q {
  display: block;
  margin-top: 6px;
  padding: 6px 8px;
  background: rgba(255, 255, 0, 0.1); /* 淡淡的高光笔黄 */
  border-left: 3px solid #feca57;
  font-size: 13px;
  color: #8395a7;
  font-style: italic; /* 斜体模拟手写感 */
  border-radius: 0 4px 4px 0;
  position: relative;
}
ai q::before {
  content: "✎ ";
  opacity: 0.7;
}